Viewing file:  pages-profile-settings.blade.php (7.38 KB) -rw-r--r--
Select action/file-type:
 (+) |  (+) |  (+) | Code (+) | Session (+) |  (+) | SDB (+) |  (+) |  (+) |  (+) |  (+) |  (+) |
@extends('layouts.master')
@section('title')
@lang('translation.settings')
@endsection
@section('content')
<div class="position-relative mx-n4 mt-n4">
<div class="profile-wid-bg profile-setting-img">
<img src="{{ URL::asset('assets/images/profile-bg.jpg') }}" class="profile-wid-img" alt="">
<div class="overlay-content">
<div class="text-end p-3">
<div class="p-0 ms-auto rounded-circle profile-photo-edit">
<input id="profile-foreground-img-file-input" type="file" class="profile-foreground-img-file-input">
<label for="profile-foreground-img-file-input" class="profile-photo-edit btn btn-light">
<i class="ri-image-edit-line align-bottom me-1"></i> Change Cover
</label>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xxl-3">
<div class="card mt-n5">
<div class="card-title">
<div class="d-flex align-items-center mb-0 mt-3 p-3">
<div class="flex-grow-1">
<h5 class="card-title mb-0">Change Passoword</h5>
</div>
</div>
</div>
<div class="card-body px-4">
@if ($errors->any())
<div class="alert alert-danger">
@foreach ($errors->all() as $error)
<span class="each-error">{{ $error }} </span><br/>
@endforeach
</div>
@endif
@if(session()->has('message'))
<div class="alert alert-success">
{{ session()->get('message') }}
</div>
@endif
<form action="{{route('updatePassword')}}" method="post">
@csrf
<div class="row g-2">
<div class="col-lg-4">
<div>
<label for="oldpasswordInput" class="form-label">Old
Password <span
class="text-danger">*</span></label>
<div class="position-relative auth-pass-inputgroup">
<input type="password" name="current_password" class="form-control" minlength="6" id="oldpasswordInput"
placeholder="Enter current password" required>
<button class="btn btn-link position-absolute end-0 top-0 text-decoration-none toggle-password" type="button">
<i class="ri-eye-fill align-middle"></i>
</button>
</div>
</div>
</div>
<!--end col-->
<div class="col-lg-4">
<div>
<label for="newpasswordInput" class="form-label">New
Password <span
class="text-danger">*</span></label>
<!-- <input type="password" name="password" class="form-control" minlength="6" id="newpasswordInput"
placeholder="Enter new password" required> -->
<div class="position-relative auth-pass-inputgroup">
<input type="password" name="password" class="form-control" minlength="6" id="newpasswordInput"
placeholder="Enter new password" required>
<button class="btn btn-link position-absolute end-0 top-0 text-decoration-none toggle-password" type="button">
<i class="ri-eye-fill align-middle"></i>
</button>
</div>
</div>
</div>
<!--end col-->
<div class="col-lg-4">
<div>
<label for="confirmpasswordInput" class="form-label">Confirm
Password <span
class="text-danger">*</span></label>
<div class="position-relative auth-pass-inputgroup">
<input type="password" name="confirm_password" class="form-control" minlength="6" id="confirmpasswordInput"
placeholder="Confirm password" required>
<button class="btn btn-link position-absolute end-0 top-0 text-decoration-none toggle-password" type="button">
<i class="ri-eye-fill align-middle"></i>
</button>
</div>
</div>
</div>
<!--end col-->
<div class="col-lg-12 pt-2">
<div class="text-end">
<button type="submit" class="btn btn-success">Change
Password</button>
</div>
</div>
<!--end col-->
</div>
<!--end row-->
</form>
</div>
</div>
<!--end card-->
</div>
<!--end col-->
</div>
<!--end row-->
@endsection
@section('script')
<script src="{{ URL::asset('assets/js/pages/profile-setting.init.js') }}"></script>
<script src="{{ URL::asset('/assets/js/app.min.js') }}"></script>
<script>
document.querySelectorAll('.toggle-password').forEach(function(button) {
button.addEventListener('click', function() {
const input = this.closest('.auth-pass-inputgroup').querySelector('input');
const icon = this.querySelector('i');
const type = input.getAttribute('type') === 'password' ? 'text' : 'password';
input.setAttribute('type', type);
icon.classList.toggle('ri-eye-fill');
icon.classList.toggle('ri-eye-off-fill');
});
});
var password = document.getElementById("newpasswordInput")
, confirm_password = document.getElementById("confirmpasswordInput");
function validatePassword(){
if(password.value != confirm_password.value) {
confirm_password.setCustomValidity("Passwords Don't Match");
} else {
confirm_password.setCustomValidity('');
}
}
password.onchange = validatePassword;
confirm_password.onkeyup = validatePassword;
</script>
@endsection
|