517 lines
		
	
	
		
			22 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			517 lines
		
	
	
		
			22 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
<section id="crm-warehouse-index">
 | 
						|
    <div class="crm-warehouse-index alert-errors"></div>
 | 
						|
    <div wire:ignore>
 | 
						|
        <div class="query-filters" id="toolbar">
 | 
						|
            <div class="d-flex flex-wrap">
 | 
						|
                <div class="pt-1 pr-2 pb-1" style="min-width: 175px; max-width: 225px">
 | 
						|
                    <button data-bs-toggle='offcanvas' data-bs-target='#offcanvasUser' class="btn btn-primary waves-effect waves-light">Agregar almacén</button>
 | 
						|
                </div>
 | 
						|
                <button type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordionFiltrado" aria-expanded="false" aria-controls="accordionFiltrado">
 | 
						|
                Filtrado
 | 
						|
                </button>
 | 
						|
                <div class="px-2 pt-1">
 | 
						|
                    <button class="btn btn-label-secondary waves-effect py-3 btn-refresh" disabled><i class="fa-solid fa-rotate"></i></button>
 | 
						|
                </div>
 | 
						|
                <div class="pr-2" style="width: 60px;">
 | 
						|
                    <a href="javascript:void(0)" class="clear-filters">Limpiar Filtrado</a>
 | 
						|
                </div>
 | 
						|
            </div>
 | 
						|
        </div>
 | 
						|
        <table id="bt-warehouses"></table>
 | 
						|
    </div>
 | 
						|
</section>
 | 
						|
 | 
						|
@push('page-script')
 | 
						|
    <script>
 | 
						|
        const store_route = '{{ route('admin.core.users.store') }}',
 | 
						|
            route_show    = '{{ route('admin.inventory.warehouse.show', ['warehouse' => '~warehouse~']) }}',
 | 
						|
            route_destroy = '{{ route('admin.inventory.warehouse.destroy', ['warehouse' => '~warehouse~']) }}',
 | 
						|
            statusList    = {!! json_encode($status_list) !!},
 | 
						|
            statusIntCatalogCss = {!! json_encode($status_list_class) !!};
 | 
						|
 | 
						|
        var btt_height;
 | 
						|
 | 
						|
 | 
						|
        // BootstrapTable Petición AJAX
 | 
						|
        function ajaxRequest(params) {
 | 
						|
            let url = '{{ url()->current() }}' +
 | 
						|
                '?' +
 | 
						|
                $.param(params.data) +
 | 
						|
                '&' +
 | 
						|
                $('.query-filters :input').serialize();
 | 
						|
 | 
						|
            $.get(url).then(function (res) {
 | 
						|
                params.success(res)
 | 
						|
            })
 | 
						|
        }
 | 
						|
 | 
						|
 | 
						|
        // BootstrapTable Formatter
 | 
						|
        function userAvatarFormatter(value, row, index) {
 | 
						|
            if(row.id){
 | 
						|
                let show_href = route_show.replace('~warehouseo~', row.id);
 | 
						|
 | 
						|
                return [
 | 
						|
                    '<div class="d-flex justify-content-start align-items-center user-name">',
 | 
						|
                        '<div class="avatar-wrapper">',
 | 
						|
                            '<div class="avatar avatar-sm me-4">' +
 | 
						|
                                '<img src="' + row.profile_photo_url + '" alt="Avatar" class="rounded-circle">' +
 | 
						|
                            '</div>',
 | 
						|
                        '</div>',
 | 
						|
                        '<div class="d-flex flex-column">',
 | 
						|
                            '<a href="' + show_href + '" class="text-heading text-truncate"><span class="fw-medium">' + row.name + '</span></a>',
 | 
						|
                            '<small>' + row.email + '</small>',
 | 
						|
                        '</div>',
 | 
						|
                    '</div>',
 | 
						|
                ].join('')
 | 
						|
            }
 | 
						|
        }
 | 
						|
 | 
						|
        function uidFormatter(value, row, index) {
 | 
						|
            if(row.id){
 | 
						|
                let show_href = route_show.replace('~warehouseo~', row.id);
 | 
						|
 | 
						|
                return [
 | 
						|
                    '<div class="d-flex align-items-center justify-content-center">',
 | 
						|
                        '<a href="' + show_href + '" class="whitespace-nowrap" title="Ver warehouseo"> ' + row.id + '</a>',
 | 
						|
                        @can('crm.warehouses.update')
 | 
						|
                            '<a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill dropdown-toggle hide-arrow" data-bs-toggle="dropdown"><i class="ti ti-dots-vertical ti-md"></i></a>',
 | 
						|
                            '<div class="dropdown-menu dropdown-menu-end m-0">',
 | 
						|
                                '<a href="javascript:deleteRow(' + row.id + ');" class="dropdown-item delete-record">Eliminar</a>',
 | 
						|
                            '</div>',
 | 
						|
                        @endcan
 | 
						|
                    '</div>'
 | 
						|
                ].join('')
 | 
						|
            }
 | 
						|
        }
 | 
						|
 | 
						|
        // BootstrapTable Init
 | 
						|
        function initTable(table) {
 | 
						|
            $(table)
 | 
						|
                .bootstrapTable('destroy')
 | 
						|
                .bootstrapTable({
 | 
						|
                    height: btt_height,
 | 
						|
                    locale: 'es-MX',
 | 
						|
                    ajax: "ajaxRequest",
 | 
						|
                    toolbar: "#toolbar",
 | 
						|
                    search: true,
 | 
						|
                    showColumns: true,
 | 
						|
                    showColumnsToggleAll: true,
 | 
						|
                    showExport: true,
 | 
						|
                    showFullscreen: true,
 | 
						|
                    showPaginationSwitch: true,
 | 
						|
                    showRefresh: true,
 | 
						|
                    showToggle: true,
 | 
						|
                    clickToSelect: true,
 | 
						|
                    minimumCountColumns: 4,
 | 
						|
                    fixedColumns: true,
 | 
						|
                    fixedNumber: 1,
 | 
						|
                    idField: "id",
 | 
						|
                    pagination: true,
 | 
						|
                    pageList: [10, 25, 50, 100, 500],
 | 
						|
                    sidePagination: "server",
 | 
						|
                    exportTypes: ['csv', 'txt', 'excel'],
 | 
						|
                    exportOptions: {
 | 
						|
                        fileName: 'warehouseos',
 | 
						|
                    },
 | 
						|
                    sortName: 'users.id',
 | 
						|
                    sortOrder: 'desc',
 | 
						|
                    mobileResponsive: true,
 | 
						|
                    cookie: true,
 | 
						|
                    resizable: true,
 | 
						|
                    cookieIdTable:"crm-warehouse-index",
 | 
						|
                    columns: [
 | 
						|
                        {
 | 
						|
                            field: 'id',
 | 
						|
                            title: 'UID',
 | 
						|
                            align: 'center',
 | 
						|
                            sortable: true,
 | 
						|
                            sortName: 'users.id',
 | 
						|
                            switchable: false,
 | 
						|
                            formatter: uidFormatter
 | 
						|
                        },
 | 
						|
 | 
						|
                        {
 | 
						|
                            field: 'name',
 | 
						|
                            title: 'Nombre',
 | 
						|
                            formatter: userAvatarFormatter,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'email',
 | 
						|
                            title: 'Correo electrónico',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'tipo_persona',
 | 
						|
                            title: 'Tipo persona',
 | 
						|
                            visible: false,
 | 
						|
                            sortable: true,
 | 
						|
                            formatter: window.btFormatter.tipoPersona,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'rfc',
 | 
						|
                            title: 'RFC',
 | 
						|
                            sortable: true,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'nombre_fiscal',
 | 
						|
                            title: 'Nombre fiscal',
 | 
						|
                            sortable: true,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'c_regimen_fiscal',
 | 
						|
                            title: 'Regimen fiscal',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                            formatter: window.btFormatter.regimenFiscal,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'domicilio_fiscal',
 | 
						|
                            title: 'Domicilio fiscal',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'estado',
 | 
						|
                            title: 'Estado',
 | 
						|
                            sortable: true,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'municipio',
 | 
						|
                            title: 'Municipio',
 | 
						|
                            sortable: true,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'localidad',
 | 
						|
                            title: 'Localidad',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                        },
 | 
						|
 | 
						|
                        {
 | 
						|
                            field: 'c_uso_cfdi',
 | 
						|
                            title: 'Uso de CFDI',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                            formatter: window.btFormatter.usoCfdi,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'cargo',
 | 
						|
                            title: 'Cargo',
 | 
						|
                            visible: false,
 | 
						|
                            sortable: true,
 | 
						|
                        },
 | 
						|
 | 
						|
 | 
						|
                        {
 | 
						|
                            field: 'is_prospect',
 | 
						|
                            title: 'Es prospecto',
 | 
						|
                            align: 'center',
 | 
						|
                            visible: false,
 | 
						|
                            sortable: true,
 | 
						|
                            formatter: window.btFormatter.check,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'is_customer',
 | 
						|
                            title: 'Es cliente',
 | 
						|
                            align: 'center',
 | 
						|
                            visible: false,
 | 
						|
                            sortable: true,
 | 
						|
                            formatter: window.btFormatter.check,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'is_provider',
 | 
						|
                            title: 'Es proveedor',
 | 
						|
                            align: 'center',
 | 
						|
                            visible: false,
 | 
						|
                            sortable: true,
 | 
						|
                            formatter: window.btFormatter.check,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'is_user',
 | 
						|
                            title: 'Es usuario',
 | 
						|
                            align: 'center',
 | 
						|
                            visible: false,
 | 
						|
                            sortable: true,
 | 
						|
                            formatter: window.btFormatter.check,
 | 
						|
                        },
 | 
						|
 | 
						|
                        {
 | 
						|
                            field: 'status',
 | 
						|
                            title: 'Estado',
 | 
						|
                            align: 'center',
 | 
						|
                            sortable: true,
 | 
						|
                            formatter: window.btFormatter.status,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'created_at',
 | 
						|
                            title: 'Creado        ',
 | 
						|
                            align: 'center',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'created_by_name',
 | 
						|
                            title: 'Creado por',
 | 
						|
                            align: 'center',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                            sortName: 'created_by_name',
 | 
						|
                        },
 | 
						|
                        {
 | 
						|
                            field: 'updated_at',
 | 
						|
                            title: 'Modificado    ',
 | 
						|
                            align: 'center',
 | 
						|
                            sortable: true,
 | 
						|
                            visible: false,
 | 
						|
                        },
 | 
						|
                    ]
 | 
						|
                })
 | 
						|
        }
 | 
						|
 | 
						|
        function toggleSections() {
 | 
						|
            const isProspect = $('#is_prospect').is(':checked');
 | 
						|
            const isCustomer = $('#is_customer').is(':checked');
 | 
						|
            const isProvider = $('#is_provider').is(':checked');
 | 
						|
            const isUser = $('#is_user').is(':checked');
 | 
						|
 | 
						|
            $('.div-sat').toggle(isCustomer || isProvider);
 | 
						|
            $('.div-sat-customer').toggle(isCustomer);
 | 
						|
            $('.div-user-auth').toggle(isCustomer || isUser);
 | 
						|
            $('.div-roles').toggle(isUser);
 | 
						|
        }
 | 
						|
 | 
						|
        function toggleCheckboxes(status) {
 | 
						|
            const isDisabled = status == 1;
 | 
						|
            $('#is_prospect, #is_customer, #is_provider, #is_user').prop('disabled', isDisabled);
 | 
						|
        }
 | 
						|
 | 
						|
 | 
						|
        load_js_form = () => {
 | 
						|
            $('#userForm .select2')
 | 
						|
                .each(function() {
 | 
						|
                    var $this = $(this)
 | 
						|
 | 
						|
                    $this.wrap('<div class="position-relative"></div>')
 | 
						|
 | 
						|
                    $this.select2({
 | 
						|
                        dropdownAutoWidth: true,
 | 
						|
                        width: '100%',
 | 
						|
                        dropdownParent: $this.parent()
 | 
						|
                    });
 | 
						|
                });
 | 
						|
 | 
						|
            // Evento para los checkboxes
 | 
						|
            $('#is_prospect, #is_customer, #is_provider, #is_user').on('change', toggleSections);
 | 
						|
 | 
						|
            // Evento para el select de estado
 | 
						|
            $('.div-status').on('change', 'select[name="status"]', function() {
 | 
						|
                toggleCheckboxes($(this).val());
 | 
						|
            });
 | 
						|
 | 
						|
 | 
						|
            // Previo de imagenes
 | 
						|
            document.getElementById("photo").addEventListener('change', updatePreviewImage);
 | 
						|
 | 
						|
 | 
						|
            // Reset form
 | 
						|
            $("#userForm")
 | 
						|
                .on('reset', function(){
 | 
						|
                    var form = $("#userForm");
 | 
						|
 | 
						|
                    form.validate().resetForm();
 | 
						|
 | 
						|
                    setTimeout(function(){
 | 
						|
                        $('#roles').trigger('change');
 | 
						|
 | 
						|
                        toggleSections();
 | 
						|
                    }, 250)
 | 
						|
 | 
						|
                    $('#user-image').prop("src", "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
 | 
						|
 | 
						|
                    $('#userForm .alert-errors').html('');
 | 
						|
 | 
						|
                    $('.pdf-dropzone-div').show();
 | 
						|
 | 
						|
                    $("#pdf-dropzone").removeAllFiles(true);
 | 
						|
                });
 | 
						|
 | 
						|
 | 
						|
            $("#userForm")
 | 
						|
                .validate({
 | 
						|
                    errorClass: 'error',
 | 
						|
                    highlight: function(element, errorClass, validClass) {
 | 
						|
                        // Agrega la clase de error a la fila (contenedor del campo)
 | 
						|
                        $(element).closest('.mb-3').addClass('has-error');
 | 
						|
                    },
 | 
						|
                    unhighlight: function(element, errorClass, validClass) {
 | 
						|
                        // Elimina la clase de error de la fila (contenedor del campo)
 | 
						|
                        $(element).closest('.mb-3').removeClass('has-error');
 | 
						|
                    },
 | 
						|
                    errorPlacement: function(error, element) {
 | 
						|
                        // Controla dónde se colocan los mensajes de error
 | 
						|
                        error.appendTo(element.closest('.mb-3').find('.error-message'));
 | 
						|
                    },
 | 
						|
                    rules: {
 | 
						|
                        name: {
 | 
						|
                            required: true,
 | 
						|
                            minlength: 5
 | 
						|
                        },
 | 
						|
                        email: {
 | 
						|
                            required: true,
 | 
						|
                            email: true
 | 
						|
                        },
 | 
						|
                        password: {
 | 
						|
                            required: function(element) {
 | 
						|
                                return !$("#userForm input[name=id]").val() && ($('#is_user').is(':checked') || $('#is_customer').is(':checked'));
 | 
						|
                            },
 | 
						|
                            minlength: 6
 | 
						|
                        }
 | 
						|
                    },
 | 
						|
                    messages: {
 | 
						|
                        name: {
 | 
						|
                            required: "Por favor ingrese su nombre completo",
 | 
						|
                            minlength: "El nombre completo debe tener al menos 8 caracteres"
 | 
						|
                        },
 | 
						|
                        email: {
 | 
						|
                            required: "Por favor ingrese su correo electrónico",
 | 
						|
                            email: "El valor no es una dirección de correo válida"
 | 
						|
                        },
 | 
						|
                        password: {
 | 
						|
                            required: "La contraseña es obligatoria para nuevos usuarios",
 | 
						|
                            minlength: "La contraseña debe tener al menos 6 caracteres"
 | 
						|
                        }
 | 
						|
                    },
 | 
						|
                    submitHandler: function(form, event) {
 | 
						|
                        // Evita que el formulario se envíe automáticamente
 | 
						|
                        event.preventDefault();
 | 
						|
 | 
						|
                        var form = $("#userForm")[0],
 | 
						|
                            data = new FormData(form);
 | 
						|
 | 
						|
                        $('#userForm :input').prop('disabled', true);
 | 
						|
                        $('#userForm .alert-errors').html('');
 | 
						|
 | 
						|
                        $.ajax({
 | 
						|
                            url: store_route,
 | 
						|
                            method: 'POST',
 | 
						|
                            headers: {
 | 
						|
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
 | 
						|
                            },
 | 
						|
                            data: data,
 | 
						|
                            contentType: false,
 | 
						|
                            processData: false,
 | 
						|
                            cache: false,
 | 
						|
                            timeout: 3000,
 | 
						|
                            success: function(data) {
 | 
						|
                                $('#userForm :input').prop('disabled', false);
 | 
						|
 | 
						|
                                if (data.errors) {
 | 
						|
                                    $('#userForm .alert-errors').html('<div class="alert alert-danger alert-dismissible fade show" role="alert">' +
 | 
						|
                                        '<div class="alert-body">' + data.errors + '</div>' +
 | 
						|
                                        '<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>' +
 | 
						|
                                        '</div>');
 | 
						|
 | 
						|
                                } else {
 | 
						|
                                    let $usersIndexAlert = $('.crm-warehouse-index.alert-errors');
 | 
						|
 | 
						|
                                    $usersIndexAlert.html('<div class="alert alert-success alert-dismissible fade show" role="alert">' +
 | 
						|
                                        '<div class="alert-body">' +
 | 
						|
                                        '<p class="mb-0"><strong>' + data.success + '</strong></p>' +
 | 
						|
                                        '</div>' +
 | 
						|
                                        '<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>' +
 | 
						|
                                        '</div>');
 | 
						|
 | 
						|
                                    $('#userForm button[type=reset]').trigger('click');
 | 
						|
                                    $('#toolbar .clear-filters').trigger('click');
 | 
						|
                                }
 | 
						|
                            },
 | 
						|
                            error: function(e) {
 | 
						|
                                $('#userForm :input').prop('disabled', false);
 | 
						|
 | 
						|
                                $('#userForm .alert-errors').html('<div class="alert alert-danger alert-dismissible fade show" role="alert">' +
 | 
						|
                                    '<div class="alert-body">' + e.responseJSON.message + '</div>' +
 | 
						|
                                    '<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>' +
 | 
						|
                                    '</div>');
 | 
						|
                            }
 | 
						|
                        });
 | 
						|
 | 
						|
                    }
 | 
						|
                });
 | 
						|
 | 
						|
 | 
						|
            // Inicializar el estado al cargar la página
 | 
						|
            toggleSections();
 | 
						|
            toggleCheckboxes($('select[name="status"]').val());
 | 
						|
        }
 | 
						|
 | 
						|
        // Previo de imagen de perfil
 | 
						|
        updatePreviewImage = (event) => {
 | 
						|
            var file = event.target.files[0],
 | 
						|
                reader = new FileReader();
 | 
						|
 | 
						|
            reader.onload = event => {
 | 
						|
                document.getElementById('user-image').setAttribute('src', event.target.result);
 | 
						|
            };
 | 
						|
 | 
						|
            reader.readAsDataURL(file);
 | 
						|
        }
 | 
						|
 | 
						|
 | 
						|
        document.addEventListener('DOMContentLoaded', function() {
 | 
						|
            $(document).ready(function() {
 | 
						|
                var $table        = $('#bt-warehouses'),
 | 
						|
                    $btnRefresh   = $('#toolbar .btn-refresh'),
 | 
						|
                    $clearFilters = $('a.clear-filters');
 | 
						|
 | 
						|
                var btt_rest_height = 220,
 | 
						|
                    btt_min_height  = 600;
 | 
						|
 | 
						|
                btt_height = (window.innerHeight - btt_rest_height) < btt_min_height?
 | 
						|
                    btt_height:
 | 
						|
                    window.innerHeight - btt_rest_height;
 | 
						|
 | 
						|
                var offcanvasElement = document.getElementById('offcanvasUser'),
 | 
						|
                    offcanvasUser = new bootstrap.Offcanvas(offcanvasElement);
 | 
						|
 | 
						|
                const refreshButton = document.querySelector('.btn-refresh');
 | 
						|
                const inputs = document.querySelectorAll('#toolbar input, #toolbar select');
 | 
						|
 | 
						|
                inputs.forEach(input => {
 | 
						|
                    input.addEventListener('change', () => {
 | 
						|
                        refreshButton.disabled = false;
 | 
						|
                        refreshButton.classList.remove('btn-label-secondary');
 | 
						|
                        refreshButton.classList.add('btn-label-success');
 | 
						|
                    });
 | 
						|
                });
 | 
						|
 | 
						|
 | 
						|
                // Button Refresh
 | 
						|
                $btnRefresh
 | 
						|
                    .on('click', () => {
 | 
						|
                        $table.bootstrapTable('refresh');
 | 
						|
                        refreshButton.disabled = true;
 | 
						|
                        refreshButton.classList.remove('btn-label-success');
 | 
						|
                        refreshButton.classList.add('btn-label-secondary');
 | 
						|
                    });
 | 
						|
 | 
						|
                // Button clear filters
 | 
						|
                $clearFilters
 | 
						|
                    .on('click', () => {
 | 
						|
                        $table.bootstrapTable('resetSearch', ''); // Inicializa la búsqueda con cadena vacía
 | 
						|
                        refreshButton.disabled = true;
 | 
						|
                        refreshButton.classList.remove('btn-label-success');
 | 
						|
                        refreshButton.classList.add('btn-label-secondary');
 | 
						|
                   });
 | 
						|
 | 
						|
 | 
						|
                initTable('#bt-warehouses'); // Una vez que todos los scripts estén cargados, inicializa Bootstrap Table
 | 
						|
 | 
						|
 | 
						|
                load_js_form();
 | 
						|
            });
 | 
						|
        });
 | 
						|
    </script>
 | 
						|
@endpush
 |