<?php $__env->startSection('content'); ?>
    <div class="d-flex justify-content-between align-items-center mb-2">
        <h2>Buat Laporan Baru</h2>
        <a href="<?php echo e(route('laporan.index')); ?>" class="btn btn-outline-secondary rounded-3 px-4">
            <i class="bi bi-arrow-left me-1"></i> Kembali
        </a>
    </div>

    <form method="POST" action="<?php echo e(route('laporan.store')); ?>" enctype="multipart/form-data" id="laporanForm">
        <?php echo csrf_field(); ?>

        <!-- ================= INFORMASI UMUM ================= -->
        <div class="card shadow-sm mb-4 border-0">
            <div class="card-header bg-primary text-white">
                <h5 class="mb-0"><i class="fas fa-info-circle me-2"></i>Informasi Umum</h5>
            </div>

            <div class="card-body">
                <div class="row g-3">

                    <div class="col-md-6">
                        <label class="form-label">Tanggal</label>
                        <input type="date" class="form-control" name="tanggal" id="tanggal"
                            value="<?php echo e(old('tanggal', date('Y-m-d'))); ?>" readonly>
                        <span id="messageTanggal" class="text-danger small mt-1 d-block"></span>
                    </div>
                    <input type="hidden" name="nama_gl" value="<?php echo e(Auth::user()->karyawan->nama); ?>">
                    <div class="col-md-6">
                        <label class="form-label">Nama GL</label>
                        <input type="text" class="form-control" value="<?php echo e(Auth::user()->karyawan->nama); ?>" readonly>
                    </div>

                    <input type="hidden" name="jabatan" id="jabatanInput">
                    <!-- Manpower -->
                    <div class="col-md-6">
                        <label class="form-label">Pilih Manpower</label>
                        <select class="form-select" name="manpower_id" id="manpowerSelect">
                            <option value="">-- Pilih Karyawan --</option>

                            <?php $__currentLoopData = $manpowers; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $mp): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <option value="<?php echo e($mp->id); ?>" data-dept="<?php echo e($mp->departemen); ?>"
                                    data-plant="<?php echo e($mp->plant); ?>" data-jabatan="<?php echo e($mp->jabatan); ?>"
                                    <?php echo e(old('manpower_id') == $mp->id ? 'selected' : ''); ?>>
                                    <?php echo e($mp->nama); ?> - <?php echo e($mp->jabatan); ?>

                                </option>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </select>
                        <span id="messageManpower" class="text-danger small mt-1 d-block"></span>
                    </div>

                    <!-- AUTO FILL -->
                    <div class="col-md-3">
                        <label class="form-label">Departemen</label>
                        <input type="text" class="form-control" name="departemen" readonly>
                    </div>

                    <div class="col-md-3">
                        <label class="form-label">Plant</label>
                        <input type="text" class="form-control" name="plant" readonly>
                    </div>

                </div>
            </div>
        </div>

        <!-- ================= PENILAIAN ================= -->
        <?php
            $kategoris = [
                'SHE Culture' => 'Target 100%',
                'ATR' => 'Target 99%',
                'Incident' => 'Target Zero',
                'Manpower Behavior' => 'Target Zero',
            ];
        ?>
        <div class="card shadow-sm mb-4 border-0">
            <div class="card-header bg-success text-white">
                <h5 class="mb-0">
                    <i class="fas fa-check-square me-2"></i>Penilaian
                </h5>
            </div>

            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-bordered mb-0">

                        <thead class="table-light">
                            <tr>
                                <th>Kategori</th>
                                <th>Status</th>
                                <th>Keterangan</th>
                            </tr>
                        </thead>

                        <tbody>
                            <?php $__currentLoopData = $kategoris; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $kategori => $target): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <?php $key = Str::slug($kategori); ?>
                                <tr>
                                    <td>
                                        <strong><?php echo e($kategori); ?></strong><br>
                                        <small class="text-muted"><?php echo e($target); ?></small>
                                    </td>

                                    <td class="text-center">
                                        <div class="btn-group">
                                            <input type="radio" class="btn-check"
                                                name="penilaian[<?php echo e($key); ?>][status]"
                                                id="status_<?php echo e($key); ?>_1" value="1">

                                            <label class="btn btn-outline-success"
                                                for="status_<?php echo e($key); ?>_1">Tercapai</label>

                                            <input type="radio" class="btn-check"
                                                name="penilaian[<?php echo e($key); ?>][status]"
                                                id="status_<?php echo e($key); ?>_0" value="0">

                                            <label class="btn btn-outline-danger"
                                                for="status_<?php echo e($key); ?>_0">Tidak</label>
                                        </div>
                                    </td>

                                    <td style="min-width:200px;">
                                        <textarea class="form-control" name="penilaian[<?php echo e($key); ?>][keterangan]" rows="2"
                                            placeholder="Tulis alasan jika tidak tercapai..."></textarea>
                                    </td>
                                </tr>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </tbody>

                    </table>
                </div>
            </div>
        </div>
        <!-- ================= TAMBAHAN ================= -->
        <div class="card shadow-sm mb-4 border-0">
            <div class="card-header bg-info text-white">
                <h5 class="mb-0"><i class="fas fa-file-alt me-2"></i>Informasi Tambahan</h5>
            </div>

            <div class="card-body">
                <textarea class="form-control mb-3" name="note" placeholder="Note"></textarea>
                <textarea class="form-control mb-3" name="feedback" placeholder="Feedback"></textarea>

                <input class="form-control" type="file" name="foto" id="foto" accept="image/*">
                <span id="messageFoto" class="text-danger small mt-1 d-block"></span>
            </div>
        </div>

        <div class="text-end">
            <button class="btn btn-primary btn-lg" id="buttonLaporan">Simpan</button>
        </div>

    </form>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
    <script>
        window.addEventListener('DOMContentLoaded', function() {
            const select = document.getElementById('manpowerSelect');
            if (select.value) {
                select.dispatchEvent(new Event('change'));
            }
        });
        // AUTO FILL
        document.getElementById('manpowerSelect').addEventListener('change', function() {
            const selected = this.options[this.selectedIndex];

            document.querySelector('[name="departemen"]').value =
                selected.getAttribute('data-dept') || '';

            document.querySelector('[name="plant"]').value =
                selected.getAttribute('data-plant') || '';

            document.getElementById('jabatanInput').value =
                selected.getAttribute('data-jabatan') || '';
        });


        document.getElementById('laporanForm').addEventListener('submit', function(e) {
            let valid = true;

            const manpowerSelect = document.getElementById('manpowerSelect').value;
            const tanggal = document.getElementById('tanggal').value;
            const fotoInput = document.getElementById('foto');

            const messageManpower = document.getElementById('messageManpower');
            const messageTanggal = document.getElementById('messageTanggal');
            const messageFoto = document.getElementById('messageFoto');

            // RESET
            messageManpower.textContent = '';
            messageTanggal.textContent = '';
            messageFoto.textContent = '';

            if (!manpowerSelect) {
                messageManpower.textContent = 'Manpower harus di isi.';
                valid = false;
            }

            if (!tanggal) {
                messageTanggal.textContent = 'Tanggal harus di isi.';
                valid = false;
            }

            if (fotoInput.files.length === 0) {
                messageFoto.textContent = 'Foto harus di isi.';
                valid = false;
            }

            // VALIDASI STATUS
            document.querySelectorAll('tbody tr').forEach(tr => {
                const radios = tr.querySelectorAll('input[type="radio"]');
                const isChecked = Array.from(radios).some(r => r.checked);

                if (!isChecked) {
                    tr.classList.add('table-danger');
                    valid = false;
                } else {
                    tr.classList.remove('table-danger');
                }
            });

            // VALIDASI KETERANGAN
            document.querySelectorAll('input[value="0"]:checked').forEach(radio => {
                const tr = radio.closest('tr');
                const textarea = tr.querySelector('textarea');

                if (!textarea.value.trim()) {
                    textarea.classList.add('is-invalid');
                    valid = false;
                } else {
                    textarea.classList.remove('is-invalid');
                }
            });

            if (!valid) {
                e.preventDefault();
            }
        });


        document.querySelectorAll('input[type="radio"]').forEach(radio => {
            radio.addEventListener('change', function() {
                const tr = this.closest('tr');
                const textarea = tr.querySelector('textarea');

                // HAPUS ERROR STATUS ROW
                tr.classList.remove('table-danger');

                if (this.value == "1") {
                    // Kalau Tercapai
                    textarea.value = '';
                    textarea.classList.remove('is-invalid'); // 🔥 INI YANG PENTING
                    textarea.setAttribute('disabled', true);
                } else {
                    // Kalau Tidak
                    textarea.removeAttribute('disabled');
                }
            });
        });
    </script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts/app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\laragon\www\gl-asuh\resources\views/menu/laporan/create.blade.php ENDPATH**/ ?>