<?php $__env->startSection('content'); ?> 
    <div class="d-flex justify-content-between align-items-center mb-3">
        <div>
            <h2 class="mb-0 fw-semibold">Edit User</h2>
            <small class="text-muted">
                Perbarui data akun pengguna sistem
            </small>
        </div>

        <a href="<?php echo e(route('user.index')); ?>" class="btn btn-outline-secondary rounded-3 px-4">
            <i class="bi bi-arrow-left me-1"></i> Kembali
        </a>
    </div>
 
    <div class="card border-0 shadow-sm rounded-4">
 
        <div style="height:4px; background:#d6a100;"></div>

        <div class="card-body p-4">

            <form action="<?php echo e(route('user.update', $user->slug)); ?>" method="POST">

                <?php echo csrf_field(); ?>
                <?php echo method_field('PUT'); ?>

                <div class="row g-4">
 
                    <div class="col-lg-6">

                        <div class="mb-3">
                            <label class="form-label small fw-semibold">
                                Hubungkan Karyawan
                            </label>

                            <select id="karyawan_id" name="karyawan_id"
                                class="form-select rounded-3 js-example-basic-single <?php $__errorArgs = ['karyawan_id'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>">

                                <option value="">
                                    Pilih Karyawan
                                </option>

                                <?php $__currentLoopData = $karyawans; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $karyawan): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option data-nama="<?php echo e($karyawan->nama); ?>" data-nrp="<?php echo e($karyawan->nrp); ?>"
                                        value="<?php echo e($karyawan->id); ?>"
                                        <?php echo e(old('karyawan_id', $user->karyawan_id) == $karyawan->id ? 'selected' : ''); ?>>

                                        <?php echo e($karyawan->nrp); ?> - <?php echo e($karyawan->nama); ?>


                                    </option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>

                            </select>

                            <span id="messageKaryawan" class="text-danger small mt-1 d-block"></span>

                            <?php $__errorArgs = ['karyawan_id'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <div class="invalid-feedback">
                                    <?php echo e($message); ?>

                                </div>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>

                            <div class="form-text">
                                Menampilkan karyawan yang belum memiliki akun user.
                            </div>
                        </div>

                        <div class="mb-3">
                            <label class="form-label small fw-semibold">
                                Nama
                            </label>

                            <input type="text" id="name_display" class="form-control rounded-3 bg-light"
                                value="<?php echo e(old('name', $user->name)); ?>" placeholder="Nama otomatis dari karyawan" readonly>

                            <input type="hidden" name="name" id="name" value="<?php echo e(old('name', $user->name)); ?>">

                            <span id="messageName" class="text-danger small mt-1 d-block"></span>
                        </div>

                        <div class="mb-3">
                            <label class="form-label small fw-semibold">
                                NRP (Username Login)
                            </label>

                            <input type="text" id="nrp_display" class="form-control rounded-3 bg-light"
                                value="<?php echo e(old('nrp', $user->nrp)); ?>" placeholder="NRP otomatis dari karyawan" readonly>

                            <input type="hidden" name="nrp" id="nrp" value="<?php echo e(old('nrp', $user->nrp)); ?>">

                            <span id="messageNRP" class="text-danger small mt-1 d-block"></span>
                        </div>

                    </div>
 
                    <div class="col-lg-6">

                        <div class="mb-3">
                            <label class="form-label small fw-semibold">
                                Role
                            </label>

                            <select id="role" name="role"
                                class="form-select rounded-3 <?php $__errorArgs = ['role'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>">

                                <option value="">
                                    Pilih Role
                                </option>

                                <option value="administrator"
                                    <?php echo e(old('role', $user->role) == 'administrator' ? 'selected' : ''); ?>>
                                    Administrator
                                </option>

                                <option value="atasan" <?php echo e(old('role', $user->role) == 'atasan' ? 'selected' : ''); ?>>
                                    Atasan
                                </option>

                                <option value="anak_asuh" <?php echo e(old('role', $user->role) == 'anak_asuh' ? 'selected' : ''); ?>>
                                    Anak asuh
                                </option>

                            </select>

                            <span id="messageRole" class="text-danger small mt-1 d-block"></span>

                            <?php $__errorArgs = ['role'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <div class="invalid-feedback">
                                    <?php echo e($message); ?>

                                </div>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <div class="mt-4">

                            <div class="form-check form-switch mb-3">
                                <input class="form-check-input" type="checkbox" id="changePasswordToggle">

                                <label class="form-check-label fw-semibold" for="changePasswordToggle">
                                    Ubah Password
                                </label>
                            </div>

                            <div class="row g-3">

                                <div class="col-md-6">
                                    <label class="form-label small fw-semibold">
                                        Password Baru
                                    </label>

                                    <input type="password" id="password" name="password"
                                        class="form-control rounded-3 <?php $__errorArgs = ['password'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>"
                                        placeholder="Masukkan password baru" disabled>

                                    <span id="messagePassword" class="text-danger small mt-1 d-block"></span>

                                    <?php $__errorArgs = ['password'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                        <div class="invalid-feedback">
                                            <?php echo e($message); ?>

                                        </div>
                                    <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label small fw-semibold">
                                        Konfirmasi Password
                                    </label>

                                    <input type="password" id="password_confirmation" name="password_confirmation"
                                        class="form-control rounded-3" placeholder="Ulangi password baru" disabled>

                                    <span id="messagePasswordConfirm" class="text-danger small mt-1 d-block"></span>
                                </div>

                            </div>

                            <div class="form-text mt-2">
                                Kosongkan jika tidak ingin mengubah password user.
                            </div>

                        </div>
 
                        <div class="border rounded-4 p-3 bg-light-subtle">

                            <div class="d-flex align-items-start gap-3">
                                <div>
                                    <i class="bi bi-info-circle text-warning fs-4"></i>
                                </div>

                                <div>
                                    <div class="fw-semibold mb-1">
                                        Informasi Akun
                                    </div>

                                    <small class="text-muted d-block">
                                        Pastikan role dan data karyawan sesuai sebelum menyimpan perubahan.
                                    </small>
                                </div>
                            </div>

                        </div>

                    </div>

                </div>
 
                <div class="mt-4 d-flex justify-content-end">
                    <button type="submit" class="btn btn-warning rounded-3 px-4 fw-semibold shadow-sm">
                        <i class="bi bi-check-circle me-1"></i>
                        Update Data
                    </button>
                </div>

            </form>

        </div>
    </div>

    <script>
        const karyawanSelect = document.getElementById('karyawan_id');

        function syncKaryawanData() {

            const selected = karyawanSelect.options[karyawanSelect.selectedIndex];

            const nama = selected.getAttribute('data-nama') || '';
            const nrp = selected.getAttribute('data-nrp') || '';

            document.getElementById('name').value = nama;
            document.getElementById('nrp').value = nrp;

            document.getElementById('name_display').value = nama;
            document.getElementById('nrp_display').value = nrp;
 
            document.getElementById('messageKaryawan').innerText =
                karyawanSelect.value ? '' : 'Karyawan belum dipilih';

            document.getElementById('messageName').innerText =
                nama ? '' : 'Nama akan otomatis terisi';

            document.getElementById('messageNRP').innerText =
                nrp ? '' : 'NRP akan otomatis terisi';
        }

        karyawanSelect.addEventListener('change', syncKaryawanData);

        window.addEventListener('DOMContentLoaded', function() {
            syncKaryawanData();

            new TomSelect("#karyawan_id", {
                create: false,
                sortField: {
                    field: "text",
                    direction: "asc"
                }
            });

            const role = document.getElementById('role');

            function validateRole() {
                document.getElementById('messageRole').innerText =
                    role.value ? '' : 'Role wajib dipilih';
            }

            role.addEventListener('change', validateRole);

            validateRole();
        });


        const changePasswordToggle =
            document.getElementById('changePasswordToggle');

        const passwordInput =
            document.getElementById('password');

        const passwordConfirmInput =
            document.getElementById('password_confirmation');

        changePasswordToggle.addEventListener('change', function() {

            passwordInput.disabled = !this.checked;
            passwordConfirmInput.disabled = !this.checked;

            if (!this.checked) {

                passwordInput.value = '';
                passwordConfirmInput.value = '';

                document.getElementById('messagePassword').innerText = '';
                document.getElementById('messagePasswordConfirm').innerText = '';
            }
        });

        passwordConfirmInput.addEventListener('keyup', function() {

            if (passwordInput.value !== passwordConfirmInput.value) {

                document.getElementById('messagePasswordConfirm').innerText =
                    'Konfirmasi password tidak sama';

            } else {

                document.getElementById('messagePasswordConfirm').innerText = '';
            }

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

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /home/u544939042/domains/mitracempaka.id/gl-asuh/resources/views/menu/user/edit.blade.php ENDPATH**/ ?>