Prototipo Etapa 0: pulido de UI (agente de diseño) + capturas de referencia
Ajustes visuales al wizard de emisión, sidebar con logo oficial, dashboard y componentes de dinero/atención. Se agregan capturas de cada vista en prototipo/capturas/ para revisión de diseño.
This commit is contained in:
JohannVelazquez
+363
-71
@@ -43,7 +43,7 @@
|
||||
|
||||
*{box-sizing:border-box}
|
||||
html,body{margin:0;padding:0;background:var(--crema)}
|
||||
body{font-family:"Poppins",system-ui,sans-serif;color:var(--ink);font-size:13.5px;line-height:1.55;padding-top:var(--banner-h);min-width:1366px}
|
||||
body{font-family:"Poppins",system-ui,sans-serif;color:var(--ink);font-size:13.5px;line-height:1.55;padding-top:var(--banner-h)}
|
||||
::selection{background:var(--amarillo);color:var(--cafe)}
|
||||
|
||||
/* ============ Banner fijo de prototipo ============ */
|
||||
@@ -66,14 +66,11 @@
|
||||
color:#D9CDBB;display:flex;flex-direction:column;padding:26px 16px 18px;
|
||||
position:sticky;top:var(--banner-h);height:calc(100vh - var(--banner-h));
|
||||
}
|
||||
.brand{display:flex;align-items:center;gap:12px;padding:0 10px 22px;border-bottom:1px solid rgba(247,189,12,.16);margin-bottom:14px}
|
||||
.brand{display:flex;align-items:center;gap:10px;padding:0 8px 14px;border-bottom:1px solid rgba(247,189,12,.16);margin-bottom:10px}
|
||||
.logo-mark{
|
||||
width:42px;height:42px;border-radius:11px;background:var(--amarillo);color:var(--cafe);
|
||||
display:grid;place-items:center;font-weight:800;font-size:21px;letter-spacing:-.02em;flex:none;
|
||||
box-shadow:0 2px 10px rgba(247,189,12,.35);
|
||||
width:198px;max-width:100%;display:flex;align-items:center;flex:none;
|
||||
}
|
||||
.brand-name{color:var(--amarillo);font-weight:700;font-size:19px;letter-spacing:.14em;line-height:1.1}
|
||||
.brand-sub{color:rgba(255,255,255,.55);font-size:8.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:500}
|
||||
.logo-mark img{display:block;width:100%;height:auto}
|
||||
|
||||
.nav-label{color:rgba(217,205,187,.45);font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:14px 12px 7px;font-weight:600}
|
||||
.nav-item{
|
||||
@@ -117,20 +114,27 @@
|
||||
background:var(--crema-2);border:1px solid var(--linea);padding:5px 11px;border-radius:999px;font-weight:500;
|
||||
}
|
||||
.pill b{color:var(--ink);font-weight:600}
|
||||
.sync-context{
|
||||
display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border-radius:9px;
|
||||
color:var(--info-ink);background:var(--info-bg);border:1px solid #BCD7EA;
|
||||
font-size:11px;font-weight:500;line-height:1.35;white-space:nowrap
|
||||
}
|
||||
.sync-context .dot{box-shadow:none;width:7px;height:7px}
|
||||
.sync-context small{display:block;color:var(--info-ink);opacity:.72;font-size:9.5px;font-weight:400}
|
||||
|
||||
.content{padding:30px 34px 60px;max-width:1560px}
|
||||
.view{display:none;animation:fadeIn .18s ease}
|
||||
.view.active{display:block}
|
||||
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
|
||||
.view-title{font-size:23px;font-weight:600;letter-spacing:-.01em;margin:0 0 3px}
|
||||
.view-sub{color:var(--muted);margin:0 0 26px;font-size:13px;font-weight:300;max-width:880px}
|
||||
.view-sub{color:var(--muted);margin:0 0 16px;font-size:12.5px;font-weight:400;max-width:920px}
|
||||
.view-sub b{font-weight:500;color:var(--ink)}
|
||||
|
||||
/* ============ Componentes base ============ */
|
||||
.card{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radius);box-shadow:var(--shadow)}
|
||||
.card-pad{padding:22px 24px}
|
||||
.card-title{font-size:14px;font-weight:600;margin:0 0 2px}
|
||||
.card-sub{font-size:11.5px;color:var(--muted);font-weight:300;margin:0 0 14px}
|
||||
.card-sub{font-size:11px;color:var(--muted);font-weight:400;margin:0 0 10px}
|
||||
|
||||
.btn{
|
||||
display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:10px;
|
||||
@@ -207,6 +211,12 @@
|
||||
.kpi-meta{font-size:11.5px;color:var(--muted);margin-top:7px;font-weight:300}
|
||||
.kpi-meta .up{color:var(--ok-ink);font-weight:500}
|
||||
.kpi-meta .down{color:var(--bad-ink);font-weight:500}
|
||||
.money-split{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:3px}
|
||||
.money-line{border-left:3px solid var(--linea-2);padding-left:10px}
|
||||
.money-line:first-child{border-left-color:var(--bad)}
|
||||
.money-line:last-child{border-left-color:var(--info)}
|
||||
.money-line b{display:block;font-size:20px;line-height:1.25;font-variant-numeric:tabular-nums}
|
||||
.money-line small{font-size:10px;color:var(--muted);font-weight:600;letter-spacing:.06em}
|
||||
|
||||
/* Gráficas simples */
|
||||
.bars{display:flex;align-items:flex-end;gap:26px;height:190px;padding:8px 6px 0}
|
||||
@@ -225,7 +235,7 @@
|
||||
.hbar-n{color:var(--muted);font-size:11.5px;text-align:right;font-variant-numeric:tabular-nums}
|
||||
|
||||
/* Lista requiere atención */
|
||||
.att-item{display:flex;align-items:center;gap:13px;padding:12px 6px;border-bottom:1px solid var(--linea);cursor:pointer;border-radius:8px;transition:background .12s}
|
||||
.att-item{display:grid;grid-template-columns:auto minmax(0,1fr) 190px auto;align-items:center;gap:13px;padding:12px 6px;border-bottom:1px solid var(--linea);cursor:pointer;border-radius:8px;transition:background .12s}
|
||||
.att-item:hover{background:var(--crema)}
|
||||
.att-item:last-child{border-bottom:none}
|
||||
.sev{width:9px;height:9px;border-radius:50%;flex:none}
|
||||
@@ -234,6 +244,12 @@
|
||||
.att-txt b{font-weight:600}
|
||||
.att-txt .att-sub{display:block;font-size:11px;color:var(--muted);font-weight:300}
|
||||
.att-go{color:var(--muted-2);font-size:15px}
|
||||
.att-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:10.5px;color:var(--muted)}
|
||||
.att-meta span{display:block}
|
||||
.att-meta b{display:block;color:var(--ink);font-size:11px;font-weight:600}
|
||||
#view-dashboard.active{display:flex;flex-direction:column}
|
||||
.dashboard-attention{order:1}
|
||||
.dashboard-charts{order:2}
|
||||
|
||||
/* Filtros chips */
|
||||
.filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
|
||||
@@ -332,6 +348,13 @@
|
||||
.check-ico svg{width:12px;height:12px}
|
||||
.check-row b{font-weight:600}
|
||||
.check-row .cr-sub{color:var(--muted);font-size:11px;font-weight:300;display:block}
|
||||
.approval-gate{border:1.5px solid var(--warn-line);background:#FFFDF6}
|
||||
.approval-status{display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-bottom:1px solid var(--linea)}
|
||||
.approval-status:last-child{border-bottom:none}
|
||||
.approval-status .state-dot{width:9px;height:9px;border-radius:50%;background:var(--warn);margin-top:5px;flex:none}
|
||||
.approval-status.ok .state-dot{background:var(--ok)}
|
||||
.approval-status span{font-size:12px}
|
||||
.approval-status small{display:block;color:var(--muted);font-size:10.5px;margin-top:2px}
|
||||
|
||||
/* Éxito */
|
||||
.success-wrap{max-width:660px;margin:30px auto;text-align:center}
|
||||
@@ -375,6 +398,18 @@
|
||||
.aging-cell.warm .aging-val{color:var(--warn-ink)}
|
||||
.aging-total{background:var(--crema);border-left:1px solid var(--linea-2)}
|
||||
|
||||
/* Cobranza · pagos detectados y reglas de recordatorio */
|
||||
.sync-chip{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:600;color:var(--ok-ink);background:var(--ok-bg);border-radius:99px;padding:4px 12px;white-space:nowrap}
|
||||
.sync-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok);animation:syncPulse 2s infinite}
|
||||
@keyframes syncPulse{0%,100%{opacity:1}50%{opacity:.35}}
|
||||
.regla{display:flex;align-items:center;gap:12px;padding:11px 2px;border-bottom:1px solid var(--linea)}
|
||||
.regla:last-child{border-bottom:none}
|
||||
.regla-d{font-weight:700;font-size:11.5px;min-width:46px;text-align:center;background:var(--crema);border:1px solid var(--linea-2);border-radius:8px;padding:6px 4px;flex:none;font-variant-numeric:tabular-nums}
|
||||
.regla-txt{flex:1;font-size:12.5px;line-height:1.45}
|
||||
.regla-txt small{display:block;font-size:11px;color:var(--muted);font-weight:300}
|
||||
.regla .chip{flex:none}
|
||||
.regla.off{opacity:.55}
|
||||
|
||||
.empty-state{text-align:center;padding:38px 20px;color:var(--muted)}
|
||||
.empty-state .es-ico{width:52px;height:52px;border-radius:50%;background:var(--ok-bg);color:var(--ok);display:grid;place-items:center;margin:0 auto 12px}
|
||||
.empty-state .es-ico svg{width:24px;height:24px}
|
||||
@@ -396,6 +431,66 @@
|
||||
.mb8{margin-bottom:8px}.mb12{margin-bottom:12px}.mb16{margin-bottom:16px}.mb20{margin-bottom:20px}.mb24{margin-bottom:24px}
|
||||
.flex{display:flex;align-items:center;gap:10px}
|
||||
.spread{display:flex;align-items:center;justify-content:space-between;gap:14px}
|
||||
|
||||
/* ============ Adaptación progresiva ============ */
|
||||
@media (max-width:1200px){
|
||||
.app{grid-template-columns:220px 1fr}
|
||||
.content{padding:24px 24px 50px}
|
||||
.grid4{grid-template-columns:repeat(2,1fr)}
|
||||
.aging-card{min-width:980px}
|
||||
.card:has(.aging-card){overflow-x:auto!important}
|
||||
.topbar{padding-inline:24px}
|
||||
}
|
||||
@media (max-width:900px){
|
||||
body{font-size:13px}
|
||||
.app{display:block}
|
||||
.sidebar{position:static;height:auto;padding:14px;display:flex;flex-direction:row;flex-wrap:wrap;gap:5px;align-items:center}
|
||||
.brand{width:100%;padding:0 4px 12px;margin-bottom:5px}
|
||||
.logo-mark{width:180px}
|
||||
.nav-label{display:none}
|
||||
.nav-item{padding:8px 10px;margin:0;font-size:11.5px}
|
||||
.nav-item svg{width:15px;height:15px}
|
||||
.bind-status{margin:7px 0 0;width:100%}
|
||||
.user-chip{display:none}
|
||||
.topbar{position:static;padding:10px 16px;align-items:flex-start;flex-wrap:wrap}
|
||||
.crumbs>span:first-child,.top-right>.pill:last-child{display:none}
|
||||
.top-right{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
|
||||
.content{padding:20px 16px 42px}
|
||||
.view-title{font-size:20px}
|
||||
.grid2,.grid3,.grid4,.send-layout,.pay-opt{grid-template-columns:1fr;display:grid}
|
||||
.content [style*="grid-template-columns"]{grid-template-columns:1fr!important}
|
||||
.dashboard-charts>*{min-width:0}
|
||||
.bars{gap:10px}
|
||||
.bar-val{font-size:9px}
|
||||
.stepper{overflow-x:auto}
|
||||
.step{min-width:175px}
|
||||
.ticket-ribbon{flex-wrap:wrap}
|
||||
.ticket-ribbon .sep{display:none}
|
||||
.ticket-ribbon [style*="margin-left:auto"]{margin-left:0!important}
|
||||
.att-item{grid-template-columns:auto minmax(0,1fr) auto}
|
||||
.att-meta{grid-column:2;grid-row:2;grid-template-columns:auto auto;justify-content:start}
|
||||
.att-go{grid-column:3;grid-row:1/3}
|
||||
.filters{align-items:stretch}
|
||||
.search-box{margin-left:0;width:100%}
|
||||
.search-box input{width:100%}
|
||||
.tbl{min-width:760px}
|
||||
.card:has(.tbl){overflow-x:auto!important}
|
||||
.doc{padding:22px 20px}
|
||||
.wiz-foot{align-items:stretch;flex-direction:column}
|
||||
.wiz-foot>.flex{flex-wrap:wrap}
|
||||
}
|
||||
@media (max-width:560px){
|
||||
.grid4{grid-template-columns:1fr}
|
||||
.proto-banner{font-size:10px;padding:0 10px;text-align:center}
|
||||
.nav-item{flex:1 1 46%}
|
||||
.nav-num{display:none}
|
||||
.top-right{width:100%;margin-left:0;justify-content:flex-start}
|
||||
.top-right>.pill{display:none}
|
||||
.sync-context{width:100%;white-space:normal}
|
||||
.money-split{grid-template-columns:1fr}
|
||||
.dl{grid-template-columns:1fr}
|
||||
.card-pad{padding:18px}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -411,18 +506,18 @@
|
||||
<!-- ================= Sidebar ================= -->
|
||||
<aside class="sidebar">
|
||||
<div class="brand">
|
||||
<div class="logo-mark">B</div>
|
||||
<div>
|
||||
<div class="brand-name">BALAM</div>
|
||||
<div class="brand-sub">Talento Estratégico</div>
|
||||
<div class="logo-mark">
|
||||
<img src="logo-balam-oficial.png" alt="Balam Talento Estratégico">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-label">Operación</div>
|
||||
<div class="nav-label" style="padding-top:2px">General</div>
|
||||
<div class="nav-item active" data-view="dashboard">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><rect x="3" y="3" width="7.5" height="7.5" rx="1.5"/><rect x="13.5" y="3" width="7.5" height="7.5" rx="1.5"/><rect x="3" y="13.5" width="7.5" height="7.5" rx="1.5"/><rect x="13.5" y="13.5" width="7.5" height="7.5" rx="1.5"/></svg>
|
||||
Dashboard
|
||||
</div>
|
||||
|
||||
<div class="nav-label">Facturación</div>
|
||||
<div class="nav-item" data-view="solicitudes">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M3 7.5 12 3l9 4.5v9L12 21l-9-4.5v-9Z"/><path d="M3 7.5 12 12m0 0 9-4.5M12 12v9"/></svg>
|
||||
Solicitudes (Jira)
|
||||
@@ -430,25 +525,35 @@
|
||||
</div>
|
||||
<div class="nav-item" data-view="emision">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M14 3H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9l-6-6Z"/><path d="M14 3v6h6M9 14l2 2 4-4"/></svg>
|
||||
Emisión asistida
|
||||
Por aprobar y emitir
|
||||
<span class="nav-num">3</span>
|
||||
</div>
|
||||
<div class="nav-item" data-view="envio">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="m22 2-11 11M22 2 15 22l-4-9-9-4 20-7Z"/></svg>
|
||||
Envío al cliente
|
||||
<span class="nav-num">4</span>
|
||||
</div>
|
||||
|
||||
<div class="nav-label">Cobranza</div>
|
||||
<div class="nav-item" data-view="cobranza">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2.5"/></svg>
|
||||
Cobranza
|
||||
Cuentas por cobrar
|
||||
<span class="nav-num">6</span>
|
||||
</div>
|
||||
<div class="nav-item" data-view="pagos">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M18 8a6 6 0 1 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.7 21a2 2 0 0 1-3.4 0"/></svg>
|
||||
Pagos y recordatorios
|
||||
</div>
|
||||
|
||||
<div class="nav-label">Trazabilidad</div>
|
||||
<div class="nav-item" data-view="bitacora">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M8 6h13M8 12h13M8 18h13M3.5 6h.01M3.5 12h.01M3.5 18h.01"/></svg>
|
||||
Bitácora
|
||||
</div>
|
||||
|
||||
<div class="bind-status">
|
||||
<div class="row1"><span class="dot"></span> BIND ERP · conectado</div>
|
||||
<div class="meta">Última sincronización: hoy 12:42 · 1,240 / 20,000 llamadas</div>
|
||||
<div class="row1"><span class="dot"></span> BIND ERP · operativo</div>
|
||||
<div class="meta">Corte de datos: hoy 09:47 · próxima lectura aprox. 10:02<br>1,240 / 20,000 llamadas</div>
|
||||
</div>
|
||||
|
||||
<div class="user-chip">
|
||||
@@ -469,8 +574,9 @@
|
||||
<span class="current" id="crumb">Dashboard</span>
|
||||
</div>
|
||||
<div class="top-right">
|
||||
<span class="pill">TC DOF <b>$18.7342</b> MXN/USD · 06 jul 2026</span>
|
||||
<span class="pill">Lunes, 6 de julio de 2026</span>
|
||||
<span class="sync-context"><span class="dot"></span><span><b>BIND actualizado hace 4 min</b><small>Corte 09:47 · próxima lectura aprox. 10:02</small></span></span>
|
||||
<span class="pill">TC DOF <b>$18.7342</b> MXN/USD · 08 jul 2026</span>
|
||||
<span class="pill">Miércoles, 8 de julio de 2026</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -481,7 +587,7 @@
|
||||
============================================================ -->
|
||||
<section class="view active" id="view-dashboard">
|
||||
<h1 class="view-title">Panel de control — Julio 2026</h1>
|
||||
<p class="view-sub">Resumen del mes al <b>lunes 6 de julio</b>. Cifras leídas de BIND ERP; montos por moneda <b>sin mezclar</b> (MXN y USD se reportan por separado).</p>
|
||||
<p class="view-sub">Corte 8 jul · BIND ERP · importes separados por moneda.</p>
|
||||
|
||||
<div class="grid4 mb20">
|
||||
<div class="kpi">
|
||||
@@ -499,19 +605,22 @@
|
||||
<div class="kpi-value">14 <small>/ ~55 del mes</small></div>
|
||||
<div class="kpi-meta">5 en proceso · 36 esperadas (recurrencias + tickets)</div>
|
||||
</div>
|
||||
<div class="kpi k-bad">
|
||||
<div class="kpi k-bad" onclick="show('cobranza')" style="cursor:pointer">
|
||||
<div class="kpi-label">Cartera vencida</div>
|
||||
<div class="kpi-value">$444,660 <small>MXN</small></div>
|
||||
<div class="kpi-meta">+ $11,750 USD · 5 facturas vencidas</div>
|
||||
<div class="money-split">
|
||||
<div class="money-line"><small>MXN</small><b>$444,660</b></div>
|
||||
<div class="money-line"><small>USD</small><b>$11,750</b></div>
|
||||
</div>
|
||||
<div class="kpi-meta">6 facturas vencidas · importes sin conversión · ver aging ›</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display:grid;grid-template-columns:1.5fr 1fr;gap:20px" class="mb20">
|
||||
<div style="display:grid;grid-template-columns:1.5fr 1fr;gap:20px" class="mb20 dashboard-charts">
|
||||
<div class="card card-pad">
|
||||
<div class="spread mb12">
|
||||
<div>
|
||||
<h3 class="card-title">Facturación mensual · MXN</h3>
|
||||
<p class="card-sub" style="margin-bottom:0">Últimos 6 meses · julio en curso (al día 6)</p>
|
||||
<p class="card-sub" style="margin-bottom:0">Últimos 6 meses · julio en curso</p>
|
||||
</div>
|
||||
<span class="chip chip-neutral">Fuente: BIND ERP</span>
|
||||
</div>
|
||||
@@ -527,7 +636,7 @@
|
||||
|
||||
<div class="card card-pad">
|
||||
<h3 class="card-title">Facturas por cliente · junio</h3>
|
||||
<p class="card-sub">54 facturas emitidas — el mayor exige <b>una factura por colaborador</b></p>
|
||||
<p class="card-sub">54 emitidas · CEMEX factura por colaborador</p>
|
||||
<div class="hbar-row"><span><b>CEMEX</b></span><div class="hbar-track"><div class="hbar-fill am" style="width:100%"></div></div><span class="hbar-n">38 fact.</span></div>
|
||||
<div class="hbar-row"><span>ACUNTIA</span><div class="hbar-track"><div class="hbar-fill" style="width:18%"></div></div><span class="hbar-n">7 fact.</span></div>
|
||||
<div class="hbar-row"><span>Axie</span><div class="hbar-track"><div class="hbar-fill" style="width:11%"></div></div><span class="hbar-n">4 fact.</span></div>
|
||||
@@ -537,39 +646,47 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card card-pad">
|
||||
<div class="card card-pad dashboard-attention mb20">
|
||||
<div class="spread mb8">
|
||||
<h3 class="card-title">Requiere atención</h3>
|
||||
<div>
|
||||
<h3 class="card-title">Qué necesita atención</h3>
|
||||
<p class="card-sub" style="margin:2px 0 0">Prioridad, responsable y antigüedad.</p>
|
||||
</div>
|
||||
<span class="chip chip-warn"><span class="cdot"></span>5 pendientes</span>
|
||||
</div>
|
||||
<div class="att-item" onclick="show('solicitudes')">
|
||||
<span class="sev sev-bad"></span>
|
||||
<span class="att-txt"><b>FAC-0873 · Axie</b> — bloqueado: falta la <b>cotización BIND</b> (obligatoria para iniciar facturación).
|
||||
<span class="att-sub">Solicitarla al área comercial antes de convertir a prefactura.</span></span>
|
||||
<span class="att-meta"><span>Responsable<b>Araceli</b></span><span>Antigüedad<b>Hoy</b></span></span>
|
||||
<span class="att-go">›</span>
|
||||
</div>
|
||||
<div class="att-item" onclick="show('cobranza')">
|
||||
<span class="sev sev-bad"></span>
|
||||
<span class="att-txt"><b>F-2026-0019 · ACUNTIA</b> — factura de <b>febrero</b> con 114 días vencida ($86,200 MXN).
|
||||
<span class="att-sub">Cliente puntual sin seguimiento a tiempo — alerta interna escalada a administración.</span></span>
|
||||
<span class="att-meta"><span>Responsable<b>Dirección</b></span><span>Antigüedad<b>114 días</b></span></span>
|
||||
<span class="att-go">›</span>
|
||||
</div>
|
||||
<div class="att-item" onclick="show('emision')">
|
||||
<span class="sev sev-warn"></span>
|
||||
<span class="att-txt"><b>3 prefacturas en simulación</b> esperan validación humana antes de emitir CFDI.
|
||||
<span class="att-sub">Nada se timbra sin confirmación del aprobador.</span></span>
|
||||
<span class="att-txt"><b>3 prefacturas en simulación</b> esperan aprobación humana antes de habilitar el timbrado.
|
||||
<span class="att-sub">Aprobar y timbrar son acciones separadas; cada aprobación queda ligada a una versión.</span></span>
|
||||
<span class="att-meta"><span>Responsable<b>Arturo</b></span><span>Antigüedad<b>38 min</b></span></span>
|
||||
<span class="att-go">›</span>
|
||||
</div>
|
||||
<div class="att-item" onclick="show('solicitudes')">
|
||||
<span class="sev sev-warn"></span>
|
||||
<span class="att-txt"><b>FAC-0871 · Nuova Textil</b> — cliente nuevo <b>sin cédula de identificación fiscal</b> adjunta.
|
||||
<span class="att-sub">El alta del cliente en BIND la realiza administración antes de poder cotizar.</span></span>
|
||||
<span class="att-meta"><span>Responsable<b>Arturo</b></span><span>Antigüedad<b>Desde ayer</b></span></span>
|
||||
<span class="att-go">›</span>
|
||||
</div>
|
||||
<div class="att-item" onclick="show('envio')">
|
||||
<span class="sev sev-info"></span>
|
||||
<span class="att-txt"><b>4 facturas emitidas sin enviar</b> — la facturación termina hasta que el correo sale con los adjuntos correctos.
|
||||
<span class="att-sub">CEMEX requiere Excel de horas con VoBo + nomenclatura de asunto.</span></span>
|
||||
<span class="att-meta"><span>Responsable<b>Arturo</b></span><span>Antigüedad<b>Desde ayer</b></span></span>
|
||||
<span class="att-go">›</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -583,7 +700,7 @@
|
||||
<!-- Bandeja -->
|
||||
<div id="sol-lista">
|
||||
<h1 class="view-title">Solicitudes de facturación — Jira ITSM</h1>
|
||||
<p class="view-sub">Bandeja sincronizada del portal <b>Administración General → Facturación</b>. Regla vigente: <b>si no hay ticket en Jira, no se factura</b>. Todos los tickets se asignan a Arturo (administración hace doble check de datos, cédula fiscal y estado de cuenta).</p>
|
||||
<p class="view-sub">Tickets de Jira asignados a Arturo · <b>sin ticket, no se factura</b>.</p>
|
||||
|
||||
<div class="filters">
|
||||
<button class="fchip on">Todos (8)</button>
|
||||
@@ -698,7 +815,7 @@
|
||||
<div class="spread mb16">
|
||||
<div>
|
||||
<h1 class="view-title">FAC-0876 · CEMEX — Staff augmentation</h1>
|
||||
<p class="view-sub" style="margin-bottom:0">Levantado por <b>Araceli Sánchez</b> (comercial) · 03 jul 2026, 10:22 · Asignado a <b>Arturo R.</b> · Empresa origen: <b>Balam</b></p>
|
||||
<p class="view-sub" style="margin-bottom:0">Araceli Sánchez · 03 jul, 10:22 · Responsable: <b>Arturo R.</b></p>
|
||||
</div>
|
||||
<span class="chip chip-ok" style="font-size:12px;padding:5px 14px"><span class="cdot"></span>Listo para facturar</span>
|
||||
</div>
|
||||
@@ -745,8 +862,8 @@
|
||||
============================================================ -->
|
||||
<section class="view" id="view-emision">
|
||||
<div id="wiz-main">
|
||||
<h1 class="view-title">Emisión asistida de CFDI</h1>
|
||||
<p class="view-sub">Flujo validado en Discovery (6-jul): <b>cotización BIND → prefactura → validación humana → CFDI</b>. Nada se timbra sin confirmación explícita del aprobador.</p>
|
||||
<h1 class="view-title">Preparación, aprobación y emisión de CFDI</h1>
|
||||
<p class="view-sub"><b>Cotización BIND → prefactura → aprobación humana → CFDI.</b> Aprobar no timbra.</p>
|
||||
|
||||
<div class="ticket-ribbon">
|
||||
<span class="tkid">FAC-0876</span>
|
||||
@@ -761,14 +878,14 @@
|
||||
<div class="step" id="st-2"><span class="step-n">2</span><span class="step-t"><b>Datos de factura</b><small>CFDI · PPD/PUE · TC DOF</small></span></div>
|
||||
<div class="step" id="st-3"><span class="step-n">3</span><span class="step-t"><b>Conceptos e IVA</b><small>regla 16% / 0%</small></span></div>
|
||||
<div class="step" id="st-4"><span class="step-n">4</span><span class="step-t"><b>Prefactura</b><small>simulación, sin timbrar</small></span></div>
|
||||
<div class="step" id="st-5"><span class="step-n">5</span><span class="step-t"><b>Validación y emisión</b><small>timbra el PAC de BIND</small></span></div>
|
||||
<div class="step" id="st-5"><span class="step-n">5</span><span class="step-t"><b>Aprobación humana</b><small>habilita la emisión; no timbra</small></span></div>
|
||||
</div>
|
||||
|
||||
<!-- Paso 1 -->
|
||||
<div class="wiz-pane active" id="wp-1">
|
||||
<div class="card card-pad">
|
||||
<h3 class="card-title">Paso 1 · Selecciona la cotización de BIND</h3>
|
||||
<p class="card-sub">Regla de negocio (Discovery 6-jul, definida por Araceli): <b>toda factura parte de una cotización registrada en BIND</b>. La conversión a prefactura es de un clic, sin volver a capturar.</p>
|
||||
<p class="card-sub"><b>Toda factura parte de una cotización BIND.</b></p>
|
||||
|
||||
<div class="grid2 mt12">
|
||||
<div class="quote-card sel" onclick="pickQuote(this)">
|
||||
@@ -808,7 +925,7 @@
|
||||
<div class="wiz-pane" id="wp-2">
|
||||
<div class="card card-pad">
|
||||
<h3 class="card-title">Paso 2 · Datos de la factura</h3>
|
||||
<p class="card-sub">Precargados desde la cotización y el catálogo del cliente en BIND. Los campos editables quedan registrados en bitácora.</p>
|
||||
<p class="card-sub">Datos de BIND · los cambios quedan en bitácora.</p>
|
||||
|
||||
<div class="grid3 mt12">
|
||||
<div class="field"><label>Cliente (receptor)</label><input type="text" value="CEMEX, S.A.B. de C.V." readonly><div class="hint">RFC: CMX870506AB1 · precargado de BIND</div></div>
|
||||
@@ -853,7 +970,7 @@
|
||||
<div class="wiz-pane" id="wp-3">
|
||||
<div class="card card-pad">
|
||||
<h3 class="card-title">Paso 3 · Conceptos e IVA</h3>
|
||||
<p class="card-sub">Conceptos importados de la cotización. El IVA se asigna <b>automáticamente por regla</b> — en BIND hoy es captura manual y ha causado errores (Discovery 6-jul).</p>
|
||||
<p class="card-sub">Conceptos de la cotización · IVA automático por regla.</p>
|
||||
|
||||
<div class="alert alert-ok mb16">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 6 9 17l-5-5"/></svg>
|
||||
@@ -941,7 +1058,7 @@
|
||||
<button class="btn btn-ghost" onclick="wiz(3)">← Corregir conceptos</button>
|
||||
<div class="flex">
|
||||
<button class="btn btn-ghost" onclick="toast('Prefactura PRE-2026-0311 guardada. Puede retomarse desde el Dashboard.')">Guardar y validar después</button>
|
||||
<button class="btn btn-primary" onclick="wiz(5)">Pasa el doble check → validación final</button>
|
||||
<button class="btn btn-primary" onclick="wiz(5)">Enviar prefactura v3 a aprobación →</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -950,36 +1067,41 @@
|
||||
<div class="wiz-pane" id="wp-5">
|
||||
<div class="grid2" style="grid-template-columns:1.2fr 1fr;align-items:start">
|
||||
<div class="card card-pad">
|
||||
<h3 class="card-title">Paso 5 · Validaciones finales</h3>
|
||||
<p class="card-sub">Todos los candados en verde. La emisión es el único paso irreversible del flujo.</p>
|
||||
<h3 class="card-title">Paso 5 · Revisión previa a la aprobación</h3>
|
||||
<p class="card-sub">La aprobación queda ligada a PRE-2026-0311 v3.</p>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>Cotización BIND vinculada</b><span class="cr-sub">COT-2026-0455 vigente · regla obligatoria del 6-jul</span></span></div>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>Ticket Jira válido y autorizado</b><span class="cr-sub">FAC-0876 · doble check de administración completado</span></span></div>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>Método de pago PPD</b><span class="cr-sub">Coherente con 90 días de crédito · sin riesgo de requerimiento SAT</span></span></div>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>IVA 16% por regla fiscal</b><span class="cr-sub">Nacional MXN · sin override manual</span></span></div>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>Prefactura revisada en simulación</b><span class="cr-sub">PRE-2026-0311 · totales verificados: $79,390.40 MXN</span></span></div>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>Prefactura lista para decisión</b><span class="cr-sub">PRE-2026-0311 · versión 3 · total verificado: $79,390.40 MXN</span></span></div>
|
||||
<div class="check-row"><span class="check-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><path d="M20 6 9 17l-5-5"/></svg></span><span><b>Cliente activo en BIND con datos fiscales completos</b><span class="cr-sub">CEMEX · RFC y dirección fiscal precargados</span></span></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="card card-pad mb16">
|
||||
<h3 class="card-title mb8">Aprobación humana</h3>
|
||||
<div class="card card-pad mb16 approval-gate" id="approval-pending">
|
||||
<div class="spread mb8">
|
||||
<h3 class="card-title">Aprobación humana</h3>
|
||||
<span class="chip chip-warn">Pendiente</span>
|
||||
</div>
|
||||
<div class="field mb12">
|
||||
<label>Aprobador responsable</label>
|
||||
<select><option selected>Arturo R. — Administración / Facturación</option><option>Araceli Sánchez — Dirección</option></select>
|
||||
<div class="hint">Queda asentado en la bitácora junto con fecha y hora</div>
|
||||
<select id="approval-owner"><option selected>Arturo R. — Administración / Facturación</option><option>Araceli Sánchez — Dirección</option></select>
|
||||
<div class="hint">La decisión quedará asentada con fecha, hora, Jira, folio BIND y versión de prefactura.</div>
|
||||
</div>
|
||||
<label style="display:flex;gap:9px;font-size:12px;cursor:pointer;align-items:flex-start">
|
||||
<input type="checkbox" id="chk-confirm" style="width:16px;height:16px;accent-color:#1E7A46;margin-top:2px" onchange="document.getElementById('btn-emit').disabled=!this.checked">
|
||||
<span>Revisé la prefactura <b>PRE-2026-0311</b> y autorizo la emisión del CFDI.</span>
|
||||
</label>
|
||||
<div class="approval-status"><span class="state-dot"></span><span><b>PRE-2026-0311 · versión 3</b><small>Cualquier cambio posterior en datos fiscales, conceptos o importes invalidará esta aprobación.</small></span></div>
|
||||
<button class="btn btn-primary btn-lg mt12" style="width:100%;justify-content:center" onclick="approvePrefactura()">Aprobar prefactura v3</button>
|
||||
</div>
|
||||
<div class="alert alert-warn mb12">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 9v4m0 4h.01M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z"/></svg>
|
||||
<span><b>Acción irreversible.</b> Al emitir, el PAC de BIND timbra el CFDI ante el SAT. Cancelar después implica proceso administrativo y contable.</span>
|
||||
<div id="approval-approved" style="display:none">
|
||||
<div class="card card-pad mb12">
|
||||
<div class="spread mb8"><h3 class="card-title">Prefactura aprobada</h3><span class="chip chip-ok">Aprobada</span></div>
|
||||
<div class="approval-status ok"><span class="state-dot"></span><span><b>Arturo R. aprobó PRE-2026-0311 v3</b><small>10 jul 2026 · 09:54 · FAC-0876 · COT-2026-0455</small></span></div>
|
||||
</div>
|
||||
<div class="alert alert-warn mb12">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 9v4m0 4h.01M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z"/></svg>
|
||||
<span><b>Acción irreversible.</b> El siguiente botón timbra ante el SAT mediante el PAC de BIND. Total a emitir: <b>$79,390.40 MXN</b>.</span>
|
||||
</div>
|
||||
<button class="btn btn-primary btn-lg" id="btn-emit" style="width:100%;justify-content:center" onclick="emitOk()">Timbrar CFDI aprobado — $79,390.40 MXN</button>
|
||||
</div>
|
||||
<button class="btn btn-primary btn-lg" id="btn-emit" style="width:100%;justify-content:center" disabled onclick="emitOk()">
|
||||
Emitir CFDI — timbra el PAC de BIND
|
||||
</button>
|
||||
<button class="btn btn-ghost mt8" style="width:100%;justify-content:center" onclick="wiz(4)">← Volver a la prefactura</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1018,7 +1140,7 @@
|
||||
============================================================ -->
|
||||
<section class="view" id="view-envio">
|
||||
<h1 class="view-title">Envío al cliente</h1>
|
||||
<p class="view-sub">El paso que hoy falta sistematizar: <b>la facturación termina hasta que el correo sale</b> con los adjuntos y el formato que cada cliente exige. El botón "Enviar" se bloquea si falta un requisito.</p>
|
||||
<p class="view-sub"><b>No se envía</b> hasta completar los adjuntos requeridos por el cliente.</p>
|
||||
|
||||
<div class="send-layout">
|
||||
<!-- Cola -->
|
||||
@@ -1051,7 +1173,7 @@
|
||||
<div class="spread mb12">
|
||||
<div>
|
||||
<h3 class="card-title">F-2026-0143 · CEMEX, S.A.B. de C.V.</h3>
|
||||
<p class="card-sub" style="margin:0">Perfil de envío del catálogo de particularidades por cliente</p>
|
||||
<p class="card-sub" style="margin:0">Requisitos del cliente</p>
|
||||
</div>
|
||||
<span class="chip chip-cafe">Perfil CEMEX</span>
|
||||
</div>
|
||||
@@ -1124,8 +1246,8 @@
|
||||
VISTA 5 · COBRANZA
|
||||
============================================================ -->
|
||||
<section class="view" id="view-cobranza">
|
||||
<h1 class="view-title">Cobranza operativa</h1>
|
||||
<p class="view-sub">Aging de cuentas por cobrar leído de BIND (<b>Finanzas → Cuentas por cobrar</b>), por moneda y sin mezclar. Las alertas son <b>internas, al equipo Balam</b> — los recordatorios automáticos al cliente se habilitan en fase posterior.</p>
|
||||
<h1 class="view-title">Cuentas por cobrar</h1>
|
||||
<p class="view-sub"><b>Corte 09:47</b> · próxima lectura 10:02 · MXN y USD separados.</p>
|
||||
|
||||
<div class="card mb16" style="overflow:hidden">
|
||||
<div style="padding:13px 18px;border-bottom:1px solid var(--linea)" class="spread">
|
||||
@@ -1159,12 +1281,137 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Detalle por factura: el control que hoy vive en el Excel de Arturo -->
|
||||
<div class="card mb20" style="overflow:hidden">
|
||||
<div style="padding:13px 18px;border-bottom:1px solid var(--linea)" class="spread">
|
||||
<div>
|
||||
<h3 class="card-title" style="margin:0">Facturas abiertas · detalle</h3>
|
||||
<p class="card-sub" style="margin:2px 0 0">Saldo y días de mora leídos de BIND.</p>
|
||||
</div>
|
||||
<div class="filters" style="margin:0">
|
||||
<button class="fchip on">Todas (14)</button>
|
||||
<button class="fchip">Vencidas (6)</button>
|
||||
<button class="fchip">Por vencer (8)</button>
|
||||
<button class="fchip">MXN (11)</button>
|
||||
<button class="fchip">USD (3)</button>
|
||||
</div>
|
||||
</div>
|
||||
<table class="tbl" style="font-size:12px">
|
||||
<thead><tr><th>Folio</th><th>Cliente</th><th class="num">Monto</th><th>Vencimiento</th><th>Días de mora</th><th></th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td class="mono">F-2026-0019</td><td>ACUNTIA</td><td class="num">$86,200.00 MXN</td><td>16-mar-2026</td><td><span class="chip chip-bad">114 días · febrero</span></td><td><button class="btn btn-ghost btn-sm" onclick="edoCuenta()">Edo. cuenta</button></td></tr>
|
||||
<tr><td class="mono">F-2026-0058</td><td>Regiotour</td><td class="num">$85,700.00 MXN</td><td>26-abr-2026</td><td><span class="chip chip-bad">73 días</span></td><td><button class="btn btn-ghost btn-sm" onclick="toast('Estado de cuenta ejemplificado con ACUNTIA en este prototipo.')">Edo. cuenta</button></td></tr>
|
||||
<tr><td class="mono">F-2026-0087</td><td>Dilo</td><td class="num">$124,700.00 MXN</td><td>28-may-2026</td><td><span class="chip chip-warn">41 días</span></td><td><button class="btn btn-ghost btn-sm" onclick="toast('Estado de cuenta ejemplificado con ACUNTIA en este prototipo.')">Edo. cuenta</button></td></tr>
|
||||
<tr><td class="mono">INV-2026-0102</td><td>Axie</td><td class="num">$11,750.00 USD</td><td>31-may-2026</td><td><span class="chip chip-warn">38 días</span></td><td><button class="btn btn-ghost btn-sm" onclick="toast('Estado de cuenta ejemplificado con ACUNTIA en este prototipo.')">Edo. cuenta</button></td></tr>
|
||||
<tr><td class="mono">F-2026-0114</td><td>Dilo</td><td class="num">$62,060.00 MXN</td><td>20-jun-2026</td><td><span class="chip chip-warn">18 días</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0117</td><td>Regiotour</td><td class="num">$86,000.00 MXN</td><td>29-jun-2026</td><td><span class="chip chip-warn">9 días</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0110</td><td>CEMEX</td><td class="num">$71,920.00 MXN</td><td>14-jul-2026</td><td><span class="chip chip-info">Vence en 6 días</span></td><td></td></tr>
|
||||
<tr><td class="mono">INV-2026-0106</td><td>Axie</td><td class="num">$5,175.00 USD</td><td>15-jul-2026</td><td><span class="chip chip-info">Vence en 7 días</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0126</td><td>Regiotour</td><td class="num">$110,020.00 MXN</td><td>18-jul-2026</td><td><span class="chip chip-neutral">Al corriente</span></td><td></td></tr>
|
||||
<tr><td class="mono">INV-2026-0108</td><td>Axie</td><td class="num">$5,175.00 USD</td><td>21-jul-2026</td><td><span class="chip chip-neutral">Al corriente</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0132</td><td>Dilo</td><td class="num">$114,029.60 MXN</td><td>24-jul-2026</td><td><span class="chip chip-neutral">Al corriente</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0138</td><td>CEMEX</td><td class="num">$118,560.00 MXN</td><td>30-jul-2026</td><td><span class="chip chip-neutral">Al corriente</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0141</td><td>CEMEX</td><td class="num">$118,560.00 MXN</td><td>02-ago-2026</td><td><span class="chip chip-neutral">Al corriente</span></td><td></td></tr>
|
||||
<tr><td class="mono">F-2026-0143</td><td>CEMEX</td><td class="num">$79,390.40 MXN</td><td>05-ago-2026</td><td><span class="chip chip-neutral">Al corriente · emitida 06-jul</span></td><td></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Estado de cuenta por cliente (ejemplo: ACUNTIA) -->
|
||||
<div class="card mb20" id="edo-cuenta" style="display:none;overflow:hidden">
|
||||
<div style="padding:13px 18px;border-bottom:1px solid var(--linea)" class="spread">
|
||||
<div>
|
||||
<h3 class="card-title" style="margin:0">Estado de cuenta · ACUNTIA</h3>
|
||||
<p class="card-sub" style="margin:2px 0 0">Facturas abiertas y pagos recientes.</p>
|
||||
</div>
|
||||
<div style="display:flex;gap:8px">
|
||||
<button class="btn btn-ghost btn-sm" onclick="toast('Estado de cuenta exportado a PDF/XLSX (demo).')">Exportar</button>
|
||||
<button class="btn btn-ghost btn-sm" onclick="edoCuenta(false)">Cerrar ✕</button>
|
||||
</div>
|
||||
</div>
|
||||
<table class="tbl" style="font-size:12px">
|
||||
<thead><tr><th>Folio</th><th>Emitida</th><th class="num">Total</th><th class="num">Pagado</th><th class="num">Saldo</th><th>Estatus</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td class="mono">F-2026-0019</td><td>12-feb-2026</td><td class="num">$86,200.00</td><td class="num">$0.00</td><td class="num" style="color:var(--bad-ink);font-weight:600">$86,200.00</td><td><span class="chip chip-bad">Vencida · 114 días</span></td></tr>
|
||||
<tr><td class="mono">F-2026-0034</td><td>10-mar-2026</td><td class="num">$79,450.00</td><td class="num">$79,450.00</td><td class="num">$0.00</td><td><span class="chip chip-ok">Pagada · 22-jun</span></td></tr>
|
||||
<tr><td class="mono">F-2026-0007</td><td>09-ene-2026</td><td class="num">$86,200.00</td><td class="num">$86,200.00</td><td class="num">$0.00</td><td><span class="chip chip-ok">Pagada · 08-jul</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="alert alert-info" style="margin:12px 18px 16px">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/><path d="M12 8h.01M11 12h1v4h1"/></svg>
|
||||
<span>El pago del 08-jul cubrió <b>enero</b> pero dejó <b>febrero</b> abierta — pago fuera de orden. El estado de cuenta <b>por folio</b> deja el cruce claro para ambos lados (hoy ese cruce se hace intercambiando Exceles con el cliente).</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<!-- ============================================================
|
||||
VISTA 5b · PAGOS Y RECORDATORIOS
|
||||
============================================================ -->
|
||||
<section class="view" id="view-pagos">
|
||||
<h1 class="view-title">Pagos y recordatorios</h1>
|
||||
<p class="view-sub">Pagos leídos de BIND · alertas internas por días de mora.</p>
|
||||
|
||||
<!-- Pagos detectados + reglas de recordatorio -->
|
||||
<div style="display:grid;grid-template-columns:1.4fr 1fr;gap:20px" class="mb20">
|
||||
<div class="card card-pad">
|
||||
<div class="spread mb12">
|
||||
<div>
|
||||
<h3 class="card-title">Pagos detectados</h3>
|
||||
<p class="card-sub" style="margin:0">Detectados en cada lectura de BIND.</p>
|
||||
</div>
|
||||
<span class="sync-chip">Sincronizado con BIND · hace 4 min</span>
|
||||
</div>
|
||||
<table class="tbl" style="font-size:12px">
|
||||
<thead><tr><th>Factura</th><th>Cliente</th><th class="num">Pagado</th><th>Detectado</th><th>Resultado</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td class="mono">F-2026-0095</td><td>Dilo</td><td class="num">$98,600.00 MXN</td><td>hoy · 9:47</td><td><span class="chip chip-ok">Saldada</span></td></tr>
|
||||
<tr><td class="mono">F-2026-0007</td><td>ACUNTIA</td><td class="num">$86,200.00 MXN</td><td>hoy · 9:47</td><td><span class="chip chip-warn">Saldada · fuera de orden</span></td></tr>
|
||||
<tr><td class="mono">INV-2026-0099</td><td>Axie</td><td class="num">$8,372.50 USD</td><td>ayer · 17:32</td><td><span class="chip chip-info">Saldada · tolerancia</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="alert alert-info mt12">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/><path d="M12 8h.01M11 12h1v4h1"/></svg>
|
||||
<span><b>Tolerancia por comisión:</b> INV-2026-0099 quedó con residual de <b>$27.50 USD</b> por el fee de la transferencia — dentro del umbral configurable ($50), se marca saldada en lugar de aparecer eternamente como morosa. La fecha mostrada es la del <b>registro en BIND</b> (lo captura el despacho), no la fecha valor del banco.</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card card-pad">
|
||||
<h3 class="card-title">Reglas de recordatorio</h3>
|
||||
<p class="card-sub">Acciones configuradas por días de mora.</p>
|
||||
<div class="regla">
|
||||
<span class="regla-d">D+1</span>
|
||||
<span class="regla-txt">Alerta interna a Arturo R.<small>Factura vencida detectada en el aging</small></span>
|
||||
<span class="chip chip-ok">MVP · activa</span>
|
||||
</div>
|
||||
<div class="regla off">
|
||||
<span class="regla-d">D+5</span>
|
||||
<span class="regla-txt">Correo de cortesía al cliente<small>Plantilla con folio, monto y días transcurridos</small></span>
|
||||
<span class="chip chip-neutral">Fase posterior</span>
|
||||
</div>
|
||||
<div class="regla">
|
||||
<span class="regla-d">D+15</span>
|
||||
<span class="regla-txt">Escalamiento interno a dirección<small>Araceli S. + Arturo R. — caso ACUNTIA-febrero</small></span>
|
||||
<span class="chip chip-ok">MVP · activa</span>
|
||||
</div>
|
||||
<div class="regla off">
|
||||
<span class="regla-d">D+30</span>
|
||||
<span class="regla-txt">2º correo al cliente + CC a dirección<small>Con estado de cuenta adjunto</small></span>
|
||||
<span class="chip chip-neutral">Fase posterior</span>
|
||||
</div>
|
||||
<div class="alert alert-info mt12">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/><path d="M12 8h.01M11 12h1v4h1"/></svg>
|
||||
<span>Los <b>correos automáticos al cliente</b> están cotizados en el <b>Anexo B</b> (fase posterior); el MVP entrega las alertas internas y deja estas reglas preparadas para activarse.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display:grid;grid-template-columns:1.4fr 1fr;gap:20px">
|
||||
<div class="card card-pad">
|
||||
<div class="spread mb12">
|
||||
<div>
|
||||
<h3 class="card-title">Alertas internas <span class="chip chip-warn" style="margin-left:6px">al equipo Balam — no al cliente</span></h3>
|
||||
<p class="card-sub" style="margin:0">Los recordatorios automáticos <b>al cliente</b> se habilitan en fase posterior (Anexo B).</p>
|
||||
<p class="card-sub" style="margin:0">Avisos internos · correos al cliente en fase posterior.</p>
|
||||
</div>
|
||||
</div>
|
||||
<table class="tbl" style="font-size:12px">
|
||||
@@ -1190,6 +1437,16 @@
|
||||
<td><span class="chip chip-warn">38 días</span></td>
|
||||
<td>Recordatorio de gestión</td><td>Arturo R.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="mono">F-2026-0114</td><td>Dilo</td><td class="num">$62,060 MXN</td>
|
||||
<td><span class="chip chip-warn">18 días</span></td>
|
||||
<td>Recordatorio de gestión</td><td>Arturo R.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="mono">F-2026-0117</td><td>Regiotour</td><td class="num">$86,000 MXN</td>
|
||||
<td><span class="chip chip-warn">9 días</span></td>
|
||||
<td>Recordatorio de gestión</td><td>Arturo R.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="mono">F-2026-0110</td><td>CEMEX</td><td class="num">$71,920 MXN</td>
|
||||
<td><span class="chip chip-info">Vence en 6 días</span></td>
|
||||
@@ -1209,7 +1466,7 @@
|
||||
<div class="empty-state">
|
||||
<div class="es-ico"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 6 9 17l-5-5"/></svg></div>
|
||||
<b>Sin excepciones — todos los clientes reciben seguimiento</b>
|
||||
<p>Decisión de dirección (6-jul-2026): la lista de excepciones queda <b>vacía</b>. La capacidad existe y es configurable, pero hoy ningún cliente se excluye de los avisos de vencimiento.</p>
|
||||
<p>Decisión de dirección (6-jul-2026): la lista de excepciones queda <b>vacía</b>. Al corte de las 09:47 ningún cliente está excluido; próxima lectura de BIND aprox. 10:02.</p>
|
||||
</div>
|
||||
<button class="btn btn-ghost btn-sm" style="width:100%;justify-content:center" onclick="toast('Capacidad disponible pero sin uso: dirección decidió no excluir a nadie (6-jul).')">Agregar excepción…</button>
|
||||
</div>
|
||||
@@ -1221,7 +1478,7 @@
|
||||
============================================================ -->
|
||||
<section class="view" id="view-bitacora">
|
||||
<h1 class="view-title">Bitácora de auditoría</h1>
|
||||
<p class="view-sub">Registro inmutable de cada acción: quién, qué, cuándo, con qué <b>ticket Jira</b> y qué <b>folio BIND</b>. Base de la trazabilidad end-to-end del flujo.</p>
|
||||
<p class="view-sub">Trazabilidad por usuario, ticket Jira y folio BIND.</p>
|
||||
|
||||
<div class="filters">
|
||||
<button class="fchip on">Todo (hoy)</button>
|
||||
@@ -1240,6 +1497,12 @@
|
||||
<table class="tbl">
|
||||
<thead><tr><th>Fecha y hora</th><th>Usuario</th><th>Acción</th><th>Referencias</th><th>Detalle</th></tr></thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="white-space:nowrap">08 jul 2026 · 09:47</td><td><b>Plataforma</b></td>
|
||||
<td><span class="chip chip-ok">Pago detectado</span></td>
|
||||
<td class="mono" style="font-size:11.5px">F-2026-0095 · F-2026-0007</td>
|
||||
<td>Sincronización BIND: 2 pagos registrados por el despacho · Dilo saldada · ACUNTIA aplicó a enero (pago fuera de orden — febrero sigue abierta)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="white-space:nowrap">06 jul 2026 · 13:05</td><td><b>Arturo R.</b></td>
|
||||
<td><span class="chip chip-ok">CFDI emitido</span></td>
|
||||
@@ -1324,8 +1587,13 @@
|
||||
<script>
|
||||
/* ============ Navegación entre vistas ============ */
|
||||
const CRUMBS = {
|
||||
dashboard:'Dashboard', solicitudes:'Solicitudes (Jira)', emision:'Emisión asistida',
|
||||
envio:'Envío al cliente', cobranza:'Cobranza', bitacora:'Bitácora'
|
||||
dashboard:'Dashboard',
|
||||
solicitudes:'Facturación · Solicitudes (Jira)',
|
||||
emision:'Facturación · Por aprobar y emitir',
|
||||
envio:'Facturación · Envío al cliente',
|
||||
cobranza:'Cobranza · Cuentas por cobrar',
|
||||
pagos:'Cobranza · Pagos y recordatorios',
|
||||
bitacora:'Bitácora'
|
||||
};
|
||||
|
||||
function show(view){
|
||||
@@ -1356,9 +1624,11 @@ document.querySelectorAll('.nav-item[data-view]').forEach(el => {
|
||||
el.addEventListener('click', () => show(el.dataset.view));
|
||||
});
|
||||
|
||||
/* ============ Wizard de emisión (5 pasos) ============ */
|
||||
/* ============ Wizard de preparación, aprobación y emisión (5 pasos) ============ */
|
||||
let curStep = 1;
|
||||
let approvalGranted = false;
|
||||
function wiz(n){
|
||||
if(n < 5 && approvalGranted) resetApproval();
|
||||
curStep = n;
|
||||
document.querySelectorAll('.wiz-pane').forEach(p => p.classList.remove('active'));
|
||||
document.getElementById('wp-' + n).classList.add('active');
|
||||
@@ -1381,14 +1651,29 @@ function startWizard(){
|
||||
function resetWizard(){
|
||||
document.getElementById('wiz-exito').style.display = 'none';
|
||||
document.getElementById('wiz-main').style.display = 'block';
|
||||
const chk = document.getElementById('chk-confirm');
|
||||
chk.checked = false;
|
||||
document.getElementById('btn-emit').disabled = true;
|
||||
resetApproval();
|
||||
pickPay('ppd');
|
||||
wiz(1);
|
||||
}
|
||||
|
||||
function resetApproval(){
|
||||
approvalGranted = false;
|
||||
document.getElementById('approval-pending').style.display = 'block';
|
||||
document.getElementById('approval-approved').style.display = 'none';
|
||||
}
|
||||
|
||||
function approvePrefactura(){
|
||||
approvalGranted = true;
|
||||
document.getElementById('approval-pending').style.display = 'none';
|
||||
document.getElementById('approval-approved').style.display = 'block';
|
||||
toast('PRE-2026-0311 v3 aprobada por Arturo R. · la emisión ya está habilitada.');
|
||||
}
|
||||
|
||||
function emitOk(){
|
||||
if(!approvalGranted){
|
||||
toast('Primero se requiere la aprobación humana de la prefactura v3.');
|
||||
return;
|
||||
}
|
||||
document.getElementById('wiz-main').style.display = 'none';
|
||||
document.getElementById('wiz-exito').style.display = 'block';
|
||||
toast('CFDI F-2026-0143 timbrado por el PAC de BIND · evidencia anexada a FAC-0876.');
|
||||
@@ -1429,6 +1714,13 @@ function updateSend(){
|
||||
}
|
||||
}
|
||||
|
||||
/* ============ Cobranza: estado de cuenta por cliente ============ */
|
||||
function edoCuenta(open = true){
|
||||
const el = document.getElementById('edo-cuenta');
|
||||
el.style.display = open ? 'block' : 'none';
|
||||
if(open) el.scrollIntoView({behavior:'instant', block:'start'});
|
||||
}
|
||||
|
||||
/* ============ Toast ============ */
|
||||
let toastTimer = null;
|
||||
function toast(msg){
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 206 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 225 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 170 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 176 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 275 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 248 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 302 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 247 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Reference in New Issue
Block a user