187 lines
No EOL
9.5 KiB
PHP
187 lines
No EOL
9.5 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Profile | Midtown Hotel</title>
|
|
<?php require('./components/link.php') ?>
|
|
<style>
|
|
.booking-hero{
|
|
position: relative;
|
|
width: 100%;
|
|
background-color: #194141;
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-shadow: 0px 3px 3px #BFCBCB;
|
|
}
|
|
.custom-alert-t{
|
|
position:fixed;
|
|
top: 100px;
|
|
right: 25px;
|
|
z-index: 10000;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="booking-hero">
|
|
<?php
|
|
require('./components/header.php') ;
|
|
if(!(isset($_SESSION['login']) && $_SESSION['login'] == true)){
|
|
redirect('index.php');
|
|
}
|
|
|
|
$user_exist = select("SELECT * FROM `user_creds` WHERE `id`=? LIMIT 1", [$_SESSION['uerID']], 's');
|
|
if(mysqli_num_rows($user_exist) == 0){
|
|
redirect('index.php');
|
|
}
|
|
|
|
$user_fetch = mysqli_fetch_assoc($user_exist);
|
|
?>
|
|
</div>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12 mt-5">
|
|
<h4 style="text-transform: uppercase; letter-spacing: 2px; color: #194141;">Profile<h4>
|
|
</div>
|
|
<div class="accordion mt-4 mb-4" id="accordionExample">
|
|
<!--personal information-->
|
|
<div class="accordion-item show">
|
|
<h2 class="accordion-header" id="headingOne">
|
|
<button class="accordion-button" style='background-color: #F8F9FA; box-shadow: none; text-transform: capitalize; font-weight: 600; font-size: 18px; color: black;' type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
|
Personal information
|
|
</button>
|
|
</h2>
|
|
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
|
<div class="accordion-body">
|
|
<div class="col-12">
|
|
<form id="info-form">
|
|
<div class="row">
|
|
<div class="col-md-6 mb-3">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">First Name</label>
|
|
<input name="firstname" value="<?php echo $user_fetch['firstname']?>" type="text" class="form-control shadow-none" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">Last Name</label>
|
|
<input name="lastname" value="<?php echo $user_fetch['lastname']?>" type="text" class="form-control shadow-none" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">Phone</label>
|
|
<input name="phone" value="<?php echo $user_fetch['phone']?>"type="tel" class="form-control shadow-none" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">Date of Birth</label>
|
|
<input name="birth" value="<?php echo $user_fetch['birth']?>" type="date" class="form-control shadow-none" required/>
|
|
</div>
|
|
<div class="mb-3 col-md-12">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">Address</label>
|
|
<textarea name="address" type="text"rows="3" class="form-control shadow-none" style="resize: none;" required><?php echo $user_fetch['address']?></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3 d-grid">
|
|
<button type="submit" class="btn btn-dark shadow-none d-block ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--change password-->
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header" id="headingTwo">
|
|
<button class="accordion-button collapsed" style='background-color: #F8F9FA; box-shadow: none; text-transform: capitalize; font-weight: 600; font-size: 18px; color: black;' type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
|
change password
|
|
</button>
|
|
</h2>
|
|
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
|
<div class="accordion-body">
|
|
<div class="col-12">
|
|
<form id="password-form">
|
|
<div class="row">
|
|
<div class="col-md-12 mb-3">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">New Password</label>
|
|
<input name="new_password" type="password" class="form-control shadow-none" required>
|
|
</div>
|
|
<div class="col-md-12 mb-3">
|
|
<label class="form-label" style="font-weight: 600; font-size: 14px;">Confirm Password</label>
|
|
<input name="confirm_password" type="password" class="form-control shadow-none" required>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3 d-grid">
|
|
<button type="submit" class="btn btn-dark shadow-none d-block ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!--footer-->
|
|
<?php require('./components/footer.php'); ?>
|
|
<?php require('./components/script.php') ?>
|
|
<script>
|
|
let info_form = document.getElementById('info-form');
|
|
info_form.addEventListener('submit', function(e){
|
|
e.preventDefault();
|
|
|
|
let data = new FormData();
|
|
data.append('info_form', '');
|
|
data.append('firstname', info_form.elements['firstname'].value);
|
|
data.append('lastname', info_form.elements['lastname'].value);
|
|
data.append('phone', info_form.elements['phone'].value);
|
|
data.append('birth', info_form.elements['birth'].value);
|
|
data.append('address', info_form.elements['address'].value);
|
|
|
|
let xhr = new XMLHttpRequest();
|
|
xhr.open("POST", "ajax/profile.php", true);
|
|
xhr.onload = function(){
|
|
if(this.responseText == 'phone_already'){
|
|
alert('error', 'This phone number is alerady registered!');
|
|
} else if(this.responseText == 0){
|
|
alert('error', 'There have been no changes!');
|
|
} else{
|
|
alert('success', 'Your information has been saved!');
|
|
}
|
|
}
|
|
xhr.send(data);
|
|
})
|
|
|
|
let password_form = document.getElementById('password-form');
|
|
password_form.addEventListener('submit', function(e){
|
|
e.preventDefault();
|
|
|
|
let new_password = password_form.elements['new_password'].value;
|
|
let confirm_password = password_form.elements['confirm_password'].value;
|
|
|
|
if(new_password != confirm_password){
|
|
alert('error', 'Passwords do not match, please try again!');
|
|
return false;
|
|
}
|
|
|
|
let data = new FormData();
|
|
data.append('password_form', '');
|
|
data.append('new_password', new_password);
|
|
data.append('confirm_password', confirm_password);
|
|
|
|
let xhr = new XMLHttpRequest();
|
|
xhr.open("POST", "ajax/profile.php", true);
|
|
xhr.onload = function(){
|
|
if(this.responseText == 'mismatch'){
|
|
alert('error', 'Passwords do not match, please try again!');
|
|
} else if(this.responseText == 0){
|
|
alert('error', 'Fail to update your password');
|
|
} else{
|
|
alert('success', 'Your password is updated!');
|
|
password_form.reset();
|
|
}
|
|
}
|
|
xhr.send(data);
|
|
})
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|