@extends('adminlte::page')

@section('title', 'Detalle de Venta')

@section('content_header')
    <h1>Detalle de Venta #{{ $venta->id }}</h1>
@stop

@section('content')
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <div>
                <a href="{{ route('admin.ventas.index') }}" class="btn btn-secondary btn-sm">
                    <i class="fas fa-arrow-left"></i> Volver
                </a>
            </div>
            <div>
                @can('admin.ventas.edit')
                    <a href="{{ route('admin.ventas.edit', $venta) }}" class="btn btn-warning btn-sm">
                        <i class="fas fa-edit"></i> Editar
                    </a>
                @endcan
                @can('admin.ventas.destroy')
                    <form action="{{ route('admin.ventas.destroy', $venta) }}"
                          method="POST"
                          style="display: inline-block;"
                          onsubmit="return confirm('¿Está seguro de eliminar esta venta? Esta acción no se puede deshacer.');">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-danger btn-sm">
                            <i class="fas fa-trash"></i> Eliminar
                        </button>
                    </form>
                @endcan
            </div>
        </div>
        <div class="card-body">
            <div class="row">
                <!-- Información de la Venta -->
                <div class="col-md-6">
                    <div class="card border-primary mb-3">
                        <div class="card-header bg-primary text-white">
                            <h5 class="mb-0"><i class="fas fa-hand-holding-usd"></i> Información de la Venta</h5>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-sm">
                                    <tr>
                                        <th width="40%">ID Venta:</th>
                                        <td>{{ $venta->id }}</td>
                                    </tr>
                                <tr>
                                    <th>Fecha de Creación:</th>
                                    <td>{{ $venta->created_at->format('d/m/Y H:i') }}</td>
                                </tr>
                                <tr>
                                    <th>Monto Vendido:</th>
                                    <td><strong>S/ {{ number_format($venta->monto_vendido, 2) }}</strong></td>
                                </tr>
                                <tr>
                                    <th>Total Pagado:</th>
                                    <td><strong class="text-success">S/ {{ number_format($venta->total_pagado, 2) }}</strong></td>
                                </tr>
                                <tr>
                                    <th>Saldo Pendiente:</th>
                                    <td><strong class="text-{{ $venta->restante > 0 ? 'danger' : 'success' }}">S/ {{ number_format($venta->restante, 2) }}</strong></td>
                                </tr>
                                <tr>
                                    <th>Porcentaje Pagado:</th>
                                    <td>
                                        <div class="progress" style="height: 20px;">
                                            <div class="progress-bar bg-{{ $venta->estado_pago_badge_class }}"
                                                 role="progressbar"
                                                 style="width: {{ $venta->porcentaje_pagado }}%"
                                                 aria-valuenow="{{ $venta->porcentaje_pagado }}"
                                                 aria-valuemin="0"
                                                 aria-valuemax="100">
                                                {{ number_format($venta->porcentaje_pagado, 1) }}%
                                            </div>
                                        </div>
                                        <small class="text-muted">{{ $venta->estado_pago_texto }}</small>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Estado de Pago:</th>
                                    <td>
                                        <span class="badge badge-{{ $venta->estado_pago_badge_class }}">
                                            {{ $venta->estado_pago_texto }}
                                        </span>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Estado del Pedido:</th>
                                    <td>
                                        <span class="badge badge-{{ $venta->estado_pedido == 'entregado' ? 'success' : ($venta->estado_pedido == 'cancelado' ? 'danger' : ($venta->estado_pedido == 'en_proceso' ? 'warning' : 'info')) }}">
                                            {{ ucfirst(str_replace('_', ' ', $venta->estado_pedido)) }}
                                        </span>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Estado de Entrega:</th>
                                    <td>
                                        <span class="badge badge-{{ $venta->estado_entrega_badge_class ?? 'secondary' }}">
                                            {{ $venta->estado_entrega_texto ?? 'Registro Creado' }}
                                        </span>
                                    </td>
                                </tr>
                                @if($venta->codigo_seguimiento)
                                <tr>
                                    <th>Código de Seguimiento:</th>
                                    <td>
                                        <strong class="text-primary">{{ $venta->codigo_seguimiento }}</strong>
                                    </td>
                                </tr>
                                @endif
                                @php
                                    // Calcular Total Precio Base de la cotización
                                    $totalPrecioBase = 0;
                                    foreach ($venta->cotizacion->productos as $productoCotizacion) {
                                        $precioBase = $productoCotizacion->precio_base_cotizacion ?? $productoCotizacion->producto->precio_base ?? 0;
                                        $totalPrecioBase += $productoCotizacion->cantidad * $precioBase;
                                    }
                                @endphp
                                <tr>
                                    <th>Total Precio Base:</th>
                                    <td>
                                        <strong>S/ {{ number_format($totalPrecioBase, 2) }}</strong>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Total de Gastos:</th>
                                    <td>
                                        <strong class="text-danger">S/ {{ number_format($venta->total_gastos, 2) }}</strong>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Margen Bruto:</th>
                                    <td>
                                        <span class="text-{{ ($venta->margen_bruto_con_transporte ?? 0) >= 0 ? 'success' : 'danger' }}">
                                            <strong>S/ {{ number_format($venta->margen_bruto_con_transporte ?? 0, 2) }}</strong>
                                        </span>
                                        <br>
                                        <small class="text-muted">Monto Vendido - (Total Precio Base + Total Gastos)</small>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Margen Neto:</th>
                                    <td>
                                        <span class="text-{{ ($venta->margen_neto ?? 0) >= 0 ? 'success' : 'danger' }}">
                                            <strong>S/ {{ number_format($venta->margen_neto ?? 0, 2) }}</strong>
                                        </span>
                                        <br>
                                        <small class="text-muted">Margen Bruto - Total Gastos</small>
                                    </td>
                                </tr>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Información de Entrega -->
                <div class="col-md-6">
                    <div class="card border-success mb-3">
                        <div class="card-header bg-success text-white">
                            <h5 class="mb-0"><i class="fas fa-truck"></i> Información de Entrega</h5>
                        </div>
                        <div class="card-body">
                            @if($venta->direccion_entrega || $venta->distrito || $venta->provincia || $venta->ciudad)
                                <div class="table-responsive">
                                    <table class="table table-sm">
                                    @if($venta->direccion_entrega)
                                        <tr>
                                            <th width="40%">Dirección:</th>
                                            <td>{{ $venta->direccion_entrega }}</td>
                                        </tr>
                                    @endif
                                    @if($venta->distrito)
                                        <tr>
                                            <th>Distrito:</th>
                                            <td>{{ $venta->distrito }}</td>
                                        </tr>
                                    @endif
                                    @if($venta->provincia)
                                        <tr>
                                            <th>Provincia:</th>
                                            <td>{{ $venta->provincia }}</td>
                                        </tr>
                                    @endif
                                    @if($venta->ciudad)
                                        <tr>
                                            <th>Ciudad:</th>
                                            <td>{{ $venta->ciudad }}</td>
                                        </tr>
                                    @endif
                                    @if($venta->codigo_postal)
                                        <tr>
                                            <th>Código Postal:</th>
                                            <td>{{ $venta->codigo_postal }}</td>
                                        </tr>
                                    @endif
                                    @if($venta->referencia)
                                        <tr>
                                            <th>Referencia:</th>
                                            <td>{{ $venta->referencia }}</td>
                                        </tr>
                                    @endif
                                    </table>
                                </div>
                            @else
                                <p class="text-muted mb-0">No hay información de entrega registrada</p>
                            @endif
                        </div>
                    </div>
                </div>

                <!-- Gastos de la Venta -->
                <div class="col-md-6">
                    <div class="card border-warning mb-3">
                        <div class="card-header bg-warning text-white">
                            <h5 class="mb-0"><i class="fas fa-receipt"></i> Gastos de la Venta</h5>
                        </div>
                        <div class="card-body">
                            @if($venta->gastos->count() > 0)
                                <div class="table-responsive" style="max-height: 300px; overflow-y: auto;">
                                    <table class="table table-sm table-bordered">
                                        <thead>
                                            <tr>
                                                <th>Descripción</th>
                                                <th class="text-right">Monto</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach($venta->gastos as $gasto)
                                                <tr>
                                                    <td>
                                                        <strong>{{ $gasto->descripcion }}</strong>
                                                        @if($gasto->fecha)
                                                            <br><small class="text-muted">{{ $gasto->fecha->format('d/m/Y') }}</small>
                                                        @endif
                                                        @if($gasto->observaciones)
                                                            <br><small class="text-muted">{{ $gasto->observaciones }}</small>
                                                        @endif
                                                    </td>
                                                    <td class="text-right">
                                                        <strong>S/ {{ number_format($gasto->monto, 2) }}</strong>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <th>Total:</th>
                                                <th class="text-right text-danger">S/ {{ number_format($venta->total_gastos, 2) }}</th>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                            @else
                                <p class="text-muted mb-0">No hay gastos registrados</p>
                            @endif
                        </div>
                    </div>
                </div>

                <!-- Historial de Pagos -->
                <div class="col-md-12">
                    <div class="card border-info mb-3">
                        <div class="card-header bg-info text-white d-flex justify-content-between align-items-center">
                            <h5 class="mb-0"><i class="fas fa-money-bill-wave"></i> Historial de Pagos</h5>
                            @can('admin.ventas.pagos.create')
                                @if($venta->restante > 0)
                                    <button type="button" class="btn btn-light btn-sm" data-toggle="modal" data-target="#modalAgregarPago">
                                        <i class="fas fa-plus"></i> Agregar Pago
                                    </button>
                                @endif
                            @endcan
                        </div>
                        <div class="card-body">
                            <div class="row mb-3">
                                <div class="col-md-3">
                                    <strong>Total Vendido:</strong><br>
                                    <span class="h5">S/ {{ number_format($venta->monto_vendido, 2) }}</span>
                                </div>
                                <div class="col-md-3">
                                    <strong>Total Pagado:</strong><br>
                                    <span class="h5 text-success">S/ {{ number_format($venta->total_pagado, 2) }}</span>
                                </div>
                                <div class="col-md-3">
                                    <strong>Saldo Pendiente:</strong><br>
                                    <span class="h5 text-{{ $venta->restante > 0 ? 'danger' : 'success' }}">S/ {{ number_format($venta->restante, 2) }}</span>
                                </div>
                                <div class="col-md-3">
                                    <strong>Porcentaje Pagado:</strong><br>
                                    <span class="h5">{{ number_format($venta->porcentaje_pagado, 1) }}%</span>
                                </div>
                            </div>
                            @if($venta->pagos->count() > 0)
                                <div class="table-responsive">
                                    <table class="table table-sm table-bordered table-hover">
                                        <thead>
                                            <tr>
                                                <th>Fecha de Pago</th>
                                                <th>Monto</th>
                                                <th>Método de Pago</th>
                                                <th>Número de Comprobante</th>
                                                <th>Observaciones</th>
                                                <th>Registrado por</th>
                                                <th>Fecha de Registro</th>
                                                @can('admin.ventas.pagos.delete')
                                                    <th>Acciones</th>
                                                @endcan
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach($venta->pagos as $pago)
                                                <tr>
                                                    <td>{{ $pago->fecha_pago->format('d/m/Y') }}</td>
                                                    <td><strong>S/ {{ number_format($pago->monto, 2) }}</strong></td>
                                                    <td>{{ $pago->metodo_pago_texto }}</td>
                                                    <td>{{ $pago->numero_comprobante ?? '-' }}</td>
                                                    <td>{{ $pago->observaciones ?? '-' }}</td>
                                                    <td>{{ $pago->usuario->name ?? 'N/A' }}</td>
                                                    <td>{{ $pago->created_at->format('d/m/Y H:i') }}</td>
                                                    @can('admin.ventas.pagos.delete')
                                                        <td>
                                                            <form action="{{ route('admin.ventas.pagos.destroy', $pago) }}"
                                                                  method="POST"
                                                                  class="d-inline eliminar-pago-form"
                                                                  data-pago-id="{{ $pago->id }}">
                                                                @csrf
                                                                @method('DELETE')
                                                                <button type="submit"
                                                                        class="btn btn-sm btn-danger"
                                                                        onclick="return confirm('¿Está seguro de eliminar este pago? Esta acción no se puede deshacer.');">
                                                                    <i class="fas fa-trash"></i>
                                                                </button>
                                                            </form>
                                                        </td>
                                                    @endcan
                                                </tr>
                                            @endforeach
                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <th colspan="1" class="text-right">Total:</th>
                                                <th class="text-success">S/ {{ number_format($venta->total_pagado, 2) }}</th>
                                                <th colspan="{{ auth()->user()->can('admin.ventas.pagos.delete') ? '6' : '5' }}"></th>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                            @else
                                <p class="text-muted mb-0">No hay pagos registrados</p>
                            @endif
                        </div>
                    </div>
                </div>

                <!-- Información de Cotización -->
                <div class="col-md-12">
                    <div class="card border-success mb-3">
                        <div class="card-header bg-success text-white">
                            <h5 class="mb-0"><i class="fas fa-file-invoice"></i> Cotización Asociada</h5>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-3">
                                    <strong>Número:</strong><br>
                                    <a href="{{ route('admin.cotizaciones.show', $venta->cotizacion) }}" target="_blank">
                                        {{ $venta->cotizacion->numero_cotizacion }}
                                    </a>
                                </div>
                                <div class="col-md-3">
                                    <strong>Cliente:</strong><br>
                                    {{ $venta->cotizacion->cliente->user->name ?? 'N/A' }}
                                </div>
                                <div class="col-md-3">
                                    <strong>Fecha Emisión:</strong><br>
                                    {{ $venta->cotizacion->fecha_emision->format('d/m/Y') }}
                                </div>
                                <div class="col-md-3">
                                    <strong>Estado:</strong><br>
                                    <span class="badge badge-{{ $venta->cotizacion->estado == 'aprobada' ? 'success' : 'danger' }}">
                                        {{ ucfirst($venta->cotizacion->estado) }}
                                    </span>
                                </div>
                            </div>
                            <div class="row mt-3">
                                <div class="col-md-3">
                                    <strong>Monto Cotizado:</strong><br>
                                    S/ {{ number_format($venta->cotizacion->total, 2) }}
                                </div>
                                <div class="col-md-9">
                                    <strong>Nota de la Venta:</strong><br>
                                    {{ $venta->nota ?? 'Sin observaciones' }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Productos de la Cotización -->
                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h5 class="mb-0"><i class="fas fa-boxes"></i> Productos de la Cotización</h5>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>Código</th>
                                            <th>Descripción</th>
                                            <th>Cantidad</th>
                                            <th>Precio Unitario</th>
                                            <th>Subtotal</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($venta->cotizacion->productos as $index => $productoCotizacion)
                                            <tr>
                                                <td>{{ $index + 1 }}</td>
                                                <td>{{ $productoCotizacion->producto->codigo_producto ?? 'N/A' }}</td>
                                                <td>{{ $productoCotizacion->producto->descripcion ?? 'N/A' }}</td>
                                                <td>{{ $productoCotizacion->cantidad }}</td>
                                                <td>S/ {{ number_format($productoCotizacion->precio_unitario, 2) }}</td>
                                                <td>S/ {{ number_format($productoCotizacion->subtotal, 2) }}</td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                    <tfoot>
                                        <tr>
                                            <th colspan="5" class="text-right">Total:</th>
                                            <th>S/ {{ number_format($venta->cotizacion->total, 2) }}</th>
                                        </tr>
                                    </tfoot>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal para Agregar Pago -->
    @can('admin.ventas.pagos.create')
    <div class="modal fade" id="modalAgregarPago" tabindex="-1" role="dialog" aria-labelledby="modalAgregarPagoLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header bg-info text-white">
                    <h5 class="modal-title" id="modalAgregarPagoLabel">
                        <i class="fas fa-money-bill-wave"></i> Agregar Pago
                    </h5>
                    <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="formAgregarPago">
                    <div class="modal-body">
                        <div class="alert alert-info">
                            <strong>Saldo Pendiente:</strong> S/ <span id="saldoPendiente">{{ number_format($venta->restante, 2) }}</span>
                        </div>
                        <div class="form-group">
                            <label for="monto">Monto <span class="text-danger">*</span></label>
                            <input type="number"
                                   class="form-control"
                                   id="monto"
                                   name="monto"
                                   step="0.01"
                                   min="0.01"
                                   max="{{ $venta->restante }}"
                                   required>
                            <small class="form-text text-muted">Máximo: S/ {{ number_format($venta->restante, 2) }}</small>
                        </div>
                        <div class="form-group">
                            <label for="metodo_pago">Método de Pago <span class="text-danger">*</span></label>
                            <select class="form-control" id="metodo_pago" name="metodo_pago" required>
                                <option value="efectivo">Efectivo</option>
                                <option value="transferencia">Transferencia</option>
                                <option value="tarjeta">Tarjeta</option>
                                <option value="cheque">Cheque</option>
                                <option value="deposito">Depósito</option>
                                <option value="otro">Otro</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="numero_comprobante">Número de Comprobante</label>
                            <input type="text"
                                   class="form-control"
                                   id="numero_comprobante"
                                   name="numero_comprobante"
                                   maxlength="100"
                                   placeholder="Número de transferencia, cheque, comprobante, etc.">
                        </div>
                        <div class="form-group">
                            <label for="fecha_pago">Fecha de Pago <span class="text-danger">*</span></label>
                            <input type="date"
                                   class="form-control"
                                   id="fecha_pago"
                                   name="fecha_pago"
                                   value="{{ date('Y-m-d') }}"
                                   required>
                        </div>
                        <div class="form-group">
                            <label for="observaciones">Observaciones</label>
                            <textarea class="form-control"
                                      id="observaciones"
                                      name="observaciones"
                                      rows="3"
                                      maxlength="500"
                                      placeholder="Observaciones adicionales..."></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                        <button type="submit" class="btn btn-info">
                            <i class="fas fa-save"></i> Guardar Pago
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    @endcan
@stop

@section('js')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        $(document).ready(function() {
            // Formulario para agregar pago
            $('#formAgregarPago').on('submit', function(e) {
                e.preventDefault();

                const form = $(this);
                const submitBtn = form.find('button[type="submit"]');
                const ventaId = {{ $venta->id }};

                // Validar monto
                const monto = parseFloat($('#monto').val());
                const saldoPendiente = parseFloat({{ $venta->restante }});

                if (monto > saldoPendiente) {
                    Swal.fire('Error', 'El monto no puede exceder el saldo pendiente (S/ ' + saldoPendiente.toFixed(2) + ')', 'error');
                    return;
                }

                if (monto <= 0) {
                    Swal.fire('Error', 'El monto debe ser mayor a cero', 'error');
                    return;
                }

                submitBtn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Guardando...');

                $.ajax({
                    url: '{{ route("admin.ventas.pagos.store", $venta) }}',
                    method: 'POST',
                    data: form.serialize(),
                    headers: {
                        'X-CSRF-TOKEN': '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response.success) {
                            Swal.fire({
                                icon: 'success',
                                title: '¡Éxito!',
                                text: response.message,
                                timer: 2000,
                                showConfirmButton: false
                            }).then(() => {
                                location.reload();
                            });
                        } else {
                            Swal.fire('Error', response.message || 'Error al agregar el pago', 'error');
                            submitBtn.prop('disabled', false).html('<i class="fas fa-save"></i> Guardar Pago');
                        }
                    },
                    error: function(xhr) {
                        let errorMessage = 'Error al agregar el pago';
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            errorMessage = xhr.responseJSON.message;
                        }
                        Swal.fire('Error', errorMessage, 'error');
                        submitBtn.prop('disabled', false).html('<i class="fas fa-save"></i> Guardar Pago');
                    }
                });
            });

            // Eliminar pago con AJAX
            $('.eliminar-pago-form').on('submit', function(e) {
                e.preventDefault();

                const form = $(this);
                const pagoId = form.data('pago-id');

                Swal.fire({
                    title: '¿Está seguro?',
                    text: 'Esta acción eliminará el pago y no se puede deshacer.',
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#d33',
                    cancelButtonColor: '#3085d6',
                    confirmButtonText: 'Sí, eliminar',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: form.attr('action'),
                            method: 'POST',
                            data: {
                                _method: 'DELETE',
                                _token: '{{ csrf_token() }}'
                            },
                            success: function(response) {
                                if (response.success) {
                                    Swal.fire({
                                        icon: 'success',
                                        title: '¡Éxito!',
                                        text: response.message,
                                        timer: 2000,
                                        showConfirmButton: false
                                    }).then(() => {
                                        location.reload();
                                    });
                                } else {
                                    Swal.fire('Error', response.message || 'Error al eliminar el pago', 'error');
                                }
                            },
                            error: function(xhr) {
                                let errorMessage = 'Error al eliminar el pago';
                                if (xhr.responseJSON && xhr.responseJSON.message) {
                                    errorMessage = xhr.responseJSON.message;
                                }
                                Swal.fire('Error', errorMessage, 'error');
                            }
                        });
                    }
                });
            });
        });
    </script>
@stop