@extends('layout.backoffice')
@section('content')
    <div class="row">
        <form id="cliente">
            <input type="hidden" value="{{$entidad["id_cliente"] ?? ''}}" name="entity" id="entity"/>
            <div class="col-12 col-sm-12">
                <div class="card card-primary card-outline card-outline-tabs">
                    <div class="card-header">
                        <ul class="nav nav-tabs card-header-tabs flex-column flex-sm-row" id="custom-tabs-four-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" data-bs-toggle="tab" href="#tab-general" role="tab" aria-controls="tab_general" aria-selected="true">
                                    Información General
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" data-bs-toggle="tab" href="#tab-compras" role="tab" aria-controls="tab-compras" aria-selected="false">
                                    Historial De Compras
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="card-body">
                        <div class="tab-content">
                            <div class="tab-pane fade active show" id="tab-general" role="tabpanel" aria-labelledby="custom-tabs-four-home-tab">
                                @include('page.informes.cliente.tab.general')
                            </div>
                            {{--                            <div class="tab-pane fade" id="tab-adicional" role="tabpanel" aria-labelledby="custom-tabs-four-home-tab">--}}
                            {{--                                @include('page.informes.cliente.tab.adicional')--}}
                            {{--                            </div>--}}
                            <div class="tab-pane fade" id="tab-compras" role="tabpanel" aria-labelledby="custom-tabs-four-messages-tab">
                                @include('page.informes.cliente.tab.compras')
                            </div>
                        </div>
                    </div>
                    <div class="card-footer">
                        @if (isset($entidad["id_cliente"]))
                            <button type="button" id="btn_actualizar" class="btn btn-primary btn-sm btn-flat">Actualizar</button>
                        @else
                            <button type="button" id="btn_guardar" class="btn btn-primary btn-sm btn-flat">Guardar</button>
                        @endif
                        <a href="{{ url('backoffice/informes/cliente/listar/') }}">
                            <button type="button" class="btn btn-default btn-sm btn-flat">Volver</button>
                        </a>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <script>
        jQuery(document).ready(function () {
            jQuery('#doc_tipo').val("{{$entidad["doc_tipo"] ?? ''}}").change();
            jQuery('#cliente_dep').val("{{$entidad["id_estado"] ?? ''}}").change();
            jQuery('#cliente_depart_envio').val("{{$entidad["envio_id_estado"] ?? ''}}").change();
        });

        jQuery(document).on('change', '#cliente_dep', function () {
            if (jQuery(this).val() != "") {
                axios.get('maestro/ciudad/' + jQuery(this).val()).then(function (resp) {
                    jQuery('#cliente_ciudad').empty();
                    jQuery('#cliente_ciudad').append(jQuery('<option>', {value: "", text: "Seleccione"}, '</option>'));

                    for (i = 0; i < resp.data.data.length; i++) {
                        if (resp.data.data[i].nombre !== "") {
                            jQuery('#cliente_ciudad').append(jQuery('<option>', {value: resp.data.data[i].id_ciudad, text: resp.data.data[i].nombre}, '</option>'));
                        }
                    }

                    @if (isset($entidad["id_cliente"]))
                    jQuery('#cliente_ciudad').val({{$entidad["id_ciudad"]}}).change();
                    @endif
                });
            }
        });

        jQuery(document).on('change', '#cliente_depart_envio', function () {
            if (jQuery(this).val() != "") {
                axios.get('maestro/ciudad/' + jQuery(this).val()).then(function (resp) {
                    jQuery('#cliente_envio_ciudad').empty();
                    jQuery('#cliente_envio_ciudad').append(jQuery('<option>', {value: "", text: "Seleccione"}, '</option>'));
                    for (i = 0; i < resp.data.data.length; i++) {
                        if (resp.data.data[i].nombre !== "") {
                            jQuery('#cliente_envio_ciudad').append(jQuery('<option>', {value: resp.data.data[i].id_ciudad, text: resp.data.data[i].nombre}, '</option>'));
                        }
                    }

                    @if (isset($entidad["id_cliente"]))
                    jQuery('#cliente_envio_ciudad').val({{$entidad["envio_id_ciudad"]}}).change();
                    @endif
                });
            }
        });

        jQuery(document).on('click', '#btn_guardar', function () {
            if (system_validarcampos("cliente")) {
                axios.post('cliente/crear', getDataJson("cliente")).then(function (resp) {
                    if (resp.data.error === 0) {
                        Swal.fire("Cliente creado", '', 'success').then(function () {
                            window.location = UrlGlobal + 'informes/cliente/gestionar/' + resp.data.data.id;
                        });
                    } else {
                        notificarUsuario(resp.data.mensaje);
                    }
                });
            }
        });

        jQuery(document).on('click', '#btn_actualizar', function () {
            if (system_validarcampos("cliente")) {
                axios.put('cliente/', getDataJson("cliente")).then(function (resp) {
                    if (resp.data.error === 0) {
                        Swal.fire("Cliente actualizado", '', 'success').then(function () {
                            location.reload();
                        });
                    } else {
                        notificarUsuario(resp.data.mensaje);
                    }
                });
            }
        });
    </script>
@endsection