@extends('layout.master', [
'activePage' => $activePage,
'categoria' => $categoria,
'menuParent' => $menuParent,
'titlePage' => $titlePage
])


@push('plugin-styles')
{!! Html::style('assets/css/loader.css') !!}
{!! Html::style('assets/css/apps/tickets.css') !!}
{!! Html::style('plugins/table/datatable/datatables.css') !!}
{!! Html::style('plugins/table/datatable/dt-global_style.css') !!}
@endpush


@section('content')

<div class="sub-header-container">
    <header class="header navbar navbar-expand-sm">
        <ul class="navbar-nav flex-row">
            <li>
                <div class="page-header">
                    <nav class="breadcrumb-one" aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="javascript:void(0);"> {{__('Catalogos')}}</a></li>
                            <li class="breadcrumb-item active" aria-current="page"><span> {{__('CATALOGO DE CHEQUERAS')}}</span></li>
                        </ol>
                    </nav>
                </div>
            </li>
        </ul>
    </header>
</div>
<div class="layout-px-spacing">
    <div class="container-fluid p-0">
        <div class="row layout-top-spacing justify-content-end">
            <div class="col-3 text-right">
                <button class="btn btn-primary" data-toggle="modal" data-target="#modal-chequeras">Nueva chequera</button>
            </div>
        </div>
        <div class="row date-table-container layout-top-spacing">
            <div class="table-responsive">
                <table class="table table-hover" id="list-chequeras">
                    <thead>
                        <tr>
                            <th class="no-content"></th>
                            <th>{{__('ID')}}</th>
                            <th>{{__('Descripción')}}</th>
                            <th>{{__('Banco')}}</th>
                            <th>{{__('Cuenta bancaria')}}</th>
                            <th>{{__('Plaza')}}</th>
                            <th>{{__('Cuenta contable')}}</th>
                            <th>{{__('Moneda')}}</th>
                            <th>{{__('Sucursal bancaria')}}</th>
                            <th>{{__('Fecha de creación')}}</th>
                            <th>{{__('Ultima actualización')}}</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>


<div class="modal fade draggable" id="modal-chequeras" tabindex="-1" role="dialog" aria-hidden="true" style="z-index: 1500;">
    <div class="modal-dialog modal-dialog-centered modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="title-modal-chequeras">Agregar chequera </h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <i class="las la-times"></i>
                </button>
            </div>
            <form action="{{url('catalogos/chequeras/save-chequera')}}" method="POST" id="formulario" class="form-with-spin">
                {{ csrf_field() }}
                <input type="hidden" name="id_chequera" id="id_chequera">
                <div class="modal-body">
                    <div class="form-group">
                        <label>Descripción: <span class="text-danger">*</span></label>
                        <input type="text" name="nombre" id="nombre" class="form-control" required>
                    </div>
                    <div class="form-group">
                        <label>Banco: <span class="text-danger">*</span></label>
                        <select id="id_banco" class="form-control" name="id_banco" required>
                            <option value="">- Selecciona una opción -</option>
                            @foreach ($data['bancos'] as $item)
                            <option value="{{ $item->id }}">
                                {{$item->descripcion_corta }}
                            </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="form-group">
                        <label>Cuenta bancaria: <span class="text-danger">*</span></label>
                        <input type="text" name="cuenta_bancaria" id="cuenta_bancaria" class="form-control" required>
                    </div>
                    <div class="form-group">
                        <label>Plaza: </label>
                        <input type="number" name="plaza" id="plaza" class="form-control">
                    </div>
                    <div class="form-group">
                        <label>Cuenta contable: </label>
                        <input type="number" name="cuenta_contable" max="32767" id="cuenta_contable" class="form-control">
                    </div>
                    <div class="form-group row">
                        <div class="col-6">
                            <label>S CC: </label>
                            <input type="number" max="32767" name="scuenta_contable" id="scuenta_contable" class="form-control">
                        </div>
                        <div class="col-6">
                            <label>Ss CC: </label>
                            <input type="number" max="32767" name="sscuenta_contable" id="sscuenta_contable" class="form-control">
                        </div>
                    </div>
                    <div class="form-group row">

                        <div class="col-6">
                            <label>Sss CC: </label>
                            <input type="number" max="32767" name="ssscuenta_contable" id="ssscuenta_contable" class="form-control">
                        </div>
                        <div class="col-6">
                            <label>Sss CC: </label>
                            <input type="number" max="32767" name="sssscuenta_contable" id="sssscuenta_contable" class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label>Moneda: <span class="text-danger">*</span></label>
                        <select id="id_moneda" class="form-control" name="id_moneda" required>
                            <option value="">- Selecciona una opción -</option>
                            @foreach ($data['monedas'] as $item)
                            <option value="{{ $item->id }}">
                                {{$item->codigo }}
                            </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group">
                        <label>Sucursal bancaria: </label>
                        <input type="number" max="32767" name="sucursal_bancaria" id="sucursal_bancaria" class="form-control">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger btn-link" data-dismiss="modal">Cerrar</button>
                    <button type="submit" class="btn btn-primary">Guardar</button>
                </div>
            </form>
        </div>
    </div>
</div>

<style>
    .flatpickr-calendar {
        z-index: 1600 !important;
    }
</style>

@endsection

@push('plugin-scripts')
{!! Html::script('plugins/table/datatable/datatables.js') !!}
{!! Html::script('plugins/table/datatable/button-ext/dataTables.buttons.min.js') !!}
{!! Html::script('plugins/table/datatable/button-ext/jszip.min.js') !!}
{!! Html::script('assets/js/loader.js') !!}
{!! Html::script('plugins/jquery-ui/jquery-ui.min.js') !!}
{!! Html::script('assets/js/basicui/inputmask.js') !!}

@endpush

@push('custom-scripts')
<script>
    $(document).ready(function() {

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        getChequeras();
    });

    function getChequeras() {
        $('#list-chequeras').dataTable().fnDestroy();

        var table = $('#list-chequeras').DataTable({
            lengthMenu: [10, 15, 20, 50, 100, 200, 500],
            language: {
                url: "{{asset('assets/material/datatable_sp.json')}}"
            },
            ajax: {
                url: "{{url('catalogos/chequeras/get-chequeras')}}",
                type: "POST",
            },
            columns: [{
                    data: "id",
                    render: function(data, type, full, meta) {
                        return '<div><button class="btn btn-sm p-0 btn-link text-primary font-20" title="Editar chequera" onclick="editarChequera(' + data + ')" ><i class="las la-edit"></i></button><button class="font-20 text-danger btn btn-link p-0" title="Eliminar chequera" onclick="eliminarChequera(' + data + ')"><i class="las la-trash"></i></button></div>';
                    }
                },
                {
                    data: "id"
                },
                {
                    data: "nombre"
                },
                {
                    data: "banco.descripcion_corta"
                },
                {
                    data: "cuenta_bancaria"
                },
                {
                    data: "plaza",
                },
                {
                    data: "cuenta_contable",
                },
                {
                    data: "moneda.codigo",
                },
                {
                    data: "sucursal_bancaria",
                },
                {
                    data: "created_at",
                    render: function(data, type, full, meta) {
                        var new_created_at = new Date(data);

                        var day = new_created_at.getDate()
                        if (day < 10) {
                            day = '0' + day;
                        }

                        var month = new_created_at.getMonth() + 1;
                        if (month < 10) {
                            month = `0${month}`;
                        }

                        return day + '-' + month + '-' + new_created_at.getFullYear() + ' ' + new_created_at.getHours() + ':' + new_created_at.getMinutes();
                    }
                },
                {
                    data: "updated_at",
                    render: function(data, type, full, meta) {
                        var new_created_at = new Date(data);

                        var day = new_created_at.getDate()
                        if (day < 10) {
                            day = '0' + day;
                        }

                        var month = new_created_at.getMonth() + 1;
                        if (month < 10) {
                            month = `0${month}`;
                        }

                        return day + '-' + month + '-' + new_created_at.getFullYear() + ' ' + new_created_at.getHours() + ':' + new_created_at.getMinutes();
                    }
                },

            ],
            order: [
                [1, "desc"]
            ],


        });
    }


    function editarChequera(id) {
        $.ajax({
                url: '{{ url("catalogos/chequeras/get-chequera" )}}',
                type: 'POST',
                dataType: 'json',
                data: {
                    id: id,
                },
            })
            .done(function(resp) {

                $('#id_chequera').val(id);
                $('#nombre').val(resp.data['nombre']);
                $('#id_banco').val(resp.data['id_banco']).trigger('chnage');
                $('#id_moneda').val(resp.data['id_moneda']).trigger('chnage');
                $('#cuenta_bancaria').val(resp.data['cuenta_bancaria']);
                $('#plaza').val(resp.data['plaza']);
                $('#cuenta_contable').val(resp.data['cuenta_contable']);
                $('#scuenta_contable').val(resp.data['scuenta_contable']);
                $('#sscuenta_contable').val(resp.data['sscuenta_contable']);
                $('#ssscuenta_contable').val(resp.data['ssscuenta_contable']);
                $('#sssscuenta_contable').val(resp.data['sssscuenta_contable']);
                $('#sucursal_bancaria').val(resp.data['sucursal_bancaria']);
                $('#title-modal-chequeras').text('Editar chequera')
                $('#modal-chequeras').modal('show')
            })
            .fail(function() {
                console.log("error");
            })
            .always(function() {
                console.log("complete");

            })

    }

    function eliminarChequera(id) {
        Swal.fire({
            title: '¿Estás seguro de eliminar?',
            text: "Esta acción no es reversible",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            cancelButtonText: 'Cancelar',
            confirmButtonText: 'Sí, eliminar'
        }).then((result) => {
            if (result.value) {
                $('#loadingModal').modal('show')
                window.location.replace("{{url('catalogos/chequeras/delete-chequera')}}/" + id);
            }
        })
    }
</script>
@endpush