68 lines
3.3 KiB
PHP
68 lines
3.3 KiB
PHP
<!-- MODULE 2: NOTIFICATIONS -->
|
|
<section id="section-notificaciones" class="section-view">
|
|
<div class="card">
|
|
<div style="margin-bottom: 2rem;">
|
|
<h2 style="margin: 0; display: flex; align-items: center; gap: 10px;">
|
|
<img src="?action=get_image&name=whatsapp-notification.png" style="width:64px;height:64px;"> Notificaciones WhatsApp
|
|
</h2>
|
|
<p style="color: var(--text-muted); margin: 5px 0 0 0;">📱 Busca clientes y envía comprobantes de pago directamente a su WhatsApp</p>
|
|
</div>
|
|
|
|
<!-- CONFIG CONTAINER -->
|
|
<div class="config-container">
|
|
<div class="form-group" style="position: relative;">
|
|
<label>Buscar Cliente (Nombre, Email o ID)</label>
|
|
<div class="search-wrapper">
|
|
<svg class="search-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="11" cy="11" r="8" />
|
|
<line x1="21" y1="21" x2="16.65" y2="16.65" />
|
|
</svg>
|
|
<input type="text" id="clientSearch" class="form-control search-input-padded" placeholder="Escribe para buscar (ej. Juan Perez)..." autocomplete="off">
|
|
</div>
|
|
<div id="searchResults" class="search-results"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PLACEHOLDER STATE (Initially Visible) -->
|
|
<div id="notificationsPlaceholder" class="placeholder-state">
|
|
<span class="placeholder-icon">👋</span>
|
|
<p>Busca un cliente arriba para ver sus pagos y enviar notificaciones</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="paymentsContainer" class="card" style="display: none;">
|
|
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 10px;">
|
|
<h3 style="margin: 0; display: flex; align-items: center;">
|
|
<img src="?action=image&file=client.webp" class="client-header-icon"> <span id="selectedClientName">Pagos del Cliente</span>
|
|
</h3>
|
|
<div style="display: flex; gap: 8px;">
|
|
<a id="btnNotifCrm" href="#" target="_blank" class="btn btn-uniform" style="height: 38px;">
|
|
<img src="?action=image&file=crm.webp" class="icon-crm"> Ver en CRM
|
|
</a>
|
|
<button class="btn btn-secondary" onclick="refreshClientPayments()" style="height: 38px;">
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M23 4v6h-6" />
|
|
<path d="M1 20v-6h6" />
|
|
<path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15" />
|
|
</svg>
|
|
Refrescar Pagos
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div style="overflow-x: auto;">
|
|
<table id="paymentsTable">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Fecha</th>
|
|
<th>Monto</th>
|
|
<th>Método</th>
|
|
<th>Acción</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|