225 lines
11 KiB
PHP
225 lines
11 KiB
PHP
|
<?= $this->extend('admin/layout') ?>
|
||
|
|
|
||
|
|
<?= $this->section('content') ?>
|
||
|
|
<div class="space-y-5 sm:space-y-6">
|
||
|
|
<!-- Page Header -->
|
||
|
|
<div class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
|
||
|
|
<div>
|
||
|
|
<h2 class="text-2xl font-semibold text-gray-800 dark:text-white/90">
|
||
|
|
<?= $user ? 'Edit Pengguna' : 'Tambah Pengguna' ?>
|
||
|
|
</h2>
|
||
|
|
<p class="text-sm text-gray-500 dark:text-gray-400">
|
||
|
|
<?= $user ? 'Ubah informasi pengguna' : 'Tambahkan pengguna baru' ?>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<a
|
||
|
|
href="<?= base_url('admin/users') ?>"
|
||
|
|
class="inline-flex items-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2.5 text-sm font-medium text-gray-700 shadow-theme-xs hover:bg-gray-50 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-white/[0.03]"
|
||
|
|
>
|
||
|
|
<i class="fe fe-arrow-left"></i>
|
||
|
|
Kembali
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Flash Messages -->
|
||
|
|
<?php if (session()->getFlashdata('error')): ?>
|
||
|
|
<div class="rounded-lg border border-error-200 bg-error-50 p-4 dark:border-error-800 dark:bg-error-900/20">
|
||
|
|
<p class="text-sm text-error-800 dark:text-error-400">
|
||
|
|
<?= esc(session()->getFlashdata('error')) ?>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
|
||
|
|
<!-- Form -->
|
||
|
|
<div class="rounded-lg border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]">
|
||
|
|
<div class="p-5 sm:p-6">
|
||
|
|
<form
|
||
|
|
action="<?= $user ? base_url('admin/users/update/' . $user['id']) : base_url('admin/users/store') ?>"
|
||
|
|
method="post"
|
||
|
|
class="space-y-6"
|
||
|
|
>
|
||
|
|
<?= csrf_field() ?>
|
||
|
|
|
||
|
|
<div class="grid grid-cols-1 gap-6 sm:grid-cols-2">
|
||
|
|
<!-- Username -->
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Username <span class="text-error-500">*</span>
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
type="text"
|
||
|
|
name="username"
|
||
|
|
value="<?= old('username', $user['username'] ?? '') ?>"
|
||
|
|
placeholder="Masukkan username"
|
||
|
|
class="h-11 w-full rounded-lg border border-gray-300 bg-transparent px-4 py-2.5 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 focus:outline-none dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
|
||
|
|
required
|
||
|
|
/>
|
||
|
|
<?php if (isset($validation) && $validation->hasError('username')): ?>
|
||
|
|
<p class="mt-1 text-sm text-error-600"><?= esc($validation->getError('username')) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Email -->
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Email <span class="text-error-500">*</span>
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
type="email"
|
||
|
|
name="email"
|
||
|
|
value="<?= old('email', $user['email'] ?? '') ?>"
|
||
|
|
placeholder="Masukkan email"
|
||
|
|
class="h-11 w-full rounded-lg border border-gray-300 bg-transparent px-4 py-2.5 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 focus:outline-none dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
|
||
|
|
required
|
||
|
|
/>
|
||
|
|
<?php if (isset($validation) && $validation->hasError('email')): ?>
|
||
|
|
<p class="mt-1 text-sm text-error-600"><?= esc($validation->getError('email')) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Password (only for create) -->
|
||
|
|
<?php if (!$user): ?>
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Password <span class="text-error-500">*</span>
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
type="password"
|
||
|
|
name="password"
|
||
|
|
placeholder="Masukkan password (min 6 karakter)"
|
||
|
|
class="h-11 w-full rounded-lg border border-gray-300 bg-transparent px-4 py-2.5 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 focus:outline-none dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
|
||
|
|
required
|
||
|
|
minlength="6"
|
||
|
|
/>
|
||
|
|
<?php if (isset($validation) && $validation->hasError('password')): ?>
|
||
|
|
<p class="mt-1 text-sm text-error-600"><?= esc($validation->getError('password')) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
<?php endif; ?>
|
||
|
|
|
||
|
|
<!-- Role -->
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Role <span class="text-error-500">*</span>
|
||
|
|
</label>
|
||
|
|
<select
|
||
|
|
name="role_id"
|
||
|
|
class="h-11 w-full rounded-lg border border-gray-300 bg-transparent px-4 py-2.5 text-sm text-gray-800 shadow-theme-xs focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 focus:outline-none dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:focus:border-brand-800"
|
||
|
|
required
|
||
|
|
>
|
||
|
|
<option value="">Pilih Role</option>
|
||
|
|
<?php foreach ($roles as $role): ?>
|
||
|
|
<option value="<?= $role['id'] ?>" <?= old('role_id', $user['role_id'] ?? '') == $role['id'] ? 'selected' : '' ?>>
|
||
|
|
<?= esc(ucfirst($role['name'])) ?>
|
||
|
|
</option>
|
||
|
|
<?php endforeach; ?>
|
||
|
|
</select>
|
||
|
|
<?php if (isset($validation) && $validation->hasError('role_id')): ?>
|
||
|
|
<p class="mt-1 text-sm text-error-600"><?= esc($validation->getError('role_id')) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Phone Number -->
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Nomor Telepon
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
type="text"
|
||
|
|
name="phone_number"
|
||
|
|
value="<?= old('phone_number', $user['phone_number'] ?? '') ?>"
|
||
|
|
placeholder="Masukkan nomor telepon"
|
||
|
|
class="h-11 w-full rounded-lg border border-gray-300 bg-transparent px-4 py-2.5 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 focus:outline-none dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
|
||
|
|
/>
|
||
|
|
<?php if (isset($validation) && $validation->hasError('phone_number')): ?>
|
||
|
|
<p class="mt-1 text-sm text-error-600"><?= esc($validation->getError('phone_number')) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Telegram ID -->
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Telegram ID
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
type="number"
|
||
|
|
name="telegram_id"
|
||
|
|
value="<?= old('telegram_id', $user['telegram_id'] ?? '') ?>"
|
||
|
|
placeholder="Masukkan Telegram ID"
|
||
|
|
class="h-11 w-full rounded-lg border border-gray-300 bg-transparent px-4 py-2.5 text-sm text-gray-800 shadow-theme-xs placeholder:text-gray-400 focus:border-brand-300 focus:ring-3 focus:ring-brand-500/10 focus:outline-none dark:border-gray-700 dark:bg-gray-900 dark:text-white/90 dark:placeholder:text-white/30 dark:focus:border-brand-800"
|
||
|
|
/>
|
||
|
|
<?php if (isset($validation) && $validation->hasError('telegram_id')): ?>
|
||
|
|
<p class="mt-1 text-sm text-error-600"><?= esc($validation->getError('telegram_id')) ?></p>
|
||
|
|
<?php endif; ?>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Active Status -->
|
||
|
|
<div>
|
||
|
|
<label class="mb-1.5 block text-sm font-medium text-gray-700 dark:text-gray-400">
|
||
|
|
Status
|
||
|
|
</label>
|
||
|
|
<div class="flex items-center gap-4">
|
||
|
|
<label class="flex items-center cursor-pointer">
|
||
|
|
<input
|
||
|
|
type="checkbox"
|
||
|
|
name="is_active"
|
||
|
|
value="1"
|
||
|
|
<?= old('is_active', $user['is_active'] ?? 1) ? 'checked' : '' ?>
|
||
|
|
class="sr-only"
|
||
|
|
/>
|
||
|
|
<div class="relative">
|
||
|
|
<div class="block h-8 w-14 rounded-full <?= old('is_active', $user['is_active'] ?? 1) ? 'bg-brand-500' : 'bg-gray-300 dark:bg-gray-700' ?> transition-colors"></div>
|
||
|
|
<div class="absolute left-1 top-1 h-6 w-6 rounded-full bg-white transition-transform <?= old('is_active', $user['is_active'] ?? 1) ? 'translate-x-6' : '' ?>"></div>
|
||
|
|
</div>
|
||
|
|
<span class="ml-3 text-sm text-gray-700 dark:text-gray-400">
|
||
|
|
<?= old('is_active', $user['is_active'] ?? 1) ? 'Aktif' : 'Tidak Aktif' ?>
|
||
|
|
</span>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Form Actions -->
|
||
|
|
<div class="flex items-center gap-3 border-t border-gray-100 pt-6 dark:border-gray-800">
|
||
|
|
<button
|
||
|
|
type="submit"
|
||
|
|
class="inline-flex items-center justify-center gap-2 rounded-lg bg-brand-500 px-4 py-2.5 text-sm font-medium text-white shadow-theme-xs hover:bg-brand-600"
|
||
|
|
>
|
||
|
|
<i class="fe fe-save"></i>
|
||
|
|
<?= $user ? 'Simpan Perubahan' : 'Simpan Pengguna' ?>
|
||
|
|
</button>
|
||
|
|
<a
|
||
|
|
href="<?= base_url('admin/users') ?>"
|
||
|
|
class="inline-flex items-center justify-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2.5 text-sm font-medium text-gray-700 shadow-theme-xs hover:bg-gray-50 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-white/[0.03]"
|
||
|
|
>
|
||
|
|
Batal
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// Toggle switch functionality
|
||
|
|
document.querySelector('input[name="is_active"]')?.addEventListener('change', function() {
|
||
|
|
const toggle = this.closest('label').querySelector('.block');
|
||
|
|
const circle = this.closest('label').querySelector('.absolute');
|
||
|
|
const text = this.closest('label').querySelector('span');
|
||
|
|
|
||
|
|
if (this.checked) {
|
||
|
|
toggle.classList.add('bg-brand-500');
|
||
|
|
toggle.classList.remove('bg-gray-300', 'dark:bg-gray-700');
|
||
|
|
circle.classList.add('translate-x-6');
|
||
|
|
text.textContent = 'Aktif';
|
||
|
|
} else {
|
||
|
|
toggle.classList.remove('bg-brand-500');
|
||
|
|
toggle.classList.add('bg-gray-300', 'dark:bg-gray-700');
|
||
|
|
circle.classList.remove('translate-x-6');
|
||
|
|
text.textContent = 'Tidak Aktif';
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
<?= $this->endSection() ?>
|
||
|
|
|