@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-header bg-primary text-white">
                    <h5 class="card-title"><i class="fa fa-user"></i> Datos del Cliente</h5>
                </div>

                <div class="card-body">

                    <form id="editFormCliente" method="POST">
                        @csrf
                        @method('PUT')

                        <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>

                        <div class="form-group">
                            <div class="row">
                                <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 class="col">
                                    <div class="form-group">
                                        <label for="tipo_deuda">Tipo de deuda</label>
                                        <select id="tipo_deuda" name="tipo_deuda" class="form-control">
                                            <option value="0">Saldo pendiente historico</option>
                                            <option value="1">Saldo pendiente actual</option>
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col">
                                    <div class="form-group">
                                        <label for="tipo_cliente">Tipo de Cliente</label>
                                        <select id="tipo_cliente" name="tipo_cliente" class="form-control" required>
                                            <option value="despacho" {{ $cliente->tipo_cliente == 'despacho' ? 'selected' : '' }}>Cliente de Despacho</option>
                                            <option value="stock" {{ $cliente->tipo_cliente == 'stock' ? 'selected' : '' }}>Cliente STOCK (Almacén)</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!--precios del cliente-->
                        <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>

                    </form>

                </div>

                <div class="card-footer">
                    <button type="button" id="btnEditCliente" class="btn btn-success mr-2"> <i class="fa fa-save"></i> Actualizar</button>
                    <a href="{{ route('clientes.index') }}" class="btn btn-warning"> <i class="fa fa-list"></i> Lista de clientes</a>
                </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 btn = $('#btnEditCliente');
                // Desactiva el botón
                btn.prop('disabled', true);
                btn.text('Actualizando cliente...');

                const formData = new FormData($('#editFormCliente')[0]);
                let clienteId = $('#cliente_id').val();

                // Agregar el método PUT al FormData
                formData.append('_method', 'PUT');

                $.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: response.message || '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