@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">Expenses</h1>
        <a href="{{ route('expenses.create') }}" class="px-4 py-2 bg-blue-600 text-white rounded">New Expense</a>
    </div>
    <div class="bg-white rounded shadow overflow-hidden">
        <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">Vendor</th>
                    <th class="px-4 py-2 text-left text-xs font-medium text-gray-500">Category</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-left text-xs font-medium text-gray-500">Status</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->vendor?->name ?: 'General' }}</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 capitalize">{{ $e->payment_status }}</td>
                    <td class="px-4 py-2 text-right">{{ number_format($e->amount, 2) }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    <div class="mt-4">{{ $expenses->links() }}</div>
    </div>
@endsection