@extends('layouts.app')

@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
    <main>

        <div class="pt-6 px-4">

            <breadcrumb
                :items="[{ 'title': 'Laporan Keseluruhan', 'icon': 'fas fa-users', 'url': '{{ route('reports') }}' }, { 'title': 'Lelongan', 'icon': 'fas fa-users' }]">
            </breadcrumb>

            <div class="container">
                <div class="flex w-full">
                    <div class="xl:w-3/5 2xl:w-2/3 p-12 mx-auto">
                        <div class="bg-yellow-600 text-gray-200 text-lg px-6 py-4 rounded-t-lg"><a href="/reports"
                                class="router-link-active"><i class="fas fa-backspace text-white"></i></a> <span
                                class="text-center mx-auto text-white font-bold">Laporan Lelongan</span></div>
                                <form id="formLelongan" method="GET" action="{{ route('reports.lelongan.show') }}">

                            <div class="rounded bg-white shadow p-6">
                                <div class="pb-6"><label for="username"
                                        class="font-semibold text-gray-700 block pb-1">Tarikh</label>
                                    <div class="flex">
                                        <span
                                            class="text-gray-600 border border-2 rounded-l px-4 py-2 whitespace-no-wrap"
                                            style="background-color: rgb(249, 250, 251);">Mula</span>
                                        <input id="tarikhmula" name="startDate" type="date"
                                            value="{{ request()->startDate ?? $startDate }}"
                                            class="border border-2 border-l-0 rounded-r px-4 py-2 w-80r mr-2">
                                        <span
                                            class="text-gray-600 border border-2 rounded-l px-4 py-2 whitespace-no-wrap"
                                            style="background-color: rgb(249, 250, 251);">Hingga</span>
                                        <input id="tarikhhingga" name="endDate" type="date"
                                            value="{{ request()->endDate ?? $endDate }}"
                                            class="border border-2 border-l-0 rounded-r px-4 py-2 w-80r mr-2">
                                       <!-- Hidden Input to Determine Action -->
                                            <input type="hidden" name="action" id="formAction" value="search">
                                            
                                            <button type="submit" onclick="setAction('search')" class="border border-yellow-600 text-yellow-600 font-montserrat py-2 px-8 font-medium rounded-xl hover:bg-yellow-600 hover:text-white transition-all duration-300 ml-5">
                                                <i class="fas fa-magnifying-glass mr-2"></i> Search
                                            </button>

                                            <button type="submit" onclick="setAction('excel')" class="border border-yellow-600 text-yellow-600 py-2 px-8 font-medium rounded-xl hover:bg-yellow-600 hover:text-white transition-all duration-300 ml-2">
                                                <i class="fas fa-file-excel mr-2"></i> Excel
                                            </button>
                                    </div>

                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
           
            <div kodcaw="operasi">
                <div>
                    <!---->
                    <!---->
                </div>
                <div>
                    <!---->
                    <!---->
                </div>
                <div class="flex justify-between mb-2">


                </div>
                <table class="min-w-full leading-normal">
                    <thead class="text-center">
                        <tr>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                No
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Kod Cawangan
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Cawangan
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Bil
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Berat (g)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Nilai Marhun(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Pembiayaan(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Baki Pembiayaan(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Keuntungan(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Caj Lelong(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Harga Asas(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Harga Jual(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Baki(RM)
                            </th>
                            <th
                                class="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider">
                                Action
                            </th>
                        </tr>
                    </thead>
                    @php
                    $totalbillelong = 0;
                    $totalberat = 0;
                    $totalnm = 0;
                    $totalpinjaman = 0;
                    $totalbakipjm = 0;
                    $totalkeuntungan = 0;
                    $totalcajlelong = 0;
                    $totalhargajual= 0;
                    $totalhargaasas= 0;
                    $totalbaki= 0;
                    @endphp
                    <tbody>
                        @forelse ($lelongan as $lelong)
                        @php
                        $totalbillelong += $lelong['total_lelongan'];
                        $totalberat += $lelong['sum_berat'];
                        $totalnm += $lelong['sum_nilai_marhun'];
                        $totalpinjaman += $lelong['sum_pinjaman'];
                        $totalbakipjm += $lelong['sum_bakipjm'];
                        $totalkeuntungan += $lelong['sum_bakiupah'];
                        $totalcajlelong+= $lelong['sum_cajlelong'];
                        $totalhargajual+= $lelong['sum_hargajual'];
                        $totalhargaasas+= $lelong['sum_hargaasas'];
                        $totalbaki+= $lelong['sum_baki'];
                        @endphp

                        <tr>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">{{ $loop->iteration }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">{{ $lelong['kodcaw'] }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">{{ $lelong['details_caw'] }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">{{ $lelong['total_lelongan'] }}
                                        </p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_berat'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_nilai_marhun'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_pinjaman'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_bakipjm'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_bakiupah'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_cajlelong'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_hargaasas'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_hargajual'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($lelong['sum_baki'], 2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <a href="{{ route('reports.lelongan.cawangan.excel', [$lelong['kodcaw'], 'startDate' => request()->startDate, 'endDate' => request()->endDate]) }}"
                                            target="_blank" rel="noopener noreferrer"
                                            class="border border-blue-600 text-blue-600 font-montserrat py-2 px-4 font-medium rounded-xl hover:bg-blue-600 hover:text-white transition-all duration-300">
                                            <i class="fas fa-download mr-2"></i>
                                        </a>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="6" class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">Data not available</p>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        @endforelse
                        <tr>
                            <td colspan="3" class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">Jumlah Keseluruhan</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">{{ $totalbillelong}}
                                        </p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalberat,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalnm,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalpinjaman,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalbakipjm,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalkeuntungan,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalcajlelong,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalhargaasas,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalhargajual,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                            {{ number_format($totalbaki,2) }}</p>
                                    </div>
                                </div>
                            </td>
                            <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                                <div class="flex items-center">
                                    <div class="ml-3">
                                        <p class="text-gray-900 whitespace-no-wrap">
                                        </p>
                                    </div>
                                </div>
                            </td>

                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </main>
    @include('layouts.footer')

</div>
@endsection

<!-- JavaScript to Change Action -->
<script>
    function setAction(action) {
        document.getElementById('formAction').value = action;
        document.getElementById('formLelongan').submit(); 
    }
</script>