polizia_frascati/resources/views/livewire/report.blade.php

<div class="m-3">

    @include('components.report.nuovo.add')
    @include('components.report.nuovo.add-modal')
    @include('components.report.alerting.alert')

    @if (!$add && !$update)
        @include('components.report.list.verbali')
    @else
        <form>
            @include('components.report.modifica.header')
            @include('components.report.modifica.menu')
            <div class="tab-content" id="custom-tabs-three-tabContent">
                @include('components.report.protocollo.protocollo')
                @include('components.report.parti.parti-accertatori')
                @include('components.report.segnalazione.segnalazione-page')
                @include('components.report.campo-sinistro.campo-sinistro')
                @include('components.report.segnaletica.segnaletica')
                @include('components.report.testimoni.testimone')
                @include('components.report.allegati.allegato')
            </div>
            @include('components.report.modifica.footer')
        </form>

        @include('components.report.anagrafica.anagrafica-modal')

        @include('components.report.veicoli.veicolo-modal')

        @include('components.report.veicoli.veicolo-data-parte')

        @include('components.report.pedoni.pedone-modal')

        @include('components.report.allegati.allegati-modal')

        @include('components.report.accertatori.accertatore-modal')

    @endif

</div>



@push('css')
    <link rel="stylesheet" href="/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
    <link rel="stylesheet" href="/plugins/select2/css/select2.min.css">
    <link rel="stylesheet" href="/dist/css/app.css">
@endpush

@push('scripts')

    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB-Qn1jVJkNUIXFynhk6bcRmNczlYPRQ94&loading=async" defer></script>

    <script src="/plugins/select2/js/select2.min.js"></script>
    <script src="/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
    <script>
        var maxDamageColumns = 4;
        var displayedDamageColumns = 1;

        function loadCoordinates()
        {
            var geocoder = new google.maps.Geocoder();
            var address = $("#localita_due").text().replaceAll('\n                        ', '') + " " + $("#prossimita_civico").text().replaceAll('\n                        ', '') + " ," + $("#localita_uno").text().replaceAll('\n                        ', '');
            geocoder.geocode({
                "address": address
            }, function(results) {
                var location = results[0].geometry.location;
                var lat = location.lat();
                var lng = location.lng();
                @this.set('latitude', lat);
                @this.set('longitude', lng);
            });
        }

        function hasColumnValues(columnNumber) {
            const selectors = [
                `data_tipo_danno_${columnNumber}`,
                `data_entita_danno_${columnNumber}`,
                `data_effetto_danno_${columnNumber}`,
                `data_parte_macchina_${columnNumber}`
            ];

            return selectors.some(selector => {
                const element = document.querySelector(`[wire\\:model="${selector}"]`);
                return element && element.value;
            });
        }

        function showNextDamageColumn() {
            if (displayedDamageColumns < maxDamageColumns) {
                displayedDamageColumns++;
                var nextColumn = document.getElementById('damage-column-' + displayedDamageColumns);
                if (nextColumn) {
                    nextColumn.style.display = 'block';
                }
                if (displayedDamageColumns >= maxDamageColumns) {
                    document.getElementById('add-damage-btn').style.display = 'none';
                }
                window.Livewire.rescan();
            }
        }

        function initializeDamageColumns() {

            for (let i = 2; i <= maxDamageColumns; i++) {
                if (hasColumnValues(i)) {
                    var column = document.getElementById('damage-column-' + i);
                    if (column) {
                        column.style.display = 'block';
                        displayedDamageColumns = i;
                    }
                }
            }

            if (displayedDamageColumns >= maxDamageColumns) {
                document.getElementById('add-damage-btn').style.display = 'none';
            }
        }

        document.addEventListener('DOMContentLoaded', initializeDamageColumns);

        document.addEventListener('livewire:load', function () {
            Livewire.hook('message.processed', () => {
                initializeDamageColumns();
            });
        });

        Livewire.on('load-check', () => {

            $("input[data-bootstrap-switch]").each(function () {
                $(this).bootstrapSwitch({
                    onSwitchChange: function (e, state) {
                        @this.set($(this).prop('id'), state);
                    }
                });
            });

        });

        Livewire.on('load-select', () => {
            const stradario = [
                "localita_due", "intersezione_con", "segnaletica_verticale_1_via",
                "segnaletica_verticale_2_via", "segnaletica_orizzontale_1_via",
                "segnaletica_orizzontale_2_via", "segnaletica_verticale_3_via",
                "segnaletica_verticale_4_via", "segnaletica_orizzontale_3_via",
                "segnaletica_orizzontale_4_via", "vei_carta_circolazione_rilasciata_da_di"
            ];

            stradario.forEach(stradarioSelect);

            function stradarioSelect(value) {
                const ajaxUrl = (value === "vei_carta_circolazione_rilasciata_da_di") ?
                    '/localita' :
                    '/stradario_api';

                $('.' + value).select2({
                    theme: 'bootstrap4',
                    ajax: {
                        url: ajaxUrl,
                        dataType: 'json'
                    },
                    dropdownParent: value === "vei_carta_circolazione_rilasciata_da_di" ? $('#veicoloParte') : null,
                });

                $('.' + value).on('change', function (e) {
                    var data = $('.' + value).select2("val");
                    @this.set(value, data);
                });
            }

            $('.anagraficaClass').select2({
                theme: 'bootstrap4',
                ajax: {
                    url: '/anagrafica',
                    dataType: 'json'
                }
            });

            $('.anagraficaClass').on('change', function (e) {
                var data = $(e.currentTarget).val();
                var progressive = $(e.currentTarget).data("progressive");
                @this.updateAnagraficaParteCoinvolta(data, progressive);
            });

            const anagrafiche = ["richiestaAnagrafica", "data_testi_oculari_0", "data_testi_oculari_1",
                "data_testi_oculari_2", "data_testi_oculari_3"
            ];
            anagrafiche.forEach(anagraficheSelect);

            function anagraficheSelect(value) {
                $('.' + value).select2({
                    theme: 'bootstrap4',
                    ajax: {
                        url: '/anagrafica',
                        dataType: 'json'
                    }
                });

                $('.' + value).on('change', function (e) {
                    var data = $('.' + value).select2("val");
                    @this.set(value, data);
                });

            }

            const accertatori = ["accertatore_1", "accertatore_2", "accertatore_3", "accertatore_4",
                "accertatore_5"
            ];
            accertatori.forEach(accertatoreSelect);

            function accertatoreSelect(value) {
                $('.' + value).select2({
                    theme: 'bootstrap4',
                    ajax: {
                        url: '/accertatori',
                        dataType: 'json'
                    }
                });
                $('.' + value).on('change', function (e) {
                    var data = $('.' + value).select2("val");
                    @this.set(value, data);
                });
            }

            $('.veicoliClass').select2({
                theme: 'bootstrap4',
                ajax: {
                    url: '/veicoli',
                    dataType: 'json'
                }
            });

            $('.veicoliClass').on('change', function (e) {
                var data = $(e.currentTarget).val();
                var progressive = $(e.currentTarget).data("progressive");
                @this.updateVeicoloParteCoinvolta(data, progressive);
            });

            $('.localita_uno').select2({
                theme: 'bootstrap4',
                ajax: {
                    url: '/localita',
                    dataType: 'json'
                }
            });
            $('.localita_uno').on('change', function (e) {
                var data = $('.localita_uno').select2("val");
                @this.set('localita_uno', data);
            });

            const multiple = ["tipo_urto", "tipo_segnalazione", "segnalazione_pervenuta_da", "materiale_recuperato",
                "ausilio_altri_enti", "condizioni_luce", "tipo_strada", "segnaletica_verticale_1",
                "segnaletica_verticale_2", "segnaletica_verticale_3", "segnaletica_verticale_4",
                "segnaletica_orizzontale_1", "segnaletica_orizzontale_2", "segnaletica_orizzontale_3",
                "segnaletica_orizzontale_4"
            ];
            multiple.forEach(multipleSelect);

            function multipleSelect(value) {
                $('.' + value).select2({
                    theme: 'bootstrap4'
                });
                $('.' + value).on('change', function (e) {
                    var data = $('.' + value).select2("val");
                    @this.set(value, data);
                });
            }
        });
        Livewire.on('load-anagrafica-modal', () => {
    const modalsAnag = [
        "anag_birth_town_id",
        "anag_residenza_town_id",
        "anag_documento_rilasciato_da_di_foreign_localita",
        "anag_sede_legale_town_id",
        "anag_foreign_birth_country",
        "anag_foreign_residence_country",
        "anag_pg_foreign_residence_country"
    ];

    const countryFields = [
        "anag_foreign_birth_country",
        "anag_foreign_residence_country"
    ];

    function modalsAnagSelect(value) {
        $('.' + value).select2({
            dropdownParent: $("#anagraficaParte"),
            theme: 'bootstrap4',
            ajax: {
                url: '/localita',
                dataType: 'json'
            },
            width: '100%'
        }).on('change', function (e) {
            var data = $('.' + value).select2("val");
            @this.set(value, data);
        });

        const currentValue = $('.' + value).val();
        const currentText = $('.' + value).find('option:selected').text();
        if (currentValue) {
            let option = new Option(currentText, currentValue, true, true);
            $('.' + value).append(option).trigger('change');
        }
    }

    function initializeCountrySelects(value) {
        $('.' + value).select2({
            dropdownParent: $("#anagraficaParte .modal-content"),
            theme: 'bootstrap4',
            ajax: {
                url: '/countries',
                dataType: 'json'
            },
            width: '100%'
        }).on('change', function (e) {
            var data = $('.' + value).select2("val");
            @this.set(value, data);
        });

        const currentValue = $('.' + value).val();
        const currentText = $('.' + value).find('option:selected').text();
        if (currentValue) {
            let option = new Option(currentText, currentValue, true, true);
            $('.' + value).append(option).trigger('change');
        }
    }

    // Funzione per gestire la visibilità dei campi di nascita
    function toggleNationalityFields() {
        const nationality = $('select[wire\\:model="anag_nazionalita"]').val();
        const foreignBirthCountry = $("#foreignBirthCountry");
        const foreignBirthCity = $("#foreignBirthCity");
        const italianBirthTown = $("#pippo");

        if (nationality === '1') { // Straniera
            foreignBirthCountry.show();
            foreignBirthCity.show();
            italianBirthTown.hide();
        } else { // Italiana o non selezionata
            foreignBirthCountry.hide();
            foreignBirthCity.hide();
            italianBirthTown.show();
        }
    }

    // Funzione per gestire la visibilità dei campi di residenza
    function toggleResidenceFields() {
        const residenceType = $('select[wire\\:model="anag_residenza_tipo"]').val();
        const italianFields = $("#italianResidenceFields");
        const foreignCountry = $("#foreignResidenceCountry");
        const foreignCity = $("#foreignResidenceCity");

        // Nascondi tutti i campi
        italianFields.hide();
        foreignCountry.hide();
        foreignCity.hide();

        // Mostra i campi appropriati
        if (residenceType === '0') { // Italiana
            italianFields.show();
        } else if (residenceType === '1') { // Straniera
            foreignCountry.show();
            foreignCity.show();
        }
    }

    function initializeModalState() {
        const currentType = $('input[name="anag_type"]:checked').val();
        if (currentType == 0 || !currentType) {
            $("#boxPersonaFisica").show();
            $("#boxPersonaGiuridica").hide();
        } else {
            $("#boxPersonaFisica").hide();
            $("#boxPersonaGiuridica").show();
        }

        setTimeout(() => {
            modalsAnag.forEach(modalsAnagSelect);
        }, 100);

        setTimeout(() => {
            countryFields.forEach(initializeCountrySelects);
        }, 100);

        // Inizializza la visibilità dei campi basata sui valori attuali
        setTimeout(() => {
            toggleNationalityFields();
            toggleResidenceFields();
        }, 200);
    }

    initializeModalState();

    $('input[name="anag_type"]').change(function () {
        var x = $('input[name="anag_type"]:checked').val();
        if (x == 0) {
            $("#boxPersonaFisica").show();
            $("#boxPersonaGiuridica").hide();
            @this.changeAnagType(0);
        } else {
            $("#boxPersonaFisica").hide();
            $("#boxPersonaGiuridica").show();
            setTimeout(() => {
                modalsAnag.forEach(modalsAnagSelect);
            }, 100);
            @this.changeAnagType(1);
        }
    });

    // Event listener per la nazionalità (nascita)
    $('select[wire\\:model="anag_nazionalita"]').change(function () {
        toggleNationalityFields();
    });

    // Event listener per il tipo di residenza
    $('select[wire\\:model="anag_residenza_tipo"]').change(function () {
        toggleResidenceFields();
    });

    Livewire.on('change-visualization', (type) => {
        $('input:radio[name="anag_type"]').filter('[value="' + type + '"]').prop('checked', true);
        if (type == 0) {
            $("#boxPersonaFisica").show();
            $("#boxPersonaGiuridica").hide();
        } else {
            $("#boxPersonaFisica").hide();
            $("#boxPersonaGiuridica").show();
            setTimeout(() => {
                modalsAnag.forEach(modalsAnagSelect);
            }, 100);
        }
    });

    // Gestione per le aziende (persona giuridica)
    $('select[wire\\:model="nazionalita"]').change(function () {
        const isPGStraniera = $(this).val() === "1";
        $("#foreignPGResidenceCountry")[isPGStraniera ? 'show' : 'hide']();
        $("#foreignPGResidenceCity")[isPGStraniera ? 'show' : 'hide']();
        $("#italianAddressFields")[isPGStraniera ? 'hide' : 'show']();

        if (!isPGStraniera) {
            @this.set('anag_foreign_residence_country', '');
            @this.set('anag_foreign_residence_city', '');
        }
    });

    $('#anagraficaParte').on('show.bs.modal', function () {
        initializeModalState();
    });

    $('#anagraficaParte').on('hidden.bs.modal', function () {
        modalsAnag.forEach(value => {
            if ($('.' + value).data('select2')) {
                $('.' + value).select2('destroy');
            }
        });
    });
});

        Livewire.on('load-select-modal', () => {

            initializeSelect2Controls();
            @this.cleanPolizzaData();

            const initSelect2Field = (selector, url) => {
                const $field = $(selector);
                if ($field.data('select2')) {
                    $field.select2('destroy');
                }
                $field.empty().select2({
                    dropdownParent: $('#veicoloDataParte'),
                    theme: 'bootstrap4',
                    ajax: {
                        url: url,
                        dataType: 'json'
                    },
                    width: '100%'
                });
            };

            initSelect2Field('.anagrafica_id', '/anagrafica');
            initSelect2Field('.compagnia_id', '/compagnie');
            initSelect2Field('.agenzia', '/polizze/agenzie');

            $('.polizza_num').val('');
            $('.valida_dal').val('');
            $('.valida_al').val('');
            const modals = [
                "data_proprietari", "data_coproprietari", "data_conducenti",
                "data_passeggero_0", "data_passeggero_1", "data_passeggero_2", "data_passeggero_3",
                "data_infortunato_extra_0", "data_infortunato_extra_1", "data_infortunato_extra_2",
                "data_infortunato_extra_3", "anagrafica_id"
            ];

            function initializeSelect2(element, url = '/anagrafica') {
                return $(element).select2({
                    dropdownParent: $('#veicoloDataParte'),
                    theme: 'bootstrap4',
                    ajax: {
                        url: url,
                        dataType: 'json'
                    },
                    width: '100%'
                });
            }

            function initializeRelatedElements(value, data) {
                $('#' + value + "_cinture").hide();
                $('.' + value + "_edit").hide();
                $('.' + value + "_remove").hide();
                $('.' + value + "_add").hide();

                if (data > 0) {
                    $('.' + value + "_edit").show();
                    $('.' + value + "_remove").show();
                    $('#' + value + "_cinture").show();
                } else {
                    $('.' + value + "_add").show();
                }
            }

            function modalsSelect(value) {
                const $select = $('.' + value);
                initializeSelect2($select);

                if (["data_proprietari", "data_coproprietari", "data_conducenti", "data_passeggero_0",
                    "data_passeggero_1", "data_passeggero_2", "data_passeggero_3"
                ].includes(value)) {
                    initializeRelatedElements(value, $select.val());
                }

                $select.on('change', function (e) {
                    const data = $(this).val();
                    @this.set(value, data);

                    if (["data_proprietari", "data_coproprietari", "data_conducenti", "data_passeggero_0",
                        "data_passeggero_1", "data_passeggero_2", "data_passeggero_3"
                    ].includes(value)) {
                        initializeRelatedElements(value, data);
                    }
                });

                const currentValue = $select.val();
                const currentText = $select.find('option:selected').text();
                if (currentValue) {
                    const option = new Option(currentText, currentValue, true, true);
                    $select.append(option).trigger('change');
                }
            }

            $('#veicoloDataParte select').each(function () {
                if ($(this).data('select2')) {
                    $(this).select2('destroy');
                }
            });

            modals.forEach(modalsSelect);

            $('.data_polizze').each(function () {
                if ($(this).data('select2')) {
                    $(this).select2('destroy');
                }
                initializeSelect2(this, '/polizze').on('change', function (e) {
                    @this.set('data_polizze', $(this).val());
                });
            });

            $('#veicoloDataParte').on('hidden.bs.modal', function () {
                $('#veicoloDataParte select').each(function () {
                    if ($(this).data('select2')) {
                        $(this).select2('destroy');
                    }
                });
            });

            $('.compagnia_id').each(function () {
                if ($(this).data('select2')) {
                    $(this).select2('destroy');
                }
                const currentValue = $(this).val();
                const currentText = $(this).find('option:selected').text();

                $(this).select2({
                    dropdownParent: $('#veicoloDataParte'),
                    theme: 'bootstrap4',
                    ajax: {
                        url: '/compagnie',
                        dataType: 'json'
                    },
                    width: '100%'
                }).on('change', function (e) {
                    @this.set('compagnia_id', $(this).val());
                });

                if (currentValue && currentText) {
                    const option = new Option(currentText, currentValue, true, true);
                    $(this).append(option).trigger('change');
                }
            });

            $('.agenzia').each(function () {
                if ($(this).data('select2')) {
                    $(this).select2('destroy');
                }
                const currentValue = $(this).val();
                const currentText = $(this).find('option:selected').text();

                $(this).select2({
                    dropdownParent: $('#veicoloDataParte'),
                    theme: 'bootstrap4',
                    ajax: {
                        url: '/polizze/agenzie',
                        dataType: 'json'
                    },
                    width: '100%'
                }).on('change', function (e) {
                    @this.set('agenzia', $(this).val());
                });

                if (currentValue && currentText) {
                    const option = new Option(currentText, currentValue, true, true);
                    $(this).append(option).trigger('change');
                }
            });

            $('.valida_dal').on('change', function (e) {
                @this.set('valida_dal', $(this).val());
            });

            $('.valida_al').on('change', function (e) {
                @this.set('valida_al', $(this).val());
            });

            $('.polizza_num').on('input', function (e) {
                @this.set('polizza_num', $(this).val());
            });


        });

        Livewire.on('updatePolizzaSelects', data => {

            if (data.anagrafica) {
                const $anagrafica = $('.anagrafica_id');
                const anagOption = new Option(data.anagrafica.text, data.anagrafica.id, true, true);
                $anagrafica.append(anagOption).trigger('change');
            }

            if (data.compagnia) {
                const $compagnia = $('.compagnia_id');
                const compOption = new Option(data.compagnia.text, data.compagnia.id, true, true);
                $compagnia.append(compOption).trigger('change');
            }

            if (data.agenzia) {
                const $agenzia = $('.agenzia');
                const agOption = new Option(data.agenzia, data.agenzia, true, true);
                $agenzia.append(agOption).trigger('change');
            }

            if (data.polizza_num) {
                $('.polizza_num').val(data.polizza_num); @this.set('polizza_num', data.polizza_num);
            }
            if (data.valida_dal) {
                $('.valida_dal').val(data.valida_dal);
                @this.set('valida_dal', data.valida_dal);
            }
            if (data.valida_al) {
                $('.valida_al').val(data.valida_al);
                @this.set('valida_al', data.valida_al);
            }
        });

        Livewire.on('load-select-pedone', () => {

            var x = $("#generalizzato").val();
            if (x == "3")
                $("#generalizzato_select").show();
            else
                $("#generalizzato_select").hide();
            $("#generalizzato").change(function () {
                var val = this.value;
                if (val == "3")
                    $("#generalizzato_select").show();
                else
                    $("#generalizzato_select").hide();
            });

            var x = $("#infortunato").val();
            if (x == "1")
                $("#infortunato_select").show();
            else
                $("#infortunato_select").hide();
            $("#infortunato").change(function () {
                var val = this.value;
                if (val == "1")
                    $("#infortunato_select").show();
                else
                    $("#infortunato_select").hide();
            });

        });

        Livewire.on('load-pedone', (value) => {
            $(".pedone").html(value);
        });

        Livewire.on('set-default-value', (id, text, element) => {

            $('.' + element).select2("val", $('.' + element + " option:contains('" + text + "')").val());

        });
        Livewire.on('add-default-value', (id, text, element) => {
            var newOption = new Option(text, id, false, false);
            $('.' + element).append(newOption).val(id).trigger('change');

            if (element == "data_conducenti" || element == "data_passeggero_0" || element == "data_passeggero_1" ||
                element == "data_passeggero_2" || element == "data_passeggero_3") {
                $('#' + element + "_cinture").hide();
                $('.' + element + "_edit").hide();
                $('.' + element + "_remove").hide();
                $('.' + element + "_add").hide();
                if (id > 0) {
                    $('.' + element + "_edit").show();
                    $('.' + element + "_remove").show();
                    $('.' + element + "_add").hide();
                    $('#' + element + "_cinture").show();
                } else
                    $('.' + element + "_add").show();

            }

        });

        Livewire.on('close-modal', () => {

            $("#anagraficaParte").modal('hide');
            $("#veicoloParte").modal('hide');
            $("#pedoneModal").modal('hide');
            $("#accertatoriModal").modal('hide');
            $("#allegatiModal").modal('hide');
        });

        Livewire.on('close-modal-parte-comune', () => {
            const selectFields = [
                'data_polizze',
                'data_proprietari',
                'data_conducenti',
                'data_passeggero_0',
                'data_passeggero_1',
                'data_passeggero_2',
                'data_passeggero_3',
                'data_infortunato_extra_0',
                'data_infortunato_extra_1',
                'data_infortunato_extra_2',
                'data_infortunato_extra_3'
            ];

            selectFields.forEach(field => {
                if ($(`.${field}`).length) {
                    $(`.${field}`).val(null).trigger('change');
                    if ($(`.${field}`).data('select2')) {
                        $(`.${field}`).select2('destroy');
                    }
                }
            });

            $("#veicoloDataParte").modal('hide');
        });
        $(document).on('click', '[data-dismiss="modal"]', function (e) {
            const modalId = $(this).closest('.modal').attr('id');
            if (modalId === 'veicoloDataParte') {
                e.preventDefault();
                Livewire.emit('closeAndResetModal');
            }
        });

        Livewire.on('attachments', (allegati) => {
            $("#attachments").html('');
            allegati.split("|").forEach(function (item) {
                $("#attachments").append(item + "<br>");
            });
        });

        Livewire.on('updateAnagrafica', (data, progressive) => {
            @this.updateAnagraficaParteCoinvolta(data, progressive);
        });


        Livewire.on('showLoading', (cls) => {
            $("." + cls).hide();
            $("." + cls + "Text").show();
        });

        Livewire.on('hideLoading', (cls) => {
            $("." + cls).show();
            $("." + cls + "Text").hide();
        });

        function initializeSelect2Controls() {
            console.log("initializeSelect2Controls");
            const modals = [
                "data_proprietari", "data_coproprietari", "data_conducenti",
                "data_passeggero_0", "data_passeggero_1", "data_passeggero_2", "data_passeggero_3",
                "data_infortunato_extra_0", "data_infortunato_extra_1", "data_infortunato_extra_2",
                "data_infortunato_extra_3"
            ];

            modals.forEach(value => {
                $('.' + value).select2({
                    dropdownParent: document.body,
                    theme: 'bootstrap4',
                    ajax: {
                        url: '/anagrafica',
                        dataType: 'json'
                    },
                    width: '100%'
                });
            });
        }

        $('.anagrafica_id').on('change', function (e) {
            @this.set('anagrafica_id', $(this).val());
            updateAnagraficaButtons($(this).val());
        });

        $('.compagnia_id').on('change', function (e) {
            @this.set('compagnia_id', $(this).val());
        });

        $('.agenzia').on('change', function (e) {
            @this.set('agenzia', $(this).val());
        });

        $('.polizza_num').on('input', function (e) {
            @this.set('polizza_num', $(this).val());
        });

        $('.valida_dal').on('change', function (e) {
            @this.set('valida_dal', $(this).val());
        });

        $('.valida_al').on('change', function (e) {
            @this.set('valida_al', $(this).val());
        });

        

    </script>

@endpush