@extends('layouts.apex')

@section('title', 'Sampling')

@section('content')
<div class="page-header">
    <div class="page-header-content">
        <div>
            <h1 class="page-header-title">Sampling</h1>
            <p class="page-header-subtitle">Pencatatan sampling udang</p>
        </div>
        <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#samplingModal">
            <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="vertical-align: text-bottom; margin-right: 0.5rem;">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/>
            </svg>
            Sampling Baru
        </button>
        <button type="button" class="btn btn-warning ms-2" onclick="recalculateAllADG()">
            <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="vertical-align: text-bottom; margin-right: 0.5rem;">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
            </svg>
            Recalculate ADG
        </button>
    </div>
</div>

<div class="page-body">
    <!-- Summary Cards -->
    <div class="stat-grid">
        <div class="stat-card">
            <div class="stat-icon primary">
                <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
                </svg>
            </div>
            <div class="stat-label">Total Sampling</div>
            <div class="stat-value" id="summaryTotalSampling">{{ $summary->total_sampling }}</div>
        </div>
        <div class="stat-card">
            <div class="stat-icon success">
                <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
                </svg>
            </div>
            <div class="stat-label">Total QTY</div>
            <div class="stat-value" id="summaryTotalBenih">{{ number_format($summary->total_benih, 0) }}</div>
        </div>
        <div class="stat-card">
            <div class="stat-icon info">
                <svg width="24" height="24" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/>
                </svg>
            </div>
            <div class="stat-label">Bulan Ini</div>
            <div class="stat-value" id="summaryBulanIni">{{ number_format($summary->bulan_ini, 0) }}</div>
        </div>
    </div>

    <!-- Table -->
    <div class="card">
        <div class="card-header">
            <h5 class="card-title">Riwayat Sampling</h5>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table id="samplingTable" class="table table-striped table-hover">
                    <thead>
                        <tr>
                            <th>No. Bukti</th>
                            <th>Tanggal</th>
                            <th>No Kolam</th>
                            <th>Doc</th>
                            <th>Qty Sampling</th>
                            <th>Total Berat (g)</th>
                            <th>MBW</th>
                            <th>ADG (Gr)</th>
                            <th>Dibuat Oleh</th>
                            <th>Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<!-- Sampling Modal -->
<div id="samplingModal" class="modal fade" tabindex="-1">
    <div class="modal-dialog modal-lg" style="max-width: 800px;">
        <div class="modal-content">
            <form id="samplingForm" action="{{ route('sampling.store.batch') }}" method="POST">
                @csrf
                <input type="hidden" name="_method" value="POST" id="samplingMethod">
                <input type="hidden" name="sampling_id" id="sampling_id">
                <div class="modal-header">
                    <h5 class="modal-title" id="samplingModalTitle">Sampling Baru</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <!-- Master Section -->
                    <div class="row" style="margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid #dee2e6;">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-label">Nomor Bukti</label>
                                <input type="text"style="width:200px;" name="no_bukti" id="no_bukti" class="form-control" placeholder="Menunggu generate..." readonly>
                                <small class="form-text text-muted" id="no_bukti_help">Pilih tanggal untuk generate nomor bukti otomatis</small>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-label">Tanggal Sampling *</label>
                                <input style="width:200px;"type="date" name="tanggal_sampling" id="tanggal_sampling" class="form-control" value="{{ date('Y-m-d') }}" required>
                            </div>
                        </div>
                    </div>

                    <!-- Detail Table Section -->
                    <div style="margin-bottom: 1.5rem;">
                        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
                            <div style="display: flex; align-items: center; gap: 1rem;">
                                <h6 style="margin: 0;">Data Sampling per Lokasi</h6>
                                <span class="badge badge-primary" id="rowCount" style="background: #007bff; color: white; padding: 0.25rem 0.75rem; border-radius: 12px; font-size: 0.875rem;">
                                    1 baris
                                </span>
                            </div>
                            <button type="button" class="btn btn-sm btn-primary" onclick="addBatchRow()">
                                <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="display: inline; vertical-align: middle; margin-right: 0.25rem;">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/>
                                </svg>
                                Tambah Baris
                            </button>
                        </div>

                        <div style="overflow-x: auto;">
                            <table class="table table-bordered" id="batchTable">
                                <thead>
                                    <tr>
                                        <th style="width: 150px;">No Kolam *</th>
                                        <th style="width: 80px;">Doc</th>
                                        <th style="width: 120px;">Qty Sampling</th>
                                        <th style="width: 120px;">Total Berat (g)</th>
                                        <th style="width: 120px;">MBW</th>
                                        <th style="width: 50px;">Aksi</th>
                                    </tr>
                                </thead>
                                <tbody id="batchTableBody">
                                    <!-- Rows will be added dynamically -->
                                </tbody>
                                <tfoot>
                                    <tr style="background-color: #f8f9fa; font-weight: bold;">
                                        <td colspan="2" style="text-align: right; padding-right: 1rem; display:none">
                                            <strong>GRAND TOTAL:</strong>
                                        </td>
                                        <td style="text-align: center;">
                                            <span id="grandTotalQty" style="color: #28a745; font-size: 1.1rem;display:none">0</span>
                                        </td>
                                        <td style="text-align: center;">
                                            <span id="grandTotalBerat" style="color: #007bff; font-size: 1.1rem;display:none">0</span>
                                        </td>
                                        <td colspan="2"></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>

                    <!-- Keterangan -->
                    <div class="form-group">
                        <label class="form-label">Keterangan</label>
                        <textarea name="keterangan" id="keterangan" class="form-control" rows="2"></textarea>
                    </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-primary" id="submitBtn">
                        <span id="submitBtnText">
                            <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="vertical-align: text-bottom; margin-right: 0.5rem;">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                            </svg>
                            Simpan Semua Data
                        </span>
                        <span id="submitBtnLoading" class="d-none">
                            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" style="width: 1rem; height: 1rem; border-width: 0.15em; margin-right: 0.5rem; display: inline-block;"></span>
                            <span style="display: inline-block;">Menyimpan...</span>
                        </span>
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

@push('scripts')
<style>
/* SweetAlert z-index higher than Bootstrap modal (1055) */
.swal2-popup-on-top {
    z-index: 99999 !important;
}
.swal2-backdrop-show {
    z-index: 99998 !important;
}

/* Required field indicator */
.required-indicator {
    color: #dc3545;
    font-weight: bold;
}
</style>
<script>
// Global functions - declared outside document.ready for onclick access
let samplingTable;
let pollingInterval = null;
let lastKnownSequence = null;
let isSubmitting = false;

// Lokasi options
const lokasiOptions = @json($lokasis->map(function($lokasi) {
    return ['id' => $lokasi->id, 'nama' => $lokasi->nama];
})->toArray());

// Helper function untuk format angka dengan pemisah ribuan
function formatNumber(number) {
    if (number === null || number === undefined || number === '' || isNaN(number)) {
        return '0';
    }
    return new Intl.NumberFormat('id-ID').format(number);
}

// Helper function untuk format number dengan separator ribuan saat mengetik (English format: 1,000.22)
function formatNumberInput(number) {
    if (number === '' || number === null || number === undefined) {
        return '';
    }

    let value = number.toString();

    // Hapus semua karakter kecuali digit dan titik
    let hasDot = value.indexOf('.') !== -1;

    let integerPart, decimalPart;

    if (hasDot) {
        let parts = value.split('.');
        integerPart = parts[0].replace(/\D/g, '');
        decimalPart = parts[1] ? parts[1].replace(/\D/g, '').substring(0, 2) : '';
    } else {
        integerPart = value.replace(/\D/g, '');
        decimalPart = '';
    }

    if (!integerPart || integerPart === '') {
        return hasDot ? '.' : '';
    }

    // Tambahkan separator ribuan dengan COMMA (English format: 1,000)
    let formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ',');

    let result = formattedInteger;
    if (hasDot) {
        result += '.' + decimalPart;
    }

    return result;
}

// Helper function untuk parse number format kembali ke number (English format)
function parseNumberInput(numberString) {
    if (!numberString || numberString === '') {
        return 0;
    }
    // Hapus koma (pemisah ribuan) dan parse
    var cleaned = numberString.replace(/,/g, '');
    var result = parseFloat(cleaned);
    return isNaN(result) ? 0 : result;
}

// Helper function untuk konversi format tanggal ke yyyy-mm-dd (format HTML5 date input)
function convertDateForInput(dateString) {
    if (!dateString || dateString === '' || dateString === '-' || dateString === null) {
        return '';
    }

    console.log('convertDateForInput input:', dateString, 'type:', typeof dateString);

    // Jika sudah dalam format yyyy-mm-dd atau yyyy-mm-dd hh:mm:ss, ambil 10 karakter pertama
    if (typeof dateString === 'string' && dateString.match(/^\d{4}-\d{2}-\d{2}/)) {
        const result = dateString.substring(0, 10);
        console.log('Format yyyy-mm-dd detected:', result);
        return result;
    }

    // Konversi dari format dd-mm-yyyy ke yyyy-mm-dd
    if (typeof dateString === 'string' && dateString.match(/^\d{2}-\d{2}-\d{4}$/)) {
        const parts = dateString.split('-');
        const result = parts[2] + '-' + parts[1] + '-' + parts[0];
        console.log('Format dd-mm-yyyy converted to:', result);
        return result;
    }

    console.log('Could not convert date:', dateString);
    return '';
}

// Function untuk update summary cards
function updateSummary() {
    $.ajax({
        url: '/sampling/summary',
        method: 'GET',
        success: function(response) {
            if (response.success && response.data) {
                const summary = response.data;
                $('#summaryTotalSampling').text(summary.total_sampling);
                $('#summaryTotalBenih').text(formatNumber(summary.total_benih));
                $('#summaryBulanIni').text(formatNumber(summary.bulan_ini));
            }
        },
        error: function(xhr) {
            console.error('Gagal mengupdate summary:', xhr);
        }
    });
}

// Batch row functions
function addBatchRow() {
    const rowNumber = $('#batchTableBody tr').length + 1;
    const uniqueId = Date.now() + '_' + rowNumber;

    const row = `
        <tr class="batch-row">
            <td>
                <select name="data_sampling[${rowNumber}][kolam]" id="batch_${uniqueId}_lokasi" class="form-control form-select batch-lokasi" required onchange="calculateDoc('${uniqueId}', '${rowNumber}')">
                    <option value="">Pilih Kolam</option>
                    ${lokasiOptions.map(lokasi => `<option value="${lokasi.nama}">${lokasi.nama}</option>`).join('')}
                </select>
            </td>
            <td>
                <input type="number" name="data_sampling[${rowNumber}][doc]" id="batch_${uniqueId}_doc" class="form-control" placeholder="Auto" readonly style="background-color: #f8f9fa;">
            </td>
            <td>
                <input type="text" name="data_sampling[${rowNumber}][qty_sampling_display]" id="batch_${uniqueId}_qty_sampling_display" class="form-control number-input" placeholder="0" style="text-align: right;" required oninput="formatNumberInputSampling('${uniqueId}')">
                <input type="hidden" name="data_sampling[${rowNumber}][qty_sampling]" id="batch_${uniqueId}_qty_sampling" value="0">
            </td>
            <td>
                <input type="text" name="data_sampling[${rowNumber}][total_berat_display]" id="batch_${uniqueId}_total_berat_display" class="form-control number-input" placeholder="0" style="text-align: right;" required oninput="formatNumberInputBerat('${uniqueId}')">
                <input type="hidden" name="data_sampling[${rowNumber}][total_berat]" id="batch_${uniqueId}_total_berat" value="0">
            </td>
            <td>
                <input type="text" name="data_sampling[${rowNumber}][mbw_display]" id="batch_${uniqueId}_mbw_display" class="form-control" placeholder="Auto" readonly style="background-color: #f8f9fa; font-weight: 500; color: #28a745;">
                <input type="hidden" name="data_sampling[${rowNumber}][mbw]" id="batch_${uniqueId}_mbw" value="0">
            </td>
            <td>
                <button type="button" class="btn btn-sm btn-danger" onclick="removeBatchRow(this)">
                    <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                    </svg>
                </button>
            </td>
        </tr>
    `;
    $('#batchTableBody').append(row);

    // Initialize Select2 for the new row
    const newRow = $('#batchTableBody tr:last');

    if (newRow.find('.batch-lokasi').length) {
        newRow.find('.batch-lokasi').select2({
            theme: 'bootstrap4',
            placeholder: 'Pilih Kolam',
            allowClear: true,
            width: '100%',
            dropdownParent: $('#samplingModal')
        });
    }

    updateRowCount();
}

function updateRowCount() {
    const count = $('#batchTableBody tr').length;
    const rowCountEl = $('#rowCount');
    rowCountEl.text(count + (count === 1 ? ' baris' : ' baris'));

    // Update grand total when row count changes
    updateGrandTotal();
}

function removeBatchRow(button) {
    const row = $(button).closest('tr');
    const samplingId = row.data('sampling-id');

    // Cek jika ini adalah record yang sudah ada (punya ID)
    if (samplingId && samplingId !== '') {
        // Konfirmasi penghapusan
        Swal.fire({
            title: 'Hapus Baris Ini?',
            html: 'Apakah Anda yakin ingin menghapus baris ini?<br><small>Baris akan dihapus dari database (soft delete).</small>',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6',
            confirmButtonText: 'Ya, hapus!',
            cancelButtonText: 'Batal'
        }).then((result) => {
            if (result.isConfirmed) {
                // Soft delete record dari database
                $.ajax({
                    url: '/sampling/' + samplingId,
                    method: 'DELETE',
                    data: {
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        // Hapus baris dari form setelah berhasil soft delete
                        if ($('#batchTableBody tr').length > 1) {
                            row.remove();
                            updateRowCount();
                            updateGrandTotal();

                            // Update summary cards dan DataTable
                            $('#samplingTable').DataTable().ajax.reload(null, false);
                            updateSummary();

                            Swal.fire({
                                icon: 'success',
                                title: 'Berhasil',
                                text: 'Baris berhasil dihapus dari database!',
                                timer: 2000,
                                showConfirmButton: false
                            });
                        } else {
                            Swal.fire({
                                icon: 'info',
                                title: 'Info',
                                text: 'Minimal harus ada satu baris data'
                            });
                        }
                    },
                    error: function(xhr) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Gagal',
                            text: xhr.responseJSON?.message || 'Gagal menghapus baris!'
                        });
                    }
                });
            }
        });
    } else {
        // Ini adalah baris baru (belum ada di database), hapus dari form saja
        if ($('#batchTableBody tr').length > 1) {
            row.remove();
            updateRowCount();
            updateGrandTotal();
        } else {
            Swal.fire({
                icon: 'info',
                title: 'Info',
                text: 'Minimal harus ada satu baris data'
            });
        }
    }
}

// Calculate MBW (Mean Body Weight)
function calculateMBW(uniqueId) {
    const qtySampling = parseFloat($('#batch_' + uniqueId + '_qty_sampling').val()) || 0;
    const totalBerat = parseFloat($('#batch_' + uniqueId + '_total_berat').val()) || 0;
    let mbw = 0;

    if (qtySampling > 0) {
        mbw = totalBerat / qtySampling;
    }

    // Update mbw hidden field
    $('#batch_' + uniqueId + '_mbw').val(mbw.toFixed(2));
    // Update mbw display field
    $('#batch_' + uniqueId + '_mbw_display').val(mbw.toFixed(2));

    // Update grand total
    updateGrandTotal();
}

// Format input for QTY Sampling
function formatNumberInputSampling(uniqueId) {
    const $input = $('#batch_' + uniqueId + '_qty_sampling_display');
    const value = $input.val();

    if (value !== '') {
        const formatted = formatNumberInput(value);
        $input.val(formatted);

        // Parse untuk update hidden field
        const angka = parseNumberInput(formatted);
        $('#batch_' + uniqueId + '_qty_sampling').val(angka);
        calculateMBW(uniqueId);
    }
}

// Format input for Total Berat
function formatNumberInputBerat(uniqueId) {
    const $input = $('#batch_' + uniqueId + '_total_berat_display');
    const value = $input.val();

    if (value !== '') {
        const formatted = formatNumberInput(value);
        $input.val(formatted);

        // Parse untuk update hidden field
        const angka = parseNumberInput(formatted);
        $('#batch_' + uniqueId + '_total_berat').val(angka);
        calculateMBW(uniqueId);
    }
}

// Calculate DOC (Days of Culture)
function calculateDoc(uniqueId, rowNumber) {
    const lokasiId = $('#batch_' + uniqueId + '_lokasi').val();
    const tanggalSampling = $('#tanggal_sampling').val();

    if (!lokasiId || !tanggalSampling) {
        return;
    }

    // Fetch tebar data for this kolam
    $.ajax({
        url: '/tebar/get-by-kolam/' + lokasiId,
        method: 'GET',
        success: function(response) {
            if (response.success && response.data) {
                const tebar = response.data;
                const tanggalTebar = tebar.tanggal_tebar;

                if (tanggalTebar) {
                    // Calculate days difference
                    const tebarDate = new Date(tanggalTebar);
                    const samplingDate = new Date(tanggalSampling);
                    const diffTime = Math.abs(samplingDate - tebarDate);
                    const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));

                    // Update doc field
                    $('#batch_' + uniqueId + '_doc').val(diffDays);
                }
            }
        },
        error: function(xhr) {
            console.log('Error fetching tebar data:', xhr);
        }
    });
}

function updateGrandTotal() {
    let grandTotalQty = 0;
    let grandTotalBerat = 0;

    $('#batchTableBody tr').each(function() {
        const qtySampling = parseFloat($(this).find('[id$="_qty_sampling"]').val()) || 0;
        const totalBerat = parseFloat($(this).find('[id$="_total_berat"]').val()) || 0;
        grandTotalQty += qtySampling;
        grandTotalBerat += totalBerat;
    });

    // Update grand total display
    $('#grandTotalQty').text(formatNumber(grandTotalQty));
    $('#grandTotalBerat').text(formatNumber(grandTotalBerat));
}

function editSampling(id) {
    console.log('editSampling called with id:', id);

    // Stop any ongoing polling
    stopRealtimePolling();

    $.ajax({
        url: '/sampling/' + id,
        method: 'GET',
        success: function(response) {
            console.log('Sampling data received:', response);
            const sampling = response.data;

            // Load all records with the same no_bukti
            $.ajax({
                url: '/sampling/batch/' + sampling.no_bukti,
                method: 'GET',
                success: function(batchResponse) {
                    console.log('Batch data received:', batchResponse);
                    const batchData = batchResponse.data;

                    $('#samplingModalTitle').text('Edit Sampling - ' + sampling.no_bukti);
                    $('#samplingMethod').val('PUT');
                    $('#sampling_id').val(id);
                    $('#samplingForm').attr('action', '/sampling/batch/' + sampling.no_bukti);

                    // Set master field values
                    $('#no_bukti').val(sampling.no_bukti || '');
                    $('#no_bukti_help').html('✅ No Bukti: <strong>' + sampling.no_bukti + '</strong> (Read-only)');

                    // Set master field values - tanggal sampling bisa diubah
                    console.log('Original tanggal value from API:', sampling.tanggal, 'Type:', typeof sampling.tanggal);
                    const tanggalValue = convertDateForInput(sampling.tanggal);
                    console.log('Converted tanggal value:', tanggalValue);
                    $('#tanggal_sampling').val(tanggalValue).prop('disabled', false);
                    $('#keterangan').val(sampling.keterangan || '');

                    // Clear batch table and populate with existing data
                    $('#batchTableBody').empty();

                    if (batchData && batchData.length > 0) {
                        batchData.forEach(function(item, index) {
                            addBatchRowWithData(item, index + 1);
                        });
                    } else {
                        // If no batch data, add single row with current data
                        addBatchRowWithData(sampling, 1);
                    }

                    // Show modal using Bootstrap 5 API
                    const modal = new bootstrap.Modal(document.getElementById('samplingModal'));
                    modal.show();
                    console.log('Modal opened for edit');

                    // Add event listener to update no_bukti when tanggal changes in edit mode
                    $('#tanggal_sampling').off('change.editMode').on('change.editMode', function() {
                        const newTanggal = $(this).val();
                        console.log('Tanggal changed in edit mode:', newTanggal);

                        // Generate new no_bukti based on new date
                        $.ajax({
                            url: '/sampling/get-last-sequence/' + newTanggal,
                            method: 'GET',
                            success: function(response) {
                                const dateParts = newTanggal.split('-');
                                const dateObj = new Date(dateParts[0], dateParts[1] - 1, dateParts[2]);
                                const yy = dateObj.getFullYear().toString().slice(-2);
                                const mm = String(dateObj.getMonth() + 1).padStart(2, '0');
                                const dd = String(dateObj.getDate()).padStart(2, '0');
                                const tanggalPart = yy + mm + dd;

                                const nextSequence = response.next_sequence;
                                const newNoBukti = 'SAM' + tanggalPart + String(nextSequence).padStart(3, '0');

                                // Update no_bukti field and help text
                                $('#no_bukti').val(newNoBukti);
                                $('#no_bukti_help').html('⏳ No Bukti Baru: <strong>' + newNoBukti + '</strong> (berdasarkan tanggal baru)');

                                // Update form action with new no_bukti
                                $('#samplingForm').attr('action', '/sampling/batch/' + newNoBukti);
                                $('#samplingModalTitle').text('Edit Sampling - ' + newNoBukti);

                                // Update lastKnownSequence for polling
                                lastKnownSequence = {
                                    next_sequence: nextSequence,
                                    no_bukti: newNoBukti,
                                    timestamp: response.timestamp
                                };

                                console.log('No bukti updated to:', newNoBukti);
                            },
                            error: function(xhr) {
                                console.error('Failed to get last sequence:', xhr);
                            }
                        });
                    });
                },
                error: function(xhr) {
                    console.error('Error fetching batch data:', xhr);
                    // If batch fetch fails, show single record in form
                    $('#samplingModalTitle').text('Edit Sampling');
                    $('#samplingMethod').val('PUT');
                    $('#sampling_id').val(id);
                    $('#samplingForm').attr('action', '/sampling/' + id);

                    $('#no_bukti').val(sampling.no_bukti || '');
                    $('#no_bukti_help').html('✅ No Bukti: <strong>' + sampling.no_bukti + '</strong> (Read-only)');
                    const tanggalValue = convertDateForInput(sampling.tanggal);
                    $('#tanggal_sampling').val(tanggalValue).prop('disabled', false);
                    $('#keterangan').val(sampling.keterangan || '');

                    $('#batchTableBody').empty();
                    addBatchRowWithData(sampling, 1);

                    const modal = new bootstrap.Modal(document.getElementById('samplingModal'));
                    modal.show();

                    // Add event listener to update no_bukti when tanggal changes in edit mode
                    $('#tanggal_sampling').off('change.editMode').on('change.editMode', function() {
                        const newTanggal = $(this).val();
                        console.log('Tanggal changed in edit mode (fallback):', newTanggal);

                        // Generate new no_bukti based on new date
                        $.ajax({
                            url: '/sampling/get-last-sequence/' + newTanggal,
                            method: 'GET',
                            success: function(response) {
                                const dateParts = newTanggal.split('-');
                                const dateObj = new Date(dateParts[0], dateParts[1] - 1, dateParts[2]);
                                const yy = dateObj.getFullYear().toString().slice(-2);
                                const mm = String(dateObj.getMonth() + 1).padStart(2, '0');
                                const dd = String(dateObj.getDate()).padStart(2, '0');
                                const tanggalPart = yy + mm + dd;

                                const nextSequence = response.next_sequence;
                                const newNoBukti = 'SAM' + tanggalPart + String(nextSequence).padStart(3, '0');

                                // Update no_bukti field and help text
                                $('#no_bukti').val(newNoBukti);
                                $('#no_bukti_help').html('⏳ No Bukti Baru: <strong>' + newNoBukti + '</strong> (berdasarkan tanggal baru)');

                                // Update form action with new no_bukti
                                $('#samplingForm').attr('action', '/sampling/batch/' + newNoBukti);
                                $('#samplingModalTitle').text('Edit Sampling - ' + newNoBukti);

                                // Update lastKnownSequence for polling
                                lastKnownSequence = {
                                    next_sequence: nextSequence,
                                    no_bukti: newNoBukti,
                                    timestamp: response.timestamp
                                };

                                console.log('No bukti updated to:', newNoBukti);
                            },
                            error: function(xhr) {
                                console.error('Failed to get last sequence:', xhr);
                            }
                        });
                    });
                }
            });
        },
        error: function(xhr) {
            console.error('Error fetching sampling:', xhr);
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: 'Gagal mengambil data sampling!'
            });
        }
    });
}

function addBatchRowWithData(data, rowNumber) {
    const uniqueId = Date.now() + '_' + rowNumber + '_' + Math.random().toString(36).substr(2, 9);

    const row = `
        <tr class="batch-row" data-sampling-id="${data.id || ''}">
            <td>
                <input type="hidden" name="data_sampling[${rowNumber}][id]" value="${data.id || ''}">
                <select name="data_sampling[${rowNumber}][kolam]" id="batch_${uniqueId}_lokasi" class="form-control form-select batch-lokasi" required onchange="calculateDoc('${uniqueId}', '${rowNumber}')">
                    <option value="">Pilih Kolam</option>
                    ${lokasiOptions.map(lokasi => `<option value="${lokasi.nama}" ${data.kolam == lokasi.nama ? 'selected' : ''}>${lokasi.nama}</option>`).join('')}
                </select>
            </td>
            <td>
                <input type="number" name="data_sampling[${rowNumber}][doc]" id="batch_${uniqueId}_doc" class="form-control" placeholder="Auto" readonly style="background-color: #f8f9fa;" value="${data.doc || ''}">
            </td>
            <td>
                <input type="text" name="data_sampling[${rowNumber}][qty_sampling_display]" id="batch_${uniqueId}_qty_sampling_display" class="form-control number-input" placeholder="0" style="text-align: right;" required oninput="formatNumberInputSampling('${uniqueId}')" value="${data.qty_sampling > 0 ? formatNumber(data.qty_sampling) : '0'}">
                <input type="hidden" name="data_sampling[${rowNumber}][qty_sampling]" id="batch_${uniqueId}_qty_sampling" value="${data.qty_sampling || 0}">
            </td>
            <td>
                <input type="text" name="data_sampling[${rowNumber}][total_berat_display]" id="batch_${uniqueId}_total_berat_display" class="form-control number-input" placeholder="0" style="text-align: right;" required oninput="formatNumberInputBerat('${uniqueId}')" value="${data.total_berat > 0 ? formatNumber(data.total_berat) : '0'}">
                <input type="hidden" name="data_sampling[${rowNumber}][total_berat]" id="batch_${uniqueId}_total_berat" value="${data.total_berat || 0}">
            </td>
            <td>
                <input type="text" name="data_sampling[${rowNumber}][mbw_display]" id="batch_${uniqueId}_mbw_display" class="form-control" placeholder="Auto" readonly style="background-color: #f8f9fa; font-weight: 500; color: #28a745;" value="${data.mbw > 0 ? formatNumber(data.mbw) : '0'}">
                <input type="hidden" name="data_sampling[${rowNumber}][mbw]" id="batch_${uniqueId}_mbw" value="${data.mbw || 0}">
            </td>
            <td>
                <button type="button" class="btn btn-sm btn-danger" onclick="removeBatchRow(this)">
                    <svg width="14" height="14" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                    </svg>
                </button>
            </td>
        </tr>
    `;
    $('#batchTableBody').append(row);

    // Initialize Select2 for the new row
    const newRow = $('#batchTableBody tr:last');

    if (newRow.find('.batch-lokasi').length) {
        newRow.find('.batch-lokasi').select2({
            theme: 'bootstrap4',
            placeholder: 'Pilih Kolam',
            allowClear: true,
            width: '100%',
            dropdownParent: $('#samplingModal')
        });
    }

    updateRowCount();
    updateGrandTotal();
}

function deleteSampling(id) {
    console.log('deleteSampling called with id:', id);

    // Fetch the sampling data to check if it's part of a batch
    $.ajax({
        url: '/sampling/' + id,
        method: 'GET',
        success: function(response) {
            const sampling = response.data;
            const noBukti = sampling.no_bukti;

            // Check if there are other records with the same no_bukti
            $.ajax({
                url: '/sampling/check-no-bukti-usage/' + noBukti + '/' + id,
                method: 'GET',
                success: function(checkResponse) {
                    let confirmText = 'Apakah Anda yakin ingin menghapus data sampling ini?';

                    if (checkResponse.count > 0) {
                        confirmText = `Data ini bagian dari batch ${noBukti} dengan ${checkResponse.count} record lainnya. Hapus hanya record ini atau seluruh batch?`;

                        Swal.fire({
                            title: 'Hapus Data Sampling?',
                            text: confirmText,
                            icon: 'warning',
                            showCancelButton: true,
                            showDenyButton: true,
                            confirmButtonColor: '#d33',
                            denyButtonColor: '#3085d6',
                            cancelButtonColor: '#6c757d',
                            confirmButtonText: 'Hapus Semua Batch',
                            denyButtonText: 'Hapus Ini Saja',
                            cancelButtonText: 'Batal'
                        }).then((result) => {
                            if (result.isConfirmed) {
                                // Delete all records with the same no_bukti
                                deleteAllBatch(noBukti);
                            } else if (result.isDenied) {
                                // Delete only this record
                                deleteSingleRecord(id);
                            }
                        });
                    } else {
                        // Single record, show simple confirmation
                        Swal.fire({
                            title: 'Hapus Data Sampling?',
                            text: confirmText,
                            icon: 'warning',
                            showCancelButton: true,
                            confirmButtonColor: '#d33',
                            cancelButtonColor: '#3085d6',
                            confirmButtonText: 'Ya, hapus!',
                            cancelButtonText: 'Batal'
                        }).then((result) => {
                            if (result.isConfirmed) {
                                deleteSingleRecord(id);
                            }
                        });
                    }
                },
                error: function(xhr) {
                    // If checking fails, proceed with simple delete
                    deleteSingleRecord(id);
                }
            });
        },
        error: function(xhr) {
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: 'Gagal mengambil data sampling!'
            });
        }
    });
}

function deleteSingleRecord(id) {
    $.ajax({
        url: '/sampling/' + id,
        method: 'DELETE',
        data: {
            _token: '{{ csrf_token() }}'
        },
        success: function(response) {
            $('#samplingTable').DataTable().ajax.reload(null, false);
            updateSummary();
            Swal.fire({
                icon: 'success',
                title: 'Berhasil',
                text: 'Sampling benur berhasil dihapus!',
                timer: 2000,
                showConfirmButton: false
            });
        },
        error: function(xhr) {
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: xhr.responseJSON?.message || 'Gagal menghapus sampling benur!'
            });
        }
    });
}

function deleteAllBatch(noBukti) {
    $.ajax({
        url: '/sampling/batch/' + noBukti,
        method: 'DELETE',
        data: {
            _token: '{{ csrf_token() }}'
        },
        success: function(response) {
            $('#samplingTable').DataTable().ajax.reload(null, false);
            updateSummary();
            Swal.fire({
                icon: 'success',
                title: 'Berhasil',
                text: 'Seluruh batch sampling benur berhasil dihapus!',
                timer: 2000,
                showConfirmButton: false
            });
        },
        error: function(xhr) {
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: xhr.responseJSON?.message || 'Gagal menghapus batch sampling benur!'
            });
        }
    });
}

function resetSamplingForm() {
    console.log('resetSamplingForm called');

    // Reset form elements
    $('#samplingForm')[0].reset();
    $('#samplingModalTitle').text('Sampling Baru');
    $('#samplingMethod').val('POST');
    $('#sampling_id').val('');
    $('#samplingForm').attr('action', '{{ route('sampling.store.batch') }}');

    // Stop polling
    stopRealtimePolling();
    lastKnownSequence = null;
    isSubmitting = false;

    // Enable master fields that were disabled in edit mode
    $('#tanggal_sampling').prop('disabled', false);

    // Clear batch table and add one empty row
    $('#batchTableBody').empty();
    addBatchRow();

    // Reset no_bukti - clear immediately
    $('#no_bukti').val('');
    $('#no_bukti_help').text('Pilih tanggal untuk generate nomor bukti otomatis');

    // Set tanggal ke hari ini dan generate preview (tanpa delay)
    const today = '{{ date('Y-m-d') }}';
    $('#tanggal_sampling').val(today);
    console.log('Setting tanggal to:', today);

    // Generate no_bukti preview untuk hari ini (immediate call)
    console.log('Calling generateNoBuktiPreview...');
    generateNoBuktiPreview(today);

    // Reset grand total
    $('#grandTotalQty').text('0');
    $('#grandTotalBerat').text('0');

    // Reset tombol submit
    $('#submitBtn').prop('disabled', false);
    $('#submitBtnText').removeClass('d-none').css('display', 'inline');
    $('#submitBtnLoading').addClass('d-none').css('display', 'none');
}

// Fungsi untuk generate preview no_bukti
function generateNoBuktiPreview(tanggal) {
    console.log('generateNoBuktiPreview called with tanggal:', tanggal);

    if (!tanggal) {
        $('#no_bukti').val('');
        $('#no_bukti_help').text('Pilih tanggal untuk generate nomor bukti otomatis');
        return;
    }

    // Parse tanggal dari format yyyy-mm-dd (HTML5 date input)
    const dateParts = tanggal.split('-');
    const tanggalObj = new Date(dateParts[0], dateParts[1] - 1, dateParts[2]);

    if (isNaN(tanggalObj.getTime())) {
        $('#no_bukti_help').html('❌ Format tanggal tidak valid');
        return;
    }

    // Generate tanggal part (YYMMDD)
    const yy = tanggalObj.getFullYear().toString().slice(-2);
    const mm = String(tanggalObj.getMonth() + 1).padStart(2, '0');
    const dd = String(tanggalObj.getDate()).padStart(2, '0');
    const tanggalPart = yy + mm + dd;

    // Tampilkan preview dengan nomor urut sementara
    $('#no_bukti').val('SAM' + tanggalPart + 'XXX');
    $('#no_bukti_help').html('⏳ Loading...');

    // Ambil nomor urut terakhir untuk tanggal ini dari database
    $.ajax({
        url: '/sampling/get-last-sequence/' + tanggal,
        method: 'GET',
        success: function(response) {
            console.log('getLastSequence response:', response);

            if (response.error) {
                $('#no_bukti_help').html('❌ ' + response.error);
                return;
            }

            const nextSequence = response.next_sequence;
            const noBuktiPreview = 'SAM' + tanggalPart + String(nextSequence).padStart(3, '0');

            lastKnownSequence = {
                next_sequence: nextSequence,
                no_bukti: noBuktiPreview,
                timestamp: response.timestamp
            };

            $('#no_bukti').val(noBuktiPreview);
            $('#no_bukti_help').html('✅ No Bukti: <strong>' + noBuktiPreview + '</strong> <small style="color: #6c757d;">(Real-time)</small>');

            // Start polling untuk update real-time
            startRealtimePolling(tanggal);
        },
        error: function(xhr) {
            console.error('Error getting last sequence:', xhr);
            // Jika error, tampilkan pesan error
            const errorMsg = xhr.responseJSON?.error || 'Gagal mengambil nomor urut';
            $('#no_bukti_help').html('❌ ' + errorMsg);
        }
    });
}

// Fungsi untuk polling real-time setiap detik
function startRealtimePolling(tanggal) {
    // Stop polling yang ada sebelumnya
    if (pollingInterval) {
        clearInterval(pollingInterval);
    }

    // Polling setiap 1 detik
    pollingInterval = setInterval(function() {
        if (!tanggal || isSubmitting) {
            return;
        }

        $.ajax({
            url: '/sampling/get-last-sequence/' + tanggal,
            method: 'GET',
            success: function(response) {
                if (response.error) {
                    console.log('Polling error:', response.error);
                    return;
                }

                const currentSequence = response.next_sequence;

                // Parse tanggal untuk generate no_bukti
                const dateParts = tanggal.split('-');
                const dateObj = new Date(dateParts[0], dateParts[1] - 1, dateParts[2]);
                const yy = dateObj.getFullYear().toString().slice(-2);
                const mm = String(dateObj.getMonth() + 1).padStart(2, '0');
                const dd = String(dateObj.getDate()).padStart(2, '0');
                const tanggalPart = yy + mm + dd;
                const noBuktiPreview = 'SAM' + tanggalPart + String(currentSequence).padStart(3, '0');

                // Update tampilan jika ada perubahan
                if (!lastKnownSequence || currentSequence !== lastKnownSequence.next_sequence) {
                    $('#no_bukti').val(noBuktiPreview);

                    // Tampilkan warning jika nomor urut berubah
                    if (lastKnownSequence && currentSequence > lastKnownSequence.next_sequence) {
                        $('#no_bukti_help').html('⚠️ Nomor urut berubah! <strong>' + noBuktiPreview + '</strong> <small style="color: #dc3545;">(Update baru)</small>');
                    } else {
                        $('#no_bukti_help').html('✅ No Bukti: <strong>' + noBuktiPreview + '</strong> <small style="color: #6c757d;">(Real-time)</small>');
                    }

                    lastKnownSequence = {
                        next_sequence: currentSequence,
                        no_bukti: noBuktiPreview,
                        timestamp: response.timestamp
                    };
                }
            },
            error: function(xhr) {
                const errorMsg = xhr.responseJSON?.error || 'Polling error';
                console.log('Polling error:', errorMsg);
            }
        });
    }, 1000);
}

// Fungsi untuk stop polling
function stopRealtimePolling() {
    if (pollingInterval) {
        clearInterval(pollingInterval);
        pollingInterval = null;
    }
}

$(document).ready(function() {
    console.log('Document ready! Initializing...');

    // Initialize batch table with one row
    addBatchRow();

    // Initialize Select2 for the first batch row
    initSelect2ForBatchRows();

    // Initialize grand total
    updateGrandTotal();

    // Auto-generate no_bukti preview saat tanggal berubah
    $('#tanggal_sampling').on('change', function() {
        const tanggal = $(this).val();
        generateNoBuktiPreview(tanggal);
    });

    samplingTable = $('#samplingTable').DataTable({
        processing: true,
        serverSide: true,
        pageLength: 10,
        lengthMenu: [[10, 25, 50, 100], [10, 25, 50, 100]],
        scrollX: true,
        dom: 'Bfrtip',
        buttons: [
            'copy',
            'csv',
            'excel',
            'pdf',
            'print'
        ],
        ajax: {
            url: '{{ route("sampling.data") }}',
            type: 'GET',
            data: function(d) {
                d._token = '{{ csrf_token() }}';
                // Ensure search parameters are properly sent
                if (d.search && d.search.value) {
                    d.search = d.search;
                }
            },
            error: function(xhr, error, thrown) {
                console.error('DataTable error:', error, thrown);
                console.error('Response:', xhr.responseText);
            }
        },
        columns: [
            { data: 'no_bukti', name: 'no_bukti', searchable: true },
            { data: 'tanggal_format', name: 'tanggal', searchable: false },
            { data: 'kolam', name: 'kolam', searchable: true },
            { data: 'doc', name: 'doc', searchable: true },
            { data: 'qty_sampling_format', name: 'qty_sampling', searchable: true },
            { data: 'total_berat_format', name: 'total_berat', searchable: true },
            { data: 'mbw_format', name: 'mbw', searchable: true },
            { data: 'adg_format', name: 'adg', searchable: true },
            { data: 'pembuat', name: 'created_by', searchable: true },
            { data: 'action', orderable: false, searchable: false }
        ],
        order: [[0, 'desc']],
        language: {
            sEmptyTable: "Tidak ada data tersedia",
            sInfo: "Menampilkan _START_ sampai _END_ dari _TOTAL_ data",
            sInfoEmpty: "Menampilkan 0 sampai 0 dari 0 data",
            sInfoFiltered: "(difilter dari _MAX_ total data)",
            sInfoPostFix: "",
            sInfoThousands: ",",
            sLengthMenu: "Tampilkan _MENU_ data",
            sLoadingRecords: "Memuat...",
            sProcessing: "Memproses...",
            sSearch: "Cari:",
            sSearchPlaceholder: "Cari berdasarkan No. Bukti, Lokasi...",
            sZeroRecords: "Tidak ditemukan data yang cocok",
            oPaginate: {
                sFirst: "Pertama",
                sLast: "Terakhir",
                sNext: "Selanjutnya",
                sPrevious: "Sebelumnya"
            },
            oAria: {
                sSortAscending: ": aktifkan untuk mengurutkan kolom secara ascending",
                sSortDescending: ": aktifkan untuk mengurutkan kolom secara descending"
            }
        }
    });

    $('#samplingForm').on('submit', function(e) {
        e.preventDefault();
        console.log('Form submit triggered!');

        // Cegah double submit
        if (isSubmitting) {
            console.log('Already submitting, skipping...');
            return;
        }

        // Validasi setiap baris
        let hasError = false;
        $('#batchTableBody tr').each(function(rowIdx, row) {
            const lokasiId = $(row).find('.batch-lokasi').val();
            const qtySampling = parseFloat($(row).find('[id$="_qty_sampling"]').val()) || 0;
            const totalBerat = parseFloat($(row).find('[id$="_total_berat"]').val()) || 0;

            if (!lokasiId || lokasiId === '') {
                Swal.fire({
                    icon: 'error',
                    title: 'Validasi Error',
                    text: 'Kolam harus dipilih di baris ' + (rowIdx + 1)
                });
                hasError = true;
                return false;
            }

            if (qtySampling < 0.01) {
                Swal.fire({
                    icon: 'error',
                    title: 'Validasi Error',
                    text: 'Qty Sampling minimal 0.01 di baris ' + (rowIdx + 1)
                });
                hasError = true;
                return false;
            }

            if (totalBerat < 0.01) {
                Swal.fire({
                    icon: 'error',
                    title: 'Validasi Error',
                    text: 'Total Berat minimal 0.01 di baris ' + (rowIdx + 1)
                });
                hasError = true;
                return false;
            }
        });

        if (hasError) {
            return;
        }

        // Prepare form data - temporarily enable disabled fields for submission
        const disabledFields = $('#samplingForm').find(':disabled').prop('disabled', false);
        const formData = $(this).serialize();
        disabledFields.prop('disabled', true);
        const url = $(this).attr('action');
        const method = $('#samplingMethod').val(); // 'POST' or 'PUT'

        submitFormData(formData, url, method);
    });

    function submitFormData(formData, url, method) {
        console.log('=== SUBMIT FORM DATA CALLED ===');
        console.log('URL:', url);
        console.log('Method:', method);
        console.log('FormData:', formData);

        // Set flag submitting
        isSubmitting = true;

        // Disable tombol dan tampilkan loading
        const submitBtn = $('#submitBtn');
        const submitBtnText = $('#submitBtnText');
        const submitBtnLoading = $('#submitBtnLoading');

        submitBtn.prop('disabled', true);
        submitBtnText.addClass('d-none').css('display', 'none');
        submitBtnLoading.removeClass('d-none').css('display', 'inline-block');

        $.ajax({
            url: url,
            method: method, // Use actual method (POST or PUT)
            data: formData,
            beforeSend: function(xhr) {
                xhr.setRequestHeader('X-CSRF-TOKEN', '{{ csrf_token() }}');
            },
            success: function(response) {
                console.log('=== SUCCESS ===');
                console.log('Response:', response);

                // Re-enable tombol
                submitBtn.prop('disabled', false);
                submitBtnText.removeClass('d-none').css('display', 'inline');
                submitBtnLoading.addClass('d-none').css('display', 'none');

                isSubmitting = false;

                // Reload DataTable
                $('#samplingTable').DataTable().ajax.reload(null, false);

                // Update summary cards
                updateSummary();

                // Tampilkan SweetAlert
                const isEdit = method === 'PUT';
                Swal.fire({
                    icon: 'success',
                    title: 'Berhasil',
                    text: isEdit
                        ? `Sampling benur berhasil diperbarui! ${response.records_count ? response.records_count + ' records' : ''}`
                        : `Sampling benur berhasil disimpan dengan No. Bukti: ${response.no_bukti}!`,
                    timer: 2000,
                    showConfirmButton: false,
                    backdrop: false,
                    customClass: {
                        popup: 'swal2-popup-on-top'
                    }
                }).then(function() {
                    // Tutup modal dan reset form
                    const modalEl = document.getElementById('samplingModal');
                    const modal = bootstrap.Modal.getInstance(modalEl);
                    if (modal) {
                        modal.hide();
                    }
                    resetSamplingForm();
                });
            },
            error: function(xhr) {
                console.error('Error:', xhr);
                console.error('Response Text:', xhr.responseText);
                console.error('Status:', xhr.status);
                console.error('Response JSON:', xhr.responseJSON);
                const errorMsg = xhr.responseJSON?.message || (xhr.responseJSON?.errors ? Object.values(xhr.responseJSON.errors).join(', ') : 'Terjadi kesalahan!');
                const errorDetails = xhr.responseJSON?.details;
                const errorType = xhr.responseJSON?.error;

                let fullErrorMsg = errorMsg;
                if (errorDetails) {
                    fullErrorMsg += '\n\nDetail: ' + errorDetails;
                }

                Swal.fire({
                    icon: 'error',
                    title: 'Gagal',
                    text: fullErrorMsg,
                    footer: errorType ? `Error Type: ${errorType}` : null
                });

                // Re-enable tombol
                submitBtn.prop('disabled', false);
                submitBtnText.removeClass('d-none').css('display', 'inline');
                submitBtnLoading.addClass('d-none').css('display', 'none');

                isSubmitting = false;
            }
        });
    }

    // Reset form when modal is shown (for new entry)
    $('#samplingModal').on('show.bs.modal', function(e) {
        const relatedTarget = e.relatedTarget;

        // Jika modal dibuka dari tombol "Sampling Baru" (bukan dari fungsi editSampling)
        if (relatedTarget && $(relatedTarget).attr('data-bs-toggle') === 'modal') {
            // Ini tombol "Sampling Baru", reset form
            console.log('Opening modal for new entry - resetting form');
            resetSamplingForm();
        } else {
            // Ini dari fungsi editSampling, jangan reset form
            console.log('Opening modal for edit');
        }
    });

    // Reset form when modal is closed
    $('#samplingModal').on('hidden.bs.modal', function() {
        // Remove edit mode event listener
        $('#tanggal_sampling').off('change.editMode');
        stopRealtimePolling();
        resetSamplingForm();
    });
});

// Helper function to initialize Select2 for batch rows
function initSelect2ForBatchRows() {
    $('#batchTableBody').find('.batch-lokasi').each(function() {
        $(this).select2({
            theme: 'bootstrap4',
            placeholder: 'Pilih Kolam',
            allowClear: true,
            width: '100%',
            dropdownParent: $('#samplingModal')
        });
    });
}
</script>
@endpush
@endsection