arreglados los contenedores, falta quitar el buscador de instaladores y arreglar los botones de ese crud
This commit is contained in:
parent
bd313fdfa4
commit
fc9fcca6c0
193
public.php
193
public.php
@ -635,6 +635,44 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* ROUNDED CONFIG CONTAINER (Standardized Layout) */
|
||||
.config-container {
|
||||
background: var(--bg-body);
|
||||
padding: 1.5rem;
|
||||
border-radius: 12px;
|
||||
border: 1px solid var(--border);
|
||||
margin-bottom: 2rem;
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
align-items: flex-end;
|
||||
/* Align inputs and buttons */
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.config-container .form-group {
|
||||
margin-bottom: 0;
|
||||
/* Remove default margin inside container */
|
||||
flex: 1;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
/* PLACEHOLDER STATES */
|
||||
.placeholder-state {
|
||||
text-align: center;
|
||||
padding: 4rem;
|
||||
color: var(--text-muted);
|
||||
border: 1px dashed var(--border);
|
||||
border-radius: 12px;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.placeholder-icon {
|
||||
font-size: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
opacity: 0.5;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* THEME TOGGLE (Premium) */
|
||||
.theme-toggle {
|
||||
background: var(--bg-card);
|
||||
@ -1021,15 +1059,26 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
<!-- MODULE 1: INSTALLERS -->
|
||||
<section id="section-instaladores" class="section-view active">
|
||||
<div class="card">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem;">
|
||||
<div>
|
||||
<h2 style="margin: 0; display: flex; align-items: center; gap: 10px;">
|
||||
<img src="?action=get_image&name=installers-management.png" style="width:64px;height:64px;"> Gestión de Instaladores
|
||||
</h2>
|
||||
<p style="color: var(--text-muted); margin: 5px 0 0 0;">👷 Administra tu equipo de técnicos y asigna instalaciones de manera eficiente</p>
|
||||
</div>
|
||||
<button class="btn btn-primary" onclick="openInstallerModal()">+ Nuevo Instalador</button>
|
||||
<div style="margin-bottom: 2rem;">
|
||||
<h2 style="margin: 0; display: flex; align-items: center; gap: 10px;">
|
||||
<img src="?action=get_image&name=installers-management.png" style="width:64px;height:64px;"> Gestión de Instaladores
|
||||
</h2>
|
||||
<p style="color: var(--text-muted); margin: 5px 0 0 0;">👷 Administra tu equipo de técnicos y asigna instalaciones de manera eficiente</p>
|
||||
</div>
|
||||
|
||||
<!-- CONFIG CONTAINER -->
|
||||
<div class="config-container">
|
||||
<div class="form-group">
|
||||
<label>Buscar Instalador</label>
|
||||
<input type="text" id="installerSearch" class="form-control" placeholder="Nombre, ID o WhatsApp..." onkeyup="filterInstallers()">
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn btn-primary" onclick="openInstallerModal()" style="height: 42px;">
|
||||
+ Nuevo Instalador
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="overflow-x: auto;">
|
||||
<table id="installersTable">
|
||||
<thead>
|
||||
@ -1043,28 +1092,43 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="installersEmptyState" class="placeholder-state" style="display: none;">
|
||||
<span class="placeholder-icon">🔍</span>
|
||||
<p>No se encontraron instaladores</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- MODULE 2: NOTIFICATIONS -->
|
||||
<section id="section-notificaciones" class="section-view">
|
||||
<div class="card">
|
||||
<div style="margin-bottom: 1.5rem;">
|
||||
<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>
|
||||
<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">
|
||||
|
||||
<!-- 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 id="searchResults" class="search-results"></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>
|
||||
|
||||
@ -1107,20 +1171,32 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
<!-- MODULE 3: STRIPE -->
|
||||
<section id="section-pagos-spei" class="section-view">
|
||||
<div class="card">
|
||||
<div style="margin-bottom: 1.5rem;">
|
||||
<div style="margin-bottom: 2rem;">
|
||||
<h2 style="margin: 0; display: flex; align-items: center; gap: 10px;">
|
||||
<img src="?action=get_image&name=online-payments-stripe.png" style="width:64px;height:64px;"> Pagos SPEI
|
||||
</h2>
|
||||
<p style="color: var(--text-muted); margin: 5px 0 0 0;">🏦 Genera referencias de transferencia bancaria para que tus clientes paguen vía SPEI</p>
|
||||
</div>
|
||||
<label>Buscar Cliente para Stripe</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="stripeSearch" class="form-control search-input-padded" placeholder="Buscar cliente..." autocomplete="off">
|
||||
<div id="stripeResults" class="search-results"></div>
|
||||
|
||||
<!-- CONFIG CONTAINER -->
|
||||
<div class="config-container">
|
||||
<div class="form-group" style="position: relative;">
|
||||
<label>Buscar Cliente para Stripe</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="stripeSearch" class="form-control search-input-padded" placeholder="Buscar cliente..." autocomplete="off">
|
||||
</div>
|
||||
<div id="stripeResults" class="search-results"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PLACEHOLDER STATE (Initially Visible) -->
|
||||
<div id="stripePlaceholder" class="placeholder-state">
|
||||
<span class="placeholder-icon">🏦</span>
|
||||
<p>Selecciona un cliente para generar una referencia de pago SPEI</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1221,20 +1297,32 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
<!-- MODULE 4: OXXO -->
|
||||
<section id="section-pagos-oxxo" class="section-view">
|
||||
<div class="card">
|
||||
<div style="margin-bottom: 1.5rem;">
|
||||
<div style="margin-bottom: 2rem;">
|
||||
<h2 style="margin: 0; display: flex; align-items: center; gap: 10px;">
|
||||
<img src="?action=get_image&name=oxxo-payments.png" style="width:64px;height:64px;"> Pagos OXXO
|
||||
</h2>
|
||||
<p style="color: var(--text-muted); margin: 5px 0 0 0;">🏪 Genera fichas de pago OXXO para que tus clientes paguen en tiendas de conveniencia</p>
|
||||
</div>
|
||||
<label>Buscar Cliente para OXXO</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="oxxoSearch" class="form-control search-input-padded" placeholder="Buscar cliente..." autocomplete="off">
|
||||
<div id="oxxoResults" class="search-results"></div>
|
||||
|
||||
<!-- CONFIG CONTAINER -->
|
||||
<div class="config-container">
|
||||
<div class="form-group" style="position: relative;">
|
||||
<label>Buscar Cliente para OXXO</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="oxxoSearch" class="form-control search-input-padded" placeholder="Buscar cliente..." autocomplete="off">
|
||||
</div>
|
||||
<div id="oxxoResults" class="search-results"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PLACEHOLDER STATE (Initially Visible) -->
|
||||
<div id="oxxoModulePlaceholder" class="placeholder-state">
|
||||
<span class="placeholder-icon">🏪</span>
|
||||
<p>Selecciona un cliente para generar una ficha OXXO Pay</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1574,6 +1662,7 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
document.getElementById('selectedClientName').textContent = `Pagos de ${name}`;
|
||||
document.getElementById('btnNotifCrm').href = `${store.publicUrl}/client/${client.id}`;
|
||||
document.getElementById('paymentsContainer').style.display = 'block';
|
||||
document.getElementById('notificationsPlaceholder').style.display = 'none'; // Hide placeholder
|
||||
loadPayments(client.id);
|
||||
});
|
||||
|
||||
@ -1638,6 +1727,7 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
document.getElementById('stripeAmount').value = data.accountOutstanding > 0 ? data.accountOutstanding : '';
|
||||
document.getElementById('btnVerEnCrm').href = `${store.publicUrl}/client/${data.id}`;
|
||||
document.getElementById('stripeDetailContainer').style.display = 'block';
|
||||
document.getElementById('stripePlaceholder').style.display = 'none'; // Hide placeholder
|
||||
if (data.stripeCustomerId) loadStripeHistory(data.stripeCustomerId);
|
||||
else document.getElementById('stripeHistoryContainer').style.display = 'none';
|
||||
});
|
||||
@ -1697,7 +1787,8 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
document.getElementById('btnOxxoCrm').href = `${store.publicUrl}/client/${data.id}`;
|
||||
|
||||
// Reset View
|
||||
document.getElementById('oxxoPlaceholder').style.display = 'block';
|
||||
document.getElementById('oxxoPlaceholder').style.display = 'block'; // This is the PREVIEW placeholder (keep as is)
|
||||
document.getElementById('oxxoModulePlaceholder').style.display = 'none'; // Hide MODULE placeholder
|
||||
document.getElementById('oxxoResult').style.display = 'none';
|
||||
document.getElementById('oxxoResult').innerHTML = '';
|
||||
|
||||
@ -1852,9 +1943,37 @@ $installersData = json_decode($config['installersDataWhatsApp'] ?? '{"instalador
|
||||
<img src="?action=image&file=delete.webp" class="icon-action" style="margin-left:10px" onclick="deleteInstaller(${i})" title="Borrar">
|
||||
</td>
|
||||
</tr>`).join('');
|
||||
filterInstallers(); // Re-apply filter after render
|
||||
}
|
||||
renderTable();
|
||||
|
||||
window.filterInstallers = function() {
|
||||
const query = document.getElementById('installerSearch').value.toLowerCase();
|
||||
const rows = document.querySelectorAll('#installersTable tbody tr');
|
||||
let visibleCount = 0;
|
||||
|
||||
rows.forEach(row => {
|
||||
const text = row.innerText.toLowerCase();
|
||||
if (text.includes(query)) {
|
||||
row.style.display = '';
|
||||
visibleCount++;
|
||||
} else {
|
||||
row.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
const emptyState = document.getElementById('installersEmptyState');
|
||||
const tableContainer = document.querySelector('#installersTable').parentElement;
|
||||
|
||||
if (visibleCount === 0 && rows.length > 0) {
|
||||
emptyState.style.display = 'block';
|
||||
tableContainer.style.display = 'none';
|
||||
} else {
|
||||
emptyState.style.display = 'none';
|
||||
tableContainer.style.display = 'block';
|
||||
}
|
||||
}
|
||||
|
||||
window.editInstaller = function(index) {
|
||||
const installer = store.installers[index];
|
||||
if (!installer) return;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user