@extends('garage.layouts.app')

@section('title', 'View Voucher')

@section('content')
@php
    $typeColors = [
        'journal' => 'primary',
        'receipt' => 'success',
        'payment' => 'danger',
        'contra' => 'info'
    ];
    $typeColor = $typeColors[$voucher->voucher_type] ?? 'secondary';
    $statusColors = [
        'draft' => 'warning',
        'posted' => 'success',
        'cancelled' => 'danger'
    ];
    $statusColor = $statusColors[$voucher->status] ?? 'secondary';

    $totalDebit = 0;
    $totalCredit = 0;
@endphp

<style>
    .gv-meta { display:flex; flex-wrap:wrap; gap:.35rem .6rem; align-items:center; }
    .gv-chip { display:inline-flex; gap:.35rem; align-items:center; padding:.15rem .5rem; border:1px solid #e5e7eb; border-radius:999px; background:#fff; font-size:.82rem; }
    .gv-chip .k { color:#64748b; font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; }
    .gv-chip .v { color:#0f172a; font-weight:700; }
    .gv-lines th, .gv-lines td { padding:.35rem .5rem; }
    .gv-lines .sub { font-size:.78rem; color:#64748b; margin-top:.1rem; }
    .gv-narr { padding:.5rem .65rem; border:1px dashed #e5e7eb; border-radius:.5rem; background:#f8fafc; font-size:.9rem; }
</style>

<div class="container-fluid px-2 px-lg-3 py-3">
    <div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-2">
        <div>
            <div class="d-flex flex-wrap align-items-center gap-2">
                <h1 class="h5 mb-0 font-monospace">{{ $voucher->voucher_no }}</h1>
                <span class="badge bg-{{ $typeColor }}">{{ ucfirst($voucher->voucher_type) }}</span>
                <span class="badge bg-{{ $statusColor }}">{{ ucfirst($voucher->status) }}</span>
            </div>
            <div class="gv-meta mt-2">
                <span class="gv-chip"><span class="k">Date</span><span class="v">{{ \Carbon\Carbon::parse($voucher->voucher_date)->format('M d, Y') }}</span></span>
                <span class="gv-chip"><span class="k">Ref</span><span class="v">{{ $voucher->reference_no ?? '—' }}</span></span>
                <span class="gv-chip"><span class="k">Total</span><span class="v">PKR {{ number_format($voucher->total_amount, 2) }}</span></span>
                <span class="gv-chip"><span class="k">By</span><span class="v">{{ $creator->name ?? '—' }}</span></span>
            </div>
            @if((isset($saleSources) && $saleSources->count()) || (isset($purchaseSources) && $purchaseSources->count()))
                <div class="gv-meta mt-2">
                    @foreach(($saleSources ?? collect()) as $src)
                        <span class="gv-chip">
                            <span class="k">Sale</span>
                            <span class="v">
                                <a class="text-decoration-none" href="{{ route('garage.sales.show', $src->sale_id) }}">
                                    #{{ $src->sale_id }} · {{ $src->sale_number }}
                                </a>
                                <span class="text-muted small">({{ $src->voucher_type }} · {{ $src->link_kind }})</span>
                            </span>
                        </span>
                    @endforeach
                    @foreach(($purchaseSources ?? collect()) as $src)
                        <span class="gv-chip">
                            <span class="k">PO</span>
                            <span class="v">
                                <a class="text-decoration-none" href="{{ route('garage.purchase-orders.show', $src->purchase_order_id) }}">
                                    #{{ $src->purchase_order_id }} · {{ $src->purchase_order_number }}
                                </a>
                                <span class="text-muted small">({{ $src->voucher_type }} · {{ $src->link_kind }})</span>
                            </span>
                        </span>
                    @endforeach
                </div>
            @endif
        </div>

        <div class="d-flex flex-wrap gap-2">
            @if(!empty($relatedSale?->receipt_voucher_id))
                <a href="{{ route('garage.vouchers.show', $relatedSale->receipt_voucher_id) }}" class="btn btn-sm btn-outline-success">Receipt</a>
            @elseif(!empty($canMakeReceipt) && !empty($relatedSale?->id))
                <a href="{{ route('garage.sales.receipt.form', $relatedSale->id) }}" class="btn btn-sm btn-outline-success">Make receipt</a>
            @endif

            @if(in_array($voucher->status, ['draft','posted']))
                <a href="{{ route('garage.vouchers.edit', $voucher->id) }}" class="btn btn-sm btn-outline-primary">Edit</a>
            @endif
            @if($voucher->status === 'draft')
                <form action="{{ route('garage.vouchers.approve', $voucher->id) }}" method="POST">
                    @csrf
                    <button type="submit" class="btn btn-sm btn-primary" onclick="return confirm('Approve and post this voucher?');">Approve</button>
                </form>
            @endif

            @if($voucher->status !== 'cancelled')
                <form action="{{ route('garage.vouchers.cancel', $voucher->id) }}" method="POST">
                    @csrf
                    <button type="submit" class="btn btn-sm btn-outline-danger" onclick="return confirm('Cancel this voucher?');">Cancel</button>
                </form>
            @endif

            <a href="{{ route('garage.vouchers.index') }}" class="btn btn-sm btn-outline-secondary">Back</a>
        </div>
    </div>

    @if($voucher->narration)
        <div class="gv-narr mb-3">{{ $voucher->narration }}</div>
    @endif

    <div class="table-responsive border rounded bg-white">
        <table class="table table-sm table-hover mb-0 gv-lines align-middle">
            <thead class="table-light">
                <tr>
                    <th style="width: 42px;">#</th>
                    <th>Ledger</th>
                    <th style="width: 90px;">Type</th>
                    <th style="width: 160px;" class="text-end">Amount</th>
                    <th>Narration</th>
                </tr>
            </thead>
            <tbody>
                @foreach($transactions as $index => $transaction)
                    @php
                        if ($transaction->transaction_type === 'debit') {
                            $totalDebit += (float) $transaction->amount;
                        } else {
                            $totalCredit += (float) $transaction->amount;
                        }
                    @endphp
                    <tr>
                        <td class="text-muted">{{ $index + 1 }}</td>
                        <td>
                            <div class="fw-semibold">
                                @if(!empty($transaction->garage_ledger_id))
                                    <a class="text-decoration-none"
                                       href="{{ route('garage.ledger-reports.ledger', $transaction->garage_ledger_id) }}">
                                        {{ $transaction->ledger_name }}
                                    </a>
                                @else
                                    {{ $transaction->ledger_name }}
                                @endif
                                @if(!empty($transaction->sub_ledger_code) || !empty($transaction->sub_ledger_title))
                                    <span class="text-muted">/</span>
                                    @if(!empty($transaction->garage_sub_ledger_id))
                                        <a class="text-decoration-none text-muted"
                                           href="{{ route('garage.ledger-reports.sub-ledger', $transaction->garage_sub_ledger_id) }}">
                                            {{ trim(($transaction->sub_ledger_code ?? '').' '.($transaction->sub_ledger_title ?? '')) }}
                                        </a>
                                    @else
                                        <span class="text-muted">{{ trim(($transaction->sub_ledger_code ?? '').' '.($transaction->sub_ledger_title ?? '')) }}</span>
                                    @endif
                                @endif
                            </div>
                            @if($transaction->ledger_code)
                                <div class="sub">Code: {{ $transaction->ledger_code }}</div>
                            @endif
                        </td>
                        <td>
                            @if($transaction->transaction_type === 'debit')
                                <span class="badge bg-success-subtle text-success border border-success-subtle">Dr</span>
                            @else
                                <span class="badge bg-danger-subtle text-danger border border-danger-subtle">Cr</span>
                            @endif
                        </td>
                        <td class="text-end fw-semibold {{ $transaction->transaction_type === 'debit' ? 'text-success' : 'text-danger' }}">
                            PKR {{ number_format($transaction->amount, 2) }}
                        </td>
                        <td class="small">{{ $transaction->narration ?? '—' }}</td>
                    </tr>
                @endforeach
            </tbody>
            <tfoot class="table-light">
                <tr>
                    <td colspan="3" class="text-end fw-bold">Debit</td>
                    <td class="text-end fw-bold text-success">PKR {{ number_format($totalDebit, 2) }}</td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="3" class="text-end fw-bold">Credit</td>
                    <td class="text-end fw-bold text-danger">PKR {{ number_format($totalCredit, 2) }}</td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="3" class="text-end fw-bold">Balance</td>
                    <td class="text-end fw-bold {{ abs($totalDebit - $totalCredit) < 0.01 ? 'text-success' : 'text-danger' }}">
                        PKR {{ number_format(abs($totalDebit - $totalCredit), 2) }}
                        <span class="text-muted small">{{ abs($totalDebit - $totalCredit) < 0.01 ? '(Balanced)' : '(Unbalanced)' }}</span>
                    </td>
                    <td></td>
                </tr>
            </tfoot>
        </table>
    </div>
</div>
@endsection