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

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])

    <div class="container-fluid py-3">
        {{-- Banner info (card) data missing yang belum dikonfirmasi +
             tanggal yang belum di-pull: tampil di paling atas bagian report,
             TETAP tampil (tidak menutup otomatis) selama masih ada salah satu
             dari keduanya pada rentang filter, dan hilang sendiri ketika data
             sudah bersih. Partial sama dipakai report rptabs. --}}
        @include('components.alert_unconfirmed_missing')

        <div class="card shadow-sm">
            <div class="card-body p-3">
                @if (($filter['layout'] ?? 'overall') === 'keterlambatan')
                    @include('report.rptovr.result_keterlambatan')
                @else
                    <h4 class="text-dark font-weight-bold mb-3">List Rekap Kehadiran Karyawan</h4>
                    <hr class="horizontal dark mt-0">

                    <div class="mb-2">
                        <button class="btn btn-secondary mb-0" onclick="history.back()">
                            <i class="fas fa-circle-left me-1"></i>
                            Kembali
                        </button>
                    </div>

                    <div id="missingExportButtons" class="d-flex gap-2 flex-wrap mb-2"></div>

                    <div class="table-responsive">
                        <table class="table table-hover align-items-center mb-0" id="list_{{ $dmenu }}">
                            <thead class="thead-light" style="background-color: #00b7bd4f;">
                                <tr>
                                    <th>No</th>
                                    <th>NIK</th>
                                    <th>Nama Karyawan</th>
                                    <th>Departemen</th>
                                    <th class="text-center">Hadir</th>
                                    <th class="text-center">Izin</th>
                                    <th class="text-center">Cuti</th>
                                    <th class="text-center">Sakit</th>
                                    <th class="text-center">Mangkir</th>
                                    <th class="text-center">Skorsing</th>
                                    <th class="text-center">Tidak Hadir Lainnya</th>
                                    <th class="text-center">Terlambat</th>
                                    <th class="text-center">Pulang Cepat</th>
                                    <th class="text-center">Belum Finger In</th>
                                    <th class="text-center">Belum Finger Out</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (($rows ?? []) as $row)
                                    <tr>
                                        <td>{{ $loop->iteration }}</td>
                                        <td>{{ $row['nik'] }}</td>
                                        <td>{{ $row['nama_karyawan'] }}</td>
                                        <td>{{ $row['departemen'] ?? '-' }}</td>
                                        <td class="text-center">{{ $row['hadir'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['izin'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['cuti'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['sakit'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['mangkir'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['skorsing'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['tidak_hadir_lainnya'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['terlambat'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['pulang_cepat'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['belum_finger_in'] ?? 0 }}</td>
                                        <td class="text-center">{{ $row['belum_finger_out'] ?? 0 }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                            @if (!empty($rows))
                                {{-- Baris total keseluruhan: 1 cell per kolom supaya urutan
                                     kolom tetap sinkron saat data diexport (Excel/PDF/Print). --}}
                                <tfoot style="background-color: #00b7bd4f; border-top: 2px solid #00b7bd;">
                                    <tr class="font-weight-bold text-dark">
                                        <td></td>
                                        <td></td>
                                        <td></td>
                                        <td class="text-end">
                                            TOTAL KESELURUHAN ({{ number_format($totals['total_karyawan'] ?? count($rows), 0, ',', '.') }} Karyawan)
                                        </td>
                                        <td class="text-center">{{ number_format($totals['hadir'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['izin'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['cuti'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['sakit'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['mangkir'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['skorsing'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['tidak_hadir_lainnya'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['terlambat'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['pulang_cepat'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['belum_finger_in'] ?? 0, 0, ',', '.') }}</td>
                                        <td class="text-center">{{ number_format($totals['belum_finger_out'] ?? 0, 0, ',', '.') }}</td>
                                    </tr>
                                </tfoot>
                            @endif
                        </table>
                    </div>

                    <code class="text-xs d-block mt-2">
                        Note : Data untuk karyawan aktif MSJ.
                    </code>

                    <div class="mt-3"></div>
                @endif
            </div>
        </div>
    </div>

    @if (($filter['layout'] ?? 'overall') !== 'keterlambatan')
        @push('js')
            <script>
                let missingTable = null;

                // Index kolom angka pada rekap overall: 0 No, 1 NIK, 2 Nama
                // Karyawan, 3 Departemen, 4 Hadir, 5 Izin, 6 Cuti, 7 Sakit,
                // 8 Mangkir, 9 Skorsing, 10 Tidak Hadir Lainnya, 11 Terlambat,
                // 12 Pulang Cepat, 13 Belum Finger In, 14 Belum Finger Out.
                const OVERALL_PAGE_LENGTH = 20;
                const OVERALL_TOTAL_COLUMNS = [4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14];
                const OVERALL_LABEL_COLUMN = 3;

                function formatOverallTotal(value) {
                    return new Intl.NumberFormat('id-ID').format(value);
                }

                // Hitung ulang baris total (tfoot) setiap tabel digambar, supaya
                // angka total selalu sesuai dengan baris yang sedang tampil
                // (mengikuti kata kunci pada kolom Cari).
                function refreshOverallTotals(api) {
                    if (!api.table().footer()) {
                        return;
                    }

                    OVERALL_TOTAL_COLUMNS.forEach(function(columnIndex) {
                        const total = api
                            .column(columnIndex, { search: 'applied' })
                            .data()
                            .reduce(function(carry, value) {
                                const number = parseInt(String(value).replace(/[^0-9-]/g, ''), 10);
                                return carry + (isNaN(number) ? 0 : number);
                            }, 0);

                        $(api.column(columnIndex).footer()).html(formatOverallTotal(total));
                    });

                    const totalKaryawan = api.rows({ search: 'applied' }).count();
                    $(api.column(OVERALL_LABEL_COLUMN).footer())
                        .html('TOTAL KESELURUHAN (' + formatOverallTotal(totalKaryawan) + ' Karyawan)');
                }

                function applyMsjButtonStyle() {
                    $('#missingExportButtons .dt-button').addClass('btn btn-secondary mb-0 me-1');
                    $('#missingExportButtons .dt-button').removeClass('dt-button');
                }

                $(document).ready(function() {
                    missingTable = $('#list_{{ $dmenu }}').DataTable({
                        order: [],
                        pageLength: OVERALL_PAGE_LENGTH,
                        lengthChange: false,
                        language: {
                            lengthMenu: 'Tampilkan _MENU_ baris',
                            zeroRecords: 'Maaf - Data tidak ada',
                            info: 'Data _START_ - _END_ dari _TOTAL_',
                            infoEmpty: 'Tidak ada data',
                            infoFiltered: '(pencarian dari _MAX_ data)'
                        },
                        responsive: true,
                        drawCallback: function(settings) {
                            refreshOverallTotals(new $.fn.dataTable.Api(settings));

                            $('#list_{{ $dmenu }} tbody td').each(function() {
                                var cellText = $(this).text().trim();
                                if (cellText === '-') {
                                    $(this).css('text-align', 'center');
                                }
                            });
                        }
                    });

                    new $.fn.dataTable.Buttons(missingTable, {
                        buttons: [
                            { extend: 'excelHtml5', text: '<i class="fas fa-file-excel me-1 text-lg text-success"></i><span class="font-weight-bold"> Excel', title: 'Rekap Kehadiran Karyawan', exportOptions: { footer: true } },
                            { extend: 'pdfHtml5', text: '<i class="fas fa-file-pdf me-1 text-lg text-danger"></i><span class="font-weight-bold"> PDF', title: 'Rekap Kehadiran Karyawan', orientation: 'landscape', pageSize: 'A4', exportOptions: { footer: true } },
                            { extend: 'print', text: '<i class="fas fa-print me-1 text-lg text-info"></i><span class="font-weight-bold"> Print', title: 'Rekap Kehadiran Karyawan', exportOptions: { footer: true } }
                        ]
                    });

                    missingTable.buttons(0, null).container().appendTo('#missingExportButtons');
                    applyMsjButtonStyle();
                });
            </script>
        @endpush
    @endif
@endsection