web_php/hotel_booking/admin/accomm.php

265 lines
No EOL
11 KiB
PHP

<?php
require('components/utils.php');
adminLogin();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin Dashboard-accommodation | Midtown Hotel</title>
<?php require('components/link.php') ?>
<style>
.custom-alert-t{
position:fixed;
top: 100px;
right: 25px;
z-index: 10000;
}
</style>
</head>
<body>
<?php require('components/sidebar.php')?>
<div class="container-fluid" id="dashboard-body">
<div class="row">
<div class="col-lg-10 ms-auto p-4 overflow-hidden">
<h4 class="mb-4">Accommodation & Additional Accommodation</h4>
<!--accommodation setting-->
<div class="card mb-4">
<div class="card-body">
<div class="d-flex mb-3 align-items-center justify-content-between">
<h5 class="card-title m-0">Accommodation</h5>
<button type="button" class="btn-third" data-bs-toggle="modal" data-bs-target="#accomm-setting">Add</button>
</div>
<div class="table-responsive-md" style="height: 400px; overflow-y: scroll;">
<table class="table table-hover border">
<thead>
<tr style="background-color: #D3D3D3;">
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Status</th>
</tr>
</thead>
<tbody id="accomm_data">
</tbody>
</table>
</div>
</div>
</div>
<!--additional accommodation setting-->
<div class="card mb-4">
<div class="card-body">
<div class="d-flex mb-3 align-items-center justify-content-between">
<h5 class="card-title m-0">Additional Accommodation</h5>
<button type="button" class="btn-third" data-bs-toggle="modal" data-bs-target="#add-accomm-setting">Add</button>
</div>
<div class="table-responsive-md" style="height: 400px; overflow-y: scroll;">
<table class="table table-hover border">
<thead>
<tr style="background-color: #D3D3D3;">
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col" width="40%">Detail</th>
<th scope="col">Status</th>
</tr>
</thead>
<tbody id="add-accomm-data">
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!--accommodation modal-->
<div class="modal fade" id="accomm-setting" data-bs-backdrop="static" data-bs-keyboard="true" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
<form id="accomm_setting_form">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Add Accommodation</h5>
</div>
<div class="modal-body">
<div class="mb-3">
<label class="form-label" style="font-weight: 600;">Name</label>
<input type="text" name="accomm_name" class="form-control shadow-none" required/>
</div>
</div>
<div class="modal-footer">
<button type="reset" class="btn-cancel" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn-third">Submit</button>
</div>
</div>
</form>
</div>
</div>
<!--additional accommodation modal-->
<div class="modal fade" id="add-accomm-setting" data-bs-backdrop="static" data-bs-keyboard="true" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
<form id="add_accomm_setting_form">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Add Additional Accommodation</h5>
</div>
<div class="modal-body">
<div class="mb-3">
<label class="form-label" style="font-weight: 600;">Name</label>
<input type="text" name="add_accomm_name" class="form-control shadow-none" required/>
</div>
<div class="mb-3">
<label class="form-label" style="font-weight: 600;">Detail</label>
<textarea class="form-control" name="add_accomm_detail" rows="3" style="resize: none;"></textarea>
</div>
</div>
<div class="modal-footer">
<button type="reset" class="btn-cancel" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn-third">Submit</button>
</div>
</div>
</form>
</div>
</div>
<?php require('components/script.php') ?>
<script>
let accomm_setting_form = document.getElementById('accomm_setting_form');
let add_accomm_setting_form = document.getElementById('add_accomm_setting_form');
accomm_setting_form.addEventListener('submit', function(e){
e.preventDefault();
add_accomm();
})
function add_accomm(){
let data = new FormData();
data.append('name', accomm_setting_form.elements['accomm_name'].value);
data.append('add_accomm', '');
let xhr = new XMLHttpRequest();
xhr.open("POST", "ajax/accomm.php", true);
xhr.onload = function(){
console.log(this.responseText);
var myModal = document.getElementById('accomm-setting');
var modal = bootstrap.Modal.getInstance(myModal);
modal.hide()
if(this.responseText == 1){
alert('success', 'New accommodation is added');
accomm_setting_form.elements['accomm_name'].value ='';
get_accomm();
} else{
alert('error', 'Fail to update new accommodation')
}
}
xhr.send(data);
}
function get_accomm(){
let xhr = new XMLHttpRequest();
xhr.open("POST", "ajax/accomm.php", true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function(){
document.getElementById('accomm_data').innerHTML = this.responseText;
}
xhr.send('get_accomm');
}
function remove_accomm(val){
let xhr = new XMLHttpRequest();
xhr.open("POST", "ajax/accomm.php", true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function(){
if(this.responseText == 1){
alert('success', 'Deleted');
get_accomm();
}
else if(this.responseText == 'room_add' ){
alert('error', 'This accommodation is already addedd')
}
else{
alert('error', 'Fail to delete data')
}
}
xhr.send('remove_accomm='+val);
}
add_accomm_setting_form.addEventListener('submit', function(e){
e.preventDefault();
add_addiAccomm();
})
function add_addiAccomm(){
let data = new FormData();
data.append('name', add_accomm_setting_form.elements['add_accomm_name'].value);
data.append('detail', add_accomm_setting_form.elements['add_accomm_detail'].value);
data.append('add_addiAccomm', '');
let xhr = new XMLHttpRequest();
xhr.open("POST", "ajax/accomm.php", true);
xhr.onload = function(){
console.log(this.responseText);
var myModal = document.getElementById('add-accomm-setting');
var modal = bootstrap.Modal.getInstance(myModal);
modal.hide()
if(this.responseText == 1){
alert('success', 'New additional accommodation is added');
add_accomm_setting_form.reset();
get_addiAccomm();
} else{
alert('error', 'Fail to update new additional accommodation')
}
}
xhr.send(data);
}
function get_addiAccomm(){
let xhr = new XMLHttpRequest();
xhr.open("POST", "ajax/accomm.php", true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function(){
document.getElementById('add-accomm-data').innerHTML = this.responseText;
}
xhr.send('get_addiAccomm');
}
function remove_addiAccomm(val){
let xhr = new XMLHttpRequest();
xhr.open("POST", "ajax/accomm.php", true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function(){
if(this.responseText == 1){
alert('success', 'Deleted');
get_addiAccomm();
}
else if(this.responseText == 'room_add' ){
alert('error', 'This additional accommodation is already addedd')
}
else{
alert('error', 'Fail to delete data')
}
}
xhr.send('remove_addiAccomm='+val);
}
window.onload = function(){
get_accomm();
get_addiAccomm();
}
</script>
</body>
</html>