361 lines
12 KiB
PHP
361 lines
12 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', 'Edit Pengguna')
|
|
@section('topbar', 'Edit Data Pengguna')
|
|
|
|
@section('css')
|
|
<style>
|
|
:root {
|
|
--primary-color: #007a99;
|
|
--primary-dark: #005c73;
|
|
--secondary-color: #6c757d;
|
|
}
|
|
|
|
.registration-wrapper {
|
|
display: flex;
|
|
min-height: 100vh;
|
|
align-items: center;
|
|
background-color: #f8f9fa;
|
|
padding: 2rem 0;
|
|
}
|
|
|
|
.registration-card {
|
|
width: 100%;
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
border: none;
|
|
border-radius: 12px;
|
|
box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08);
|
|
}
|
|
|
|
.card-header {
|
|
background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
|
|
color: white;
|
|
padding: 1.75rem 2.5rem;
|
|
border-radius: 12px 12px 0 0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.card-title {
|
|
font-size: 1.5rem;
|
|
font-weight: 600;
|
|
margin: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.card-title i {
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.btn-back {
|
|
background-color: rgba(255,255,255,0.15);
|
|
border: none;
|
|
border-radius: 6px;
|
|
padding: 10px 20px;
|
|
color: white;
|
|
font-weight: 500;
|
|
transition: all 0.3s;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.btn-back:hover {
|
|
background-color: rgba(255,255,255,0.25);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.btn-back i {
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.card-body {
|
|
padding: 2.5rem;
|
|
}
|
|
|
|
.form-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: 1.5rem 2rem;
|
|
}
|
|
|
|
.form-group {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.form-group.full-width {
|
|
grid-column: span 2;
|
|
}
|
|
|
|
.form-label {
|
|
font-weight: 500;
|
|
color: #495057;
|
|
margin-bottom: 0.75rem;
|
|
display: block;
|
|
}
|
|
|
|
.form-control {
|
|
border-radius: 8px;
|
|
padding: 12px 16px;
|
|
border: 1px solid #ced4da;
|
|
width: 100%;
|
|
transition: all 0.3s;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.form-control:focus {
|
|
border-color: var(--primary-color);
|
|
box-shadow: 0 0 0 0.2rem rgba(0, 122, 153, 0.25);
|
|
}
|
|
|
|
.form-footer {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
margin-top: 2.5rem;
|
|
padding-top: 1.5rem;
|
|
border-top: 1px solid #e9ecef;
|
|
gap: 1rem;
|
|
}
|
|
|
|
.btn {
|
|
border-radius: 8px;
|
|
padding: 12px 28px;
|
|
font-weight: 500;
|
|
transition: all 0.3s;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.btn-submit {
|
|
background-color: var(--primary-color);
|
|
border: none;
|
|
color: white;
|
|
}
|
|
|
|
.btn-submit:hover {
|
|
background-color: var(--primary-dark);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.btn-cancel {
|
|
background-color: white;
|
|
border: 1px solid var(--secondary-color);
|
|
color: var(--secondary-color);
|
|
}
|
|
|
|
.btn-cancel:hover {
|
|
background-color: #f8f9fa;
|
|
}
|
|
|
|
.invalid-feedback {
|
|
display: block;
|
|
margin-top: 8px;
|
|
color: #dc3545;
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
/* Responsive adjustments */
|
|
@media (max-width: 992px) {
|
|
.registration-card {
|
|
max-width: 95%;
|
|
}
|
|
|
|
.card-body {
|
|
padding: 2rem;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.form-grid {
|
|
grid-template-columns: 1fr;
|
|
gap: 1.5rem;
|
|
}
|
|
|
|
.form-group.full-width {
|
|
grid-column: span 1;
|
|
}
|
|
|
|
.card-header {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.btn-back {
|
|
margin-top: 1rem;
|
|
width: 100%;
|
|
justify-content: center;
|
|
}
|
|
|
|
.form-footer {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.btn {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 576px) {
|
|
.card-body {
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.registration-wrapper {
|
|
padding: 1rem 0;
|
|
}
|
|
}
|
|
</style>
|
|
@endsection
|
|
|
|
@section('content')
|
|
<div class="registration-wrapper">
|
|
<div class="container">
|
|
<div class="registration-card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">
|
|
<i class="fas fa-user-edit"></i> Edit Pengguna - {{ $user->name }}
|
|
</h3>
|
|
<a href="{{ route('user.index') }}" class="btn-back">
|
|
<i class="fas fa-arrow-left"></i>Kembali ke Daftar
|
|
</a>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<form action="{{ route('user.update', $user->id) }}" method="POST">
|
|
@csrf
|
|
@method('PUT')
|
|
|
|
<div class="form-grid">
|
|
<!-- Input User -->
|
|
<div class="form-group">
|
|
<label for="name">Nama Lengkap</label>
|
|
<input id="name" type="text" class="form-control @error('name') is-invalid @enderror"
|
|
name="name" value="{{ old('name', $user->name) }}" required>
|
|
@error('name')
|
|
<span class="invalid-feedback" role="alert">
|
|
<strong>{{ $message }}</strong>
|
|
</span>
|
|
@enderror
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="email">Email</label>
|
|
<input id="email" type="email" class="form-control"
|
|
name="email" value="{{ old('email', $user->email) }}" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Role</label>
|
|
<select name="role" class="form-control @error('role') is-invalid @enderror" id="roleSelect" required>
|
|
<option value="">Pilih Role</option>
|
|
<option value="admin" {{ old('role', $user->role) == 'admin' ? 'selected' : '' }}>Admin</option>
|
|
<option value="mahasiswa" {{ old('role', $user->role) == 'mahasiswa' ? 'selected' : '' }}>Mahasiswa</option>
|
|
<option value="karyawan" {{ old('role', $user->role) == 'karyawan' ? 'selected' : '' }}>Karyawan</option>
|
|
</select>
|
|
@error('role')
|
|
<span class="invalid-feedback" role="alert">
|
|
<strong>{{ $message }}</strong>
|
|
</span>
|
|
@enderror
|
|
</div>
|
|
|
|
<div id="mahasiswaFields" style="{{ old('role', $user->role) == 'mahasiswa' ? 'block' : 'none' }}">
|
|
<div class="form-group">
|
|
<label>NIM</label>
|
|
<input type="text" name="nim" class="form-control @error('nim') is-invalid @enderror"
|
|
value="{{ old('nim', $user->mahasiswa->nim ?? '') }}"
|
|
{{ old('role', $user->role) == 'mahasiswa' ? 'required' : '' }}>
|
|
@error('nim')
|
|
<span class="invalid-feedback" role="alert">
|
|
<strong>{{ $message }}</strong>
|
|
</span>
|
|
@enderror
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Program Studi</label>
|
|
<input type="text" name="program_studi" class="form-control @error('program_studi') is-invalid @enderror"
|
|
value="{{ old('program_studi', $user->mahasiswa->program_studi ?? '') }}"
|
|
{{ old('role', $user->role) == 'mahasiswa' ? 'required' : '' }}>
|
|
@error('program_studi')
|
|
<span class="invalid-feedback" role="alert">
|
|
<strong>{{ $message }}</strong>
|
|
</span>
|
|
@enderror
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Jurusan</label>
|
|
<input type="text" name="jurusan" class="form-control @error('jurusan') is-invalid @enderror"
|
|
value="{{ old('jurusan', $user->mahasiswa->jurusan ?? '') }}"
|
|
{{ old('role', $user->role) == 'mahasiswa' ? 'required' : '' }}>
|
|
@error('jurusan')
|
|
<span class="invalid-feedback" role="alert">
|
|
<strong>{{ $message }}</strong>
|
|
</span>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Input Umum -->
|
|
<div class="form-group">
|
|
<label for="alamat">Alamat</label>
|
|
<input type="text" class="form-control"
|
|
name="alamat" value="{{ old('alamat', $user->alamat) }}" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="telepon">Telepon</label>
|
|
<input type="text" class="form-control"
|
|
name="telepon" value="{{ old('telepon', $user->telepon) }}" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="keterangan">Keterangan</label>
|
|
<input type="text" class="form-control"
|
|
name="keterangan" value="{{ old('keterangan', $user->keterangan) }}" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-footer">
|
|
<button type="submit" class="btn btn-submit">
|
|
<i class="fas fa-save mr-2"></i>Simpan Perubahan
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const roleSelect = document.getElementById('roleSelect');
|
|
const mahasiswaFields = document.getElementById('mahasiswaFields');
|
|
|
|
function toggleMahasiswaFields() {
|
|
if (roleSelect.value === 'mahasiswa') {
|
|
mahasiswaFields.style.display = 'block';
|
|
mahasiswaFields.querySelectorAll('input').forEach(input => {
|
|
input.required = true;
|
|
});
|
|
} else {
|
|
mahasiswaFields.style.display = 'none';
|
|
mahasiswaFields.querySelectorAll('input').forEach(input => {
|
|
input.required = false;
|
|
});
|
|
}
|
|
}
|
|
|
|
toggleMahasiswaFields();
|
|
|
|
roleSelect.addEventListener('change', toggleMahasiswaFields);
|
|
});
|
|
|
|
</script>
|
|
@endsection
|