@extends('layouts.app')

@section('title', 'Cash & Bank')

@section('breadcrumb')
    @include('components.breadcrumb', ['items' => ['Cash & Bank' => null]])
@endsection

@section('content')
<div>
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6">
        <div>
            <h1 class="text-2xl font-bold text-slate-900 dark:text-white">Cash & Bank Management</h1>
            <p class="text-sm text-slate-500 dark:text-slate-400 mt-1">Track receipts, payments and account balances</p>
        </div>
        <div class="flex flex-wrap items-center gap-2">
            <x-button variant="success" icon="plus-circle" :href="route('cash.receipt')">New Receipt</x-button>
            <x-button variant="danger" icon="minus-circle" :href="route('cash.payment')">New Payment</x-button>
        </div>
    </div>

    {{-- Account Balance Cards --}}
    <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
        @foreach($accounts as $account)
            <x-stat-card
                :title="$account->name"
                :value="$account->balance"
                :icon="match($account->type) { 'cash' => 'wallet', 'bank' => 'landmark', default => 'credit-card' }"
                :iconBg="match($account->type) { 'cash' => 'primary', 'bank' => 'info', default => 'warning' }"
                gradient
            />
        @endforeach
    </div>

    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">

        {{-- Quick Receipt Entry --}}
        <x-card title="Quick Receipt Entry" icon="plus-circle">
            <x-slot:headerActions><x-badge variant="success">Receipt</x-badge></x-slot:headerActions>
            <form action="{{ route('cash.receipt') }}" method="POST" class="space-y-4">
                @csrf
                <input type="hidden" name="voucher_date" value="{{ now()->format('Y-m-d') }}" />
                <x-form-input name="party_id" label="Received From" type="select" icon="user"
                    :options="\App\Models\Party::customers()->active()->pluck('name','id')" required />
                <x-form-input name="amount" label="Amount" type="number" icon="circle-dollar-sign" required />
                <x-form-input name="account_id" label="Deposit To" type="select" icon="landmark"
                    :options="$accounts->pluck('name','id')" required />
                <x-form-input name="description" label="Remarks" type="textarea" icon="message-square" />
                <x-button variant="success" icon="save" class="w-full justify-center">Save Receipt</x-button>
            </form>
        </x-card>

        {{-- Quick Payment Entry --}}
        <x-card title="Quick Payment Entry" icon="minus-circle">
            <x-slot:headerActions><x-badge variant="danger">Payment</x-badge></x-slot:headerActions>
            <form action="{{ route('cash.payment') }}" method="POST" class="space-y-4">
                @csrf
                <input type="hidden" name="voucher_date" value="{{ now()->format('Y-m-d') }}" />
                <x-form-input name="party_id" label="Paid To" type="select" icon="truck"
                    :options="\App\Models\Party::suppliers()->active()->pluck('name','id')" required />
                <x-form-input name="amount" label="Amount" type="number" icon="circle-dollar-sign" required />
                <x-form-input name="account_id" label="Paid From" type="select" icon="landmark"
                    :options="$accounts->pluck('name','id')" required />
                <x-form-input name="description" label="Remarks" type="textarea" icon="message-square" />
                <x-button variant="danger" icon="save" class="w-full justify-center">Save Payment</x-button>
            </form>
        </x-card>
    </div>

    {{-- Recent Transactions --}}
    <x-card title="Recent Cash & Bank Transactions" icon="history" :padding="false">
        <div class="overflow-x-auto">
            <table class="w-full text-sm">
                <thead>
                    <tr class="bg-slate-50 dark:bg-slate-900/50 border-b border-slate-200 dark:border-slate-800">
                        <th class="px-4 py-3 text-left text-[11px] font-bold uppercase tracking-wider text-slate-500">Date</th>
                        <th class="px-4 py-3 text-left text-[11px] font-bold uppercase tracking-wider text-slate-500">Vch</th>
                        <th class="px-4 py-3 text-left text-[11px] font-bold uppercase tracking-wider text-slate-500">Party</th>
                        <th class="px-4 py-3 text-left text-[11px] font-bold uppercase tracking-wider text-slate-500">Account</th>
                        <th class="px-4 py-3 text-right text-[11px] font-bold uppercase tracking-wider text-slate-500">Receipt</th>
                        <th class="px-4 py-3 text-right text-[11px] font-bold uppercase tracking-wider text-slate-500">Payment</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
                    @forelse(\App\Models\Voucher::with(['party','account'])->latest('voucher_date')->limit(10)->get() as $v)
                        <tr class="hover:bg-slate-50 dark:hover:bg-slate-800/50">
                            <td class="px-4 py-3 text-xs text-slate-500">{{ $v->voucher_date->format('M d') }}</td>
                            <td class="px-4 py-3 text-xs font-mono font-semibold text-slate-700">{{ $v->voucher_no }}</td>
                            <td class="px-4 py-3 text-sm font-medium">{{ $v->party->name ?? '—' }}</td>
                            <td class="px-4 py-3 text-xs text-slate-500">{{ $v->account->name ?? '—' }}</td>
                            <td class="px-4 py-3 text-right text-sm font-bold text-emerald-600 counter-num">
                                {{ $v->type === 'receipt' ? '৳' . number_format($v->amount) : '—' }}
                            </td>
                            <td class="px-4 py-3 text-right text-sm font-bold text-rose-600 counter-num">
                                {{ $v->type === 'payment' ? '৳' . number_format($v->amount) : '—' }}
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="6" class="text-center py-6 text-sm text-slate-500">No transactions found.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </x-card>
</div>
@endsection
