@extends('layouts.app')
@section('titulo', (!$model->exists ? 'Creando' : 'Editando') . ' Cliente')
@php
    $manual = true;
@endphp

@section('content')
    <div class="row">
        <div class="col">
            <div class="card shadow mb-4">
                <!-- Card Header - Dropdown -->
                <div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
                    <h6 class="m-0 font-weight-bold text-primary">Datos del cliente</h6>
                </div>
                <!-- Card Body -->
                <div class="card-body">
                    {{ html()->modelForm($model, !$model->exists ? 'POST' : 'PATCH', !$model->exists ? route('gestion.clientes.store') : route('gestion.clientes.update', $model->id))->open() }}
                    <div class="row">
                        <div class="col">
                            <div class="form-group">
                                <label for="nombre">Nombre</label>
                                {{ html()->text('Nombre')->class('form-control')->attributes(['oninput' => 'this.value = this.value.toUpperCase()']) }}
                            </div>
                        </div>
                        <div class="col">
                            <div class="form-group">
                                <label for="apellido">RTN</label>
                                {{ html()->text('RTN')->class('form-control') }}
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <div class="form-group">
                                <label for="apellido">Direccion</label>
                                {{ html()->text('Direccion')->class('form-control')->attributes(['oninput' => 'this.value = this.value.toUpperCase()']) }}
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <div class="form-group">
                                <button type="button" class="btn btn-primary mr-2" onclick="agregarFila()">
                                    <i class="fa-solid fa-plus"></i>
                                </button>
                                <button type="button" class="btn btn-danger" onclick="eliminarFila()">
                                    <i class="fa-solid fa-xmark"></i>
                                </button>
                            </div>
                            <table class="table table-bordered table-striped table-hover" id="tabla_telefonos">
                                <tbody>
                                    @php
                                        $telefonos = 0;
                                    @endphp
                                    @if ($model->exists && $model->telefonos->count() > 0)
                                        @foreach ($model->telefonos as $item)
                                            @php
                                                $telefonos++;
                                            @endphp
                                            <tr>
                                                <td>Teléfono #{{ $telefonos }}</td>
                                                <td>
                                                    <input type="number" name="telefonos[]" class="form-control"
                                                        value="{{ $item->Telefono }}" required>
                                                </td>
                                            </tr>
                                        @endforeach
                                    @else
                                        <tr>
                                            <td>Teléfono #1</td>
                                            <td>
                                                <input type="number" name="telefonos[]" class="form-control" required>
                                            </td>
                                        </tr>
                                    @endif
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {{ html()->submit('<i class="far fa-save"></i> ' . (!$model->exists ? 'Guardar' : 'Editar'))->class('btn btn-primary') }}
                        </div>
                    </div>
                    {{ html()->closeModelForm() }}
                </div>
            </div>
        </div>
    </div>
    @if ($model->exists)
        <div class="row">
            <div class="col">
                <div class="card shadow mb-4">
                    <!-- Card Header - Dropdown -->
                    <div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
                        <h6 class="m-0 font-weight-bold text-primary">Lista de contratos del cliente</h6>
                    </div>
                    <!-- Card Body -->
                    <div class="card-body">
                        @livewire('cliente-contrato-table', ['Cliente' => $model])
                    </div>
                </div>
            </div>
        </div>
    @endif
@endsection
@section('js')
    <script>
        var telefonos = {{ $telefonos > 0 ? $telefonos : 1 }};

        $(function() {
            $('[data-toggle="tooltip"]').tooltip();
        });

        function agregarFila() {
            telefonos++;
            var fila = '<tr><td>Teléfono #' + telefonos + '</td><td>' +
                '<input type="number" name="telefonos[]" class="form-control" required>' +
                '</td></tr>';
            $('#tabla_telefonos tbody').append(fila);
        }

        function eliminarFila() {
            if (telefonos == 1) return;
            $('#tabla_telefonos tbody tr:last').remove();
            telefonos--;
        }

        //Opciones de contratos
        function cambiarEstado(id, estado) {
            Swal.fire({
                title: "¿Desea " + (estado == 'A' ? "desactivar" : "activar") +
                    " este contrato del cliente actual?",
                // icon: "warning",
                iconHtml: '<i class="fa-solid ' + (estado == 'A' ? "fa-power-off" : "fa-recycle") + ' fs-xs"></i>',
                iconColor: (estado == 'A' ? "#dc3545" : "#28a745"),
                showCancelButton: !0,
                confirmButtonText: "Si",
                cancelButtonText: "No",
            }).then((result) => {
                if (result.value === true) {
                    mostrarCargando();
                    var CSRF_TOKEN = '{{ csrf_token() }}';
                    $.ajax({
                        type: 'DELETE',
                        url: "{{ $model->exists ? route('gestion.clientes.contratos.destroy', [$model->id, '']) : '' }}/" +
                            id,
                        data: {
                            _token: CSRF_TOKEN
                        },
                        dataType: 'JSON',
                        success: function(results) {
                            location.reload();
                        }
                    });

                }

            });
        }

        function mostrarCargando() {
            Swal.fire({
                title: 'Cambiando de estado...',
                html: 'Por favor espere...',
                allowOutsideClick: false,
                timerProgressBar: true,
                didOpen: () => {
                    Swal.showLoading()
                }
            })
        }
    </script>
@endsection