@extends('biz.layout')
@section('title', 'Shughuli · BizLedger')
@section('content')
<div class="bg-white rounded-2xl shadow p-4 mb-4">
    <form method="GET" class="flex flex-wrap gap-3 items-end text-sm">
        <div><label class="block">Kutoka</label><input type="date" name="from" value="{{ $filters['from'] ?? '' }}" class="border rounded-lg px-2 py-2"></div>
        <div><label class="block">Hadi</label><input type="date" name="to" value="{{ $filters['to'] ?? '' }}" class="border rounded-lg px-2 py-2"></div>
        <div><label class="block">Njia</label>
            <select name="payment_method" class="border rounded-lg px-2 py-2">
                <option value="">Zote</option>
                @foreach(['cash','mpesa','till','paybill'] as $m)
                <option value="{{ $m }}" {{ ($filters['payment_method'] ?? '') === $m ? 'selected' : '' }}>{{ strtoupper($m) }}</option>
                @endforeach
            </select></div>
        <div><label class="block">Imethibitishwa</label>
            <select name="verified" class="border rounded-lg px-2 py-2">
                <option value="">Zote</option>
                <option value="yes" {{ ($filters['verified'] ?? '') === 'yes' ? 'selected' : '' }}>Ndiyo</option>
                <option value="no" {{ ($filters['verified'] ?? '') === 'no' ? 'selected' : '' }}>Hapana</option>
            </select></div>
        <div class="flex-1 min-w-40"><label class="block">Tafuta (ae. M-Pesa code)</label>
            <input name="search" value="{{ $filters['search'] ?? '' }}" class="w-full border rounded-lg px-2 py-2"></div>
        <button class="bg-mpesa text-white font-bold px-4 py-2 rounded-lg">TAFUTA</button>
    </form>
</div>
<div class="bg-white rounded-2xl shadow overflow-hidden">
    <table class="w-full text-sm">
        <thead class="bg-gray-50 text-left"><tr>
            <th class="px-4 py-3">Tarehe</th><th class="px-4 py-3">Maelezo</th><th class="px-4 py-3">Aina</th>
            <th class="px-4 py-3">Kiasi</th><th class="px-4 py-3">Njia</th><th class="px-4 py-3">M-Pesa</th>
            <th class="px-4 py-3">Mwimbaji</th><th class="px-4 py-3">Uhakiki</th>
        </tr></thead>
        <tbody>
        @forelse($txs as $tx)
        <tr class="border-t hover:bg-gray-50">
            <td class="px-4 py-2">{{ $tx->created_at->format('d/m/Y H:i') }}</td>
            <td class="px-4 py-2">{{ $tx->description ?? $tx->product?->name ?? '-' }}</td>
            <td class="px-4 py-2">{{ $tx->type }}</td>
            <td class="px-4 py-2 font-bold {{ in_array($tx->type, ['sale','debt']) ? 'text-green-700' : 'text-red-600' }}">{{ number_format($tx->amount, 2) }}</td>
            <td class="px-4 py-2">{{ strtoupper($tx->payment_method) }}</td>
            <td class="px-4 py-2 font-mono text-xs">{{ $tx->mpesaMessage?->mpesa_code ?? '-' }}</td>
            <td class="px-4 py-2">{{ $tx->creator?->name ?? '-' }}</td>
            <td class="px-4 py-2">{{ $tx->is_verified ? '✅' : '✍️' }} <span class="text-xs text-gray-400">{{ $tx->verification_source }}</span></td>
        </tr>
        @empty
        <tr><td colspan="8" class="px-4 py-8 text-center text-gray-400">Hakuna shughuli bado</td></tr>
        @endforelse
        </tbody>
    </table>
    <div class="p-4">{{ $txs->links() }}</div>
</div>
@endsection