@extends('layouts.app')

@section('header_title', 'Financeiro - Contas a Pagar')
@section('header_description', 'Controle de obrigacoes com fornecedores e despesas.')

@section('content')
<section class="page-head-row">
    <h2>Contas a Pagar</h2>
    <a href="{{ route('finance.payable.create') }}" class="primary-btn">Nova Conta</a>
</section>

@if (session('status'))
    <div class="alert success">{{ session('status') }}</div>
@endif

<section class="kpi-grid">
    <article class="card kpi-card"><p class="kpi-label">Em Aberto</p><h3>R$ {{ number_format($totals['open'], 2, ',', '.') }}</h3></article>
    <article class="card kpi-card"><p class="kpi-label">Vencidas</p><h3>R$ {{ number_format($totals['overdue'], 2, ',', '.') }}</h3></article>
    <article class="card kpi-card"><p class="kpi-label">Pagas</p><h3>R$ {{ number_format($totals['paid'], 2, ',', '.') }}</h3></article>
</section>

<article class="card panel" style="margin-top: 14px;">
    <form method="GET" class="grid-form">
        <div>
            <label for="status">Status</label>
            <select id="status" name="status">
                <option value="all" @selected($status === 'all')>Todos</option>
                <option value="open" @selected($status === 'open')>Abertas</option>
                <option value="overdue" @selected($status === 'overdue')>Vencidas</option>
                <option value="paid" @selected($status === 'paid')>Pagas</option>
            </select>
        </div>
        <div class="form-actions"><button class="primary-btn" type="submit">Filtrar</button></div>
    </form>
</article>

<article class="card panel" style="margin-top: 14px;">
    <div class="table-wrap">
        <table>
            <thead>
                <tr>
                    <th>Descricao</th>
                    <th>Fornecedor</th>
                    <th>Vencimento</th>
                    <th>Valor</th>
                    <th>Status</th>
                    <th>Acoes</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($accounts as $acc)
                    <tr>
                        <td>{{ $acc->description }}</td>
                        <td>{{ $acc->vendor_name ?: '-' }}</td>
                        <td>{{ $acc->due_date?->format('d/m/Y') }}</td>
                        <td>R$ {{ number_format((float) $acc->amount, 2, ',', '.') }}</td>
                        <td><span class="status {{ $acc->status === 'paid' ? 'ok' : 'pending' }}">{{ strtoupper($acc->status) }}</span></td>
                        <td class="actions-col">
                            @if ($acc->status !== 'paid')
                                <form method="POST" action="{{ route('finance.payable.settle', $acc) }}" class="inline-form">
                                    @csrf
                                    <input type="hidden" name="paid_amount" value="{{ number_format((float) $acc->amount, 2, '.', '') }}">
                                    <button class="table-link" type="submit">Quitar</button>
                                </form>
                            @endif
                            <a class="table-link" href="{{ route('finance.payable.edit', $acc) }}">Editar</a>
                            <form method="POST" action="{{ route('finance.payable.destroy', $acc) }}" onsubmit="return confirm('Remover conta?');">
                                @csrf
                                @method('DELETE')
                                <button class="table-link danger" type="submit">Excluir</button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="6" class="empty-row">Nenhuma conta a pagar cadastrada.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
</article>

<div class="pagination-wrap">{{ $accounts->links() }}</div>
@endsection