import ClassSelect from '../../components/select2.js';
import Ajax from '../../components/ajax.js';

class Catalogo {

    constructor() {

        /* Definiciones */
        this.tirada_no_pod = 100;
        this.tirada_pod = 1;

        /* Mapeado de elementos */
        this.tipo_impresion = $("#tipo_impresion");
        this.paginas_cubierta = $("#cubierta_paginas");
        this.sobrecubiertaItems = $('.sobrecubierta_items').add('.sobrecubierta_pod_items');
        this.paginasSobrecubierta = $('#sobrecubierta_paginas');
        this.negro = $('#negro_paginas');
        this.color = $('#color_paginas');
        this.total = $('#paginas');

        /* Select2 para clientes */
        this.cliente = new ClassSelect($("#cliente_id"), '/catalogo/libros/clientlist', "Seleccione un cliente");

        /* Select2 para tipos de encuadernacion */
        this.encuadernacion = new ClassSelect($("#encuadernacion_id"), '/importador/getencuadernacion', "Seleccione una encuadernación");

        /* Select2 para impresion en Negro */
        this.selectPapelNegro = new ClassSelect($("#negro_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'negrohq' : 'negro',
            });

        this.selectPapelNegroPod = new ClassSelect($("#negro_pod_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'negrohq' : 'negro',
            });

        this.selectGramajeNegro = new ClassSelect($('#negro_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelNegro.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'negrohq' : 'negro',
            });

        this.selectGramajeNegroPod = new ClassSelect($('#negro_pod_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelNegroPod.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'negrohq' : 'negro',
            });


        /* Select2 para impresion en Color */
        this.selectPapelColor = new ClassSelect($("#color_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'colorhq' : 'color',
            });

        this.selectPapelColorPod = new ClassSelect($("#color_pod_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'colorhq' : 'color',
            });

        this.selectGramajeColor = new ClassSelect($('#color_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelColor.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'colorhq' : 'color',
            });

        this.selectGramajeColorPod = new ClassSelect($('#color_pod_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelColorPod.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'interior',
                sopalas: 0,
                lomo: 0,
                tipo: () => this.tipo_impresion.val().includes('hq') ? 'colorhq' : 'color',
            });

        /* Select2 para impresion de cubiertas */
        this.selectPapelCubierta = new ClassSelect($("#cubierta_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: this.encuadernacion.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'cubierta',
                sopalas: () => $('#cubierta_ancho_solapas').val(),
                lomo: () => 0,
                tipo: 'colorhq',
                uso: 'cubierta',
            });

        this.selectPapelCubiertaPod = new ClassSelect($("#cubierta_pod_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: this.encuadernacion.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'cubierta',
                sopalas: () => $('#cubierta_ancho_solapas').val(),
                lomo: () => 0,
                tipo: 'colorhq',
                uso: 'cubierta',
            });

        this.selectGramajeCubierta = new ClassSelect($('#cubierta_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelCubierta.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'cubierta',
                sopalas: () => $('#cubierta_ancho_solapas').val(),
                lomo: 0,
                tipo: 'colorhq',
            });

        this.selectGramajeCubiertaPod = new ClassSelect($('#cubierta_pod_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelCubiertaPod.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'cubierta',
                sopalas: () => $('#cubierta_ancho_solapas').val(),
                lomo: 0,
                tipo: 'colorhq',
            });

        this.acabadoCubierta = new ClassSelect($("#cubierta_acabado_id"),
            '/serviciosacabados/getacabados',
            'Seleccione acabado',
            false,
            {
                "cubierta": 1
            }
        );

        /* Select2 para impresion de sobrecubierta */
        this.selectPapelSobrecubierta = new ClassSelect($("#sobrecubierta_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: this.encuadernacion.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'sobrecubierta',
                sopalas: () => $('#sobrecubierta_ancho_solapas').val(),
                lomo: () => 0,
                tipo: 'colorhq',
            });

        this.selectPapelSobrecubiertaPod = new ClassSelect($("#sobrecubierta_pod_papel_id"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
            {
                tipo_impresion: this.encuadernacion.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'sobrecubierta',
                sopalas: () => $('#sobrecubierta_ancho_solapas').val(),
                lomo: () => 0,
                tipo: 'colorhq',
            });

        this.selectGramajeSobrecubierta = new ClassSelect($('#sobrecubierta_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelSobrecubierta.getVal(),
                tirada: () => this.tirada_no_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'sobrecubierta',
                sopalas: () => $('#sobrecubierta_ancho_solapas').val(),
                lomo: 0,
                tipo: 'colorhq',
            });

        this.selectGramajeSobrecubiertaPod = new ClassSelect($('#sobrecubierta_pod_gramaje'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
            {
                tipo_impresion: () => this.encuadernacion.getVal(),
                papel_generico: () => this.selectPapelSobrecubiertaPod.getVal(),
                tirada: () => this.tirada_pod,
                ancho: () => this.getDimensionLibro().ancho,
                alto: () => this.getDimensionLibro().alto,
                uso: 'sobrecubierta',
                sopalas: () => $('#sobrecubierta_ancho_solapas').val(),
                lomo: 0,
                tipo: 'colorhq',
            });

        this.acabadosSobrecubierta = new ClassSelect($("#sobrecubierta_acabado_id"),
            '/serviciosacabados/getacabados',
            'Seleccione acabado',
            false,
            {
                "sobrecubierta": 1
            }
        );

    }

    init() {

        const self = this;

        // Eliminar elementos que no se usan 
        $('[id*="_pod_paginas"]').remove();
        $('[id*="_pod_ancho_solapas"]').remove();
        $('[id*="_pod_acabado_id"]').remove();


        // Fuerza el foco en el campo de búsqueda de select2
        $(document).on('select2:open', () => {
            document.querySelector('.select2-search__field').focus();
        });

        this.cliente.init();
        this.tipo_impresion.select2();
        this.paginas_cubierta.select2();
        this.paginasSobrecubierta.select2();

        this.encuadernacion.init();

        this.selectPapelNegro.init();
        this.selectPapelNegroPod.init();
        this.selectGramajeNegro.init();
        this.selectGramajeNegroPod.init();

        this.selectPapelColor.init();
        this.selectPapelColorPod.init();
        this.selectGramajeColor.init();
        this.selectGramajeColorPod.init();

        this.selectPapelCubierta.init();
        this.selectPapelCubiertaPod.init();
        this.selectGramajeCubierta.init();
        this.selectGramajeCubiertaPod.init();
        this.acabadoCubierta.init();

        this.selectPapelSobrecubierta.init();
        this.selectPapelSobrecubiertaPod.init();
        this.selectGramajeSobrecubierta.init();
        this.selectGramajeSobrecubiertaPod.init();
        this.acabadosSobrecubierta.init();

        this.initPedidosTable();

        // Ajustar al ancho de contenendor la tabla de historizo de pedidos
        $('#collapsePedidos').on('shown.bs.collapse', function () {
            const table = $('#tablaPedidosAntiguos').DataTable();
            table.columns.adjust();
            if (typeof table.responsive !== 'undefined') {
                table.responsive.recalc();
            }
        });

        // Al cargar la página
        this.toggleSobrecubiertaFields();

        // Inicializacino de eventos
        this.selectPapelNegro.item.on('select2:select', function () {
            self.selectGramajeNegro.empty();
        });

        this.total.on('input change', () => {
            this.validarMultiploDe4([this.total, this.color, this.negro]);
        });
        this.color.on('input change', this.actualizarDesdeColor.bind(this));
        this.negro.on('input change', this.actualizarDesdeNegro.bind(this));
        this.tipo_impresion.on("change", this.updateOpcionesImpresion.bind(this));

        // Al cambiar el selector de paginas de sobrecubierta
        this.paginasSobrecubierta.on('change', this.toggleSobrecubiertaFields.bind(this));

        // Al cambiar el tipo de encuadernacion
        this.encuadernacion.onChange(this.enableSobrecubiertaLines.bind(this));


        this.updateOpcionesImpresion();

        $(document).on('change', '.warning-change', function () {
            $(this).addClass('bg-warning');
            let select2Container = $(this).next('.select2').find('.select2-selection');
            select2Container.addClass('bg-warning');
        });
    }

    initPedidosTable() {

        const lastColPedidos = $('#tablaPedidosAntiguos').find("tr:first th").length - 1;
        const catalogoId = $('#catalogo_id').val(); // Asegúrate que este valor exista

        const tablaPedidosAntiguos = $('#tablaPedidosAntiguos').DataTable({
            processing: true,
            serverSide: true,
            autoWidth: true,
            orderCellsTop: true,
            responsive: true,
            scrollX: true,
            lengthMenu: [5, 10, 25, 50, 75, 100],
            pageLength: 10,
            lengthChange: true,
            dom: 'lfrtip',
            order: [[1, 'desc']],
            language: {
                url: "/themes/vuexy/vendor/libs/datatables-sk/plugins/i18n/es-ES.json"
            },
            ajax: {
                url: '/catalogo/libros/pedidosAntiguos',
                method: 'GET',
                data: {
                    catalogo_id: catalogoId
                }
            },
            columnDefs: [
                {
                    orderable: false,
                    searchable: false,
                    targets: [lastColPedidos]
                }
            ],
            columns: [
                { data: 'id' },
                { data: 'created_at' },
                { data: 'tirada' },
                { data: 'precio_ud' },
                { data: 'total' },
                { data: 'estado' },
                { data: 'actionBtns' }
            ]
        });


    }

    actualizarDesdeColor() {
        const total = parseInt(this.total.val(), 10) || 0;
        const color = parseInt(this.color.val(), 10) || 0;
        const negro = Math.max(total - color, 0);
        this.negro.val(negro);
        this.validarMultiploDe4([this.total, this.color, this.negro]);
    }

    actualizarDesdeNegro() {
        const total = parseInt(this.total.val(), 10) || 0;
        const negro = parseInt(this.negro.val(), 10) || 0;
        const color = Math.max(total - negro, 0);
        this.color.val(color);
        this.validarMultiploDe4([this.total, this.color, this.negro]);
    }

    validarMultiploDe4(campos) {
        campos.forEach($el => {
            const val = parseInt($el.val(), 10) || 0;
            if (val % 4 !== 0) {
                $el.css('color', 'red');
            } else {
                $el.css('color', '');
            }
        });
    }

    updateOpcionesImpresion() {
        $('.negro_items').off('change');
        $('.color_items').off('change');

        const selValue = this.tipo_impresion.val();

        // Buscar elementos por clase dinámica (negro-*-line y color-*-line)
        const elements_negro = $('*').filter(function () {
            return [...this.classList].some(cls => /^negro.*line$/.test(cls));
        });

        const elements_color = $('*').filter(function () {
            return [...this.classList].some(cls => /^color.*line$/.test(cls));
        });

        if (selValue.includes('color')) {
            elements_color.removeClass('d-none');
        } else {
            elements_color.addClass('d-none');
        }

        elements_negro.removeClass('d-none');
    }



    getDimensionLibro() {
        let ancho = $('#ancho').val();
        let alto = $('#alto').val();;
        return { ancho, alto };
    }

    toggleSobrecubiertaFields() {
        if (this.paginasSobrecubierta.val() === '1') {
            this.sobrecubiertaItems.prop('disabled', false).trigger('change.select2');
        } else {
            this.sobrecubiertaItems.prop('disabled', true).trigger('change.select2');
        }
    }

    enableSobrecubiertaLines() {

        // Buscar elementos por clase dinámica (sobrecubierta-*-line)
        const elements_sobrecubierta = $('*').filter(function () {
            return [...this.classList].some(cls => /^sobrecubierta.*line$/.test(cls));
        });

        switch (parseInt(this.encuadernacion.getVal(), 10)) {
            case 5:
            case 6:
            case 7:
            case 8:
            case 21:
                console.log("Desactivar sobrecubierta:" + this.encuadernacion.getVal());
                elements_sobrecubierta.addClass('d-none');

                break;

            default:
                console.log("Activar sobrecubierta:" + this.encuadernacion.getVal());
                elements_sobrecubierta.removeClass('d-none');

                break;

        }
    }

}

document.addEventListener('DOMContentLoaded', function () {

    let catalogo = new Catalogo();
    catalogo.init();
});

export default Catalogo;