feat: Estandarizar fechas, mejorar UI y añadir sección de datos

Se realizan los siguientes cambios:

- Se estandariza el formato de fecha a dd/mm/aaaa en toda la aplicación (tablas, reportes, tickets) para consistencia.
- Se ajusta la versión de la aplicación a 1.3.0.
- Se reduce el tamaño del logo principal para mejorar la proporción visual.
- Se corrige el comportamiento de las pestañas de navegación para que en estado inactivo solo muestren el ícono.
- Se añade una sección discreta para la ubicación y exportación de datos, visible solo para administradores, con instrucciones para acceder a la base de datos en el contenedor Docker.

app.js

@@ -547,9 +547,6 @@ async function deleteProduct(id) {
             if (response.ok) {
                 products = products.filter(p => p.id !== id);
                 renderProductTables();
-            } else {
-                const error = await response.json();
-                alert(`Error: ${error.error}`);
             }
         } catch (error) {
             alert('Error de conexión al eliminar el producto.');
@@ -999,11 +996,13 @@ function setupUIForRole(role) {
     const settingsTab = document.querySelector('[data-tab="settings"]');
     const userManagementSection = document.getElementById('user-management-section');
     const staffInput = document.getElementById('m-staff');
+    const dbInfoIcon = document.getElementById('db-info-icon');
 
     if (role === 'admin') {
         if (dashboardTab) dashboardTab.style.display = 'block';
         if (settingsTab) settingsTab.style.display = 'block';
         if (userManagementSection) userManagementSection.style.display = 'block';
+        if (dbInfoIcon) dbInfoIcon.style.display = 'inline-block';
         
         fetch('/api/users')
             .then(res => {
@@ -1019,6 +1018,7 @@ function setupUIForRole(role) {
         if (dashboardTab) dashboardTab.style.display = 'none';
         if (settingsTab) settingsTab.style.display = 'none';
         if (userManagementSection) userManagementSection.style.display = 'none';
+        if (dbInfoIcon) dbInfoIcon.style.display = 'none';
     }
     
     if (staffInput) {
@@ -1070,6 +1070,7 @@ async function initializeApp() {
   const btnCancelEditUser = document.getElementById('btnCancelEditUser');
   const tipoServicioSelect = document.getElementById('m-tipo');
   const clientSubTabs = document.querySelector('#tab-clients .sub-tabs');
+  const dbInfoIcon = document.getElementById('db-info-icon');
   
   formSettings?.addEventListener('submit', handleSaveSettings);
   formCredentials?.addEventListener('submit', handleSaveCredentials);
@@ -1089,6 +1090,9 @@ async function initializeApp() {
   if (currentUser.role === 'admin') {
       formAddUser?.addEventListener('submit', handleAddOrUpdateUser);
       tblUsersBody?.addEventListener('click', handleTableClick);
+      dbInfoIcon?.addEventListener('click', () => {
+        document.getElementById('db-instructions').classList.toggle('hidden');
+      });
   }
   
   btnLogout?.addEventListener('click', async () => {

index.html

@@ -372,11 +372,20 @@
           </div>
         </form>
       </div>
-      <div class="section">
+      <div class="section" id="db-location-section">
-        <h2>Ubicación de los Datos</h2>
+        <h2>Ubicación y Exportación de Datos
-        <p class="data-location-info">
+          <span class="material-icons-outlined info-icon" id="db-info-icon" style="display: none;">help_outline</span>
-          Toda la información de tu negocio (clientes, recibos y configuración) se guarda de forma segura en el archivo <strong>ap-pos.db</strong>, ubicado en la misma carpeta que la aplicación. Para hacer un respaldo, simplemente copia este archivo.
+        </h2>
-        </p>
+        <div id="db-instructions" class="data-location-info hidden">
+          <p>La base de datos (<code>ap-pos.db</code>) se encuentra dentro del contenedor de Docker. Para acceder o hacer un respaldo manual:</p>
+          <ol>
+            <li>Abre una terminal o línea de comandos.</li>
+            <li>Ejecuta <code>docker ps</code> para encontrar el nombre o ID de tu contenedor (usualmente 'ap-pos').</li>
+            <li>Entra al contenedor con: <code>docker exec -it ap-pos /bin/sh</code> (reemplaza 'ap-pos' si es necesario).</li>
+            <li>Una vez dentro, la base de datos está en <code>/app/ap-pos.db</code>.</li>
+            <li>Para copiarla a tu máquina local (desde fuera del contenedor), usa:<br><code>docker cp ap-pos:/app/ap-pos.db ./backup_BDD.db</code></li>
+          </ol>
+        </div>
       </div>
       <div class="section" id="credentials-section">
         <h2>Mis Credenciales</h2>

styles.css

@@ -281,6 +281,7 @@ button.action-btn {
 .header-logo {
   max-width: 20%;
   height: auto;
+  padding-right: 50px;
 }
 
 .tabs {
@@ -529,6 +530,17 @@ table tbody tr:hover {
   font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
 }
 
+.info-icon {
+  font-size: 18px;
+  color: #6c757d;
+  cursor: pointer;
+  vertical-align: middle;
+  margin-left: 8px;
+}
+.info-icon:hover {
+  color: #343a40;
+}
+
 .sub-section {
   margin-top: 30px;
   padding-top: 20px;