170 lines
8.4 KiB
PHP
170 lines
8.4 KiB
PHP
@extends('main.layouts.app')
|
|
|
|
@section('title', 'Profile')
|
|
|
|
@section('content')
|
|
<div class="container-xxl flex-grow-1 container-p-y">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="card mb-4">
|
|
<h5 class="card-header">Detail Profil</h5>
|
|
<div class="card-body">
|
|
<div class="d-flex align-items-start align-items-sm-center gap-4">
|
|
<img
|
|
src="{{ auth()->user()->foto_profil ?? '../frontend/assets/img/avatars/1.png' }}"
|
|
alt="user-avatar"
|
|
class="d-block rounded"
|
|
height="100"
|
|
width="100"
|
|
id="uploadedAvatar"
|
|
/>
|
|
<div class="button-wrapper">
|
|
<label for="upload" class="btn btn-primary me-2 mb-4" tabindex="0">
|
|
<span class="d-none d-sm-block">Ganti Foto Profil</span>
|
|
<i class="bx bx-upload d-block d-sm-none"></i>
|
|
<input
|
|
type="file"
|
|
id="upload"
|
|
name="foto_profil"
|
|
class="account-file-input"
|
|
hidden
|
|
accept="image/png, image/jpeg"
|
|
/>
|
|
</label>
|
|
<button type="button" class="btn btn-danger account-image-reset mb-4" data-bs-toggle="modal" data-bs-target="#confirmationModal">
|
|
<i class="bx bx-reset d-block d-sm-none"></i>
|
|
<span class="d-none d-sm-block">Hapus Foto Profil</span>
|
|
</button>
|
|
<p class="text-muted mb-0">Format foto profil adalah JPG atau PNG. Maksimal ukuran foto adalah 15MB</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr class="my-0" />
|
|
<div class="card-body">
|
|
<form id="formAccountSettings" method="POST" action="{{ route('profile.update') }}" enctype="multipart/form-data">
|
|
@csrf
|
|
<div class="row">
|
|
<div class="mb-3 col-md-6">
|
|
<label for="email" class="form-label">Email</label>
|
|
<input
|
|
class="form-control"
|
|
type="text"
|
|
id="email"
|
|
name="email"
|
|
value="{{ auth()->user()->email ?? 'tamu@mail.com'}}"
|
|
readonly
|
|
/>
|
|
</div>
|
|
<div class="mb-3 col-md-6">
|
|
<label for="nama_lengkap" class="form-label">Nama Lengkap</label>
|
|
<input
|
|
class="form-control"
|
|
type="text"
|
|
id="nama_lengkap"
|
|
name="nama_lengkap"
|
|
value="{{ auth()->user()->nama_lengkap ?? 'Tamu'}}"
|
|
autofocus
|
|
/>
|
|
@error('nama_lengkap')
|
|
<span class="text-danger">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
<div class="mb-3 col-md-6">
|
|
<label class="form-label" for="nim">NIM</label>
|
|
<input
|
|
type="text"
|
|
id="nim"
|
|
name="nim"
|
|
class="form-control"
|
|
value="{{ auth()->user()->nim ?? 'E41200000'}}"
|
|
/>
|
|
@error('nim')
|
|
<span class="text-danger">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
<div class="mb-3 col-md-6">
|
|
<label class="form-label" for="semester">Semester</label>
|
|
<select id="semester" name="semester" class="select2 form-select">
|
|
<option value="">Pilih Semester</option>
|
|
@for ($i = 1; $i <= 14; $i++)
|
|
<option value="{{ $i }}" {{ (auth()->user()?->semester ?? '') == $i ? 'selected' : '' }}>{{ $i }}</option>
|
|
@endfor
|
|
</select>
|
|
@error('semester')
|
|
<span class="text-danger">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
<div class="mb-3 col-md-6">
|
|
<label for="angkatan" class="form-label">Angkatan</label>
|
|
<select id="angkatan" name="angkatan" class="select2 form-select">
|
|
<option value="">Pilih Angkatan</option>
|
|
@for ($i = 2000; $i <= date('Y'); $i++)
|
|
<option value="{{ $i }}" {{ (auth()->user()?->angkatan ?? '') == $i ? 'selected' : '' }}>{{ $i }}</option>
|
|
@endfor
|
|
</select>
|
|
@error('angkatan')
|
|
<span class="text-danger">{{ $message }}</span>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
<div class="mt-2">
|
|
<button type="submit" class="btn btn-primary me-2">Simpan Perubahan</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="confirmationModal" tabindex="-1" aria-labelledby="confirmationModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="confirmationModalLabel">Konfirmasi</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
Anda yakin ingin menghapus foto profil Anda?
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Kembali</button>
|
|
<form action="{{ route('profile.delete-photo') }}" method="POST">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit" class="btn btn-danger">Hapus</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section('scripts')
|
|
<script>
|
|
// Pratinjau gambar saat upload
|
|
const uploadInput = document.querySelector('#upload');
|
|
const uploadedAvatar = document.querySelector('#uploadedAvatar');
|
|
|
|
uploadInput.addEventListener('change', function(event) {
|
|
const file = event.target.files[0];
|
|
if (file) {
|
|
const reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
uploadedAvatar.src = e.target.result;
|
|
};
|
|
reader.readAsDataURL(file);
|
|
}
|
|
});
|
|
</script>
|
|
@endsection
|
|
|
|
@section('helpInstructions')
|
|
[
|
|
"<h4>Selamat datang di Profil!</h4><p>Hai! Kenalin aku Yura, yang akan mengajak kamu untuk menjelajah fitur profil!</p>",
|
|
"<p>Klik <strong>Ganti Foto Profil</strong> untuk mengganti foto profil Kamu.</p>",
|
|
"<p>Gunakan tombol <strong>Hapus Foto Profil</strong> untuk menghapus foto profil kamu.</p>",
|
|
"<p>Isi semua kolom dengan informasi yang benar, seperti Nama Lengkap, NIM, Semester, dan Angkatan.</p>",
|
|
"<p>Klik <strong>Simpan Perubahan</strong> untuk menyimpan perubahan data profil kamu.</p>"
|
|
]
|
|
@endsection
|
|
@endsection |