195 lines
12 KiB
PHP
195 lines
12 KiB
PHP
@extends('layouts.app')
|
|
@push('title', 'Profile')
|
|
@section('content')
|
|
<div class="page-content">
|
|
<div class="container-fluid">
|
|
|
|
<div class="position-relative mx-n4 mt-n4">
|
|
<div class="profile-wid-bg profile-setting-img">
|
|
<img src="assets/images/profile-bg.jpg" class="profile-wid-img" alt="">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-xxl-3">
|
|
<div class="card mt-n5">
|
|
<div class="card-body p-4">
|
|
<div class="text-center">
|
|
<div class="profile-user position-relative d-inline-block mx-auto mb-4">
|
|
<img src="{{ $user->avatar ? asset('storage/' . $user->avatar) : asset('assets/images/users/user-dummy-img.jpg') }}"
|
|
class="rounded-circle avatar-xl img-thumbnail user-profile-image"
|
|
alt="user-profile-image" id="preview-img">
|
|
</div>
|
|
<h5 class="fs-16 mb-1">{{ $user->name }}</h5>
|
|
<p class="text-muted mb-0">{{ $user->role }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end card-->
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-xxl-9">
|
|
<div class="card mt-xxl-n5">
|
|
<div class="card-header">
|
|
<ul class="nav nav-tabs-custom rounded card-header-tabs border-bottom-0" role="tablist">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" data-bs-toggle="tab" href="#personalDetails" role="tab">
|
|
<i class="fas fa-home"></i>
|
|
Data Personal
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" data-bs-toggle="tab" href="#changePassword" role="tab">
|
|
<i class="far fa-user"></i>
|
|
Ubah Password
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="card-body p-4">
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="personalDetails" role="tabpanel">
|
|
<form action="{{ route('profile.update_data') }}" class="needs-validation" novalidate
|
|
id="personalDetailsForm" method="POST" enctype="multipart/form-data">
|
|
@csrf
|
|
@method('PUT')
|
|
<div class="row">
|
|
<input type="hidden" id="data-user" value="{{ $user }}">
|
|
<div class="col-lg-6">
|
|
<div class="mb-3">
|
|
<label for="username" class="form-label">Username</label>
|
|
<input type="text" class="form-control" id="username"
|
|
placeholder="Masukan username anda" name="username"
|
|
value="{{ old('username', $user->username) }}"
|
|
data-initial="{{ $user->username }}" required>
|
|
<div class="invalid-feedback">
|
|
Harap masukan username anda
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-6">
|
|
<div class="mb-3">
|
|
<label for="fullname" class="form-label">Nama Lengkap</label>
|
|
<input type="text" class="form-control" id="name"
|
|
placeholder="Masukan nama lengkap anda" name="name"
|
|
value="{{ old('name', $user->name) }}"
|
|
data-initial="{{ $user->name }}" required>
|
|
<div class="invalid-feedback">
|
|
Harap masukan nama lengkap anda
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-6">
|
|
<div class="mb-3">
|
|
<label for="emailInput" class="form-label">Alamat Email</label>
|
|
<input type="email" class="form-control" id="email"
|
|
placeholder="Masukan alamat email anda" name="email"
|
|
value="{{ old('email', $user->email) }}"
|
|
data-initial="{{ $user->email }}" required>
|
|
<div class="invalid-feedback">
|
|
Harap masukan alamat email anda
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-6">
|
|
<div class="mb-3">
|
|
<label for="avatarInput" class="form-label">Foto Profile</label>
|
|
<input type="file" class="form-control" id="avatar" name="avatar"
|
|
accept="image/jpeg,image/png,image/jpg"
|
|
onchange="previewImage(event)">
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-12">
|
|
<div class="hstack gap-2 justify-content-end">
|
|
<button type="submit" class="btn btn-success" id="submit-btn"
|
|
disabled>Ubah</button>
|
|
<button type="button" class="btn btn-soft-secondary" id="cancel-btn"
|
|
onclick="setDataUser()">Batal</button>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</form>
|
|
</div>
|
|
<!--end tab-pane-->
|
|
<div class="tab-pane" id="changePassword" role="tabpanel">
|
|
<form action="{{ route('profile.update_password') }}" class="needs-validation"
|
|
novalidate id="changePasswordForm" method="POST">
|
|
@csrf
|
|
@method('PUT')
|
|
<div class="row g-2">
|
|
<div class="col-lg-4">
|
|
<div>
|
|
<label for="oldpasswordInput" class="form-label">Password
|
|
Lama</label>
|
|
<input type="password" class="form-control" id="oldpasswordInput"
|
|
placeholder="Masukan password lama anda" name="old_password"
|
|
required>
|
|
<div class="invalid-feedback">
|
|
Harap masukan password lama anda
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-4">
|
|
<div>
|
|
<label for="newpasswordInput" class="form-label">Password
|
|
Baru</label>
|
|
<input type="password" class="form-control" id="newpasswordInput"
|
|
placeholder="Masukan password baru anda" name="new_password"
|
|
required>
|
|
<div class="invalid-feedback">
|
|
Harap masukan password baru anda
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-4">
|
|
<div>
|
|
<label for="confirmpasswordInput" class="form-label">Konfirmasi
|
|
Password</label>
|
|
<input type="password" class="form-control" id="confirmpasswordInput"
|
|
placeholder="Masukan konfirmasi password baru anda"
|
|
name="new_password_confirmation" required>
|
|
<div class="invalid-feedback">
|
|
Harap masukan konfirmasi password baru anda
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
<div class="col-lg-12">
|
|
<div class="text-end">
|
|
<button type="submit" class="btn btn-success">Ubah Password</button>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
</form>
|
|
</div>
|
|
<!--end tab-pane-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--end col-->
|
|
</div>
|
|
<!--end row-->
|
|
|
|
</div>
|
|
<!-- container-fluid -->
|
|
</div><!-- End Page-content -->
|
|
|
|
@push('other-js')
|
|
<!-- profile-setting init js -->
|
|
<script src="{{ asset('assets/js/pages/customJs/auth/profile.js') }}"></script>
|
|
|
|
<script src="{{ asset('assets/js/pages/form-validation.init.js') }}"></script>
|
|
@endpush
|
|
@endsection
|