@extends('layouts.app')
@section('content')
<div class="max-w-6xl mx-auto p-6">
    <div class="flex items-center justify-between mb-4">
        <h1 class="text-xl font-semibold">Vendor Ledger — {{ $vendor->name }}</h1>
        <div class="space-x-3">
            <a href="{{ route('expenses.create', ['vendor_id'=>$vendor->id]) }}" class="px-3 py-1 bg-green-600 text-white rounded">New Expense</a>
            <a href="{{ route('vendors.index') }}" class="text-blue-700">Back</a>
        </div>
    </div>
    <div class="grid grid-cols-3 gap-4 mb-4">
        <div class="p-4 bg-white rounded shadow text-sm"><div class="text-xs text-gray-500">Total Expenses</div><div class="text-lg font-semibold">{{ number_format($totalExpenses, 2) }}</div></div>
        <div class="p-4 bg-white rounded shadow text-sm"><div class="text-xs text-gray-500">Total Payments</div><div class="text-lg font-semibold">{{ number_format($totalPaid, 2) }}</div></div>
        <div class="p-4 bg-white rounded shadow text-sm"><div class="text-xs text-gray-500">Balance Due</div><div class="text-lg font-semibold">{{ number_format($balance, 2) }}</div></div>
    </div>
    <div class="bg-white rounded shadow overflow-hidden mb-6">
        <div class="px-4 py-2 font-semibold bg-gray-50">Expenses</div>
        <table class="min-w-full">
            <thead class="bg-gray-50">
                <tr>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Date</th>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Account</th>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Ref#</th>
                    <th class="px-4 py-2 text-right text-xs font-medium text-gray-500">Amount</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100">
                @foreach($expenses as $e)
                <tr>
                    <td class="px-4 py-2">{{ $e->expense_date->format('Y-m-d') }}</td>
                    <td class="px-4 py-2">{{ $e->accountType?->name }}</td>
                    <td class="px-4 py-2">{{ $e->reference_number ?: '-' }}</td>
                    <td class="px-4 py-2 text-right">{{ number_format($e->amount, 2) }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    <div class="bg-white rounded shadow overflow-hidden">
        <div class="px-4 py-2 font-semibold bg-gray-50">Payments</div>
        <table class="min-w-full">
            <thead class="bg-gray-50">
                <tr>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Date</th>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Method</th>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Bank</th>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Cheque#</th>
                    <th class="px-4 py-2 text-right text-xs font-medium text-gray-500">Amount</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100">
                @foreach($payments as $p)
                <tr>
                    <td class="px-4 py-2">{{ $p->payment_date->format('Y-m-d') }}</td>
                    <td class="px-4 py-2">{{ $p->payment_type }}</td>
                    <td class="px-4 py-2">{{ $p->bank_name ?: '-' }}</td>
                    <td class="px-4 py-2">{{ $p->cheque_number ?: '-' }}</td>
                    <td class="px-4 py-2 text-right">{{ number_format($p->amount, 2) }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endsection