206 lines
9.5 KiB
PHP
206 lines
9.5 KiB
PHP
<nav class="navbar navbar-expand navbar-dark" style="background-color: #008b8b;" id="topbar">
|
||
<!-- Sidebar Toggle (Topbar) -->
|
||
<button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle">
|
||
<i class="fa fa-bars"></i>
|
||
</button>
|
||
|
||
<!-- Topbar Navbar -->
|
||
<ul class="navbar-nav ml-auto">
|
||
<div class="topbar-divider d-none d-sm-block"></div>
|
||
|
||
<!-- Nav Item - User Information -->
|
||
<li class="nav-item dropdown no-arrow">
|
||
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button"
|
||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||
<i class="fas fa-user-circle fa-lg mr-2"></i>
|
||
<span class="mr-2 d-none d-lg-inline small">{{ Auth::user()->name }}</span>
|
||
</a>
|
||
|
||
<!-- Dropdown - User Information -->
|
||
<div class="dropdown-menu dropdown-menu-right shadow animated--grow-in"
|
||
aria-labelledby="userDropdown">
|
||
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#profileModal">
|
||
<i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>
|
||
Profile
|
||
</a>
|
||
<div class="dropdown-divider"></div>
|
||
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal">
|
||
<i class="fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400"></i>
|
||
Logout
|
||
</a>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</nav>
|
||
|
||
<!-- Profile Modal -->
|
||
<div class="modal fade" id="profileModal" tabindex="-1" role="dialog" aria-labelledby="profileModalLabel" aria-hidden="true">
|
||
<div class="modal-dialog modal-lg" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title" id="profileModalLabel">Profile</h5>
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||
<span aria-hidden="true">×</span>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="profile-container">
|
||
<div class="profile-header">
|
||
<!-- <img src="https://placehold.co/150x150" alt="Profile Picture" class="profile-avatar"> -->
|
||
<h2>{{ Auth::user()->name }}</h2>
|
||
{{-- <h2>{{ Auth::check() ? Auth::user()->name : 'Guest' }}</h2> --}}
|
||
<p class="text-muted"></p>
|
||
</div>
|
||
|
||
<form id="profileForm" action="{{ route('profile.update') }}" method="POST">
|
||
@csrf
|
||
@method('PUT')
|
||
<div class="profile-details">
|
||
<!-- Data yang tidak bisa diubah -->
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label for="nama">Nama Lengkap</label>
|
||
<input type="text" class="form-control" id="nama" value="{{ Auth::user()->name }}" readonly>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label for="nim">NIM</label>
|
||
<input type="text" class="form-control" id="nim" value="{{ Auth::user()->mahasiswa->nim ?? 'Belum diisi' }}" readonly>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label for="email">Email</label>
|
||
<input type="email" class="form-control" id="email" value="{{ Auth::user()->email }}" readonly>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label for="program_studi">Program Studi</label>
|
||
<input type="text" class="form-control" id="program_studi" value="{{ Auth::user()->mahasiswa->program_studi ?? 'Belum diisi' }}" readonly>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Data yang bisa diubah -->
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label for="no_hp">Nomor HP</label>
|
||
<input type="text" class="form-control" id="no_hp" name="no_hp" value="{{ Auth::user()->mahasiswa->no_hp ?? '' }}" required>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label for="alamat">Alamat</label>
|
||
<textarea class="form-control" id="alamat" name="alamat" rows="2" required>{{ Auth::user()->alamat ?? '' }}</textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="profile-actions">
|
||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Tutup</button>
|
||
<button type="submit" class="btn btn-save text-white">Simpan Perubahan</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Logout Modal-->
|
||
<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
|
||
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
|
||
<span aria-hidden="true">×</span>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
|
||
<div class="modal-footer">
|
||
<button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
|
||
{{-- <a class="btn btn-primary" href="{{ route('logout') }}">Logout</a> --}}
|
||
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
|
||
@csrf
|
||
</form>
|
||
|
||
<a class="btn btn-primary" href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
|
||
Logout
|
||
</a>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||
<script>
|
||
$(document).ready(function() {
|
||
// Initialize AJAX CSRF token for all requests
|
||
$.ajaxSetup({
|
||
headers: {
|
||
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
|
||
}
|
||
});
|
||
|
||
$('#profileForm').on('submit', function(e) {
|
||
e.preventDefault();
|
||
const form = $(this);
|
||
const submitBtn = form.find('button[type="submit"]');
|
||
|
||
// Disable button during submission
|
||
submitBtn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Menyimpan...');
|
||
|
||
$.ajax({
|
||
url: form.attr('action'),
|
||
method: 'POST',
|
||
data: form.serialize(),
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
Swal.fire({
|
||
icon: 'success',
|
||
title: 'Berhasil',
|
||
text: response.message || 'Profil berhasil diperbarui',
|
||
timer: 2000,
|
||
showConfirmButton: false
|
||
}).then(() => {
|
||
$('#profileModal').modal('hide');
|
||
if (response.reload) {
|
||
location.reload();
|
||
}
|
||
});
|
||
},
|
||
error: function(xhr) {
|
||
let errorMessage = 'Terjadi kesalahan server';
|
||
|
||
if (xhr.status === 422) {
|
||
errorMessage = Object.values(xhr.responseJSON.errors)
|
||
.flat()
|
||
.join('<br>');
|
||
} else if (xhr.responseJSON && xhr.responseJSON.message) {
|
||
errorMessage = xhr.responseJSON.message;
|
||
}
|
||
|
||
Swal.fire({
|
||
icon: 'error',
|
||
title: 'Gagal',
|
||
html: errorMessage
|
||
});
|
||
},
|
||
complete: function() {
|
||
submitBtn.prop('disabled', false).html('Simpan Perubahan');
|
||
}
|
||
});
|
||
});
|
||
});
|
||
</script>
|
||
{{-- @endsection --}} |