115 lines
7.5 KiB
PHP
115 lines
7.5 KiB
PHP
<x-app-layout>
|
|
@section('page-title', $pageTitle)
|
|
<div class="d-flex align-items-center mb-4">
|
|
<a href="{{ route('admin.pengguna.index') }}" class="btn btn-outline-secondary me-3">
|
|
<i class="bi bi-arrow-left"></i>
|
|
</a>
|
|
<h3 class="my-0 fw-bold">Formulir Edit Pengguna</h3>
|
|
</div>
|
|
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-10">
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-body p-4">
|
|
<div class="card-body">
|
|
<form action="{{ route('admin.pengguna.update', $pengguna->id) }}" method="POST">
|
|
@csrf
|
|
@method('PUT')
|
|
<div class="mb-3">
|
|
<label for="nama_lengkap" class="form-label">Nama Lengkap</label>
|
|
<input type="text" name="nama_lengkap" class="form-control" id="nama_lengkap"
|
|
value="{{ old('nama_lengkap', $pengguna->nama_lengkap) }}" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="email" class="form-label">Email</label>
|
|
<input type="email" name="email" class="form-control" id="email"
|
|
value="{{ old('email', $pengguna->email) }}" required pattern="[^@\s]+@[^@\s]+\.[^@\s]+" title="Masukkan alamat email yang valid">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="nomor_induk" class="form-label">Nomor Induk (NISN/NUPTK)</label>
|
|
<input type="text" name="nomor_induk" class="form-control numeric-only" id="nomor_induk"
|
|
value="{{ old('nomor_induk', $pengguna->nomor_induk) }}" inputmode="numeric">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="role" class="form-label">Role</label>
|
|
<select name="role" class="form-select" id="role" required>
|
|
<option value="">Pilih role...</option>
|
|
<option value="siswa" @if (old('role', $pengguna->role) == 'siswa') selected @endif>Siswa
|
|
</option>
|
|
<option value="guru" @if (old('role', $pengguna->role) == 'guru') selected @endif>Guru
|
|
</option>
|
|
<option value="penjaga perpus" @if (old('role', $pengguna->role) == 'penjaga perpus') selected @endif>
|
|
Penjaga Perpus</option>
|
|
</select>
|
|
</div>
|
|
<div class="mb-3" id="kelas-container" style="display: none;">
|
|
<label for="kelas" class="form-label">Kelas (jika siswa)</label>
|
|
<input type="text" name="kelas" class="form-control" id="kelas"
|
|
value="{{ old('kelas', $pengguna->kelas) }}">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="phone" class="form-label">Nomor HP</label>
|
|
<input type="text" name="phone" class="form-control numeric-only" id="phone"
|
|
value="{{ old('phone', $pengguna->phone) }}" inputmode="numeric">
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6 mb-3">
|
|
<label for="password" class="form-label">Password Baru</label>
|
|
<input type="password" name="password" class="form-control" id="password"
|
|
placeholder="Kosongkan jika tidak diubah">
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="password_confirmation" class="form-label">Konfirmasi Password</label>
|
|
<input type="password" name="password_confirmation" class="form-control" id="password_confirmation">
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="d-flex justify-content-end">
|
|
<button type="submit" class="btn btn-primary">Simpan Perubahan</button>
|
|
</div>
|
|
</form>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Numeric only input
|
|
document.querySelectorAll('.numeric-only').forEach(function(input) {
|
|
input.addEventListener('input', function(e) {
|
|
this.value = this.value.replace(/[^0-9]/g, '');
|
|
});
|
|
});
|
|
|
|
// Dynamic Kelas Input
|
|
const roleSelect = document.getElementById('role');
|
|
const kelasContainer = document.getElementById('kelas-container');
|
|
|
|
function toggleKelas() {
|
|
if (roleSelect.value === 'siswa') {
|
|
kelasContainer.style.display = 'block';
|
|
} else {
|
|
kelasContainer.style.display = 'none';
|
|
|
|
// Optional: Clear value only if changing to non-student to prevent accidental data loss on edit?
|
|
// For edit, maybe better NOT to clear immediately unless user saves?
|
|
// But per request "hide input", clearing might be expected behavior if they change role.
|
|
// I'll keep it simple: just hide. If they change role to Teacher, they probably want to remove class.
|
|
// But resetting value on edit might exist data. Let's just hide for now.
|
|
// Actually, if they SUBMIT, and it is hidden, logic might be needed to clear it in backend or here.
|
|
// For now, mirroring create behavior (reset logic mainly).
|
|
// Wait, on Edit, if I load as Guru, it hides. If I change to Siswa, it shows (empty or old value).
|
|
// If I change Siswa -> Guru, it hides.
|
|
// For safety in Edit, I won't force clear value on toggle to avoid losing data if they accidentally switch.
|
|
// Just hide.
|
|
}
|
|
}
|
|
|
|
roleSelect.addEventListener('change', toggleKelas);
|
|
toggleKelas(); // Run on load
|
|
});
|
|
</script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</x-app-layout>
|