marsalva/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actualizar servicios.html

Browse Source
This commit is contained in:
marsalva
2026-02-08 23:07:14 +00:00
parent cbb4953abd
commit c666aa9fa4
1 changed files with 22 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
servicios.html
View File

@@ -6,6 +6,7 @@
<title>Servicios - IntegraRepara</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/lucide@latest"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=TU_API_KEY_AQUI&libraries=places&callback=initAutocomplete" async defer></script>
<style>
.fade-in { animation: fadeIn 0.3s ease-in-out; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@@ -94,7 +95,7 @@
</select>
</div>
<div>
<label class="block text-xs font-bold text-gray-600 mb-1">Población</label>
<label class="block text-xs font-bold text-gray-600 mb-1">Población / Municipio *</label>
<select id="sTown" class="w-full px-3 py-2 border rounded-lg bg-gray-50 outline-none focus:border-blue-500" disabled onchange="checkAutoAssign(this.value)">
<option value="">-- Elige provincia primero --</option>
</select>
@@ -126,13 +127,13 @@
<select id="sGuild" class="w-full px-3 py-2 border border-blue-200 rounded-lg bg-white outline-none focus:border-blue-500" onchange="loadOperators(this.value)">
<option value="">-- Seleccionar Gremio --</option>
</select>
<p id="zoneInfo" class="text-[10px] text-blue-600 mt-2 italic hidden"></p>
</div>
<div>
<label class="block text-xs font-bold text-blue-800 mb-1">Asignar Operario</label>
<select id="sOperator" class="w-full px-3 py-2 border border-blue-200 rounded-lg bg-white outline-none focus:border-blue-500">
<option value="">-- Primero elige gremio --</option>
</select>
<p id="zoneInfo" class="text-[10px] text-blue-600 mt-1 italic hidden"></p>
</div>
</div>
@@ -262,7 +263,7 @@
</div>
</div>
<div id="toast" class="fixed bottom-5 right-5 bg-slate-800 text-white px-6 py-3 rounded-lg shadow-2xl hidden"><span id="toastMsg"></span></div>
<div id="toast" class="fixed bottom-5 right-5 bg-slate-800 text-white px-6 py-3 rounded-lg shadow-2xl transform translate-y-20 opacity-0 transition-all duration-300 z-50 flex items-center gap-3"><span id="toastMsg">Msg</span></div>
<script src="js/layout.js"></script>
<script>
@@ -277,14 +278,13 @@
fetchServices();
loadCompanies();
loadGuilds();
loadProvinces(); // Cargar provincias al inicio
loadProvinces(); // NUEVO: Cargar provincias
});
// 1. FUNCIÓN GLOBAL PARA GOOGLE MAPS (Solución al error "initAutocomplete is not a function")
// 1. FUNCIÓN GLOBAL PARA GOOGLE MAPS
window.initAutocomplete = function() {
const input = document.getElementById("sAddress");
if(input) {
// Solo cargamos si el script de Google se cargó bien
try {
autocomplete = new google.maps.places.Autocomplete(input, { types: ['geocode'] });
input.addEventListener('keydown', function(e) { if (e.key === "Enter") e.preventDefault(); });
@@ -305,7 +305,7 @@
}
}
// --- LÓGICA GEOGRÁFICA ---
// --- LÓGICA GEOGRÁFICA (NUEVO) ---
async function loadProvinces() {
try {
const res = await fetch(`${API_URL}/provinces`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } });
@@ -332,21 +332,17 @@
} catch(e) {}
}
// --- AUTO ASIGNACIÓN ---
// --- AUTO ASIGNACIÓN (NUEVO) ---
async function checkAutoAssign(townId) {
if(!townId) return;
// Buscar zona y operarios para este pueblo
const res = await fetch(`${API_URL}/towns/${townId}/auto-assign`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } });
const data = await res.json();
const zoneInput = document.getElementById('sZoneName');
const opSelect = document.getElementById('sOperator');
const info = document.getElementById('zoneInfo');
if(data.found) {
zoneInput.value = data.zone_name;
info.innerHTML = `Detectada zona: <b>${data.zone_name}</b>`;
info.classList.remove('hidden');
@@ -355,18 +351,12 @@
opSelect.innerHTML += `<option value="${op.id}" class="font-bold text-blue-600">⭐ ${op.full_name}</option>`;
});
// Opción para cargar el resto si no está el que queremos
opSelect.innerHTML += '<option disabled>──────────</option><option value="load_all">Ver todos los operarios...</option>';
// Listener para cargar todos
opSelect.onchange = function() {
if(this.value === 'load_all') loadAllOperators();
};
opSelect.onchange = function() { if(this.value === 'load_all') loadAllOperators(); };
} else {
zoneInput.value = "(Sin zona asignada)";
info.classList.add('hidden');
loadOperators(document.getElementById('sGuild').value); // Volver a lógica normal
loadOperators(document.getElementById('sGuild').value);
}
}
@@ -380,10 +370,10 @@
data.operators.forEach(op => sel.innerHTML += `<option value="${op.id}">${op.full_name}</option>`);
sel.value = currentVal !== 'load_all' ? currentVal : "";
sel.onchange = null; // Quitar listener especial
sel.onchange = null;
}
// --- FUNCIONES ORIGINALES RESTAURADAS ---
// --- FUNCIONES ORIGINALES ---
async function fetchStatuses() {
try {
const res = await fetch(`${API_URL}/statuses`, { headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` } });
@@ -597,9 +587,8 @@
document.getElementById('sPhone').value = s.contact_phone;
document.getElementById('sName').value = s.contact_name;
// Dirección: Intentar limpiar la población si está concatenada
let addr = s.address;
if(addr.includes(", ")) addr = addr.split(", ")[0]; // Simple split
if(addr.includes(", ")) addr = addr.split(", ")[0];
document.getElementById('sAddress').value = addr;
document.getElementById('sEmail').value = s.email || '';
@@ -643,7 +632,6 @@
const editId = document.getElementById('editServiceId').value;
const isEdit = !!editId;
// Concatenar dirección + población
let fullAddress = document.getElementById('sAddress').value;
const townSelect = document.getElementById('sTown');
if(townSelect.value) {
@@ -653,7 +641,7 @@
const data = {
phone: document.getElementById('sPhone').value,
name: document.getElementById('sName').value,
address: fullAddress, // Dirección completa
address: fullAddress,
email: document.getElementById('sEmail').value,
description: document.getElementById('sDesc').value,
scheduled_date: document.getElementById('sDate').value,
@@ -712,6 +700,14 @@
m.innerText = msg; t.classList.remove('translate-y-20', 'opacity-0');
setTimeout(() => t.classList.add('translate-y-20', 'opacity-0'), 3000);
}
function resetForm() {
document.querySelector('form').reset();
document.getElementById('editServiceId').value = "";
document.getElementById('sTown').innerHTML = '<option value="">-- Elige provincia primero --</option>';
document.getElementById('sTown').disabled = true;
document.getElementById('zoneInfo').classList.add('hidden');
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=TU_API_KEY_AQUI&libraries=places&callback=initAutocomplete" async defer></script>
</body>