var Ubigeo = Object.assign({}, TablaGenerica);

Ubigeo._autocompleteInicializado = false;
Ubigeo._autoDepto = null;
Ubigeo._autoProv = null;
Ubigeo._autoDist = null;
Ubigeo._initAutocomplete = function() {
    var self = this;
    if (this._autocompleteInicializado) {
        if (this._autoDepto) { this._autoDepto.destruir(); this._autoDepto = null; }
        if (this._autoProv) { this._autoProv.destruir(); this._autoProv = null; }
        if (this._autoDist) { this._autoDist.destruir(); this._autoDist = null; }
        this._autocompleteInicializado = false;
    }
    this._autocompleteInicializado = true;

    this._autoDepto = Autocomplete.crear('ubigFormDepto', {
        url: this.API_URL + '/ubigeo/buscar-departamentos',
        onSelect: function(item) {
            self._autoProv.limpiar();
            self._autoDist.limpiar();
            self._autoProv.actualizarParams({ departamento: item });
        }
    });

    this._autoProv = Autocomplete.crear('ubigFormProv', {
        url: this.API_URL + '/ubigeo/buscar-provincias',
        params: { departamento: '' },
        onSelect: function(item) {
            self._autoDist.limpiar();
            var depto = document.getElementById('ubigFormDepto').value;
            self._autoDist.actualizarParams({ departamento: depto, provincia: item });
        }
    });

    this._autoDist = Autocomplete.crear('ubigFormDist', {
        url: this.API_URL + '/ubigeo/buscar-distritos',
        params: { departamento: '', provincia: '' },
        labelField: 'distrito',
        valueField: 'cod_ubigeo',
        onSelect: function(item) {
            document.getElementById('ubigFormDist').value = item.distrito;
            var cod = document.getElementById('ubigFormCod');
            if (cod) cod.value = item.cod_ubigeo;
        }
    });
};

Ubigeo.init({
    title: 'Ubigeo',
    icon: 'fa-map-marker-alt',
    idSingular: 'Ubigeo',
    idField: 'cod_ubigeo',
    endpoint: '/ubigeo',
    sortDefault: 'departamento, provincia, distrito',
    limite: 50,
    searchPlaceholder: 'Buscar por código, departamento, provincia o distrito...',
    filtroEstado: false,
    showEstado: false,
    showAcciones: true,
    exportFileName: 'Ubigeo',
    elementId: 'pageUbigeo',
    menuPage: 'Ubigeo',
    columnFilters: {},
    columns: [
        { field: 'cod_ubigeo', label: 'Código', sortable: true, filterable: true, width: '120px' },
        { field: 'departamento', label: 'Departamento', sortable: true, filterable: true },
        { field: 'provincia', label: 'Provincia', sortable: true, filterable: true },
        { field: 'distrito', label: 'Distrito', sortable: true, filterable: true },
        { field: 'activo', label: 'Estado', sortable: true, filterable: true, width: '100px',
            render: function(row) {
                return row.activo
                    ? '<span class="prov-badge prov-badge-activo"><span class="prov-badge-dot"></span>Activo</span>'
                    : '<span class="prov-badge prov-badge-inactivo"><span class="prov-badge-dot"></span>Inactivo</span>';
            }
        }
    ],
    renderFormulario: function(data) {
        var html = '<div style="display:grid;grid-template-columns:1fr 1fr;gap:16px">';
        html += '<div class="prov-field"><label>Código Ubigeo <span class="req">*</span></label><input type="text" id="ubigFormCod" class="prov-input" maxlength="6" placeholder="Se auto-asigna al seleccionar distrito" required></div>';
        html += '<div class="prov-field"><label>Departamento <span class="req">*</span></label><input type="text" id="ubigFormDepto" class="prov-input" maxlength="60" placeholder="Escriba para buscar..." autocomplete="off" required></div>';
        html += '<div class="prov-field"><label>Provincia <span class="req">*</span></label><input type="text" id="ubigFormProv" class="prov-input" maxlength="60" placeholder="Escriba para buscar..." autocomplete="off" required></div>';
        html += '<div class="prov-field"><label>Distrito <span class="req">*</span></label><input type="text" id="ubigFormDist" class="prov-input" maxlength="60" placeholder="Escriba para buscar..." autocomplete="off" required></div>';
        html += '<div class="prov-field"><label>Estado</label><select id="ubigFormEstado" class="prov-input"><option value="1">Activo</option><option value="0">Inactivo</option></select></div>';
        html += '</div>';
        return html;
    },
    onCargarFormulario: function(data) {
        var codInput = document.getElementById('ubigFormCod');
        var deptoInput = document.getElementById('ubigFormDepto');
        var provInput = document.getElementById('ubigFormProv');
        var distInput = document.getElementById('ubigFormDist');
        var estInput = document.getElementById('ubigFormEstado');
        if (!deptoInput) { console.warn('[UBIGEO] form inputs not found'); return; }

        requestAnimationFrame(this._initAutocomplete.bind(this));

        if (!data) {
            codInput.value = '';
            deptoInput.value = '';
            provInput.value = '';
            distInput.value = '';
            estInput.value = '1';
            if (this._autoDepto) { this._autoDepto.limpiar(); this._autoDepto.actualizarParams({}); }
            if (this._autoProv) { this._autoProv.limpiar(); this._autoProv.actualizarParams({ departamento: '' }); }
            if (this._autoDist) { this._autoDist.limpiar(); this._autoDist.actualizarParams({ departamento: '', provincia: '' }); }
            return;
        }
        codInput.value = data.cod_ubigeo || '';
        deptoInput.value = data.departamento || '';
        provInput.value = data.provincia || '';
        distInput.value = data.distrito || '';
        estInput.value = data.activo ? '1' : '0';
        if (this._autoDepto) this._autoDepto.actualizarParams({ departamento: data.departamento || '' });
        if (this._autoProv) this._autoProv.actualizarParams({ departamento: data.departamento || '', provincia: data.provincia || '' });
        if (this._autoDist) this._autoDist.actualizarParams({ departamento: data.departamento || '', provincia: data.provincia || '' });
    },
    onGuardar: function() {
        var self = this;
        var id = document.getElementById('pageUbigeoFormId')?.value;
        var cod = document.getElementById('ubigFormCod').value.trim();
        var depto = document.getElementById('ubigFormDepto').value.trim().toUpperCase();
        var prov = document.getElementById('ubigFormProv').value.trim().toUpperCase();
        var dist = document.getElementById('ubigFormDist').value.trim().toUpperCase();
        var est = document.getElementById('ubigFormEstado').value === '1';

        if (!cod) { Mensaje.error({ titulo: 'Validación', texto: 'El código Ubigeo es requerido' }); return; }
        if (!depto) { Mensaje.error({ titulo: 'Validación', texto: 'El departamento es requerido' }); return; }
        if (!prov) { Mensaje.error({ titulo: 'Validación', texto: 'La provincia es requerida' }); return; }
        if (!dist) { Mensaje.error({ titulo: 'Validación', texto: 'El distrito es requerido' }); return; }

        var body = { cod_ubigeo: cod, departamento: depto, provincia: prov, distrito: dist, activo: est };

        var metodo = id ? 'PUT' : 'POST';
        var url = this.API_URL + this.endpoint + (id ? '/' + id : '');

        fetch(url, {
            method: metodo,
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(body)
        })
        .then(function(r) { return r.json(); })
        .then(function(res) {
            if (res.ok) {
                Mensaje.exito({ titulo: 'Guardado', texto: res.mensaje });
                Modal.cerrar();
                self.paginaActual = 1;
                self.cargarTabla();
            } else {
                Mensaje.error({ titulo: 'Error', texto: res.mensaje || 'Error al guardar' });
            }
        })
        .catch(function(err) {
            Mensaje.error({ titulo: 'Error', texto: 'Error de conexión' });
            console.error(err);
        });
    }
});

// Sobrescribir mostrarVista para inyectar filtros en cascada
var origMostrarVistaUbigeo = Ubigeo.mostrarVista;
Ubigeo.mostrarVista = function() {
    origMostrarVistaUbigeo.call(this);

    var toolbar = document.querySelector('#' + this.elementId + ' .prov-toolbar');
    if (!toolbar) return;

    var div = document.createElement('div');
    div.className = 'prov-cascade-filtros';
    div.style.cssText = 'display:flex;gap:12px;padding:8px 0;flex-wrap:wrap;align-items:center';
    div.innerHTML =
        '<select id="' + this.elementId + 'FiltroDepto" class="prov-input" style="width:auto;min-width:200px">' +
            '<option value="">Todos los Departamentos</option>' +
        '</select>' +
        '<select id="' + this.elementId + 'FiltroProv" class="prov-input" style="width:auto;min-width:200px">' +
            '<option value="">Todas las Provincias</option>' +
        '</select>' +
        '<span class="prov-badge" id="' + this.elementId + 'CascadeBadge" style="display:none;cursor:pointer;background:var(--azul-50);color:var(--azul-700);padding:4px 10px;border-radius:20px;font-size:0.7rem">' +
            '<i class="fas fa-times" style="margin-right:4px"></i> Limpiar filtros' +
        '</span>';

    toolbar.parentNode.insertBefore(div, toolbar.nextSibling);
    this.cargarDeptos();
    this.enlazarCascada();
};

// Cargar departamentos en el combo
Ubigeo.cargarDeptos = async function() {
    var self = this;
    try {
        var res = await fetch(this.API_URL + '/ubigeo/departamentos');
        var data = await res.json();
        if (!data.ok) return;
        var sel = document.getElementById(this.elementId + 'FiltroDepto');
        data.data.forEach(function(d) {
            sel.innerHTML += '<option value="' + d.replace(/"/g, '&quot;') + '">' + d + '</option>';
        });
    } catch (e) { /* ignore */ }
};

// Cargar provincias según departamento seleccionado
Ubigeo.cargarProvincias = async function(depto) {
    var self = this;
    var sel = document.getElementById(this.elementId + 'FiltroProv');
    sel.innerHTML = '<option value="">Todas las Provincias</option>';
    if (!depto) return;
    try {
        var res = await fetch(this.API_URL + '/ubigeo/provincias?departamento=' + encodeURIComponent(depto));
        var data = await res.json();
        if (!data.ok) return;
        data.data.forEach(function(p) {
            sel.innerHTML += '<option value="' + p.replace(/"/g, '&quot;') + '">' + p + '</option>';
        });
    } catch (e) { /* ignore */ }
};

// Vincular eventos de los filtros en cascada
Ubigeo.enlazarCascada = function() {
    var self = this;
    var deptoSel = document.getElementById(this.elementId + 'FiltroDepto');
    var provSel = document.getElementById(this.elementId + 'FiltroProv');
    var badge = document.getElementById(this.elementId + 'CascadeBadge');

    if (!deptoSel) return;

    deptoSel.addEventListener('change', function() {
        self.cargarProvincias(this.value);
        provSel.value = '';
        self.paginaActual = 1;
        self.cargarTabla();
        self.actualizarBadgeCascada();
    });

    if (provSel) {
        provSel.addEventListener('change', function() {
            self.paginaActual = 1;
            self.cargarTabla();
            self.actualizarBadgeCascada();
        });
    }

    if (badge) {
        badge.addEventListener('click', function() {
            deptoSel.value = '';
            provSel.value = '';
            self.cargarProvincias('');
            self.paginaActual = 1;
            self.cargarTabla();
            badge.style.display = 'none';
        });
    }
};

// Actualiza badge de filtros activos
Ubigeo.actualizarBadgeCascada = function() {
    var depto = document.getElementById(this.elementId + 'FiltroDepto')?.value;
    var prov = document.getElementById(this.elementId + 'FiltroProv')?.value;
    var badge = document.getElementById(this.elementId + 'CascadeBadge');
    if (!badge) return;
    if (depto || prov) {
        var txt = '';
        if (depto) txt += depto;
        if (prov) txt += (txt ? ' > ' : '') + prov;
        badge.innerHTML = '<i class="fas fa-times" style="margin-right:4px"></i> ' + txt;
        badge.style.display = 'inline-block';
    } else {
        badge.style.display = 'none';
    }
};

// Hook para agregar parámetros extra a las consultas del API
Ubigeo.obtenerParamsExtra = function() {
    var depto = document.getElementById(this.elementId + 'FiltroDepto')?.value || '';
    var prov = document.getElementById(this.elementId + 'FiltroProv')?.value || '';
    var params = '';
    if (depto) params += '&departamento=' + encodeURIComponent(depto);
    if (prov) params += '&provincia=' + encodeURIComponent(prov);
    // Enviar activo=1 por defecto (solo activos)
    params += '&activo=1';
    return params;
};

// Sobrescribir para no ocultar la columna estado (no tenemos filtroEstado)
var origEnlazarEventosUbigeo = Ubigeo.enlazarEventos;
Ubigeo.enlazarEventos = function() {
    origEnlazarEventosUbigeo.call(this);
    // No hacemos nada extra, solo conservamos el original
};
