@extends('adminlte::page')

@section('title', 'Editar Cliente')

@section('content_header')
    <h1>Editar cliente</h1>
@stop

@section('content')
    <div class="row">
        <div class="col-md-6">
            <div class="card">

                <div class="card-body">

                    <form id="editFormCliente" method="POST">
                        @csrf

                        <input type="hidden" id="cliente_id" value="{{ $cliente->id }}">

                        <div class="row">
                            <div class="col">
                                <div class="form-group">
                                    <label for="tipo_documento">Tipo de Documento</label>
                                    <select id="tipo_documento" name="tipo_documento" class="form-control" required>
                                        <option value="0">SIN DOCUMENTO</option>
                                        <option value="1">DNI</option>
                                        <option value="2">RUC</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label for="documento">Documento</label>
                                    <div class="input-group">
                                        <input type="text" id="documento" name="documento" class="form-control" required
                                               value="{{ $cliente->documento }}">
                                        <div class="input-group-append">
                                            <button type="button" id="searchDocumentBtn"
                                                    class="btn btn-outline-secondary">
                                                <i class="fa fa-search"></i> Buscar
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col">

                                <div class="form-group">
                                    <label for="nombre_comercial">Nombre Comercial</label>
                                    <input type="text" id="nombre_comercial" name="nombre_comercial"
                                           class="form-control"
                                           required value="{{ $cliente->nombre_comercial }}">
                                </div>
                            </div>

                            <div class="col">

                                <div class="form-group">
                                    <label for="razon_social">Razón Social</label>
                                    <input type="text" id="razon_social" name="razon_social" class="form-control"
                                           required value="{{ $cliente->razon_social }}">
                                </div>
                            </div>
                        </div>


                        <div class="form-group">
                            <label for="direccion">Dirección</label>
                            <input type="text" id="direccion" name="direccion" class="form-control" required
                                   value="{{ $cliente->direccion }}">
                        </div>

                        <div class="form-group">
                            <label for="departamento">Departamento</label>
                            <input type="text" id="departamento" name="departamento" class="form-control" required
                                   value="{{ $cliente->departamento }}">
                        </div>

                        <div class="form-group">
                            <label for="provincia">Provincia</label>
                            <input type="text" id="provincia" name="provincia" class="form-control" required
                                   value="{{ $cliente->provincia }}">
                        </div>

                        <div class="form-group">
                            <label for="distrito">Distrito</label>
                            <input type="text" id="distrito" name="distrito" class="form-control" required
                                   value="{{ $cliente->distrito }}">
                        </div>


                        <div class="row">

                            <div class="col">
                                <div class="form-group">
                                    <label for="email">Email</label>
                                    <input type="email" id="email" name="email" class="form-control" required
                                           value="{{ $cliente->email }}">
                                </div>
                            </div>

                            <div class="col">
                                <div class="form-group">
                                    <label for="celular">Celular</label>
                                    <input type="text" id="celular" name="celular" class="form-control" required
                                           value="{{ $cliente->celular }}">
                                </div>

                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label for="celular">Deuda Anterior</label>
                                    <input type="number" id="deuda_anterior" name="deuda_anterior" class="form-control"
                                           required
                                           value="{{ $cliente->deuda_anterior }}">
                                </div>

                            </div>
                        </div>

                        <div class="row">
                            <div class="col">
                                <div class="table-responsive">
                                    <table class="table">
                                        <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>Presentación</th>
                                            <th>Tipo</th>
                                            <th>Precio</th>
                                        </tr>
                                        </thead>
                                        <tbody>

                                        @foreach($cliente->precios as $precio)
                                            <tr>
                                                <td>
                                                    <input
                                                        type="hidden" class="form-control" name="ids[]"
                                                        value="{{$precio->id}}"
                                                        readonly>
                                                </td>
                                                <td>
                                                    <input type="text" class="form-control"
                                                           value="{{$precio->presentacion_pollo->descripcion}}"
                                                           readonly>
                                                </td>
                                                <td>
                                                    <input type="text" class="form-control"
                                                           value="{{$precio->tipo_pollo->descripcion}}" readonly>
                                                </td>
                                                <td>
                                                    <input type="number"
                                                           name="prices[]"
                                                           class="form-control"
                                                           value="{{$precio->precio}}">
                                                </td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            @method('PUT')
                            <button type="button" id="btnEditCliente" class="btn btn-success mr-2">Editar</button>
                            <a href="{{ route('clientes.index') }}" class="btn btn-primary">Lista de clientes</a>
                        </div>

                    </form>

                </div>
            </div>
        </div>
    </div>
@stop

@section('css')
    {{-- <link rel="stylesheet" href="/css/admin_custom.css"> --}}
@stop

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        $(document).ready(function () {

            $('#btnEditCliente').click(function (e) {
                e.preventDefault();
                const formData = new FormData($('#editFormCliente')[0]);
                let clienteId = $('#cliente_id').val();

                $.ajax({
                    type: "POST",
                    url: "{{ route('clientes.update', ['cliente' => '__CLIENTE_ID__']) }}".replace(
                        '__CLIENTE_ID__', clienteId),
                    data: formData,
                    processData: false,
                    contentType: false,
                    dataType: "json",
                    success: function (response) {

                        if (response.success) {
                            Swal.fire({
                                title: 'Éxito!',
                                text: 'Cliente editado correctamente.',
                                icon: 'success',
                                confirmButtonText: 'OK'
                            }).then((result) => {
                                if (result.isConfirmed) {
                                    window.location.href = "{{ route('clientes.index') }}"; // Redirigir a la lista de clientes
                                }
                            });
                        } else {
                            Swal.fire({
                                title: 'Error!',
                                text: response.message || 'Ocurrió un error al editar el cliente.',
                                icon: 'error',
                                confirmButtonText: 'OK'
                            });
                        }

                    },
                    error: function (xhr, status, error) {
                        console.error(xhr.responseText);
                        alert('Ocurrió un error: ' + xhr.responseText);
                    }
                });


            });

            $('#searchDocumentBtn').on('click', function () {
                let documento = $('#documento').val();
                let tipoDocumento = $('#tipo_documento').val();

                $.ajax({
                    url: "{{ route('clientes.search') }}",
                    type: 'POST',
                    data: {
                        documento: documento,
                        tipo_documento: tipoDocumento,
                        _token: "{{ csrf_token() }}"
                    },
                    success: function (response) {
                        if (response.success) {
                            $('#nombre_comercial').val(response.data.razon_social);
                            $('#razon_social').val(response.data.razon_social);
                            $('#direccion').val(response.data.direccion);
                            $('#departamento').val(response.data.departamento);
                            $('#provincia').val(response.data.provincia);
                            $('#distrito').val(response.data.distrito);

                            Swal.fire({
                                title: 'Información encontrada',
                                text: 'Datos actualizados.',
                                icon: 'info',
                                confirmButtonText: 'OK'
                            });
                        } else {
                            Swal.fire({
                                title: 'Error!',
                                text: response.message,
                                icon: 'error',
                                confirmButtonText: 'OK'
                            });
                        }
                    },
                    error: function (xhr) {
                        Swal.fire({
                            title: 'Error!',
                            text: 'No se pudo realizar la búsqueda.',
                            icon: 'error',
                            confirmButtonText: 'OK'
                        });
                    }
                });
            });


        });
    </script>
@stop