<?php
defined('BASEPATH') OR exit('No direct script access allowed');

$is_edit  = isset($mod) && $mod !== null;
$mod_data = $is_edit ? $mod : null;
$val      = function($field) use ($is_edit, $mod_data) {
    if ($is_edit && isset($mod_data->$field)) {
        return htmlspecialchars($mod_data->$field);
    }
    return set_value($field);
};
?>
<div class="container-fluid" style="max-width:680px; padding:20px 0 60px;">

    <div class="d-flex align-items-center gap-3 mb-4">
        <a href="<?= base_url('menu-management') ?>" class="btn btn-sm btn-outline-secondary">
            <i class="bi bi-arrow-left me-1"></i> Kembali
        </a>
        <h5 class="mb-0 fw-bold"><?= $title ?></h5>
    </div>

    <?php if(validation_errors()): ?>
    <div class="alert alert-danger alert-dismissible fade show">
        <i class="bi bi-exclamation-triangle me-2"></i><?= validation_errors() ?>
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
    <?php endif; ?>

    <div class="card shadow-sm border-0" style="border-radius:14px; overflow:hidden;">
        <div class="card-body p-4">
            <form method="post" action="<?= $is_edit
                ? base_url('menu-management/edit-module/' . $mod_data->id)
                : base_url('menu-management/tambah-module') ?>">

                <!-- Parent (grup) -->
                <div class="mb-3">
                    <label class="form-label fw-semibold">Grup / Parent</label>
                    <select name="parent_id" class="form-select">
                        <option value="">— Top-level (menu utama) —</option>
                        <?php foreach($parents as $p): ?>
                        <option value="<?= $p->id ?>"
                            <?= ($is_edit && $mod_data->parent_id == $p->id) ? 'selected' : '' ?>>
                            <?= htmlspecialchars($p->label) ?> (<?= $p->slug ?>)
                        </option>
                        <?php endforeach; ?>
                    </select>
                    <div class="form-text">Kosongkan jika ini adalah grup menu utama.</div>
                </div>

                <!-- Label -->
                <div class="mb-3">
                    <label class="form-label fw-semibold">
                        Label <span class="text-danger">*</span>
                    </label>
                    <input type="text" name="label" class="form-control"
                           value="<?= $val('label') ?>"
                           placeholder="Contoh: Data Warga" required>
                    <div class="form-text">Nama menu yang tampil di sidebar.</div>
                </div>

                <!-- Slug — hanya saat tambah -->
                <?php if (!$is_edit): ?>
                <div class="mb-3">
                    <label class="form-label fw-semibold">
                        Slug <span class="text-danger">*</span>
                    </label>
                    <input type="text" name="slug" class="form-control"
                           value="<?= set_value('slug') ?>"
                           placeholder="Contoh: warga  atau  warga/pemilih" required>
                    <div class="form-text">
                        Harus unik. Cocokkan dengan segment URI CodeIgniter.
                        Gunakan huruf kecil dan tanda hubung, contoh: <code>data-warga</code>
                    </div>
                </div>
                <?php else: ?>
                <div class="mb-3">
                    <label class="form-label fw-semibold">Slug</label>
                    <input type="text" class="form-control bg-light"
                           value="<?= $val('slug') ?>" disabled>
                    <div class="form-text text-danger">
                        <i class="bi bi-lock-fill me-1"></i>Slug tidak dapat diubah setelah disimpan.
                    </div>
                </div>
                <?php endif; ?>

                <!-- Icon -->
                <div class="mb-3">
                    <label class="form-label fw-semibold">Icon</label>
                    <div class="input-group">
                        <span class="input-group-text" id="icon-preview"
                              style="min-width:44px; justify-content:center;">
                            <i id="icon-preview-i"
                               class="<?= $val('icon') ?: 'bi bi-circle' ?>"></i>
                        </span>
                        <input type="text" name="icon" id="icon-input" class="form-control"
                               value="<?= $val('icon') ?: 'bi bi-circle' ?>"
                               placeholder="bi bi-people-fill">
                    </div>
                    <div class="form-text">
                        Bootstrap Icons class. &nbsp;
                        <a href="https://icons.getbootstrap.com/" target="_blank" rel="noopener">
                            Lihat daftar icon <i class="bi bi-box-arrow-up-right"
                                                  style="font-size:.7rem;"></i>
                        </a>
                    </div>
                </div>

                <!-- URL -->
                <div class="mb-3">
                    <label class="form-label fw-semibold">URL / Path</label>
                    <div class="input-group">
                        <span class="input-group-text text-muted"
                              style="font-size:.8rem; max-width:200px;
                                     overflow:hidden; text-overflow:ellipsis;">
                            <?= base_url() ?>
                        </span>
                        <input type="text" name="url" class="form-control"
                               value="<?= $val('url') ?>"
                               placeholder="warga">
                    </div>
                    <div class="form-text">
                        Kosongkan untuk menu grup (tidak punya halaman sendiri).
                    </div>
                </div>

                <!-- Sort order -->
                <div class="mb-4">
                    <label class="form-label fw-semibold">Urutan Tampil</label>
                    <input type="number" name="sort_order" class="form-control"
                           style="max-width:120px;"
                           value="<?= $val('sort_order') !== '' ? $val('sort_order') : 0 ?>"
                           min="0" max="999">
                    <div class="form-text">Angka kecil = muncul lebih awal di sidebar.</div>
                </div>

                <hr>
                <div class="d-flex gap-2">
                    <button type="submit" class="btn btn-success fw-semibold">
                        <i class="bi bi-save me-1"></i>
                        <?= $is_edit ? 'Simpan Perubahan' : 'Tambah Modul' ?>
                    </button>
                    <a href="<?= base_url('menu-management') ?>"
                       class="btn btn-outline-secondary">
                        Batal
                    </a>
                </div>

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

<script>
document.getElementById('icon-input').addEventListener('input', function () {
    const val = this.value.trim() || 'bi bi-circle';
    document.getElementById('icon-preview-i').className = val;
});
</script>