From 0e51215fd3779d8ca712ef3616a5bb3077238323 Mon Sep 17 00:00:00 2001 From: marsalva Date: Sun, 8 Feb 2026 22:38:10 +0000 Subject: [PATCH] Actualizar configuracion.html --- configuracion.html | 95 ++++++++++++++++++++++++++++++---------------- 1 file changed, 62 insertions(+), 33 deletions(-) diff --git a/configuracion.html b/configuracion.html index 5643354..48b30c0 100644 --- a/configuracion.html +++ b/configuracion.html @@ -24,36 +24,45 @@

- Configuración Avanzada + Configuración

-
+ + + + +
-
1. Selecciona Provincia
-
- 2. Zonas Definidas + 2. Crear/Elegir Zona

Selecciona una provincia

-
3. Asignar Operarios @@ -66,6 +75,38 @@
+ + + + + + + +
@@ -102,11 +143,17 @@ function showTab(tabId) { document.querySelectorAll('.tab-content').forEach(el => el.classList.add('hidden')); document.getElementById(`view-${tabId}`).classList.remove('hidden'); + + document.querySelectorAll('.tab-btn').forEach(el => { + el.classList.remove('text-blue-600', 'border-b-2', 'border-blue-600', 'font-bold'); + el.classList.add('text-gray-500', 'font-medium'); + }); + const btn = document.getElementById(`tab-${tabId}`); + btn.classList.add('text-blue-600', 'border-b-2', 'border-blue-600', 'font-bold'); + btn.classList.remove('text-gray-500', 'font-medium'); } - // ============================ - // LÓGICA DE ZONAS - // ============================ + // --- LÓGICA DE ZONAS --- async function loadProvinces() { try { const res = await fetch(`${API_URL}/provinces`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } }); @@ -155,13 +202,8 @@ data.zones.forEach(z => { const div = document.createElement('div'); div.className = "p-3 border border-gray-100 rounded hover:border-blue-300 cursor-pointer bg-white mb-2 zone-item"; + let townsText = z.towns_names && z.towns_names.length > 0 ? z.towns_names.join(", ") : "Sin poblaciones"; - // Mostrar pueblos agrupados (si existen) - let townsText = "Sin poblaciones"; - if(z.towns_names && z.towns_names.length > 0) { - townsText = z.towns_names.join(", "); - } - div.innerHTML = `
${z.name} @@ -169,19 +211,17 @@

${townsText}

`; - div.onclick = () => selectZone(z.id, div); list.appendChild(div); }); lucide.createIcons(); } - // --- CREACIÓN DE ZONAS (NUEVO) --- async function openZoneModal() { if(!currentProvId) return; document.getElementById('newZoneName').value = ""; - // Cargar pueblos de la provincia + // Cargar pueblos const res = await fetch(`${API_URL}/provinces/${currentProvId}/towns`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } }); const data = await res.json(); const list = document.getElementById('townsList'); @@ -190,14 +230,8 @@ if(data.towns.length === 0) list.innerHTML = '

No hay poblaciones cargadas.

'; data.towns.forEach(t => { - list.innerHTML += ` - - `; + list.innerHTML += ``; }); - document.getElementById('zoneModal').classList.remove('hidden'); } @@ -206,7 +240,7 @@ const checks = document.querySelectorAll('.town-check:checked'); const townIds = Array.from(checks).map(c => c.value); - if(!name) { alert("Pon un nombre a la zona"); return; } + if(!name) { alert("Pon un nombre"); return; } await fetch(`${API_URL}/zones`, { method: 'POST', @@ -237,7 +271,7 @@ const dataOps = await resOps.json(); const resAssigned = await fetch(`${API_URL}/zones/${zoneId}/operators`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } }); - const dataAssigned = await resAssigned.json(); + const dataAssigned = await resAssigned.json(); const assignedSet = new Set(dataAssigned.assignedIds); const list = document.getElementById('listOperators'); @@ -245,12 +279,7 @@ dataOps.operators.forEach(op => { const checked = assignedSet.has(op.id) ? 'checked' : ''; - list.innerHTML += ` - - `; + list.innerHTML += ``; }); }