@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
{{-- section content --}}
@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="row mx-1">
                    <div class="card">
                        <div class="row">
                            <div class="card-header col-md-auto">
                                <h5 class="mb-0">List {{ $title_menu }}</h5>
                            </div>
                            <div class="col">
                                {{-- alert --}}
                                @include('components.alert')
                            </div>
                        </div>
                        <hr class="horizontal dark mt-0">
                        <div class="row px-4 py-2 justify-content-between align-items-center">
                            {{-- BAGIAN KIRI: TOMBOL TAMBAH (jika ada) --}}
                            <div class="col-auto mb-2 mb-md-0">
                                <div class="nav-wrapper"></div>
                            </div>

                            {{-- BAGIAN TENGAH: FILTER STATUS (BUTTON GROUP - sama seperti Matching Result) --}}
                            <div class="col-md-5 mb-2 mb-md-0">
                                <form action="{{ URL::to($url_menu) }}" method="GET" id="searchForm">
                                    @php
                                        $currentStatusFilter = request('status', $status_filter ?? null);
                                    @endphp
                                    <input type="hidden" name="status" id="statusInput"
                                        value="{{ $currentStatusFilter }}">
                                    <div class="d-flex flex-wrap align-items-center gap-1">
                                        <span class="mb-0 me-1 font-weight-bold text-sm text-secondary">
                                            Status Matching:
                                        </span>
                                        <div class="btn-group btn-group-sm" role="group"
                                            aria-label="Filter Status Matching">
                                            <button type="button"
                                                class="btn btn-outline-secondary status-filter-btn py-1 px-2 {{ $currentStatusFilter === null || $currentStatusFilter === '' ? 'active' : '' }}"
                                                data-status="">
                                                Entry/Prog
                                            </button>
                                            <button type="button"
                                                class="btn btn-outline-success status-filter-btn py-1 px-2 {{ $currentStatusFilter === 'completed' ? 'active' : '' }}"
                                                data-status="completed">
                                                Completed
                                            </button>
                                            <button type="button"
                                                class="btn btn-outline-danger status-filter-btn py-1 px-2 {{ $currentStatusFilter === 'underreview' ? 'active' : '' }}"
                                                data-status="underreview">
                                                Underreview
                                            </button>
                                            <button type="button"
                                                class="btn btn-outline-dark status-filter-btn py-1 px-2 {{ $currentStatusFilter === 'all' ? 'active' : '' }}"
                                                data-status="all">
                                                Semua
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>

                            {{-- BAGIAN KANAN: SEARCH BAR --}}
                            <div class="col-md-4 mt-2 mt-md-0">
                                <div class="d-flex align-items-center justify-content-end">
                                    <label for="searchInput" class="mb-0 me-2 font-weight-bold text-sm text-secondary">Cari
                                        :</label>
                                    <div class="input-group input-group-sm" style="max-width: 230px;">
                                        <span class="input-group-text bg-white border-end-0">
                                            <i class="fas fa-search text-secondary"></i>
                                        </span>
                                        <input type="text" id="searchInput" name="search"
                                            class="form-control border-start-0 border-radius-lg ps-2"
                                            placeholder="Request / Customer / Code..." value="{{ request('search') }}"
                                            form="searchForm" autocomplete="off">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row px-4 py-2">
                            <div class="container-fluid">
                                <div class="row">
                                    <div class="col-md-12">
                                        {{-- 3. CONTENT (LIST CARD) --}}
                                        <div id="table-data" class="card-body px-4 pb-4 mt-3" style="min-height: 400px;">

                                            {{-- Alert if Empty --}}
                                            @if ($table_detail->isEmpty())
                                                <div class="text-center p-5">
                                                    <div class="text-muted mb-2"><i class="fas fa-search fa-3x"></i>
                                                    </div>
                                                    <h6 class="text-secondary text-sm">No data found.</h6>
                                                </div>
                                            @else
                                                {{-- Loop through Grouped Data --}}
                                                @foreach ($table_detail as $reqNo => $group)
                                                    @php
                                                        $req = $group['request_info'];
                                                    @endphp

                                                    <div class="card mb-3 shadow-sm border-0">
                                                        {{-- CARD HEADER (Request Info) --}}
                                                        <div class="card-header p-3 bg-white border-bottom">
                                                            <div class="d-flex justify-content-between align-items-center">

                                                                <div class="grow">
                                                                    <h6
                                                                        class="mb-0 text-dark font-weight-bold d-flex align-items-center flex-wrap">
                                                                        <i
                                                                            class="fas fa-file-invoice text-primary me-2"></i>
                                                                        <span class="me-3">{{ $req->request_no }}</span>

                                                                        {{-- Target Test Lab Info --}}
                                                                        @php
                                                                            $targetLab =
                                                                                $group['target_test_lab'] ?? null;
                                                                        @endphp
                                                                        <div class="d-flex align-items-center flex-wrap"
                                                                            style="gap: 4px; text-transform: none !important;">
                                                                            <small
                                                                                class="text-xs font-weight-bold text-secondary d-flex align-items-center me-1">
                                                                                <i
                                                                                    class="fas fa-bullseye me-1 text-info"></i>
                                                                                <span>Target:</span>
                                                                            </small>
                                                                            <span class="badge badge-sm bg-light text-dark"
                                                                                style="text-transform: none !important;">L*
                                                                                {{ $targetLab && $targetLab->L !== null ? number_format($targetLab->L, 2) : '0' }}</span>
                                                                            <span class="badge badge-sm bg-light text-dark"
                                                                                style="text-transform: none !important;">a*
                                                                                {{ $targetLab && $targetLab->a !== null ? number_format($targetLab->a, 2) : '0' }}</span>
                                                                            <span class="badge badge-sm bg-light text-dark"
                                                                                style="text-transform: none !important;">b*
                                                                                {{ $targetLab && $targetLab->b !== null ? number_format($targetLab->b, 2) : '0' }}</span>
                                                                            <span class="badge badge-sm bg-light text-dark"
                                                                                style="text-transform: none !important;">C*
                                                                                {{ $targetLab && $targetLab->C !== null ? number_format($targetLab->C, 2) : '0' }}</span>
                                                                            <span class="badge badge-sm bg-light text-dark"
                                                                                style="text-transform: none !important;">h
                                                                                {{ $targetLab && $targetLab->h !== null ? number_format($targetLab->h, 2) : '0' }}</span>
                                                                        </div>
                                                                    </h6>

                                                                    <small class="text-muted text-xs ms-4">
                                                                        <i class="fas fa-user me-1"></i>
                                                                        {{ $req->customer_name }}
                                                                        &nbsp;|&nbsp;
                                                                        <i class="fas fa-palette me-1"></i>
                                                                        {{ $req->customer_color_code ?? '-' }}
                                                                    </small>
                                                                </div>

                                                                <div>
                                                                    @if ($authorize->add == '1')
                                                                        <button
                                                                            class="btn btn-sm btn-success mb-0 shadow-none"
                                                                            data-bs-toggle="modal"
                                                                            data-bs-target="#modalTargetSample"
                                                                            onclick="loadTargetSample('{{ $req->request_no }}', {{ $group['target_test_lab'] ? json_encode($group['target_test_lab']) : 'null' }})">
                                                                            <i class="fas fa-plus me-1"></i> Target
                                                                        </button>
                                                                    @endif
                                                                </div>
                                                            </div>
                                                        </div>

                                                        <div class="table-responsive">
                                                            <table class="table align-items-center mb-0">
                                                                <thead class="bg-light">
                                                                    <tr>
                                                                        <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-4"
                                                                            style="width: 25%;">Supplier</th>
                                                                        <th
                                                                            class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                                                            Code</th>
                                                                        <th
                                                                            class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                                                            Dosage</th>
                                                                        <th
                                                                            class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center">
                                                                            Delta</th>
                                                                        <th
                                                                            class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center">
                                                                            Status</th>
                                                                        <th
                                                                            class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 text-center">
                                                                            Action</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    @foreach ($group['suppliers'] as $supplierName => $samples)
                                                                        @php $rowCount = $samples->count(); @endphp

                                                                        @foreach ($samples as $index => $row)
                                                                            <tr
                                                                                class="{{ $index !== $rowCount - 1 ? 'border-bottom' : '' }}">

                                                                                {{-- 1. SUPPLIER COLUMN (Rowspan) --}}
                                                                                @if ($index === 0)
                                                                                    <td class="ps-4 align-top"
                                                                                        rowspan="{{ $rowCount }}"
                                                                                        style="width: 25%; background-color: #fff; border-right: 1px solid #f0f2f5;">
                                                                                        <div class="d-flex flex-column">
                                                                                            <span
                                                                                                class="text-sm font-weight-bold text-dark text-wrap mb-1">
                                                                                                {{ $row->supplier_to ?? $row->supplier_name }}
                                                                                            </span>


                                                                                        </div>
                                                                                    </td>
                                                                                @endif

                                                                                {{-- 2. SAMPLE CODE --}}
                                                                                <td class="align-middle text-center">
                                                                                    <div
                                                                                        class="d-flex flex-column align-items-center justify-content-center gap-2">

                                                                                        {{-- 1. BADGE KODE (Biru) --}}
                                                                                        @if ($row->code)
                                                                                            <span
                                                                                                class="badge badge-sm bg-gradient-info text-xxs px-3 shadow-sm">
                                                                                                {{ $row->code }}
                                                                                            </span>
                                                                                        @else
                                                                                            <span
                                                                                                class="text-xs text-secondary">-</span>
                                                                                        @endif

                                                                                        {{-- 2. BOX REMARK (Abu-abu) --}}
                                                                                        @if (!empty($row->lab_remark))
                                                                                            <div class="d-flex align-items-start p-2 bg-gray-100 border border-radius-md text-start"
                                                                                                style="min-width: 120px; max-width: 180px;">

                                                                                                {{-- Icon --}}
                                                                                                <i
                                                                                                    class="fas fa-info-circle text-secondary text-xs me-2 mt-0"></i>

                                                                                                {{-- Text --}}
                                                                                                <span
                                                                                                    class="text-xs text-secondary fst-italic text-wrap"
                                                                                                    style="line-height: 1.2;">
                                                                                                    {{ $row->lab_remark }}
                                                                                                </span>
                                                                                            </div>
                                                                                        @endif

                                                                                    </div>
                                                                                </td>

                                                                                {{-- 3. DOSAGE --}}
                                                                                <td class="align-middle text-center">
                                                                                    <span
                                                                                        class="text-xs text-secondary font-weight-bold">{{ $row->dosage }}%</span>
                                                                                </td>

                                                                                {{-- 4. DELTA VALUES (Tampilan Baru: Grid Rapi) --}}
                                                                                <td class="align-middle p-2"
                                                                                    style="width: 25%;">
                                                                                    <div
                                                                                        class="bg-gray-50 rounded p-2 border border-light">
                                                                                        <div class="row g-0">
                                                                                            {{-- Kolom Kiri: L & a --}}
                                                                                            <div
                                                                                                class="col-6 border-end pe-2">
                                                                                                <div
                                                                                                    class="d-flex justify-content-between mb-1">
                                                                                                    <span
                                                                                                        class="text-xxs text-secondary">ΔL*</span>
                                                                                                    <span
                                                                                                        class="text-xs font-weight-bold text-dark">{{ $row->tl_delta_L !== null ? number_format($row->tl_delta_L, 2) : '-' }}</span>
                                                                                                </div>
                                                                                                <div
                                                                                                    class="d-flex justify-content-between">
                                                                                                    <span
                                                                                                        class="text-xxs text-secondary">Δa*</span>
                                                                                                    <span
                                                                                                        class="text-xs font-weight-bold text-dark">{{ $row->tl_delta_a !== null ? number_format($row->tl_delta_a, 2) : '-' }}</span>
                                                                                                </div>
                                                                                            </div>
                                                                                            {{-- Kolom Kanan: b & E --}}
                                                                                            <div class="col-6 ps-2">
                                                                                                <div
                                                                                                    class="d-flex justify-content-between mb-1">
                                                                                                    <span
                                                                                                        class="text-xxs text-secondary">Δb*</span>
                                                                                                    <span
                                                                                                        class="text-xs font-weight-bold text-dark">{{ $row->tl_delta_b !== null ? number_format($row->tl_delta_b, 2) : '-' }}</span>
                                                                                                </div>
                                                                                                <div
                                                                                                    class="d-flex justify-content-between">
                                                                                                    <span
                                                                                                        class="text-xxs text-secondary fw-bold">ΔE*</span>
                                                                                                    {{-- Highlight Merah jika Delta E > 1 --}}
                                                                                                    <span
                                                                                                        class="text-xs font-weight-bolder {{ $row->tl_delta_E > 1 ? 'text-danger' : 'text-success' }}">
                                                                                                        {{ $row->tl_delta_E !== null ? number_format($row->tl_delta_E, 2) : '-' }}
                                                                                                    </span>
                                                                                                </div>
                                                                                            </div>
                                                                                        </div>
                                                                                    </div>
                                                                                </td>

                                                                                <td class="align-middle text-center"
                                                                                    style="width: 15%;">
                                                                                    @php
                                                                                        // 1. Tentukan Warna Tombol
                                                                                        $currentStatus =
                                                                                            $row->lab_status;
                                                                                        if (
                                                                                            empty($currentStatus) &&
                                                                                            $row->has_lab_data > 0
                                                                                        ) {
                                                                                            $currentStatus = 'entry';
                                                                                        }

                                                                                        $btnClass = match (
                                                                                            $currentStatus
                                                                                        ) {
                                                                                            'accepted'
                                                                                                => 'btn-outline-success',
                                                                                            'rejected'
                                                                                                => 'btn-outline-danger',
                                                                                            default
                                                                                                => 'btn-outline-secondary',
                                                                                        };

                                                                                        $labelStatus = match (
                                                                                            $currentStatus
                                                                                        ) {
                                                                                            'accepted' => 'ACC',
                                                                                            'rejected' => 'REJ',
                                                                                            default => 'ENTRY',
                                                                                        };

                                                                                        // Ambil remark saat ini untuk dikirim ke modal
                                                                                        $currentRemark =
                                                                                            $row->lab_remark ?? '';
                                                                                    @endphp

                                                                                    @if ($row->has_lab_data > 0 && $authorize->edit == '1')
                                                                                        {{-- TOMBOL PEMICU MODAL --}}
                                                                                        <button type="button"
                                                                                            class="btn btn-xs {{ $btnClass }} mb-0 px-3 py-1"
                                                                                            onclick="openUpdateModal('{{ $row->id }}', '{{ $currentStatus }}', '{{ $currentRemark }}')">
                                                                                            {{ $labelStatus }} <i
                                                                                                class="fas fa-pen ms-1 text-xxs"></i>
                                                                                        </button>
                                                                                    @endif
                                                                                </td>

                                                                                {{-- 6. ACTION COLUMN --}}
                                                                                <td class="align-middle text-center"
                                                                                    style="width: 10%;">
                                                                                    @if ($authorize->add == '1')
                                                                                        <a href="{{ URL::to($url_menu . '/add?request_no=' . $req->request_no . '&id_supplier=' . $row->id_supplier . '&highlight_id=' . $row->id) }}"
                                                                                            class="btn btn-xs btn-primary mb-0 shadow-none px-3 py-1"
                                                                                            data-bs-toggle="tooltip"
                                                                                            data-bs-placement="top"
                                                                                            title="Edit Data Lab">
                                                                                            <i class="fas fa-flask"></i>
                                                                                        </a>
                                                                                    @endif
                                                                                </td>
                                                                            </tr>
                                                                        @endforeach

                                                                        {{-- Separator Antar Supplier --}}
                                                                        @if (!$loop->last)
                                                                            <tr>
                                                                                <td colspan="6"
                                                                                    class="p-0 border-top border-2 border-light">
                                                                                </td>
                                                                            </tr>
                                                                        @endif
                                                                    @endforeach
                                                                </tbody>
                                                            </table>
                                                        </div>
                                                    </div>
                                                @endforeach
                                            @endif
                                            {{-- 4. PAGINATION --}}
                                            <div class="card-footer px-4 py-3">
                                                <div class="d-flex justify-content-end">
                                                    {{ $table_detail->appends(request()->input())->links('pagination::bootstrap-5') }}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        {{-- MODAL TARGET SAMPLE --}}
                        <div class="modal fade" id="modalTargetSample" tabindex="-1" role="dialog"
                            aria-labelledby="modalTargetSampleLabel" aria-hidden="true">
                            <div class="modal-dialog modal-dialog-centered" role="document">
                                <div class="modal-content">
                                    <form id="formTargetSample" method="POST">
                                        @csrf
                                        <div class="modal-header bg-gradient-success">
                                            <h5 class="modal-title text-white" id="modalTargetSampleLabel">
                                                <i class="fas fa-bullseye me-2"></i>Target Test Lab
                                            </h5>
                                            <button type="button" class="btn-close btn-close-white"
                                                data-bs-dismiss="modal" aria-label="Close"></button>
                                        </div>
                                        <div class="modal-body">
                                            <input type="hidden" name="request_no" id="target_request_no">
                                            <input type="hidden" name="target_id" id="target_id">
                                            <div class="mb-3">
                                                <label class="form-control-label text-xs font-weight-bold mb-2">Request
                                                    No:</label>
                                                <input type="text" class="form-control" id="target_request_no_display"
                                                    readonly>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-6 mb-3">
                                                    <label class="form-control-label text-xs font-weight-bold">L*</label>
                                                    <input type="number" step="0.01" class="form-control"
                                                        name="L" id="target_L" required>
                                                </div>
                                                <div class="col-md-6 mb-3">
                                                    <label class="form-control-label text-xs font-weight-bold">a*</label>
                                                    <input type="number" step="0.01" class="form-control"
                                                        name="a" id="target_a" required>
                                                </div>
                                                <div class="col-md-6 mb-3">
                                                    <label class="form-control-label text-xs font-weight-bold">b*</label>
                                                    <input type="number" step="0.01" class="form-control"
                                                        name="b" id="target_b" required>
                                                </div>
                                                <div class="col-md-6 mb-3">
                                                    <label class="form-control-label text-xs font-weight-bold">C*</label>
                                                    <input type="number" step="0.01" class="form-control"
                                                        name="C" id="target_C" required>
                                                </div>
                                                <div class="col-md-6 mb-3">
                                                    <label class="form-control-label text-xs font-weight-bold">h</label>
                                                    <input type="number" step="0.01" class="form-control"
                                                        name="h" id="target_h" required>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-secondary"
                                                data-bs-dismiss="modal">Batal</button>
                                            <button type="submit" class="btn btn-success">
                                                <i class="fas fa-save me-1"></i>Simpan
                                            </button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>

                        <div class="row px-4 py-2">
                            <div class="col-lg">
                                <div class="nav-wrapper" id="noted"><code>Note : <i aria-hidden="true"
                                            style="color: #ffc2cd;" class="fas fa-circle"></i> Data not active</code>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- ======================================================= --}}
    {{-- MODAL UPDATE STATUS (YANG TADI HILANG WRAPPERNYA) --}}
    {{-- ======================================================= --}}
    <div class="modal fade" id="modalUpdateStatus" tabindex="-1" role="dialog" aria-labelledby="modalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                {{-- Header Modal --}}
                <div class="modal-header">
                    <h5 class="modal-title" id="modalLabel">Update Status Lab</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                {{-- Body Modal (Form) --}}
                <div class="modal-body">
                    <form id="formUpdateStatus">
                        {{-- Hidden ID --}}
                        <input type="hidden" id="modal_row_id">

                        {{-- Pilihan Status --}}
                        <div class="form-group mb-3">
                            <label for="modal_status" class="form-control-label">Status <span
                                    class="text-danger">*</span></label>
                            <select class="form-select" id="modal_status" onchange="populateRemarkOptions()">
                                {{-- Opsi ENTRY DIBUANG agar tidak bisa kembali --}}
                                <option value="accepted" class="text-success fw-bold">ACCEPTED</option>
                                <option value="rejected" class="text-danger fw-bold">REJECTED</option>
                            </select>
                        </div>

                        {{-- Pilihan Remark --}}
                        <div class="form-group mb-0">
                            <label for="modal_remark" class="form-control-label">Remark / Alasan <span
                                    class="text-danger">*</span></label>
                            <select class="form-select" id="modal_remark">
                                {{-- Diisi via JS --}}
                            </select>
                        </div>
                    </form>
                </div>

                {{-- Footer Modal (Tombol Simpan) --}}
                <div class="modal-footer">
                    <button type="button" class="btn bg-gradient-secondary" data-bs-dismiss="modal">Batal</button>
                    <button type="button" class="btn bg-gradient-primary"
                        onclick="submitUpdateFromModal()">Simpan</button>
                </div>
            </div>
        </div>
    </div>
    {{-- ======================================================= --}}
    {{-- LOADING OVERLAY --}}
    <div id="loading-overlay"
        style="display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.7); z-index: 9999; flex-direction: column; justify-content: center; align-items: center; backdrop-filter: blur(2px);">
        <div class="spinner-border text-primary" role="status" style="width: 3rem; height: 3rem;">
            <span class="visually-hidden">Loading...</span>
        </div>
        <h6 class="mt-3 text-dark font-weight-bold">Sedang Memproses...</h6>
    </div>
    <form id="formUpdateStatusDirect" action="{{ route('testlab.update_status') }}" method="POST"
        style="display: none;">
        @csrf
        <input type="hidden" name="id" id="direct_status_id">
        <input type="hidden" name="status" id="direct_status_value">
        <input type="hidden" name="remark" id="direct_status_remark">
        {{-- <input type="hidden" name="request_no" value="{{ $req->request_no }}"> --}}
    </form>
    {{-- check flag js on dmenu --}}
    @if ($jsmenu == '1')
        @if (view()->exists("js.{$dmenu}"))
            @push('addjs')
                {{-- file js in folder (resources/views/js) --}}
                @include('js.' . $dmenu);
            @endpush
        @else
            @push('addjs')
                <script>
                    Swal.fire({
                        title: 'JS Not Found!!',
                        text: 'Please Create File JS',
                        icon: 'error',
                        confirmButtonColor: '#028284'
                    });
                </script>
            @endpush
        @endif
    @endif
@endsection
@push('js')
    <script>
        // --- STATUS FILTER & SEARCH (sama seperti Matching Result - konsisten) ---
        $(document).ready(function() {
            const searchInput = $('#searchInput');
            const statusInput = $('#statusInput');
            let typingTimer;
            const doneTypingInterval = 500;

            function reapplyStatusColors() {
                // Optional: reapply UI state setelah AJAX load (jika ada elemen yang perlu)
            }

            searchInput.on('keyup', function() {
                clearTimeout(typingTimer);
                typingTimer = setTimeout(performSearch, doneTypingInterval);
            });
            searchInput.on('keydown', function() {
                clearTimeout(typingTimer);
            });

            $('.status-filter-btn').on('click', function() {
                const btn = $(this);
                const newStatus = btn.data('status') ?? '';
                statusInput.val(newStatus);
                $('.status-filter-btn').removeClass('active');
                btn.addClass('active');
                performSearch();
            });

            function performSearch() {
                let query = searchInput.val() || '';
                let status = statusInput.val() || '';
                let mainUrl = "{{ URL::to($url_menu) }}";
                let params = [];
                if (query !== '') {
                    params.push('search=' + encodeURIComponent(query));
                }
                if (status !== '') {
                    params.push('status=' + encodeURIComponent(status));
                }
                let targetUrl = mainUrl;
                if (params.length > 0) {
                    targetUrl += '?' + params.join('&');
                }
                loadTable(targetUrl);
            }

            $(document).on('click', '.pagination a', function(event) {
                event.preventDefault();
                let pageUrl = $(this).attr('href');
                let query = searchInput.val() || '';
                let status = statusInput.val() || '';
                let url = new URL(pageUrl, window.location.origin);
                if (query !== '') {
                    url.searchParams.set('search', query);
                } else {
                    url.searchParams.delete('search');
                }
                if (status !== '') {
                    url.searchParams.set('status', status);
                } else {
                    url.searchParams.delete('status');
                }
                loadTable(url.toString());
            });

            function loadTable(url) {
                $('#table-data').css('opacity', '0.3');
                $.get(url, function(data) {
                    let newContent = $(data).find('#table-data').html();
                    $('#table-data').html(newContent);
                    setTimeout(reapplyStatusColors, 0);
                    $('#table-data').css('opacity', '1');
                    $('html, body').animate({
                        scrollTop: $("#table-data").offset().top - 100
                    }, 300);
                }).fail(function() {
                    $('#table-data').css('opacity', '1');
                    alert("Gagal memuat data.");
                });
            }
        });


        // 1. DATA OPSI REMARK dari sys_enum (accepted -> okmark, rejected -> nomark)
        const remarkAcceptedOptions = @json($remark_accepted_options ?? []);
        const remarkRejectedOptions = @json($remark_rejected_options ?? []);
        const reasonOptions = {
            accepted: remarkAcceptedOptions,
            rejected: remarkRejectedOptions
        };

        // 2. FUNGSI UPDATE DROPDOWN REMARK
        function populateRemarkOptions(selectedRemark = null) {
            const statusSelect = document.getElementById('modal_status');
            const remarkSelect = document.getElementById('modal_remark');
            const currentStatus = statusSelect.value;

            remarkSelect.innerHTML = '';

            const options = reasonOptions[currentStatus];
            if (options && Array.isArray(options)) {
                options.forEach(function(item) {
                    const value = item.value !== undefined ? item.value : item;
                    const name = item.name !== undefined ? item.name : item;
                    let option = document.createElement('option');
                    option.value = value;
                    option.textContent = name;
                    if (selectedRemark && selectedRemark === value) {
                        option.selected = true;
                    }
                    remarkSelect.appendChild(option);
                });
            }
        }

        // 3. FUNGSI BUKA MODAL (DIPERBAIKI)
        function openUpdateModal(id, currentStatus, currentRemark) {
            // Isi ID
            document.getElementById('modal_row_id').value = id;

            // Set Status di Modal
            const statusSelect = document.getElementById('modal_status');

            if (currentStatus === 'entry' || !currentStatus) {
                statusSelect.value = 'accepted';
            } else {
                statusSelect.value = currentStatus;
            }

            // Panggil fungsi untuk isi dropdown remark
            populateRemarkOptions(currentRemark);

            // --- FIX ERROR BOOTSTRAP DISINI ---
            var modalElement = document.getElementById('modalUpdateStatus');

            // Cek dulu apakah instance modal sudah ada?
            var myModal = bootstrap.Modal.getInstance(modalElement);

            if (!myModal) {
                // Jika belum ada, baru buat instance baru
                myModal = new bootstrap.Modal(modalElement);
            }

            myModal.show();
        }

        // 4. FUNGSI SIMPAN (AJAX)
        // 4. FUNGSI SIMPAN (AJAX)
        function submitUpdateFromModal() {
            let rowId = document.getElementById('modal_row_id').value;
            let newStatus = document.getElementById('modal_status').value;
            let newRemark = document.getElementById('modal_remark').value;

            // Validasi sederhana
            if (!newRemark) {
                Swal.fire({
                    icon: 'warning',
                    title: 'Peringatan',
                    text: 'Harap pilih Remark/Alasan!',
                    confirmButtonColor: '#028284'
                });
                return;
            }

            // Tutup Modal
            var modalEl = document.getElementById('modalUpdateStatus');
            var modal = bootstrap.Modal.getInstance(modalEl);
            if (modal) {
                modal.hide();
            }

            // Tampilkan Loading (Optional, bagus untuk UX)
            $('#loading-overlay').css('display', 'flex');

            // AJAX Request
            $.ajax({
                // PERBAIKAN UTAMA DISINI: Gunakan helper route() agar URL otomatis benar
                url: "{{ route('testlab.update_status') }}",
                type: "POST",
                data: {
                    _token: "{{ csrf_token() }}",
                    id: rowId,
                    status: newStatus,
                    remark: newRemark
                },
                success: function(response) {
                    $('#loading-overlay').hide();
                    Swal.fire({
                        icon: 'success',
                        title: 'Berhasil',
                        text: 'Status berhasil diperbarui',
                        timer: 1500,
                        showConfirmButton: false
                    }).then(() => {
                        location.reload();
                    });
                },
                error: function(xhr) {
                    $('#loading-overlay').hide();
                    // Tampilkan pesan error yang lebih detail
                    let msg = "Gagal update";
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        msg = xhr.responseJSON.message;
                    }
                    Swal.fire({
                        icon: 'error',
                        title: 'Gagal',
                        text: msg + ' (' + xhr.status + ')',
                        confirmButtonColor: '#028284'
                    });
                }
            });
        }

        // ... (Sisa fungsi target sample biarkan seperti sebelumnya) ...
        // Function untuk load target sample ke modal
        function loadTargetSample(requestNo, targetData) {
            $('#target_request_no').val(requestNo);
            $('#target_request_no_display').val(requestNo);

            if (targetData && targetData !== null) {
                $('#target_id').val(targetData.id);
                $('#target_L').val(targetData.L || '');
                $('#target_a').val(targetData.a || '');
                $('#target_b').val(targetData.b || '');
                $('#target_C').val(targetData.C || '');
                $('#target_h').val(targetData.h || '');
            } else {
                $('#target_id').val('');
                $('#target_L').val('');
                $('#target_a').val('');
                $('#target_b').val('');
                $('#target_C').val('');
                $('#target_h').val('');
            }
        }

        $('#formTargetSample').on('submit', function(e) {
            e.preventDefault();
            const formData = $(this).serialize();

            // 1. Tutup Modal Dulu (Optional, atau biarkan terbuka sampai sukses)
            $('#modalTargetSample').modal('hide');

            // 2. Tampilkan Loading Overlay
            $('#loading-overlay').css('display', 'flex');

            $.ajax({
                url: "{{ url('teslab/target-sample') }}",
                method: 'POST',
                data: formData,
                success: function(response) {
                    $('#loading-overlay').hide();
                    if (response.success) {
                        Swal.fire({
                            icon: 'success',
                            title: 'Berhasil!',
                            text: response.message || 'Target sample berhasil disimpan',
                            confirmButtonColor: '#028284'
                        }).then(() => {
                            location.reload();
                        });
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Error!',
                            text: response.message || 'Terjadi kesalahan',
                            confirmButtonColor: '#028284'
                        });
                    }
                },
                error: function(xhr) {
                    $('#loading-overlay').hide();
                    let errorMessage = 'Terjadi kesalahan';
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMessage = xhr.responseJSON.message;
                    }
                    Swal.fire({
                        icon: 'error',
                        title: 'Error!',
                        text: errorMessage,
                        confirmButtonColor: '#028284'
                    });
                }
            });
        });
    </script>
@endpush