feat(profile): create profile page
This commit is contained in:
arieeefajar
parent
1164c10bb6
commit
4a003d1381
|
|
@ -0,0 +1,16 @@
|
|||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Auth;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Auth;
|
||||
|
||||
class ProfileController extends Controller
|
||||
{
|
||||
public function index()
|
||||
{
|
||||
$user = Auth::user();
|
||||
return view('auth.profile', compact('user'));
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
document
|
||||
.querySelector("#profile-img-file-input")
|
||||
.addEventListener("change", function () {
|
||||
var o = document.querySelector(".user-profile-image"),
|
||||
e = document.querySelector(".profile-img-file-input").files[0],
|
||||
i = new FileReader();
|
||||
i.addEventListener(
|
||||
"load",
|
||||
function () {
|
||||
o.src = i.result;
|
||||
},
|
||||
!1
|
||||
),
|
||||
e && i.readAsDataURL(e);
|
||||
});
|
||||
var count = 2;
|
||||
function new_link() {
|
||||
count++;
|
||||
var o = document.createElement("div"),
|
||||
e =
|
||||
'<div class="row"><div class="col-lg-12"><div class="mb-3"><label for="jobTitle1" class="form-label">Job Title</label><input type="text" class="form-control" id="jobTitle1" placeholder="Job title"></div></div><div class="col-lg-6"><div class="mb-3"><label for="companyName" class="form-label">Company Name</label><input type="text" class="form-control" id="companyName" placeholder="Company name"></div></div><div class="col-lg-6"><div class="mb-3"><label for="choices-single-default3" class="form-label">Experience Years</label><div class="row"><div class="col-lg-5"><select class="form-control" data-trigger name="choices-single-default3"> <option value="">Select years</option><option value="Choice 1">2001</option><option value="Choice 2">2002</option><option value="Choice 3">2003</option><option value="Choice 4">2004</option><option value="Choice 5">2005</option><option value="Choice 6">2006</option><option value="Choice 7">2007</option><option value="Choice 8">2008</option><option value="Choice 9">2009</option><option value="Choice 10">2010</option><option value="Choice 11">2011</option><option value="Choice 12">2012</option><option value="Choice 13">2013</option><option value="Choice 14">2014</option><option value="Choice 15">2015</option><option value="Choice 16">2016</option><option value="Choice 17">2017</option><option value="Choice 18">2018</option><option value="Choice 19">2019</option><option value="Choice 20">2020</option><option value="Choice 21">2021</option><option value="Choice 22">2022</option></select></div><div class="col-auto align-self-center">to</div><div class="col-lg-5"><select class="form-control" data-trigger name="choices-single-default2"><option value="">Select years</option><option value="Choice 1">2001</option><option value="Choice 2">2002</option><option value="Choice 3">2003</option><option value="Choice 4">2004</option><option value="Choice 5">2005</option><option value="Choice 6">2006</option><option value="Choice 7">2007</option><option value="Choice 8">2008</option><option value="Choice 9">2009</option><option value="Choice 10">2010</option><option value="Choice 11">2011</option><option value="Choice 12">2012</option><option value="Choice 13">2013</option><option value="Choice 14">2014</option><option value="Choice 15">2015</option><option value="Choice 16">2016</option><option value="Choice 17">2017</option><option value="Choice 18">2018</option><option value="Choice 19">2019</option><option value="Choice 20">2020</option><option value="Choice 21">2021</option><option value="Choice 22">2022</option></select></div></div></div></div><div class="col-lg-12"><div class="mb-3"><label for="jobDescription" class="form-label">Job Description</label><textarea class="form-control" id="jobDescription" rows="3" placeholder="Enter description"></textarea></div></div><div class="hstack gap-2 justify-content-end"><a class="btn btn-success" href="javascript:deleteEl(' +
|
||||
(o.id = count) +
|
||||
')">Delete</a></div></div>';
|
||||
(o.innerHTML = document.getElementById("newForm").innerHTML + e),
|
||||
document.getElementById("newlink").appendChild(o);
|
||||
var t = document.querySelectorAll("[data-trigger]");
|
||||
for (i = 0; i < t.length; ++i) {
|
||||
var l = t[i];
|
||||
new Choices(l, {
|
||||
placeholderValue: "This is a placeholder set in the config",
|
||||
searchPlaceholderValue: "This is a search placeholder",
|
||||
searchEnabled: !1,
|
||||
});
|
||||
}
|
||||
}
|
||||
function deleteEl(o) {
|
||||
d = document;
|
||||
o = d.getElementById(o);
|
||||
d.getElementById("newlink").removeChild(o);
|
||||
}
|
||||
|
|
@ -0,0 +1,191 @@
|
|||
@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="assets/images/users/avatar-1.jpg"
|
||||
class="rounded-circle avatar-xl img-thumbnail user-profile-image"
|
||||
alt="user-profile-image">
|
||||
<div class="avatar-xs p-0 rounded-circle profile-photo-edit">
|
||||
<input id="profile-img-file-input" type="file" class="profile-img-file-input">
|
||||
<label for="profile-img-file-input" class="profile-photo-edit avatar-xs">
|
||||
<span class="avatar-title rounded-circle bg-light text-body">
|
||||
<i class="ri-camera-fill"></i>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<h5 class="fs-16 mb-1">Anna Adame</h5>
|
||||
<p class="text-muted mb-0">Lead Designer / Developer</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="" class="needs-validation" novalidate id="personalDetailsForm"
|
||||
method="POST">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<div class="row">
|
||||
<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="{{ $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="{{ $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="{{ $user->email }}" required>
|
||||
</div>
|
||||
</div>
|
||||
<!--end col-->
|
||||
<div class="col-lg-12">
|
||||
<div class="hstack gap-2 justify-content-end">
|
||||
<button type="submit" class="btn btn-success">Ubah</button>
|
||||
<button type="button" class="btn btn-soft-secondary">Batal</button>
|
||||
</div>
|
||||
</div>
|
||||
<!--end col-->
|
||||
</div>
|
||||
<!--end row-->
|
||||
</form>
|
||||
</div>
|
||||
<!--end tab-pane-->
|
||||
<div class="tab-pane" id="changePassword" role="tabpanel">
|
||||
<form action="" 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="confirm_password" required>
|
||||
<div class="invalid-feedback">
|
||||
Harap masukan konfirmasi password baru anda
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end col-->
|
||||
<div class="col-lg-12">
|
||||
<div class="mb-3">
|
||||
<a href="javascript:void(0);"
|
||||
class="link-primary text-decoration-underline">Lupa Password ?</a>
|
||||
</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
|
||||
|
|
@ -181,29 +181,9 @@ class="d-none d-xl-block ms-1 fs-12 text-muted user-name-sub-text">{{ Auth::user
|
|||
<div class="dropdown-menu dropdown-menu-end">
|
||||
<!-- item-->
|
||||
<h6 class="dropdown-header">Selamat Datang {{ Auth::user()->name }}!</h6>
|
||||
<a class="dropdown-item" href="pages-profile.html"><i
|
||||
<a class="dropdown-item" href="{{ route('profile.index') }}"><i
|
||||
class="mdi mdi-account-circle text-muted fs-16 align-middle me-1"></i> <span
|
||||
class="align-middle">Profile</span></a>
|
||||
<a class="dropdown-item" href="apps-chat.html"><i
|
||||
class="mdi mdi-message-text-outline text-muted fs-16 align-middle me-1"></i>
|
||||
<span class="align-middle">Messages</span></a>
|
||||
<a class="dropdown-item" href="apps-tasks-kanban.html"><i
|
||||
class="mdi mdi-calendar-check-outline text-muted fs-16 align-middle me-1"></i>
|
||||
<span class="align-middle">Taskboard</span></a>
|
||||
<a class="dropdown-item" href="pages-faqs.html"><i
|
||||
class="mdi mdi-lifebuoy text-muted fs-16 align-middle me-1"></i> <span
|
||||
class="align-middle">Help</span></a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="pages-profile.html"><i
|
||||
class="mdi mdi-wallet text-muted fs-16 align-middle me-1"></i> <span
|
||||
class="align-middle">Balance : <b>$5971.67</b></span></a>
|
||||
<a class="dropdown-item" href="pages-profile-settings.html"><span
|
||||
class="badge bg-soft-success text-success mt-1 float-end">New</span><i
|
||||
class="mdi mdi-cog-outline text-muted fs-16 align-middle me-1"></i> <span
|
||||
class="align-middle">Settings</span></a>
|
||||
<a class="dropdown-item" href="auth-lockscreen-basic.html"><i
|
||||
class="mdi mdi-lock text-muted fs-16 align-middle me-1"></i> <span
|
||||
class="align-middle">Lock screen</span></a>
|
||||
<form action="{{ route('auth.logout') }}" class="d-inline" method="POST">
|
||||
@csrf
|
||||
<button type="submit" class="dropdown-item">
|
||||
|
|
@ -211,9 +191,6 @@ class="align-middle">Lock screen</span></a>
|
|||
class="align-middle" data-key="t-logout">Logout</span>
|
||||
</button>
|
||||
</form>
|
||||
{{-- <a class="dropdown-item" href="auth-logout-basic.html"><i
|
||||
class="mdi mdi-logout text-muted fs-16 align-middle me-1"></i> <span
|
||||
class="align-middle" data-key="t-logout">Logout</span></a> --}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
use App\Http\Controllers\AssessmentHistoryController;
|
||||
use App\Http\Controllers\Auth\AuthenticatedSessionController;
|
||||
use App\Http\Controllers\Auth\PasswordResetLinkController;
|
||||
use App\Http\Controllers\Auth\ProfileController;
|
||||
use App\Http\Controllers\Auth\RegisteredUserController;
|
||||
use App\Http\Controllers\Auth\TwoStepVerifyController;
|
||||
use App\Http\Controllers\DashboardController;
|
||||
|
|
@ -60,6 +61,11 @@
|
|||
Route::middleware(['auth', 'verifiedAcount'])->group(function () {
|
||||
Route::post('/logout', [AuthenticatedSessionController::class, 'destroy'])->name('auth.logout');
|
||||
|
||||
Route::prefix('profile')->controller(ProfileController::class)->name('profile.')->group(function () {
|
||||
Route::get('/', 'index')->name('index');
|
||||
Route::put('/', 'update')->name('update');
|
||||
});
|
||||
|
||||
Route::prefix('location')->controller(LocationController::class)->name('location.')->group(function () {
|
||||
Route::get('/get-province', 'getProvinces')->name('get_provinces');
|
||||
Route::get('/get-regency/{id}', 'getRegencies')->name('get_regencies');
|
||||
|
|
|
|||
Loading…
Reference in New Issue