@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    {{-- Filter Card --}}
    <div class="card shadow-lg mx-4">
        <div class="card-body p-3">
            <form method="GET" action="{{ URL::to($url_menu) }}" id="lapshm-filter-form">
                <div class="row gx-4 align-items-end">
                    <div class="col-auto">
                        <label class="form-control-label fw-bold">Tanggal</label>
                        <input type="date" class="form-control" name="tanggal"
                            value="{{ $tanggal_selected ?? '' }}">
                    </div>
                    <div class="col-auto">
                        <label class="form-control-label fw-bold">Kategori</label>
                        <select class="form-control" name="kategori" style="min-width: 200px;">
                            <option value="">Semua Kategori</option>
                            @foreach ($kategori_list as $kat)
                                <option value="{{ $kat->id }}"
                                    {{ ($kategori_selected ?? '') == $kat->id ? 'selected' : '' }}>
                                    {{ $kat->nama_kategori }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-auto">
                        <button type="submit" class="btn mb-0 text-white" style="background-color: #fb6340;">
                            <i class="fas fa-search me-1"></i> Filter
                        </button>
                    </div>
                    <div class="col-auto">
                        <a href="{{ route('lapshm.exportPdf', ['q' => $encrypted_filter_query ?? '']) }}"
                           target="_blank"
                           class="btn mb-0 text-white" style="background-color: #d63031;">
                            <i class="fas fa-file-pdf me-1"></i> Export PDF
                        </a>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <div class="container-fluid py-4">
        {{-- Total Saham Keseluruhan --}}
        <div class="row mb-3">
            <div class="col-12 text-end">
                <span class="fw-bold text-dark">TOTAL JUMLAH KEPEMILIKAN SAHAM :
                    {{ number_format($total_saham_keseluruhan ?? 0, 0, ',', '.') }}</span>
            </div>
        </div>

        @php $grandTotals = []; @endphp

        @if (!empty($report) || (!empty($lain_lain) && $lain_lain['total_investor'] > 0))
            @php
                $listGroupSections = collect($report)->filter(fn($s) => $s['kategori']->jenis === 'list_group')->values();
                $sumRangeSections = collect($report)->filter(fn($s) => $s['kategori']->jenis === 'sum_range')->values();
                $sectionIndex = 0;
            @endphp
            <br>
            <br>
            {{-- ============ LIST GROUP ============ --}}
            @if ($listGroupSections->count() > 0)
                <div class="mb-4">
                    <div class="d-flex align-items-center mb-3">
                        <hr class="flex-grow-1 m-0" style="border-color: #2dce89; opacity: 0.5;">
                        <span class="px-3 fw-bold text-uppercase text-success" style="font-size: 0.9rem; letter-spacing: 1px;">
                            <i class="fas fa-list me-2"></i> List Group
                        </span>
                        <hr class="flex-grow-1 m-0" style="border-color: #2dce89; opacity: 0.5;">
                    </div>

                    @foreach ($listGroupSections as $section)
                        @php $currentIdx = $sectionIndex++; @endphp
                        {{-- Category Accordion --}}
                        <div class="card mb-3 kategori-section">
                            {{-- Category Header --}}
                            <div class="card-header p-3 cursor-pointer d-flex justify-content-between align-items-center"
                                data-bs-toggle="collapse" data-bs-target="#section-{{ $currentIdx }}"
                                aria-expanded="false" aria-controls="section-{{ $currentIdx }}"
                                style="background-color: #FAFAFA; cursor: pointer;">
                                <div class="d-flex align-items-center">
                                    <h6 class="mb-0 text-uppercase fw-bold me-3">
                                        {{ $section['kategori']->nama_kategori }}
                                    </h6>
                                    <span class="badge bg-gradient-primary" style="font-size: 0.7rem;">
                                        <i class="fas fa-users me-1"></i>{{ $section['total_investor'] }} Investor
                                    </span>
                                </div>
                                <div class="d-flex align-items-center">
                                    <span class="fw-bold me-3">
                                        TOTAL SAHAM : {{ number_format($section['total_saham'], 0, ',', '.') }}
                                    </span>
                                    <i class="fas fa-chevron-right collapse-icon"></i>
                                </div>
                            </div>

                            {{-- Category Body --}}
                            <div class="collapse" id="section-{{ $currentIdx }}">
                                <div class="card-body p-3">
                                    @if (!empty($section['investors']))
                                        <p class="text-sm mb-2">
                                            <strong>Total Investor : {{ $section['total_investor'] }}</strong>
                                        </p>
                                        <div class="table-responsive">
                                            <table class="table table-bordered table-hover align-items-center mb-0 report-table table-aligned">
                                                <colgroup>
                                                    <col style="width: 120px;">
                                                    <col style="width: 250px;">
                                                    <col style="width: 180px;">
                                                    @foreach ($tanggal_columns as $date)
                                                        <col style="width: 130px;">
                                                    @endforeach
                                                </colgroup>
                                                <thead class="bg-primary text-white">
                                                    <tr>
                                                        <th class="text-uppercase text-xxs font-weight-bolder">Nomor SID</th>
                                                        <th class="text-uppercase text-xxs font-weight-bolder">Nama Investor</th>
                                                        <th class="text-uppercase text-xxs font-weight-bolder">Kode Pemegang Rekening</th>
                                                        @foreach ($tanggal_columns as $date)
                                                            <th class="text-uppercase text-xxs font-weight-bolder text-center">
                                                                {{ \Carbon\Carbon::parse($date)->format('d/m/Y') }}
                                                            </th>
                                                        @endforeach
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @foreach ($section['investors'] as $investor)
                                                        <tr>
                                                            <td class="text-xs">{{ $investor['nomor_sid'] }}</td>
                                                            <td class="text-xs">{{ $investor['nama_investor'] }}</td>
                                                            <td class="text-xs">{{ $investor['kode_pemegang_rekening'] ?? '' }}</td>
                                                            @foreach ($tanggal_columns as $date)
                                                                <td class="text-xs text-center">
                                                                    @if ($investor['dates'][$date]['value'] !== null)
                                                                        {{ number_format($investor['dates'][$date]['value'], 0, ',', '.') }}
                                                                        @if ($investor['dates'][$date]['change'] === 'up')
                                                                            <i class="fas fa-arrow-up text-success ms-1"></i>
                                                                        @elseif($investor['dates'][$date]['change'] === 'down')
                                                                            <i class="fas fa-arrow-down text-danger ms-1"></i>
                                                                        @endif
                                                                    @endif
                                                                </td>
                                                            @endforeach
                                                        </tr>
                                                    @endforeach
                                                </tbody>
                                                <tfoot>
                                                    <tr class="fw-bold" style="background-color: #f8f9fa;">
                                                        <td class="text-xs" colspan="3"><strong>Total</strong></td>
                                                        @foreach ($tanggal_columns as $date)
                                                            @php
                                                                $colTotal = $section['totals'][$date] ?? 0;
                                                                if (!isset($grandTotals[$date])) $grandTotals[$date] = 0;
                                                                $grandTotals[$date] += $colTotal;
                                                            @endphp
                                                            <td class="text-xs text-center">
                                                                <strong>{{ number_format($colTotal, 0, ',', '.') }}</strong>
                                                            </td>
                                                        @endforeach
                                                    </tr>
                                                </tfoot>
                                            </table>
                                        </div>
                                    @else
                                        <p class="text-sm text-muted mb-0">Tidak ada data investor untuk kategori ini.</p>
                                    @endif
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            @endif

            {{-- ============ SUM RANGE ============ --}}
            @if ($sumRangeSections->count() > 0)
                <div class="mb-4">
                    <div class="d-flex align-items-center mb-3">
                        <hr class="flex-grow-1 m-0" style="border-color: #11cdef; opacity: 0.5;">
                        <span class="px-3 fw-bold text-uppercase text-info" style="font-size: 0.9rem; letter-spacing: 1px;">
                            <i class="fas fa-layer-group me-2"></i> Sum Range
                        </span>
                        <hr class="flex-grow-1 m-0" style="border-color: #11cdef; opacity: 0.5;">
                    </div>

                    @foreach ($sumRangeSections as $section)
                        @php $currentIdx = $sectionIndex++; @endphp
                        {{-- Category Accordion --}}
                        <div class="card mb-3 kategori-section">
                            {{-- Category Header --}}
                            <div class="card-header p-3 cursor-pointer d-flex justify-content-between align-items-center"
                                data-bs-toggle="collapse" data-bs-target="#section-{{ $currentIdx }}"
                                aria-expanded="false" aria-controls="section-{{ $currentIdx }}"
                                style="background-color: #FAFAFA; cursor: pointer;">
                                <div class="d-flex align-items-center">
                                    <h6 class="mb-0 text-uppercase fw-bold me-3">
                                        {{ $section['kategori']->nama_kategori }}
                                    </h6>
                                    <span class="badge bg-primary" style="font-size: 0.7rem;">
                                        <i class="fas fa-users me-1"></i>{{ $section['total_investor'] }} Investor
                                    </span>
                                </div>
                                <div class="d-flex align-items-center">
                                    <span class="fw-bold me-3">
                                        TOTAL SAHAM : {{ number_format($section['total_saham'], 0, ',', '.') }}
                                    </span>
                                    <i class="fas fa-chevron-right collapse-icon"></i>
                                </div>
                            </div>

                            {{-- Category Body --}}
                            <div class="collapse" id="section-{{ $currentIdx }}">
                                <div class="card-body p-3">
                                    @if (!empty($section['investors']))
                                        <p class="text-sm mb-2">
                                            <strong>Total Investor : {{ $section['total_investor'] }}</strong>
                                        </p>
                                        <div class="table-responsive">
                                            <table class="table table-bordered table-hover align-items-center mb-0 report-table table-aligned">
                                                <colgroup>
                                                    <col style="width: 120px;">
                                                    <col style="width: 250px;">
                                                    <col style="width: 180px;">
                                                    @foreach ($tanggal_columns as $date)
                                                        <col style="width: 130px;">
                                                    @endforeach
                                                </colgroup>
                                                <thead class="bg-primary text-white">
                                                    <tr>
                                                        <th class="text-uppercase text-xxs font-weight-bolder">Nomor SID</th>
                                                        <th class="text-uppercase text-xxs font-weight-bolder">Nama Investor</th>
                                                        <th class="text-uppercase text-xxs font-weight-bolder">Kode Pemegang Rekening</th>
                                                        @foreach ($tanggal_columns as $date)
                                                            <th class="text-uppercase text-xxs font-weight-bolder text-center">
                                                                {{ \Carbon\Carbon::parse($date)->format('d/m/Y') }}
                                                            </th>
                                                        @endforeach
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @foreach ($section['investors'] as $investor)
                                                        <tr>
                                                            <td class="text-xs">{{ $investor['nomor_sid'] }}</td>
                                                            <td class="text-xs">{{ $investor['nama_investor'] }}</td>
                                                            <td class="text-xs">{{ $investor['kode_pemegang_rekening'] ?? '' }}</td>
                                                            @foreach ($tanggal_columns as $date)
                                                                <td class="text-xs text-center">
                                                                    @if ($investor['dates'][$date]['value'] !== null)
                                                                        {{ number_format($investor['dates'][$date]['value'], 0, ',', '.') }}
                                                                        @if ($investor['dates'][$date]['change'] === 'up')
                                                                            <i class="fas fa-arrow-up text-success ms-1"></i>
                                                                        @elseif($investor['dates'][$date]['change'] === 'down')
                                                                            <i class="fas fa-arrow-down text-danger ms-1"></i>
                                                                        @endif
                                                                    @endif
                                                                </td>
                                                            @endforeach
                                                        </tr>
                                                    @endforeach
                                                </tbody>
                                                <tfoot>
                                                    <tr class="fw-bold" style="background-color: #f8f9fa;">
                                                        <td class="text-xs" colspan="3"><strong>Total</strong></td>
                                                        @foreach ($tanggal_columns as $date)
                                                            @php
                                                                $colTotal = $section['totals'][$date] ?? 0;
                                                                if (!isset($grandTotals[$date])) $grandTotals[$date] = 0;
                                                                $grandTotals[$date] += $colTotal;
                                                            @endphp
                                                            <td class="text-xs text-center">
                                                                <strong>{{ number_format($colTotal, 0, ',', '.') }}</strong>
                                                            </td>
                                                        @endforeach
                                                    </tr>
                                                </tfoot>
                                            </table>
                                        </div>
                                    @else
                                        <p class="text-sm text-muted mb-0">Tidak ada data investor untuk kategori ini.</p>
                                    @endif
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            @endif

            {{-- ============ LAIN-LAIN ============ --}}
            @if (!empty($lain_lain) && $lain_lain['total_investor'] > 0)
                <div class="mb-4">
                    <div class="d-flex align-items-center mb-3">
                        <hr class="flex-grow-1 m-0" style="border-color: #8392ab; opacity: 0.5;">
                        <span class="px-3 fw-bold text-uppercase text-secondary" style="font-size: 0.9rem; letter-spacing: 1px;">
                            <i class="fas fa-ellipsis-h me-2"></i> Lain - Lain
                        </span>
                        <hr class="flex-grow-1 m-0" style="border-color: #8392ab; opacity: 0.5;">
                    </div>

                    <div class="card mb-3 kategori-section">
                    <div class="card-header p-3 d-flex justify-content-between align-items-center"
                        style="background-color: #FAFAFA;">
                        <h6 class="mb-0 text-uppercase fw-bold">Lain - Lain</h6>
                        <div class="d-flex align-items-center">
                            <span class="fw-bold me-3">
                                TOTAL SAHAM : {{ number_format($lain_lain['total_saham'], 0, ',', '.') }}
                            </span>
                        </div>
                    </div>
                    <div class="card-body p-3">
                        <p class="text-sm mb-2">
                            <strong>Total Investor : {{ $lain_lain['total_investor'] }}</strong>
                        </p>
                        <div class="table-responsive">
                            <table class="table table-bordered align-items-center mb-0 table-aligned">
                                <colgroup>
                                    <col style="width: 120px;">
                                    <col style="width: 250px;">
                                    <col style="width: 180px;">
                                    @foreach ($tanggal_columns as $date)
                                        <col style="width: 130px;">
                                    @endforeach
                                </colgroup>
                                <thead class="bg-primary text-white">
                                    <tr>
                                        <th class="text-uppercase text-xxs font-weight-bolder" colspan="3">Keterangan</th>
                                        @foreach ($tanggal_columns as $date)
                                            <th class="text-uppercase text-xxs font-weight-bolder text-center">
                                                {{ \Carbon\Carbon::parse($date)->format('d/m/Y') }}
                                            </th>
                                        @endforeach
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr class="fw-bold" style="background-color: #f8f9fa;">
                                        <td class="text-xs" colspan="3"><strong>Total</strong></td>
                                        @foreach ($tanggal_columns as $date)
                                            @php
                                                $lainTotal = $lain_lain['totals'][$date] ?? 0;
                                                if (!isset($grandTotals[$date])) $grandTotals[$date] = 0;
                                                $grandTotals[$date] += $lainTotal;
                                            @endphp
                                            <td class="text-xs text-center">
                                                <strong>{{ number_format($lainTotal, 0, ',', '.') }}</strong>
                                            </td>
                                        @endforeach
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                </div>
            @endif

            {{-- Grand Total --}}
            <div class="card mb-3">
                <div class="card-body p-3">
                    <div class="table-responsive">
                        <table class="table table-bordered align-items-center mb-0 table-aligned">
                            <colgroup>
                                <col style="width: 120px;">
                                <col style="width: 250px;">
                                <col style="width: 180px;">
                                @foreach ($tanggal_columns as $date)
                                    <col style="width: 130px;">
                                @endforeach
                            </colgroup>
                            <tbody>
                                <tr class="fw-bold" style="background-color: #e9ecef;">
                                    <td class="text-xs" colspan="3">
                                        <strong>Grand Total</strong>
                                    </td>
                                    @foreach ($tanggal_columns as $date)
                                        <td class="text-xs text-center">
                                            <strong>{{ number_format($grandTotals[$date] ?? 0, 0, ',', '.') }}</strong>
                                        </td>
                                    @endforeach
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        @else
            <div class="card">
                <div class="card-body p-4 text-center">
                    <p class="text-muted mb-0">Tidak ada data untuk ditampilkan. Silakan pilih tanggal dan filter.</p>
                </div>
            </div>
        @endif
    </div>
@endsection

@push('js')
    <script src="https://cdn.sheetjs.com/xlsx-0.20.1/package/dist/xlsx.full.min.js"></script>
    <script>
        $(document).ready(function() {
            // Toggle chevron icon on collapse
            $('.kategori-section .card-header').on('click', function() {
                var icon = $(this).find('.collapse-icon');
                var target = $(this).data('bs-target');
                $(target).on('shown.bs.collapse', function() {
                    icon.removeClass('fa-chevron-right').addClass('fa-chevron-down');
                });
                $(target).on('hidden.bs.collapse', function() {
                    icon.removeClass('fa-chevron-down').addClass('fa-chevron-right');
                });
            });

            // Initialize DataTables on report tables
            $('.report-table').each(function() {
                $(this).DataTable({
                    pageLength: 10,
                    lengthMenu: [10, 25, 50, 100],
                    ordering: false,
                    searching: true,
                    info: true,
                    language: {
                        search: "Cari:",
                        lengthMenu: "Tampilkan _MENU_ data",
                        info: "Menampilkan _START_ - _END_ dari _TOTAL_ data",
                        infoEmpty: "Tidak ada data",
                        infoFiltered: "(difilter dari _MAX_ total data)",
                        zeroRecords: "Data tidak ditemukan",
                        paginate: {
                            first: "Pertama",
                            last: "Terakhir",
                            next: "Selanjutnya",
                            previous: "Sebelumnya"
                        }
                    }
                });
            });

            // Export to Excel
            $('#btn-export-excel').on('click', function() {
                var allData = [];

                // Header row
                var headerRow = ['Kategori', 'Nomor SID', 'Nama Investor', 'Kode Pemegang Rekening'];
                @foreach ($tanggal_columns as $date)
                    headerRow.push('{{ \Carbon\Carbon::parse($date)->format("d/m/Y") }}');
                @endforeach
                allData.push(headerRow);

                // Data rows
                @foreach ($report as $section)
                    @foreach ($section['investors'] as $investor)
                        var row = [
                            '{{ $section["kategori"]->nama_kategori }}',
                            '{{ $investor["nomor_sid"] }}',
                            '{{ $investor["nama_investor"] }}',
                            '{{ $investor["kode_pemegang_rekening"] ?? '' }}'
                        ];
                        @foreach ($tanggal_columns as $date)
                            row.push({{ $investor['dates'][$date]['value'] ?? 0 }});
                        @endforeach
                        allData.push(row);
                    @endforeach
                    // Total row
                    var totalRow = ['', 'Total', '', ''];
                    @foreach ($tanggal_columns as $date)
                        totalRow.push({{ $section['totals'][$date] ?? 0 }});
                    @endforeach
                    allData.push(totalRow);
                    allData.push([]); // empty row separator
                @endforeach

                var wb = XLSX.utils.book_new();
                var ws = XLSX.utils.aoa_to_sheet(allData);
                XLSX.utils.book_append_sheet(wb, ws, "Report Pemegang Saham");
                XLSX.writeFile(wb, "Report_Pemegang_Saham_{{ $tanggal_selected }}.xlsx");
            });
        });
    </script>


    @push('css')
    <style>
        /* Tambahan CSS untuk memastikan kolom sejajar */
        .table-aligned {
            table-layout: fixed;
            width: 100%;
        }
        .table-aligned th, .table-aligned td {
            word-wrap: break-word; /* Agar teks panjang otomatis turun ke bawah */
            white-space: normal !important;
            vertical-align: middle;
        }
    </style>
    @endpush
@endpush