@extends('Core.Sidebar')

@section('content')
    <title>Buku Besar Perusahaan Dagang</title>
    <!-- Tailwind CSS -->
    <script src="https://cdn.tailwindcss.com"></script>
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">
    
    <div class="box p-4 intro-y mt-5">
        <div class="intro-y">
            <!-- Header -->
            <div class="mb-4 bg-blue-600 text-white p-4 rounded-lg shadow-md">
                <h1 class="text-2xl font-bold">Buku Besar Perusahaan Dagang</h1>
                <p class="text-sm mt-1">Entri Jurnal Umum Budivespaendut</p>
                <p class="text-sm">Anggrek</p>
            </div>

            @foreach($groupedLaporan as $kategori => $items)
                @php
                    $kodeAkun = $items->first()->kode ?? '-';
                    $runningBalance = 0;
                @endphp

                <div class="mb-8">
                    <!-- Informasi Akun -->
                    <div class="flex justify-between items-center mb-2 bg-gray-100 p-3 rounded-t-lg">
                        <div>
                            <span class="font-bold">Nama Akun: {{ $kategori }}</span>
                        </div>
                        <div>
                            <span class="font-bold">Kode Akun: {{ $kodeAkun }}</span>
                        </div>
                    </div>

                    <!-- Tabel Transaksi -->
                    <div class="overflow-x-auto">
                        <table class="w-full bg-white border border-gray-300">
                            <thead>
                                <tr class="bg-gray-100 text-gray-600 uppercase text-sm leading-normal">
                                    <th class="py-3 px-4 text-left">Tanggal</th>
                                    <th class="py-3 px-4 text-left">Keterangan</th>
                                    <th class="py-3 px-4 text-center">Ref</th>
                                    <th class="py-3 px-4 text-right">Debit (Rp)</th>
                                    <th class="py-3 px-4 text-right">Kredit (Rp)</th>
                                    <th class="py-3 px-4 text-right">Saldo</th>
                                    <th class="py-3 px-4 text-center">Aksi</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($items as $item)
                                    @php
                                        $runningBalance += ($item->debit - $item->kredit);
                                    @endphp
                                    <tr class="border-b border-gray-200 hover:bg-gray-50">
                                        <td class="py-3 px-4">{{ date('d/m/Y', strtotime($item->Tanggal)) }}</td>
                                        <td class="py-3 px-4">{{ $item->keterangan }}</td>
                                        <td class="py-3 px-4 text-center">-</td>
                                        <td class="py-3 px-4 text-right">
                                            @if($item->debit > 0)
                                                {{ number_format($item->debit, 0, ',', '.') }}
                                            @else
                                                -
                                            @endif
                                        </td>
                                        <td class="py-3 px-4 text-right">
                                            @if($item->kredit > 0)
                                                {{ number_format($item->kredit, 0, ',', '.') }}
                                            @else
                                                -
                                            @endif
                                        </td>
                                        <td class="py-3 px-4 text-right">{{ number_format($runningBalance, 0, ',', '.') }}</td>
                                        <td class="py-3 px-4 text-center">
                                            <div class="flex justify-center space-x-2">
                                                <button class="text-blue-600 hover:text-blue-800" title="Edit">
                                                    <i class="fas fa-edit"></i>
                                                </button>
                                                <button onclick="hapusData({{ $item->id }})" class="text-red-600 hover:text-red-800" title="Hapus">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                            <tfoot>
                                <!-- <tr class="bg-gray-50 font-bold">
                                    <td colspan="3" class="py-3 px-4 text-right">Total:</td>
                                    <td class="py-3 px-4 text-right">{{ number_format($totals[$kategori]['debit'], 0, ',', '.') }}</td>
                                    <td class="py-3 px-4 text-right">{{ number_format($totals[$kategori]['kredit'], 0, ',', '.') }}</td>
                                    <td class="py-3 px-4 text-right">{{ number_format($totals[$kategori]['saldo'], 0, ',', '.') }}</td>
                                    <td></td>
                                </tr> -->
                            </tfoot>
                        </table>
                    </div>
                </div>
            @endforeach

            <!-- Action Buttons -->
            <div class="flex justify-between items-center mt-4 mb-4">
                <div class="flex space-x-2">
                    <a href="{{ route('laporan.export-excel') }}" class="btn bg-green-500 text-white hover:bg-green-600 px-4 py-2 rounded-md">
                        <i class="fas fa-file-excel mr-2"></i>Export Excel
                    </a>
                    <a href="{{ route('laporan.export-pdf') }}" class="btn bg-red-500 text-white hover:bg-red-600 px-4 py-2 rounded-md">
                        <i class="fas fa-file-pdf mr-2"></i>Export PDF
                    </a>
                    <button onclick="window.print()" class="btn bg-gray-500 text-white hover:bg-gray-600 px-4 py-2 rounded-md">
                        <i class="fas fa-print mr-2"></i>Print
                    </button>
                </div>
            </div>
        </div>
    </div>

    <style>
        @media print {
            .btn, header, footer, .no-print {
                display: none !important;
            }
            body {
                padding: 20px;
                font-size: 14px;
            }
            .box {
                box-shadow: none !important;
            }
            table {
                width: 100%;
                border-collapse: collapse;
                page-break-inside: avoid;
            }
            th, td {
                border: 1px solid #000;
                padding: 8px;
            }
        }
    </style>

    <script>
    function hapusData(id) {
        if (confirm('Apakah Anda yakin ingin menghapus data ini?')) {
            fetch(`/laporan/${id}`, {
                method: 'DELETE',
                headers: {
                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
                    'Accept': 'application/json',
                    'Content-Type': 'application/json'
                }
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('Data berhasil dihapus');
                    location.reload();
                } else {
                    alert('Gagal menghapus data: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('Terjadi kesalahan saat menghapus data');
            });
        }
    }
    </script>
@endsection