@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                {{-- Panduan & Aturan Penting --}}
                <div class="row mx-1 mb-3">
                    <div class="card shadow-sm">
                        <div class="card-body">
                            <h5 class="mb-3">Panduan & Aturan Perhitungan Lembur</h5>

                            <div class="mb-3">
                                <h6 class="text-primary">
                                    <i class="fas fa-info-circle me-1"></i> Petunjuk Penggunaan Master Perhitungan Lembur
                                </h6>
                                <ul class="mb-0 text-sm text-dark">
                                    <li>Master Perhitungan Lembur ini digunakan untuk mengkonfigurasi tarif konversi jam kerja per <strong>Jabatan</strong> dan <strong>Jenis Lembur</strong>.</li>
                                    <li>Tabel detail menentukan nilai konversi dan selisih konversi untuk setiap jam kerja (Jam 1, Jam 2, dst.).</li>
                                    <li>Setiap aturan wajib memiliki minimal <strong>2 baris detail jam kerja</strong>.</li>
                                </ul>
                            </div>

                            <div>
                                <h6 class="text-warning">
                                    <i class="fas fa-exclamation-triangle me-1"></i> Aturan Perhitungan Standar
                                </h6>
                                <p class="mb-0 text-sm text-muted">
                                    <strong>Catatan :</strong> Jabatan yang tidak diset pada master ini akan otomatis menggunakan perhitungan standar:
                                    <code class="text-danger font-weight-bold">Total Jam × 1,87% × Umk</code>.
                                </p>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- Data Table --}}
                <div class="row mx-1">
                    <div class="card shadow-sm">
                        <div class="card-header pb-0 border-bottom">
                            <div class="d-flex justify-content-between align-items-center mb-2">
                                <div>
                                    <h5 class="mb-0 font-weight-bold text-dark">List {{ $title_menu }}</h5>
                                </div>
                            </div>
                            @include('components.alert')
                        </div>

                        <div class="card-body px-4 pt-3 pb-2">
                            {{-- Action Bar --}}
                            <div class="d-flex flex-wrap justify-content-between align-items-center mb-3 gap-2">
                                <div class="d-flex flex-wrap align-items-center gap-2">
                                    @if (isset($authorize) && $authorize->add == '1')
                                        <a href="{{ url($url_menu . '/add') }}" class="btn btn-primary mb-0 px-3">
                                            <i class="fas fa-plus me-1"></i> Tambah
                                        </a>
                                    @endif

                                    <!-- @if (isset($authorize) && $authorize->excel == '1')
                                        <a href="{{ url($url_menu . '?export=excel') }}" class="btn btn-success mb-0 px-3">
                                            <i class="fas fa-file-excel me-1"></i> Excel
                                        </a>
                                    @endif

                                    @if (isset($authorize) && $authorize->pdf == '1')
                                        <a href="{{ url($url_menu . '?export=pdf') }}" class="btn btn-danger mb-0 px-3">
                                            <i class="fas fa-file-pdf me-1"></i> PDF
                                        </a>
                                    @endif

                                    @if (isset($authorize) && $authorize->print == '1')
                                        <button class="btn btn-info mb-0 px-3" onclick="window.print()">
                                            <i class="fas fa-print me-1"></i> Print
                                        </button>
                                    @endif -->
                                </div>

                            </div>

                            {{-- Data Table --}}
                            <div class="table-responsive p-0">
                                <table class="table align-items-center mb-0 display" id="list_{{ $dmenu }}">
                                    <thead class="thead-light" style="background-color: #00b7bd4f;">
                                        <tr>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7" width="110">Action</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center" width="50">No</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Jabatan</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Jenis Lembur</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Upah Dasar</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center">Penyebut</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center">Jumlah Baris Jam</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Keterangan</th>
                                            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center">Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @forelse ($table_detail as $item)
                                            @php
                                                $vcount = ($table_detail->currentPage() - 1) * $table_detail->perPage() + $loop->iteration;
                                            @endphp
                                            <tr {{ $item->isactive == '0' ? 'class=not style=background-color:#ffe9ed;' : '' }}>
                                                <td class="text-sm font-weight-normal text-center">
                                                    <div class="btn-group">
                                                        <button class="btn btn-primary btn-sm mb-0 px-3" type="button"
                                                            title="View Data"
                                                            onclick="window.location='{{ url($url_menu . '/show/' . encrypt($item->id)) }}'">
                                                            <i class="fas fa-eye"></i> View
                                                        </button>
                                                        <button type="button"
                                                            class="btn btn-sm btn-primary mb-0 px-2 dropdown-toggle dropdown-toggle-split"
                                                            data-bs-toggle="dropdown" aria-expanded="false">
                                                            <span class="visually-hidden">Toggle Dropdown</span>
                                                        </button>
                                                        <ul class="dropdown-menu">
                                                            @if (isset($authorize) && $authorize->edit == '1')
                                                                <li>
                                                                    <a class="dropdown-item"
                                                                        href="{{ url($url_menu . '/edit/' . encrypt($item->id)) }}">
                                                                        <i class="fas fa-edit text-warning me-1"></i> Edit
                                                                    </a>
                                                                </li>
                                                            @endif
                                                            @if (isset($authorize) && $authorize->delete == '1')
                                                                <li>
                                                                    <button type="button" class="dropdown-item {{ $item->isactive == '0' ? 'text-success' : 'text-danger' }}"
                                                                        title="{{ $item->isactive == '0' ? 'Aktifkan Data' : 'Nonaktifkan Data' }}"
                                                                        onclick="confirmDeactivate('{{ url($url_menu . '/destroy/' . encrypt($item->id)) }}', '{{ $item->isactive == '0' ? 'mengaktifkan' : 'menonaktifkan' }}')">
                                                                        <i class="fas {{ $item->isactive == '0' ? 'fa-check-circle' : 'fa-ban' }} me-1"></i> {{ $item->isactive == '0' ? 'Aktifkan' : 'Nonaktifkan' }}
                                                                    </button>
                                                                </li>
                                                            @endif

                                                            @if ((!isset($authorize) || $authorize->edit != '1') && (!isset($authorize) || $authorize->delete != '1'))
                                                                <li><span class="dropdown-item-text text-muted">Tidak ada aksi</span></li>
                                                            @endif
                                                        </ul>
                                                    </div>
                                                </td>
                                                <td class="align-middle text-center text-sm">{{ $vcount }}</td>
                                                <td class="align-middle text-sm font-weight-bold text-dark">
                                                    {{ $item->jabatan }}
                                                </td>
                                                <td class="align-middle text-sm font-weight-bold text-dark">
                                                    {{ $item->jenis_lembur }}
                                                </td>
                                                <td class="align-middle text-sm font-weight-bold text-dark">
                                                    {{ str_replace('_', ' ', $item->upah_dasar) }}
                                                </td>
                                                <td class="align-middle text-center text-sm text-dark">
                                                    {{ number_format($item->penyebut, 0) }}
                                                </td>
                                                <td class="align-middle text-center text-sm text-dark">
                                                    {{ $item->total_detail }} Jam
                                                </td>
                                                <td class="align-middle text-sm text-wrap" style="max-width: 250px;">
                                                    {{ $item->keterangan ?? '-' }}
                                                </td>
                                                <td class="align-middle text-center text-sm">
                                                    @if ($item->isactive == '1')
                                                        <span class="badge bg-success">Active</span>
                                                    @else
                                                        <span class="badge bg-danger">Non Active</span>
                                                    @endif
                                                </td>
                                            </tr>
                                        @empty
                                            <tr>
                                                <td colspan="9" class="text-center py-4 text-sm text-secondary">
                                                    <i class="fas fa-inbox me-1"></i> Belum ada data perhitungan overtime.
                                                </td>
                                            </tr>
                                        @endforelse
                                    </tbody>
                                </table>
                            </div>

                            {{-- Footer Note & Pagination --}}
                            <div class="d-flex justify-content-between align-items-center mt-3 px-2">
                                <div>
                                    <p class="text-xs text-secondary mb-0">
                                        Data {{ $table_detail->firstItem() ?? 0 }} - {{ $table_detail->lastItem() ?? 0 }} dari {{ $table_detail->total() }}
                                    </p>
                                    <p class="text-xs text-danger mb-0 mt-1">
                                        <span class="d-inline-block rounded-circle me-1" style="width: 8px; height: 8px; background-color: #ff99aa;"></span> Note : Data not active
                                    </p>
                                </div>
                                <div>
                                    {{ $table_detail->links() }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        function confirmDeactivate(url, actionText) {
            const title = actionText === 'mengaktifkan' ? 'Aktifkan Data?' : 'Nonaktifkan Data?';
            const text = actionText === 'mengaktifkan' ? 'Data perhitungan overtime ini akan diaktifkan kembali.' : 'Data perhitungan overtime ini akan dinonaktifkan.';
            const confirmBtnText = actionText === 'mengaktifkan' ? 'Ya, Aktifkan' : 'Ya, Nonaktifkan';
            const confirmBtnColor = actionText === 'mengaktifkan' ? '#4caf50' : '#e53e3e';

            if (typeof Swal === 'undefined') {
                if (confirm('Yakin ingin ' + actionText + ' data ini?')) {
                    window.location.href = url;
                }
                return;
            }

            Swal.fire({
                title: title,
                text: text,
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: confirmBtnColor,
                cancelButtonColor: '#6c757d',
                confirmButtonText: confirmBtnText,
                cancelButtonText: 'Batal',
                reverseButtons: true
            }).then(function(result) {
                if (result.isConfirmed) {
                    window.location.href = url;
                }
            });
        }
    </script>
@endsection