<?php
$errors = session()->getFlashdata('errors');
$selectedBarang = (string) old('barang_id', '');
$tanggalValue = old('tanggal_penyesuaian', $tanggal ?? date('Y-m-d'));
$noPenyesuaianValue = old('no_penyesuaian', $noPenyesuaian ?? '');
$stokFisikValue = old('stok_fisik', '');
$alasanValue = old('alasan', '');
$alasanOptions = [
    'Stock opname',
    'Barang rusak',
    'Barang hilang',
    'Salah input transaksi',
    'Koreksi data',
    'Lainnya',
];
?>

<section class="content-area">
    <?php if ($errors) : ?>
        <div class="alert alert-danger">
            <?php foreach ($errors as $error) : ?>
                <div><?= esc($error) ?></div>
            <?php endforeach; ?>
        </div>
    <?php endif; ?>

    <?php if (session()->getFlashdata('error')) : ?>
        <div class="alert alert-danger"><?= esc(session()->getFlashdata('error')) ?></div>
    <?php endif; ?>

    <div class="panel p-4">
        <form action="<?= esc($action, 'attr') ?>" method="post" id="stokPenyesuaianForm">
            <?= csrf_field() ?>

            <div class="row g-4">
                <div class="col-12 col-lg-3">
                    <label for="tanggal_penyesuaian" class="form-label fw-semibold">Tanggal Penyesuaian</label>
                    <input type="date" class="form-control" id="tanggal_penyesuaian" name="tanggal_penyesuaian" value="<?= esc($tanggalValue, 'attr') ?>" required>
                </div>

                <div class="col-12 col-lg-3">
                    <label for="no_penyesuaian" class="form-label fw-semibold">No. Penyesuaian</label>
                    <input type="text" class="form-control" id="no_penyesuaian" name="no_penyesuaian" value="<?= esc($noPenyesuaianValue, 'attr') ?>" readonly>
                </div>

                <div class="col-12 col-lg-6">
                    <label for="barang_id" class="form-label fw-semibold">Barang</label>
                    <select class="form-select select2" id="barang_id" name="barang_id" data-placeholder="Pilih barang" required>
                        <option value=""></option>
                        <?php foreach ($barang as $item) : ?>
                            <option
                                value="<?= esc($item['id'], 'attr') ?>"
                                data-kode="<?= esc($item['kode_barang'], 'attr') ?>"
                                data-nama="<?= esc($item['nama_barang'], 'attr') ?>"
                                data-satuan="<?= esc($item['satuan'], 'attr') ?>"
                                data-stok="<?= esc((string) ($item['stok'] ?? 0), 'attr') ?>"
                                <?= $selectedBarang === (string) $item['id'] ? 'selected' : '' ?>
                            >
                                <?= esc($item['kode_barang']) ?> - <?= esc($item['nama_barang']) ?><?= ! empty($item['nama_kategori']) ? ' (' . esc($item['nama_kategori']) . ')' : '' ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </div>

                <div class="col-12 col-md-4">
                    <label for="kode_barang" class="form-label fw-semibold">Kode Barang</label>
                    <input type="text" class="form-control" id="kode_barang" readonly>
                </div>

                <div class="col-12 col-md-4">
                    <label for="nama_barang" class="form-label fw-semibold">Nama Barang</label>
                    <input type="text" class="form-control" id="nama_barang" readonly>
                </div>

                <div class="col-12 col-md-4">
                    <label for="satuan" class="form-label fw-semibold">Satuan</label>
                    <input type="text" class="form-control" id="satuan" readonly>
                </div>

                <div class="col-12 col-md-4">
                    <label for="stok_sistem" class="form-label fw-semibold">Stok Sistem</label>
                    <input type="number" class="form-control" id="stok_sistem" readonly>
                </div>

                <div class="col-12 col-md-4">
                    <label for="stok_fisik" class="form-label fw-semibold">Stok Fisik</label>
                    <input type="number" class="form-control" id="stok_fisik" name="stok_fisik" min="0" value="<?= esc((string) $stokFisikValue, 'attr') ?>" required>
                    <div class="form-text">Isi sesuai jumlah fisik barang hasil pengecekan.</div>
                </div>

                <div class="col-12 col-md-4">
                    <label for="selisih" class="form-label fw-semibold">Selisih</label>
                    <input type="text" class="form-control" id="selisih" readonly>
                    <div class="form-text" id="jenisPenyesuaianText">Pilih barang dan isi stok fisik.</div>
                </div>

                <div class="col-12 col-md-6">
                    <label for="alasan" class="form-label fw-semibold">Alasan Penyesuaian</label>
                    <select class="form-select" id="alasan" name="alasan" required>
                        <option value="">Pilih alasan</option>
                        <?php foreach ($alasanOptions as $option) : ?>
                            <option value="<?= esc($option, 'attr') ?>" <?= $alasanValue === $option ? 'selected' : '' ?>><?= esc($option) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>

                <div class="col-12 col-md-6">
                    <label for="catatan" class="form-label fw-semibold">Catatan</label>
                    <textarea class="form-control" id="catatan" name="catatan" rows="2"><?= esc(old('catatan', '')) ?></textarea>
                </div>
            </div>

            <div class="d-flex justify-content-end gap-2 mt-4">
                <a href="<?= site_url('admin/stok-penyesuaian') ?>" class="btn btn-light">Batal</a>
                <button type="submit" class="btn btn-dark">Simpan Penyesuaian</button>
            </div>
        </form>
    </div>
</section>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        const generateNumberUrl = <?= json_encode($generateNumberUrl) ?>;
        const tanggalInput = document.getElementById('tanggal_penyesuaian');
        const noPenyesuaianInput = document.getElementById('no_penyesuaian');
        const barangSelect = document.getElementById('barang_id');
        const kodeInput = document.getElementById('kode_barang');
        const namaInput = document.getElementById('nama_barang');
        const satuanInput = document.getElementById('satuan');
        const stokSistemInput = document.getElementById('stok_sistem');
        const stokFisikInput = document.getElementById('stok_fisik');
        const selisihInput = document.getElementById('selisih');
        const jenisText = document.getElementById('jenisPenyesuaianText');

        const currentSelectedOption = function () {
            return barangSelect.options[barangSelect.selectedIndex] || null;
        };

        const updateBarangInfo = function () {
            const option = currentSelectedOption();

            if (! option || ! option.value) {
                kodeInput.value = '';
                namaInput.value = '';
                satuanInput.value = '';
                stokSistemInput.value = '';
                updateSelisih();
                return;
            }

            kodeInput.value = option.dataset.kode || '';
            namaInput.value = option.dataset.nama || '';
            satuanInput.value = option.dataset.satuan || '';
            stokSistemInput.value = option.dataset.stok || '0';
            updateSelisih();
        };

        const updateSelisih = function () {
            const stokSistem = parseInt(stokSistemInput.value, 10);
            const stokFisik = parseInt(stokFisikInput.value, 10);

            if (Number.isNaN(stokSistem) || Number.isNaN(stokFisik)) {
                selisihInput.value = '';
                jenisText.textContent = 'Pilih barang dan isi stok fisik.';
                jenisText.className = 'form-text';
                return;
            }

            const selisih = stokFisik - stokSistem;
            selisihInput.value = selisih;

            if (selisih > 0) {
                jenisText.textContent = 'Penambahan stok ' + selisih + ' item.';
                jenisText.className = 'form-text text-success';
            } else if (selisih < 0) {
                jenisText.textContent = 'Pengurangan stok ' + Math.abs(selisih) + ' item.';
                jenisText.className = 'form-text text-danger';
            } else {
                jenisText.textContent = 'Stok sistem sudah sesuai dengan stok fisik.';
                jenisText.className = 'form-text text-secondary';
            }
        };

        tanggalInput.addEventListener('change', function () {
            if (! tanggalInput.value) {
                return;
            }

            fetch(generateNumberUrl + '?tanggal_penyesuaian=' + encodeURIComponent(tanggalInput.value), {
                headers: {
                    'X-Requested-With': 'XMLHttpRequest'
                }
            })
                .then(function (response) {
                    return response.ok ? response.json() : null;
                })
                .then(function (payload) {
                    if (payload && payload.no_penyesuaian) {
                        noPenyesuaianInput.value = payload.no_penyesuaian;
                    }
                });
        });

        barangSelect.addEventListener('change', updateBarangInfo);

        if (window.jQuery) {
            $('#barang_id').on('change', updateBarangInfo);
        }

        stokFisikInput.addEventListener('input', updateSelisih);
        updateBarangInfo();
    });
</script>
