{{-- Author By : zulfazdliabuas@gmail.com | Date : 2026 --}}
@php
    use Illuminate\Support\Facades\Storage;
    use Illuminate\Support\Str;
@endphp
@push('styles')
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/bootstrap-table.min.css" rel="stylesheet">
<style>
    .sticky-actions {
        position: sticky;
        right: 0;
        background: #fff;
        z-index: 2;
        box-shadow: -12px 0 12px -12px rgba(15, 23, 42, 0.35);
        background-clip: padding-box;
    }
    .table-light .sticky-actions {
        background: #f8f9fa;
        z-index: 3;
    }
</style>
@endpush

<x-app-layout>
    <div class="py-4 submissions-page">
        <div class="container">
            @php
                $canManageSubmissionActions = auth()->user()?->hasAnyRole(['admin', 'ao']) ?? false;
            @endphp
            <div class="d-flex align-items-center justify-content-between mb-3">
                <div>
                    <h2 class="h5 mb-1">LHDN Submissions</h2>
                    <p class="text-muted mb-0">All documents submitted to LHDN (valid or invalid).</p>
                </div>
            </div>

            <div class="row g-3 mb-4">
                <div class="col-6 col-md-4 col-lg">
                    <a class="text-decoration-none" href="{{ route('admin.requests.index') }}">
                        <div class="card shadow-sm border-0 h-100">
                            <div class="card-body">
                                <div class="text-muted small">e-Invoice Requests</div>
                                <div class="fs-3 fw-bold">{{ $counts['requests'] }}</div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-md-4 col-lg">
                    <div class="card shadow-sm border-0 h-100">
                        <div class="card-body">
                            <div class="text-muted small">Documents Submitted to LHDN</div>
                            <div class="fs-3 fw-bold text-primary">{{ $counts['submitted'] }}</div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card shadow-sm border-0 mb-3 subs_list_filter_card">
                <div class="card-body subs_list_filter_body">
                    <form method="get" action="{{ route('admin.submissions.index') }}" class="row g-3 align-items-end js-submissions-filter subs_list_filter_form">
                        <div class="col-12 col-lg-5">
                            <label class="form-label">Keyword</label>
                            <input name="q" class="form-control" placeholder="Name, email, phone, invoice, car plate"
                                   value="{{ request('q') }}">
                        </div>
                        <div class="col-12 col-md-4 col-lg-3">
                            <label class="form-label">Status</label>
                            <select name="status" class="form-select">
                                <option value="">All</option>
                                @foreach(['validated','failed','einvoice_sent_to_customer'] as $status)
                                    <option value="{{ $status }}" @selected(request('status') === $status)>{{ Str::headline($status) }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-12 col-md-4 col-lg-4">
                            <label class="form-label">Site</label>
                            <select name="site_id" class="form-select">
                                <option value="">All</option>
                                @foreach($sites as $site)
                                    <option value="{{ $site->id }}" @selected((string) request('site_id') === (string) $site->id)>{{ $site->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-12 col-md-4 col-lg-3">
                            <label class="form-label">From Date</label>
                            <input type="date" name="date_from" class="form-control" value="{{ request('date_from') }}">
                        </div>
                        <div class="col-12 col-md-4 col-lg-3">
                            <label class="form-label">To Date</label>
                            <input type="date" name="date_to" class="form-control" value="{{ request('date_to') }}">
                        </div>
                        <div class="col-12 col-md-4 col-lg-3 d-flex gap-2">
                            <button class="btn btn-primary w-100 subs_list_filter_submit">Search</button>
                            <a class="btn btn-outline-secondary w-100 subs_list_filter_reset" href="{{ route('admin.submissions.index') }}">Reset</a>
                        </div>
                    </form>
                </div>
            </div>

            <div class="card shadow-sm border-0 subs_table_card" id="submissions-results">
                <div class="card-body subs_table_card_body">
                    <div id="tableToolbar" class="d-flex align-items-center gap-2 mb-3">
                        <button type="button" class="btn btn-sm btn-outline-secondary js-refresh-list" title="Refresh list">
                            <i class="bi bi-arrow-clockwise"></i> Refresh List
                        </button>
                        <ul class="nav nav-tabs mb-0">
                            <li class="nav-item">
                                <a class="nav-link {{ request('status') ? '' : 'active' }}"
                                   href="{{ request()->fullUrlWithQuery(['status' => null]) }}">
                                    All
                                </a>
                            </li>
                        </ul>
                        <a class="btn btn-outline-success btn-sm" data-no-ajax href="{{ route('admin.submissions.export', request()->query()) }}">Export Excel</a>
                    </div>
                    @php
                        $statusClasses = [
                            'approved' => 'text-bg-info',
                            'validated' => 'text-bg-success',
                            'failed' => 'text-bg-danger',
                            'einvoice_sent_to_customer' => 'text-bg-info',
                            'cancelled' => 'text-bg-secondary',
                        ];
                    @endphp
                    <div class="table-responsive">
                        <table id="submissionsTable" class="table table-hover align-middle">
                            <thead class="table-light">
                            <tr>
                                <th data-field="no" style="width:50px">No</th>
                                <th data-field="customer">Customer</th>
                                <th data-field="invoice">Invoice</th>
                                <th data-field="car_plate" style="width:100px">Car Plate</th>
                                <th data-field="location">Location</th>
                                <th data-field="status" style="width:100px">Status</th>
                                <th data-field="lhdn">LHDN</th>
                                <th data-field="receipt" style="width:80px">Receipt</th>
                                <th data-field="actions" class="text-end sticky-actions" style="width:180px">Actions</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($requests as $item)
                                @php
                                    $statusLabels = config('status_labels', []);
                                    $lhdnStatusUpper = strtoupper((string) ($item->lhdn_status ?? ''));
                                    $displayStatus = $item->status;
                                    if ($lhdnStatusUpper === 'CANCELLED') {
                                        $displayStatus = 'cancelled';
                                    } elseif (in_array($lhdnStatusUpper, ['VALIDATED', 'VALID'], true)) {
                                        $displayStatus = 'validated';
                                    } elseif ($displayStatus === 'waiting_validation') {
                                        $displayStatus = 'failed';
                                    }
                                    $displayStatusLabel = $statusLabels[$displayStatus] ?? Str::headline($displayStatus);
                                @endphp
                                <tr data-has-uuid="{{ $item->lhdn_uuid ? '1' : '0' }}"
                                    data-request-id="{{ $item->id }}"
                                    data-check-status-url="{{ route('admin.submissions.checkStatus', ['invoice' => $item->id]) }}"
                                    data-resend-url="{{ route('admin.requests.resend', ['invoice' => $item->id]) }}"
                                    data-email-url="{{ route('admin.requests.sendCustomer', ['invoice' => $item->id]) }}"
                                    data-preview-url="{{ route('invoices.preview', ['invoice' => $item->id]) }}"
                                    data-duplicate-url="{{ route('admin.requests.duplicate', ['invoice' => $item->id]) }}"
                                    data-email="{{ $item->email ?? '' }}"
                                    data-name="{{ $item->name }}"
                                    data-ic="{{ $item->ic_passport }}"
                                    data-phone="{{ $item->phone ?? '-' }}"
                                    data-tin="{{ $item->tin_no ?? '-' }}"
                                    data-invoice="{{ $item->invoice_no }}"
                                    data-car="{{ $item->car_plate ?? '-' }}"
                                    data-site="{{ $item->site->name ?? '-' }}"
                                    data-date="{{ optional($item->txn_date)->format('d/m/Y H:i') ?? '-' }}"
                                    data-amount="{{ number_format((float) ($item->amount ?? 0), 2) }}"
                                    @php
                                        $receiptUrl = $item->receipt_path ? Storage::url($item->receipt_path) : '';
                                        if ($receiptUrl) {
                                            $host = parse_url($receiptUrl, PHP_URL_HOST);
                                            $path = parse_url($receiptUrl, PHP_URL_PATH) ?: $receiptUrl;
                                            if (!$host || $host === 'localhost') {
                                                $receiptUrl = request()->getSchemeAndHttpHost() . $path;
                                            }
                                        }
                                    @endphp
                                    data-receipt-url="{{ $receiptUrl }}"
                                    data-status="{{ $displayStatusLabel }}"
                                    data-lhdn-status="{{ $item->lhdn_status ?? '-' }}"
                                    data-lhdn-uuid="{{ $item->lhdn_uuid ?? '-' }}"
                                    data-lhdn-submission="{{ $item->lhdn_submission_uid ?? '-' }}"
                                    data-lhdn-error="{{ $item->lhdn_error ?? '-' }}">
                                    <td>{{ $loop->index + 1 }}</td>
                                    <td class="text-start">
                                        <button type="button"
                                                class="btn btn-link p-0 fw-semibold text-start"
                                                data-bs-toggle="modal"
                                                data-bs-target="#editRequestModal-{{ $item->id }}">
                                            {{ $item->name }}
                                        </button>
                                        <div class="text-muted small">{{ $item->email ?? '-' }}</div>
                                        <div class="text-muted small">{{ $item->phone ?? '' }}</div>
                                    </td>
                                    <td>
                                        <div>{{ $item->invoice_no }}</div>
                                        <div class="text-muted small">{{ optional($item->txn_date)->format('d/m/Y H:i') ?? '-' }}</div>
                                    </td>
                                    <td>{{ $item->car_plate ?? '-' }}</td>
                                    <td>{{ $item->site->name ?? '-' }}</td>
                                    <td><span class="badge {{ $statusClasses[$displayStatus] ?? 'text-bg-secondary' }} js-status-badge">{{ $displayStatusLabel }}</span></td>
                                    <td class="small text-muted">
                                        @php
                                            $submitErrors = collect($item->lhdn_submit_response['rejectedDocuments'][0]['error']['details'] ?? [])
                                                ->pluck('message')
                                                ->filter()
                                                ->unique()
                                                ->implode(' | ');
                                            $detailErrors = collect($item->lhdn_error_details ?? [])
                                                ->map(function ($detail) {
                                                    $step = $detail['step'] ?? null;
                                                    $code = $detail['code'] ?? null;
                                                    $message = $detail['message'] ?? null;
                                                    $parts = array_filter([$step, $code, $message]);
                                                    return implode(' - ', $parts);
                                                })
                                                ->filter()
                                                ->unique()
                                                ->implode(' | ');
                                            $errorText = $item->lhdn_error ?: ($detailErrors ?: $submitErrors);
                                        @endphp
                                        <div class="fw-semibold">Submission UID:
                                            <span class="js-lhdn-submission-value">{{ $item->lhdn_submission_uid ?? '-' }}</span>
                                        </div>
                                        @if($item->lhdn_uuid)
                                            <div>UUID: <span class="js-lhdn-uuid-value">{{ $item->lhdn_uuid }}</span></div>
                                        @endif
                                        @if($errorText)
                                            <div class="text-muted mt-1 js-lhdn-error">{{ Str::limit($errorText, 120) }}</div>
                                        @else
                                            <div class="text-muted mt-1 js-lhdn-error">-</div>
                                        @endif
                                    </td>
                                    <td>
                                        @php
                                            $receiptUrl = $item->receipt_path ? Storage::url($item->receipt_path) : '';
                                            if ($receiptUrl) {
                                                $host = parse_url($receiptUrl, PHP_URL_HOST);
                                                $path = parse_url($receiptUrl, PHP_URL_PATH) ?: $receiptUrl;
                                                if (!$host || $host === 'localhost') {
                                                    $receiptUrl = request()->getSchemeAndHttpHost() . $path;
                                                }
                                            }
                                        @endphp
                                        @if($receiptUrl)
                                            <a class="link-primary" href="{{ $receiptUrl }}" target="_blank">View</a>
                                        @else
                                            <span class="text-muted">-</span>
                                        @endif
                                    </td>
                                    <td class="text-end sticky-actions">
                                        @php
                                            $canShowActions = in_array($displayStatus, ['approved','waiting_validation','validated','failed','einvoice_sent_to_customer','cancelled'], true);
                                        @endphp
                                        @if($canManageSubmissionActions && $displayStatus === 'failed')
                                            <button type="button"
                                                    class="btn btn-sm btn-outline-secondary"
                                                    data-bs-toggle="modal"
                                                    data-bs-target="#editRequestModal-{{ $item->id }}">
                                                Edit
                                            </button>
                                        @elseif($canManageSubmissionActions && $displayStatus === 'cancelled')
                                            <form method="post" action="{{ route('admin.requests.duplicate', ['invoice' => $item->id]) }}" class="js-duplicate-form d-inline">
                                                @csrf
                                                <button class="btn btn-sm btn-outline-secondary">
                                                    Duplicate
                                                </button>
                                            </form>
                                        @elseif(in_array($displayStatus, ['validated','einvoice_sent_to_customer'], true))
                                            <a class="btn btn-sm btn-outline-primary js-preview-link"
                                               target="_blank"
                                               href="{{ route('invoices.preview', ['invoice' => $item->id]) }}">
                                                Preview
                                            </a>
                                            @if($canManageSubmissionActions)
                                                <form method="post" action="{{ route('admin.requests.sendCustomer', ['invoice' => $item->id]) }}" class="js-email-form d-inline">
                                                    @csrf
                                                    <button class="btn btn-sm btn-primary">
                                                        Email User
                                                    </button>
                                                </form>
                                            @endif
                                        @endif
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="10" class="text-center text-muted py-4">No records.</td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @push('scripts')
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
        <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/bootstrap-table.min.js"></script>
        <script>
            document.addEventListener('DOMContentLoaded', () => {
                $('#submissionsTable').bootstrapTable({
                    toolbar: '#tableToolbar',
                    search: true,
                    searchAlign: 'right',
                    pagination: true,
                    pageSize: 20,
                    pageList: [10, 20, 50],
                    sortable: true
                });

                const csrfMeta = document.querySelector('meta[name="csrf-token"]');
                const statusClassMap = {
                    waiting_validation: 'text-bg-danger',
                    validated: 'text-bg-success',
                    failed: 'text-bg-danger',
                    cancelled: 'text-bg-secondary',
                    einvoice_sent_to_customer: 'text-bg-info',
                };

                const showAlert = (message, type = 'error') => {
                    if (window.notify) {
                        window.notify(message, type);
                        return;
                    }
                    alert(message);
                };

                const getToken = (form) => {
                    const tokenInput = form.querySelector('input[name="_token"]');
                    return tokenInput?.value || csrfMeta?.getAttribute('content') || '';
                };

                const formatStatusLabel = (value) => {
                    if (!value) {
                        return '-';
                    }
                    return value
                        .replace(/_/g, ' ')
                        .replace(/\b\w/g, (char) => char.toUpperCase());
                };

                const updateBadge = (row, status) => {
                    const badge = row?.querySelector('.js-status-badge');
                    if (!badge) {
                        return;
                    }

                    const normalized = status === 'waiting_validation' ? 'failed' : status;
                    badge.textContent = formatStatusLabel(normalized);
                    badge.className = `badge ${statusClassMap[normalized] || 'text-bg-secondary'} js-status-badge`;
                };

                const updateErrorText = (row, message) => {
                    const errorText = row?.querySelector('.js-lhdn-error');
                    if (!errorText) {
                        return;
                    }

                    errorText.textContent = message || '-';
                };

                const applyStatusColor = (el, status) => {
                    if (!el) {
                        return;
                    }
                    const normalized = status === 'waiting_validation' ? 'failed' : status;
                    const failed = String(normalized || '').toLowerCase().includes('failed');
                    const cancelled = String(normalized || '').toLowerCase().includes('cancelled');
                    el.classList.remove('text-success', 'text-danger', 'text-secondary');
                    if (cancelled) {
                        el.classList.add('text-secondary');
                        return;
                    }
                    el.classList.add(failed ? 'text-danger' : 'text-success');
                };

                const buildPreviewLink = (href, extraClasses = '') => {
                    const link = document.createElement('a');
                    link.href = href;
                    link.target = '_blank';
                    link.className = `btn btn-sm btn-outline-primary js-preview-link ${extraClasses}`.trim();
                    link.textContent = 'Preview E-Invoice';
                    return link;
                };

                const canManageSubmissionActions = @json($canManageSubmissionActions);

                const updateActions = (row, status, token) => {
                    const actions = row?.querySelector('.actions-compact');
                    if (!actions) {
                        return;
                    }

                    actions.querySelectorAll('.js-resend-form, .js-check-status-form, .js-email-form, .js-preview-link, .js-duplicate-form')
                        .forEach((node) => node.remove());

                    if (status === 'validated' || status === 'einvoice_sent_to_customer') {
                        const previewUrl = row?.dataset?.previewUrl;
                        if (previewUrl) {
                            const previewLink = buildPreviewLink(previewUrl);
                            actions.appendChild(previewLink);
                        }

                        const emailUrl = row?.dataset?.emailUrl;
                        if (canManageSubmissionActions && emailUrl) {
                            const form = document.createElement('form');
                            form.method = 'post';
                            form.action = emailUrl;
                            form.className = 'js-email-form';
                            form.innerHTML = `
                                <input type="hidden" name="_token" value="${token}">
                                <button class="btn btn-sm btn-primary">Email User</button>
                            `;
                            actions.appendChild(form);
                        }
                        return;
                    }

                    if (status === 'cancelled') {
                        const duplicateUrl = row?.dataset?.duplicateUrl;
                        if (!canManageSubmissionActions || !duplicateUrl) {
                            return;
                        }
                        const form = document.createElement('form');
                        form.method = 'post';
                        form.action = duplicateUrl;
                        form.className = 'js-duplicate-form';
                        form.innerHTML = `
                            <input type="hidden" name="_token" value="${token}">
                            <button class="btn btn-sm btn-outline-secondary w-100">Duplicate</button>
                        `;
                        actions.appendChild(form);
                    }
                };

                document.addEventListener('submit', (event) => {
                    const form = event.target;
                    if (form.classList.contains('js-email-form')) {
                        const row = form.closest('tr');
                        const email = row?.dataset?.email || '';
                        if (!email.trim()) {
                            event.preventDefault();
                            showAlert('Email tiada. Sila klik Edit untuk masukkan email.', 'error');
                        }
                        return;
                    }
                    if (!form.classList.contains('js-submissions-filter')) {
                        return;
                    }
                    event.preventDefault();
                });

                document.querySelectorAll('.js-request-edit-form[data-readonly="1"]').forEach((form) => {
                    const fields = form.querySelector('.js-request-form-fields');
                    if (!fields) return;

                    fields.querySelectorAll('input, select, textarea, button').forEach((field) => {
                        if (field.type === 'hidden') return;
                        field.disabled = true;
                    });
                });

                document.querySelectorAll('.js-request-edit-form').forEach((form) => {
                    form.addEventListener('submit', async (event) => {
                        event.preventDefault();

                        const button = form.querySelector('button[type="submit"]');
                        if (button?.disabled) {
                            return;
                        }

                        const originalLabel = button?.textContent?.trim() || 'Save';
                        if (button) {
                            button.disabled = true;
                            button.textContent = 'Saving...';
                        }

                        const token = form.querySelector('input[name="_token"]')?.value || '';
                        let didSave = false;

                        try {
                            const response = await fetch(form.action, {
                                method: 'POST',
                                headers: {
                                    'X-CSRF-TOKEN': token,
                                    'Accept': 'application/json',
                                },
                                body: new FormData(form),
                            });

                            const payload = await response.json().catch(() => ({}));
                            if (response.status === 422) {
                                const firstError = payload.errors
                                    ? Object.values(payload.errors).flat()[0]
                                    : null;
                                throw new Error(firstError || payload.message || 'Validation failed.');
                            }
                            if (!response.ok) {
                                throw new Error(payload.message || 'Failed to update request.');
                            }

                            didSave = true;
                            if (payload.data?.pdf_url) {
                                const pdfSlot = form.querySelector('.js-existing-pdf');
                                if (pdfSlot) {
                                    pdfSlot.innerHTML = `<a class="link-primary" target="_blank" href="${payload.data.pdf_url}">View existing PDF</a>`;
                                }
                            }
                            if (payload.data?.receipt_url) {
                                const receiptSlot = form.querySelector('.js-existing-receipt');
                                if (receiptSlot) {
                                    receiptSlot.innerHTML = `<a class="link-primary" target="_blank" href="${payload.data.receipt_url}">View Receipt</a>`;
                                }
                            }
                            showAlert(payload.message || 'Request updated.', 'success');
                        } catch (error) {
                            if (button) {
                                button.disabled = false;
                                button.textContent = originalLabel;
                            }
                            showAlert(error.message || 'Failed to update request.');
                            return;
                        }

                        if (button) {
                            button.disabled = false;
                            button.textContent = didSave ? 'Saved' : originalLabel;
                            if (didSave) {
                                setTimeout(() => {
                                    button.textContent = originalLabel;
                                }, 1200);
                            }
                        }
                    });
                });

                document.querySelectorAll('.js-find-tin-btn').forEach((button) => {
                    button.addEventListener('click', async () => {
                        if (button.disabled) {
                            return;
                        }

                        const input = button.closest('.input-group')?.querySelector('input[name="tin_no"]');
                        const form = button.closest('form');
                        const token = form?.querySelector('input[name="_token"]')?.value || '';
                        const url = button.dataset.searchUrl;
                        if (!url) {
                            showAlert('TIN search URL is missing.');
                            return;
                        }

                        const originalLabel = button.textContent;
                        button.disabled = true;
                        button.textContent = 'Searching...';

                        try {
                            const response = await fetch(url, {
                                method: 'POST',
                                headers: {
                                    'X-CSRF-TOKEN': token,
                                    'Accept': 'application/json',
                                },
                            });

                            const payload = await response.json().catch(() => ({}));
                            if (!response.ok) {
                                let message = payload.message || 'Failed to find TIN.';
                                if (response.status === 404) {
                                    message = 'TIN tidak dijumpai. Sila semak No. IC/Passport dan cuba semula.';
                                } else if (response.status === 400) {
                                    message = 'Maklumat IC/Passport tidak sah. Sila semak dan cuba semula.';
                                }
                                throw new Error(message);
                            }

                            if (input) {
                                input.value = payload.tin || '';
                            }
                            showAlert(payload.message || 'TIN found and saved.', 'success');
                        } catch (error) {
                            showAlert(error.message || 'Failed to find TIN.');
                        } finally {
                            button.disabled = false;
                            button.textContent = originalLabel;
                        }
                    });
                });

                document.querySelectorAll('.js-resubmit-btn').forEach((button) => {
                    button.addEventListener('click', async () => {
                        if (button.disabled) {
                            return;
                        }

                        const url = button.dataset.resubmitUrl;
                        if (!url) {
                            showAlert('Resubmit URL is missing.');
                            return;
                        }

                        const originalLabel = button.innerHTML;
                        button.disabled = true;
                        button.innerHTML = '<span class="spinner-border spinner-border-sm me-1" role="status" aria-hidden="true"></span>Resubmitting...';

                        const token = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content') || '';

                        try {
                            const response = await fetch(url, {
                                method: 'POST',
                                headers: {
                                    'X-CSRF-TOKEN': token,
                                    'Accept': 'application/json',
                                },
                            });

                            const payload = await response.json().catch(() => ({}));
                            if (!response.ok) {
                                throw new Error(payload.message || 'Failed to resubmit.');
                            }

                            const data = payload.data || {};
                            const lhdnStatusUpper = String(data.lhdn_status || '').toUpperCase();
                            const effectiveStatus = (!data.status || lhdnStatusUpper === 'VALIDATED')
                                ? (lhdnStatusUpper === 'VALIDATED' ? 'validated' : data.status)
                                : data.status;
                            const modal = button.closest('.modal');
                            const requestId = button.dataset.requestId;
                            const row = requestId
                                ? document.querySelector(`tr[data-request-id="${requestId}"]`)
                                : null;
                            if (modal) {
                                const statusEl = modal.querySelector('.js-request-status');
                                if (statusEl && effectiveStatus) {
                                    statusEl.textContent = formatStatusLabel(effectiveStatus);
                                    applyStatusColor(statusEl, effectiveStatus);
                                }
                                const statusSelect = modal.querySelector('select[name="status"]');
                                if (statusSelect && effectiveStatus) {
                                    const value = effectiveStatus;
                                    if (!Array.from(statusSelect.options).some((opt) => opt.value === value)) {
                                        const option = document.createElement('option');
                                        option.value = value;
                                        option.textContent = formatStatusLabel(value);
                                        statusSelect.appendChild(option);
                                    }
                                    statusSelect.value = value;
                                    if (value !== 'failed') {
                                        statusSelect.setAttribute('disabled', 'disabled');
                                    }
                                }
                                const submissionEl = modal.querySelector('.js-modal-submission');
                                if (submissionEl) {
                                    submissionEl.textContent = data.lhdn_submission_uid || '-';
                                }
                                const uuidEl = modal.querySelector('.js-modal-uuid');
                                if (uuidEl) {
                                    uuidEl.textContent = data.lhdn_uuid || '-';
                                }
                                const lhdnStatusEl = modal.querySelector('.js-modal-lhdn-status');
                                if (lhdnStatusEl) {
                                    lhdnStatusEl.textContent = data.lhdn_status || '-';
                                    applyStatusColor(lhdnStatusEl, data.lhdn_status);
                                }
                                const lhdnErrorEl = modal.querySelector('.js-modal-lhdn-error');
                                if (lhdnErrorEl) {
                                    lhdnErrorEl.textContent = data.lhdn_error || '-';
                                }

                                const slot = modal.querySelector('.js-preview-slot');
                                if (slot) {
                                    const existingPreview = slot.querySelector('.js-preview-link');
                                    if (effectiveStatus === 'validated' || effectiveStatus === 'einvoice_sent_to_customer') {
                                        if (!existingPreview) {
                                            const previewUrl = row?.dataset?.previewUrl;
                                            if (previewUrl) {
                                                const previewLink = buildPreviewLink(previewUrl);
                                                slot.innerHTML = '';
                                                slot.appendChild(previewLink);
                                            }
                                        }
                                    } else if (existingPreview) {
                                        slot.innerHTML = '';
                                    }
                                }
                            }

                            if (row && effectiveStatus) {
                                updateBadge(row, effectiveStatus);
                                const submission = row.querySelector('.js-lhdn-submission-value');
                                if (submission) {
                                    submission.textContent = data.lhdn_submission_uid || '-';
                                }
                                const uuid = row.querySelector('.js-lhdn-uuid-value');
                                if (uuid) {
                                    uuid.textContent = data.lhdn_uuid || '-';
                                }
                                updateErrorText(row, data.lhdn_error || '-');
                            }

                            const isFailed = String(data.status || '').toLowerCase() === 'failed'
                                || String(data.lhdn_status || '').toUpperCase() === 'FAILED';
                            showAlert(payload.message || 'Resubmitted to LHDN.', isFailed ? 'error' : 'success');
                        } catch (error) {
                            showAlert(error.message || 'Failed to resubmit.');
                        } finally {
                            button.disabled = false;
                            button.innerHTML = originalLabel;
                        }
                    });
                });

                setInterval(() => {
                    window.location.reload();
                }, 60000);
            });
        </script>
    @endpush

    <!-- Edit modals for submissions -->
    @foreach($requests as $item)
        @php
            $statusLabels = config('status_labels', []);
            $lhdnStatusUpper = strtoupper((string) ($item->lhdn_status ?? ''));
            $displayStatus = $item->status;
            if ($lhdnStatusUpper === 'CANCELLED') {
                $displayStatus = 'cancelled';
            } elseif (in_array($lhdnStatusUpper, ['VALIDATED', 'VALID'], true)) {
                $displayStatus = 'validated';
            } elseif ($displayStatus === 'waiting_validation') {
                $displayStatus = 'failed';
            }
            $displayStatusLabel = $statusLabels[$displayStatus] ?? Str::headline($displayStatus);
            $isReadonly = in_array($displayStatus, ['validated', 'einvoice_sent_to_customer'], true);
        @endphp
        @if($canManageSubmissionActions)
        <div class="modal fade" id="editRequestModal-{{ $item->id }}" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog modal-xl modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Edit Request E-Invoice #{{ $item->id }}</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form method="post"
                          action="{{ route('admin.requests.update', ['invoice' => $item->id]) }}"
                          class="row g-3 js-request-edit-form"
                          data-readonly="{{ $isReadonly ? '1' : '0' }}"
                          enctype="multipart/form-data">
                        @csrf
                        @method('put')
                        <div class="modal-body">
                            <div class="js-request-form-fields">
                                @include('admin.requests.partials.form', ['requestItem' => $item, 'sites' => $sites])
                            </div>
                            <div class="border rounded p-3 mt-3" style="background-color:#eff6ff; border-color:#2563eb !important; border-width:2px;">
                                <div class="fw-semibold mb-2">LHDN Info</div>
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        <label class="form-label">Request Status</label>
                                        @php
                                            $statusLabels = config('status_labels', []);
                                            $lhdnStatusUpper = strtoupper((string) ($item->lhdn_status ?? ''));
                                            $displayStatus = $item->status;
                                            if ($lhdnStatusUpper === 'CANCELLED') {
                                                $displayStatus = 'cancelled';
                                            } elseif (in_array($lhdnStatusUpper, ['VALIDATED', 'VALID'], true)) {
                                                $displayStatus = 'validated';
                                            } elseif ($displayStatus === 'waiting_validation') {
                                                $displayStatus = 'failed';
                                            }
                                            $displayStatusLabel = $statusLabels[$displayStatus] ?? Str::headline($displayStatus);
                                        @endphp
                                        <div class="form-control-plaintext fw-semibold js-request-status {{ $displayStatus === 'failed' ? 'text-danger' : ($displayStatus === 'cancelled' ? 'text-secondary' : 'text-success') }}">
                                            {{ $displayStatusLabel }}
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">Submission UID</label>
                                        <div class="form-control-plaintext fw-semibold js-modal-submission">{{ $item->lhdn_submission_uid ?? '-' }}</div>
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">UUID</label>
                                        <div class="form-control-plaintext fw-semibold js-modal-uuid" style="word-break: break-all;">
                                            {{ $item->lhdn_uuid ?? '-' }}
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">LHDN Status</label>
                                        @php
                                            $lhdnStatusUpper = strtoupper((string) $item->lhdn_status);
                                            $lhdnStatusClass = $lhdnStatusUpper === 'FAILED'
                                                ? 'text-danger'
                                                : ($lhdnStatusUpper === 'CANCELLED' ? 'text-secondary' : 'text-success');
                                        @endphp
                                        <div class="form-control-plaintext fw-semibold js-modal-lhdn-status {{ $lhdnStatusClass }}">
                                            {{ $item->lhdn_status ?? '-' }}
                                        </div>
                                        @php
                                            $lhdnStatus = strtoupper((string) ($item->lhdn_status ?? ''));
                                            $canPreview = in_array($item->status, ['validated', 'einvoice_sent_to_customer'], true)
                                                || in_array($lhdnStatus, ['VALIDATED', 'VALID'], true);
                                        @endphp
                                        <div class="mt-2 js-preview-slot">
                                            @if($canPreview)
                                                <a class="btn btn-sm btn-outline-primary js-preview-link" target="_blank"
                                                   href="{{ route('invoices.preview', ['invoice' => $item->id]) }}">
                                                    Preview E-Invoice
                                                </a>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <label class="form-label">LHDN Error</label>
                                        <div class="form-control-plaintext fw-semibold js-modal-lhdn-error text-danger" style="word-break: break-all;">
                                            {{ $item->lhdn_error ?? '-' }}
                                        </div>
                                        @if(!empty($item->lhdn_error_details))
                                            <div class="mt-2 small text-danger">
                                                This document cannot be processed further. Please submit a new document with the below point(s) resolved to continue:
                                                <ul class="mb-0 mt-1">
                                                    @foreach($item->lhdn_error_details as $detail)
                                                        @php
                                                            $step = $detail['step'] ?? null;
                                                            $code = $detail['code'] ?? null;
                                                            $message = $detail['message'] ?? null;
                                                            $parts = array_filter([$step, $code, $message]);
                                                        @endphp
                                                        <li>{{ implode(' - ', $parts) }}</li>
                                                    @endforeach
                                                </ul>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            @if(!$isReadonly)
                                <button type="submit" class="btn btn-primary">Save</button>
                                @if($displayStatus === 'failed')
                                    <button type="button"
                                            class="btn btn-warning text-white js-resubmit-btn"
                                            data-resubmit-url="{{ route('admin.requests.approve', ['invoice' => $item->id]) }}"
                                            data-request-id="{{ $item->id }}">
                                        Resubmit
                                    </button>
                                @endif
                            @endif
                            <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Close</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        @endif
    @endforeach
</x-app-layout>