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

TiposDocumentoSUNAT.init({
    title: 'Tipos de Documento SUNAT',
    icon: 'fa-file-invoice',
    idSingular: 'Tipo de Documento',
    idField: 'id_tipo_doc',
    endpoint: '/sunat-tipos-doc',
    sortDefault: 'codigo',
    limite: 50,
    searchPlaceholder: 'Buscar por código o nombre...',
    filtroEstado: true,
    showEstado: true,
    exportFileName: 'TiposDocumentoSUNAT',
    elementId: 'pageTiposDocumentoSUNAT',
    menuPage: 'TiposDocumentoSUNAT',
    columns: [
        { field: 'codigo', label: 'Código', sortable: true, filterable: true, width: '100px' },
        { field: 'nombre', label: 'Nombre', sortable: true, filterable: true },
        { field: 'abreviatura', label: 'Abreviatura', sortable: true, filterable: true, width: '140px' },
        { 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 SUNAT <span class="req">*</span></label><input type="text" id="tsdFormCodigo" class="prov-input" maxlength="2" required placeholder="Ej: 01"></div>';
        html += '<div class="prov-field"><label>Nombre <span class="req">*</span></label><input type="text" id="tsdFormNombre" class="prov-input" maxlength="100" required placeholder="Ej: FACTURA"></div>';
        html += '<div class="prov-field"><label>Abreviatura</label><input type="text" id="tsdFormAbreviatura" class="prov-input" maxlength="20" placeholder="Ej: FACT."></div>';
        html += '<div class="prov-field"><label>Estado</label><select id="tsdFormActivo" class="prov-input"><option value="1">Activo</option><option value="0">Inactivo</option></select></div>';
        html += '</div>';
        return html;
    },
    onCargarFormulario: function(data) {
        if (!data) {
            document.getElementById('tsdFormCodigo').value = '';
            document.getElementById('tsdFormNombre').value = '';
            document.getElementById('tsdFormAbreviatura').value = '';
            document.getElementById('tsdFormActivo').value = '1';
            return;
        }
        document.getElementById('tsdFormCodigo').value = data.codigo || '';
        document.getElementById('tsdFormNombre').value = data.nombre || '';
        document.getElementById('tsdFormAbreviatura').value = data.abreviatura || '';
        document.getElementById('tsdFormActivo').value = data.activo ? '1' : '0';
    },
    onGuardar: function() {
        var id = document.getElementById('pageTiposDocumentoSUNATFormId')?.value;
        var codigo = document.getElementById('tsdFormCodigo').value.trim().toUpperCase();
        var nombre = document.getElementById('tsdFormNombre').value.trim().toUpperCase();
        var abreviatura = document.getElementById('tsdFormAbreviatura').value.trim().toUpperCase();
        var activo = document.getElementById('tsdFormActivo').value === '1';

        if (!codigo) { Mensaje.error({ titulo: 'Validación', texto: 'El código es requerido' }); return; }
        if (!nombre) { Mensaje.error({ titulo: 'Validación', texto: 'El nombre es requerido' }); return; }

        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({ codigo: codigo, nombre: nombre, abreviatura: abreviatura, activo: activo })
        })
        .then(function(r) { return r.json(); })
        .then(function(res) {
            if (res.ok) {
                Mensaje.exito({ titulo: 'Guardado', texto: res.mensaje });
                Modal.cerrar();
                this.paginaActual = 1;
                this.cargarTabla();
            } else {
                Mensaje.error({ titulo: 'Error', texto: res.mensaje });
            }
        }.bind(this))
        .catch(function() {
            Mensaje.error({ titulo: 'Error', texto: 'Error al guardar tipo de documento' });
        });
    }
});
