@extends('layouts.admin')

@section('title', 'Caja')

@section('content')
<div class="d-flex flex-wrap justify-content-between align-items-start gap-3 mb-4">
    <div>
        <h1 class="h3 mb-1">Caja diaria</h1>
        <p class="text-secondary mb-0">Apertura, egresos, movimientos y cierres</p>
    </div>
    <div class="d-flex flex-wrap gap-2">
        @if(! $open)
            @if(auth()->user()->hasPermission('cash.open'))
                <button class="btn btn-success" type="button" data-bs-toggle="modal" data-bs-target="#modalOpenCash">
                    <i class="bi bi-safe"></i> Abrir caja
                </button>
            @endif
        @else
            @if(auth()->user()->hasPermission('cash.movements.create'))
                <button class="btn btn-outline-warning" type="button" data-bs-toggle="modal" data-bs-target="#modalExpense">
                    <i class="bi bi-dash-circle"></i> Egreso
                </button>
                <button class="btn btn-outline-primary" type="button" data-bs-toggle="modal" data-bs-target="#modalMovement">
                    <i class="bi bi-arrow-left-right"></i> Movimiento
                </button>
            @endif
            @if(auth()->user()->hasPermission('cash.close'))
                <button class="btn btn-outline-danger" type="button" data-bs-toggle="modal" data-bs-target="#modalCloseCash">
                    <i class="bi bi-safe2"></i> Cerrar caja
                </button>
            @endif
        @endif
    </div>
</div>

@if(! $open)
    <div class="alert alert-light border mb-4">
        <div class="fw-semibold mb-1">¿Encontró dinero después de cerrar la caja?</div>
        <p class="small text-secondary mb-2 mb-md-3">
            Si alguien olvidó registrar un cobro o apareció efectivo después del cierre:
            <strong>abra caja</strong> y use <em>Movimiento → Ingreso extra</em> (o la opción de dinero olvidado),
            indicando que corresponde al cierre anterior. Queda documentado en el nuevo turno.
        </p>
        @if(auth()->user()->hasPermission('cash.open'))
            <button class="btn btn-sm btn-success" type="button" data-bs-toggle="modal" data-bs-target="#modalOpenCash">
                Abrir caja para registrar
            </button>
        @endif
    </div>
@endif

@if($open)
    @php
        $income = $open->movements->where('direction', 'IN')->sum(fn ($m) => (float) $m->amount);
        $out = $open->movements->where('direction', 'OUT')->sum(fn ($m) => (float) $m->amount);
        $expenses = $open->movements->where('type', \App\Enums\CashMovementType::EXPENSE)->sum(fn ($m) => (float) $m->amount);
        $expected = (float) $open->opening_balance + $income - $out;
    @endphp

    <div class="alert alert-info border-0 mb-4">
        Revise los movimientos del turno. Cuando todo cuadre, use <strong>Cerrar caja</strong>
        e indique el efectivo contado (puede usar el saldo esperado o escribir el monto real si falta o sobra).
    </div>

    <div class="row g-3 mb-4">
        <div class="col-md-3">
            <div class="card metric h-100">
                <div class="card-body">
                    <span class="text-secondary">Saldo inicial</span>
                    <div class="fs-4 fw-bold mt-2">${{ number_format((float) $open->opening_balance, 2) }}</div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card metric h-100">
                <div class="card-body">
                    <span class="text-secondary">Ingresos</span>
                    <div class="fs-4 fw-bold mt-2 text-success">${{ number_format($income, 2) }}</div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card metric h-100">
                <div class="card-body">
                    <span class="text-secondary">Egresos</span>
                    <div class="fs-4 fw-bold mt-2" style="color:#FFA540">${{ number_format($expenses, 2) }}</div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card metric h-100">
                <div class="card-body">
                    <span class="text-secondary">Esperado actual</span>
                    <div class="fs-4 fw-bold mt-2">${{ number_format($expected, 2) }}</div>
                </div>
            </div>
        </div>
    </div>

    <div class="card mb-4">
        <div class="card-header bg-white d-flex justify-content-between align-items-center">
            <h2 class="h6 mb-0">Movimientos del turno</h2>
            <div class="d-flex align-items-center gap-3">
                <a href="{{ route('expenses.index') }}" class="small">Ver todos los egresos</a>
                <span class="text-secondary small">Salidas totales: ${{ number_format($out, 2) }}</span>
            </div>
        </div>
        <div class="table-responsive">
            <table class="table align-middle mb-0">
                <thead>
                    <tr>
                        <th>Hora</th>
                        <th>Tipo</th>
                        <th>Cliente</th>
                        <th>Categoría</th>
                        <th>Descripción</th>
                        <th>Dirección</th>
                        <th>Monto</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($open->movements->sortByDesc('created_at') as $m)
                        <tr>
                            <td>{{ $m->created_at->format('H:i') }}</td>
                            <td>
                                <span class="badge text-bg-{{ $m->type === \App\Enums\CashMovementType::EXPENSE ? 'warning' : ($m->direction === 'IN' ? 'success' : 'secondary') }}">
                                    {{ $m->type->label() }}
                                </span>
                            </td>
                            <td>{{ $m->clientLabel() }}</td>
                            <td>{{ $m->category?->label() ?? '—' }}</td>
                            <td>{{ $m->description }}</td>
                            <td>{{ $m->direction === 'IN' ? 'Entrada' : 'Salida' }}</td>
                            <td class="{{ $m->direction === 'OUT' ? 'text-danger' : 'text-success' }}">
                                {{ $m->direction === 'OUT' ? '−' : '+' }}${{ number_format((float) $m->amount, 2) }}
                            </td>
                            <td class="text-end">
                                @if($m->viewableAttachmentPath())
                                    <a class="btn btn-sm btn-outline-primary" href="{{ route('cash.movements.attachment', $m) }}" target="_blank">
                                        <i class="bi bi-eye"></i> Ver
                                    </a>
                                @endif
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="8" class="text-center py-4 text-secondary">Sin movimientos registrados.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

    @include('cash.partials.pending-orders')
@else
    <div class="card p-4 mb-4">
        <p class="text-secondary mb-0">No hay caja abierta. Use el botón <strong>Abrir caja</strong> para iniciar el turno. Los egresos del menú <em>Nuevo</em> también requieren caja abierta.</p>
    </div>
@endif

<h2 class="h5 mb-3">Historial de cierres</h2>
<div class="card">
    <div class="table-responsive">
        <table class="table align-middle mb-0">
            <thead>
                <tr>
                    <th>Usuario</th>
                    <th>Apertura</th>
                    <th>Cierre</th>
                    <th>Esperado</th>
                    <th>Contado</th>
                    <th>Diferencia</th>
                    <th>Estado</th>
                </tr>
            </thead>
            <tbody>
                @forelse($sessions as $s)
                    <tr>
                        <td>{{ $s->user->name }}</td>
                        <td>{{ $s->opened_at->format('d/m/Y H:i') }}</td>
                        <td>{{ $s->closed_at?->format('d/m/Y H:i') ?? '—' }}</td>
                        <td>{{ $s->expected_balance }}</td>
                        <td>{{ $s->counted_balance ?? '—' }}</td>
                        <td class="{{ (float) $s->difference !== 0.0 ? 'text-danger fw-bold' : '' }}">{{ $s->difference }}</td>
                        <td>{{ $s->status->value }}</td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="7" class="text-center py-5 text-secondary">Sin historial de cierres.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($sessions->hasPages())
        <div class="card-footer">{{ $sessions->links() }}</div>
    @endif
</div>

<div class="modal fade" id="modalOpenCash" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="POST" action="{{ route('cash.open') }}">
            @csrf
            <div class="modal-header">
                <h5 class="modal-title">Abrir caja</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <label class="form-label">Saldo inicial</label>
                <input class="form-control mb-3" type="number" step="0.0001" min="0" name="opening_balance" required>
                <label class="form-label">Observaciones</label>
                <textarea class="form-control" name="notes"></textarea>
            </div>
            <div class="modal-footer">
                <button class="btn btn-success" type="submit">Abrir caja</button>
            </div>
        </form>
    </div>
</div>

{{-- Egreso --}}
<div class="modal fade" id="modalExpense" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="POST" action="{{ route('expenses.store') }}" enctype="multipart/form-data">
            @csrf
            <div class="modal-header">
                <h5 class="modal-title">Nuevo egreso</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                @if(! $open)
                    <div class="alert alert-warning">Debes abrir la caja antes de registrar un egreso.</div>
                @endif
                @error('cash')
                    <div class="alert alert-danger">{{ $message }}</div>
                @enderror

                <label class="form-label">Categoría</label>
                <select class="form-select mb-3 @error('category') is-invalid @enderror" name="category" required @disabled(! $open)>
                    <option value="">Seleccione…</option>
                    @foreach(\App\Enums\ExpenseCategory::cases() as $cat)
                        <option value="{{ $cat->value }}" @selected(old('category') === $cat->value)>{{ $cat->label() }}</option>
                    @endforeach
                </select>
                @error('category')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror

                <label class="form-label">Monto</label>
                <input class="form-control mb-3 @error('amount') is-invalid @enderror" type="number" step="0.0001" min="0.0001" name="amount" value="{{ old('amount') }}" required @disabled(! $open)>
                @error('amount')<div class="invalid-feedback">{{ $message }}</div>@enderror

                <label class="form-label">Descripción</label>
                <textarea class="form-control mb-3 @error('description') is-invalid @enderror" name="description" required @disabled(! $open)>{{ old('description') }}</textarea>
                @error('description')<div class="invalid-feedback">{{ $message }}</div>@enderror

                <label class="form-label">Comprobante <span class="text-secondary">(opcional)</span></label>
                <input class="form-control @error('attachment') is-invalid @enderror" type="file" name="attachment" accept=".pdf,.jpg,.jpeg,.png,.webp" @disabled(! $open)>
                <div class="form-text">PDF o imagen, máx. 5 MB.</div>
                @error('attachment')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
            </div>
            <div class="modal-footer">
                <button class="btn btn-outline-secondary" type="button" data-bs-dismiss="modal">Cancelar</button>
                <button class="btn btn-primary" type="submit" @disabled(! $open)>Registrar egreso</button>
            </div>
        </form>
    </div>
</div>

@if($open)
<div class="modal fade" id="modalCloseCash" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="POST" action="{{ route('cash.close', $open) }}" id="formCloseCash">
            @csrf
            <div class="modal-header">
                <h5 class="modal-title">Cerrar caja</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="rounded-3 border p-3 mb-3 bg-light">
                    <div class="small text-secondary">Saldo esperado según movimientos</div>
                    <div class="fs-4 fw-bold" id="closeExpectedLabel">${{ number_format($expected, 2) }}</div>
                    <div class="small text-secondary mt-1">
                        Inicial ${{ number_format((float) $open->opening_balance, 2) }}
                        + ingresos ${{ number_format($income, 2) }}
                        − salidas ${{ number_format($out, 2) }}
                    </div>
                </div>

                <label class="form-label">¿Cuánto hay realmente en caja?</label>
                <div class="d-flex flex-wrap gap-2 mb-2">
                    <button class="btn btn-outline-primary btn-sm" type="button" id="btnUseExpected"
                        data-expected="{{ number_format($expected, 4, '.', '') }}">
                        Usar saldo esperado (${{ number_format($expected, 2) }})
                    </button>
                </div>
                <input
                    class="form-control mb-2"
                    type="number"
                    step="0.01"
                    min="0"
                    name="counted_balance"
                    id="countedBalance"
                    value="{{ old('counted_balance', number_format($expected, 2, '.', '')) }}"
                    required
                >
                <div class="form-text mb-3">Puede dejar el esperado o escribir el monto contado a mano si falta o sobra.</div>

                <div id="closeDiffBox" class="alert py-2 mb-3">
                    <span id="closeDiffText">Diferencia: $0.00 (cuadrado)</span>
                </div>

                <label class="form-label">Observaciones del cierre</label>
                <textarea class="form-control" name="notes" placeholder="Ej.: faltaron $5 por vuelto no registrado; sobró por aporte…">{{ old('notes') }}</textarea>
            </div>
            <div class="modal-footer">
                <button class="btn btn-outline-secondary" type="button" data-bs-dismiss="modal">Seguir revisando</button>
                <button class="btn btn-danger" type="submit">Confirmar cierre de caja</button>
            </div>
        </form>
    </div>
</div>

<div class="modal fade" id="modalMovement" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content" method="POST" action="{{ route('cash.movements.store', $open) }}">
            @csrf
            <div class="modal-header">
                <h5 class="modal-title">Movimiento de caja</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="alert alert-light border mb-3 small">
                    Los <strong>egresos</strong> (gastos del negocio) se registran con el botón <em>Egreso</em>.
                    Aquí: ingresos extras, dinero olvidado o correcciones de diferencia.
                </div>

                <label class="form-label mb-2">¿Qué va a registrar?</label>
                <div class="d-grid gap-2 mb-3">
                    <label class="border rounded p-3 mb-0" style="cursor:pointer">
                        <div class="form-check">
                            <input class="form-check-input" type="radio" name="type" id="movTypeIncome" value="{{ \App\Enums\CashMovementType::INCOME->value }}" checked>
                            <label class="form-check-label fw-semibold" for="movTypeIncome">Ingreso extra a caja</label>
                        </div>
                        <div class="small text-secondary mt-1 ms-4">
                            Entra dinero que <strong>no</strong> es cobro de un pedido. Ej.: aporte del dueño, cambio adicional.
                        </div>
                    </label>

                    <label class="border rounded p-3 mb-0" style="cursor:pointer">
                        <div class="form-check">
                            <input class="form-check-input" type="radio" name="type" id="movTypeForgotten" value="{{ \App\Enums\CashMovementType::INCOME->value }}" data-preset="forgotten">
                            <label class="form-check-label fw-semibold" for="movTypeForgotten">Dinero olvidado / encontrado</label>
                        </div>
                        <div class="small text-secondary mt-1 ms-4">
                            Efectivo que no se registró a tiempo (después de un cierre o un cobro olvidado). Queda como ingreso del turno actual.
                        </div>
                    </label>

                    @if(auth()->user()->hasPermission('cash.adjust'))
                        <label class="border rounded p-3 mb-0" style="cursor:pointer">
                            <div class="form-check">
                                <input class="form-check-input" type="radio" name="type" id="movTypeAdjIn" value="{{ \App\Enums\CashMovementType::AUTHORIZED_ADJUSTMENT_IN->value }}">
                                <label class="form-check-label fw-semibold" for="movTypeAdjIn">Corrección: faltaba dinero (+)</label>
                            </div>
                            <div class="small text-secondary mt-1 ms-4">
                                Al contar hay <strong>menos</strong> de lo esperado y autorizas <strong>sumar</strong> esa diferencia a la caja.
                            </div>
                        </label>

                        <label class="border rounded p-3 mb-0" style="cursor:pointer">
                            <div class="form-check">
                                <input class="form-check-input" type="radio" name="type" id="movTypeAdjOut" value="{{ \App\Enums\CashMovementType::AUTHORIZED_ADJUSTMENT_OUT->value }}">
                                <label class="form-check-label fw-semibold" for="movTypeAdjOut">Corrección: sobraba dinero (−)</label>
                            </div>
                            <div class="small text-secondary mt-1 ms-4">
                                Al contar hay <strong>más</strong> de lo esperado y autorizas <strong>restar</strong> esa diferencia de la caja.
                            </div>
                        </label>
                    @endif
                </div>

                <label class="form-label">Monto</label>
                <input class="form-control mb-3" type="number" step="0.0001" min="0.0001" name="amount" required>

                <label class="form-label">Motivo / descripción</label>
                <textarea class="form-control" name="description" id="movementDescription" required placeholder="Ej.: aporte de caja chica, cobro olvidado de Licorería X…"></textarea>
            </div>
            <div class="modal-footer">
                <button class="btn btn-outline-secondary" type="button" data-bs-dismiss="modal">Cancelar</button>
                <button class="btn btn-primary" type="submit">Registrar movimiento</button>
            </div>
        </form>
    </div>
</div>
@endif
@endsection

@push('scripts')
<script>
(() => {
    const expected = {{ json_encode(isset($expected) ? round($expected, 4) : null) }};
    const counted = document.getElementById('countedBalance');
    const diffBox = document.getElementById('closeDiffBox');
    const diffText = document.getElementById('closeDiffText');
    const btnExpected = document.getElementById('btnUseExpected');

    function refreshDiff() {
        if (!counted || expected === null || !diffText || !diffBox) return;
        const value = parseFloat(counted.value);
        if (Number.isNaN(value)) {
            diffText.textContent = 'Ingrese el monto contado';
            diffBox.className = 'alert alert-secondary py-2 mb-3';
            return;
        }
        const diff = Math.round((value - expected) * 100) / 100;
        if (Math.abs(diff) < 0.005) {
            diffText.textContent = 'Diferencia: $0.00 · Caja cuadrada';
            diffBox.className = 'alert alert-success py-2 mb-3';
        } else if (diff < 0) {
            diffText.textContent = `Faltante: $${Math.abs(diff).toFixed(2)} (hay menos que lo esperado)`;
            diffBox.className = 'alert alert-warning py-2 mb-3';
        } else {
            diffText.textContent = `Sobrante: $${diff.toFixed(2)} (hay más que lo esperado)`;
            diffBox.className = 'alert alert-info py-2 mb-3';
        }
    }

    btnExpected?.addEventListener('click', () => {
        counted.value = btnExpected.dataset.expected;
        refreshDiff();
    });
    counted?.addEventListener('input', refreshDiff);
    refreshDiff();

    const desc = document.getElementById('movementDescription');
    document.getElementById('movTypeForgotten')?.addEventListener('change', () => {
        if (!desc) return;
        if (!desc.value.trim()) {
            desc.value = 'Dinero olvidado / encontrado (cierre o cobro no registrado a tiempo)';
        }
        desc.focus();
    });
})();

@if($errors->hasAny(['cash', 'amount', 'category', 'description', 'attachment', 'counted_balance']) || session('open_expense_modal'))
    document.addEventListener('DOMContentLoaded', () => {
        const el = document.getElementById(@json($errors->has('counted_balance') || $errors->has('cash') ? 'modalCloseCash' : 'modalExpense'));
        if (el) new bootstrap.Modal(el).show();
    });
@endif
</script>
@endpush