@extends('layouts.app')

@section('title', 'Reporte Quincenal')

@section('content')
<div class="row">
    <div class="col-12">
        <h2 class="mb-4">Reporte Quincenal</h2>
    </div>
</div>

<!-- Selector -->
<div class="row mb-4">
    <div class="col-md-4">
        <form method="GET" class="d-flex gap-2">
            <select name="month_id" class="form-select" onchange="this.form.submit()">
                @foreach($months as $m)
                    <option value="{{ $m->id }}" {{ $month->id == $m->id ? 'selected' : '' }}>
                        {{ $m->name }} {{ $m->year }}
                    </option>
                @endforeach
            </select>
        </form>
    </div>
    <div class="col-md-4">
        <form method="GET" class="d-flex gap-2">
            <input type="hidden" name="month_id" value="{{ $month->id }}">
            <select name="biweekly" class="form-select" onchange="this.form.submit()">
                <option value="1" {{ $biweekly == 1 ? 'selected' : '' }}>1ra Quincena (1-15) - ANTICIPO</option>
                <option value="2" {{ $biweekly == 2 ? 'selected' : '' }}>2da Quincena (16-31) - LIQUIDACIÓN</option>
            </select>
        </form>
    </div>
    <div class="col-md-4 text-end">
        <a href="{{ route('reports.monthly', ['month_id' => $month->id]) }}" class="btn btn-outline-primary">Ver Mensual</a>
    </div>
</div>

@if($report)
    <!-- Resumen Quincenal -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card {{ $report['type'] === 'anticipo' ? 'border-success' : 'border-warning' }}">
                <div class="card-header {{ $report['type'] === 'anticipo' ? 'bg-success' : 'bg-warning' }} text-white">
                    <h5 class="mb-0">{{ $report['period'] }}</h5>
                    <small>{{ $report['description'] }}</small>
                </div>
                <div class="card-body">
                    <div class="row text-center">
                        @if($report['type'] === 'anticipo')
                            <div class="col-md-4">
                                <h6 class="text-muted">Mitad Sueldo</h6>
                                <h3>${{ number_format($report['biweekly_salary'], 2) }}</h3>
                            </div>
                            <div class="col-md-4">
                                <h6 class="text-muted">Comisiones del Mes</h6>
                                <h3 class="text-success">+${{ number_format($report['commission_amount'], 2) }}</h3>
                            </div>
                            <div class="col-md-4">
                                <h6 class="text-muted">Total ANTICIPO</h6>
                                <h2 class="text-success">${{ number_format($report['total_earning'], 2) }}</h2>
                            </div>
                        @else
                            <div class="col-md-4">
                                <h6 class="text-muted">Mitad Sueldo</h6>
                                <h3>${{ number_format($report['biweekly_salary'], 2) }}</h3>
                            </div>
                            <div class="col-md-4">
                                <h6 class="text-muted">Gastos Q{{ $biweekly }}</h6>
                                <h3 class="text-danger">-${{ number_format($report['expenses_q2'], 2) }}</h3>
                            </div>
                            <div class="col-md-4">
                                <h6 class="text-muted">Total LIQUIDACIÓN</h6>
                                <h2 class="{{ $report['total_earning'] >= 0 ? 'text-success' : 'text-danger' }}">${{ number_format($report['total_earning'], 2) }}</h2>
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Desglose de gastos -->
    @if(count($expenses) > 0)
    <div class="card mb-4">
        <div class="card-header">
            <h5>Gastos de la Quincena</h5>
        </div>
        <div class="card-body">
            <table class="table">
                <thead>
                    <tr>
                        <th>Fecha</th>
                        <th>Descripción</th>
                        <th>Tipo</th>
                        <th class="text-end">Monto</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($expenses as $expense)
                    <tr>
                        <td>{{ $expense->date->format('d/m/Y') }}</td>
                        <td>{{ $expense->description }}</td>
                        <td>
                            @if($expense->expense_type == 'q1')
                                <span class="badge bg-primary">Q1</span>
                            @elseif($expense->expense_type == 'q2')
                                <span class="badge bg-warning">Q2</span>
                            @else
                                <span class="badge bg-info">Mensual (mitad)</span>
                            @endif
                        </td>
                        <td class="text-end text-danger">${{ number_format($expense->expense_type == 'mensual' ? $expense->amount / 2 : $expense->amount, 2) }}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
    @endif

@else
    <div class="alert alert-warning">No hay datos para mostrar.</div>
@endif

<div class="row mt-4">
    <div class="col-12">
        <a href="{{ route('dashboard') }}" class="btn btn-secondary">← Volver al Dashboard</a>
    </div>
</div>
@endsection