@extends('layouts.app')

@section('content')
    <div class="container mx-auto mt-10">
        <h1 class="text2xl font-bold">
            Senarai Surat Akuan Gadaian: <span class="underline hover:underline-offset-auto 2xl: uppercase font-extrabold">{{ $bulan }}</span>
        </h1>

        <div class="flex justify-end">
            <h3 class="text-lg font-semibold">Jumlah Baki Lelong:
                <span id="total-baki" class="text-yellow-600">
                    RM {{ number_format($totalBaki, 2) }}
                </span>
            </h3>
        </div>

        <div class="overflow-x-auto">
            <table class="table-auto w-full border-collapse border border-gray-300">
                <thead>
                    <tr class="bg-yellow-600 text-white">
                        <th class="border border-gray-200 px-4 py-2">#</th>
                        <th class="border border-gray-200 px-4 py-2">No Rujukan</th>
                        <th class="border border-gray-200 px-4 py-2">Tarikh Lelong</th>
                        <th class="border border-gray-200 px-4 py-2">Pembiayaan</th>
                        <th class="border border-gray-200 px-4 py-2">Baki Lelong</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($rekod as $index => $item)
                        <tr class="{{ $index % 2 == 0 ? 'bg-gray-100' : 'bg-white' }}">
                            <td class="border border-gray-300 px-4 py-2 text-center">{{ $index + 1 }}</td>

                            <td class="px-4 py-2 border">{{ $item['norujukan'] }}</td>
                            <td class="px-4 py-2 border">{{ $item['t_lelong'] }}</td>
                            <td class="px-4 py-2 border">{{ number_format($item['pinjaman'], 2) }}</td>
                            <td class="px-4 py-2 border">{{ number_format($item['baki'], 2) }}</td>

                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        <div class="mt-6">
            <a href="{{ url()->previous() }}" class="inline-block bg-gray-500 hover:bg-gray-600 text-white px-4 py-2 rounded">
                Kembali
            </a>
        </div>

    </div>


    @include('layouts.footer');
@endsection