354 lines
14 KiB
PHP
354 lines
14 KiB
PHP
|
|
<style>
|
||
|
|
.dark-header thead th {
|
||
|
|
background-color: #343a40;
|
||
|
|
/* Dark gray background */
|
||
|
|
color: white;
|
||
|
|
/* White text color */
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<div class="container">
|
||
|
|
<h2 class="text-left">Availability Checker <a class="btn btn-primary" href="/<?php echo $_SESSION['role'] ?>/project/add">Add</a></h2>
|
||
|
|
<!-- <div id="loading" style="display:none;">
|
||
|
|
<div class=" spinner-border" role="status">
|
||
|
|
<span class="sr-only">Loading...</span>
|
||
|
|
</div>
|
||
|
|
</div> -->
|
||
|
|
|
||
|
|
<!-- Table Responsive Wrapper -->
|
||
|
|
<div class="table-responsive">
|
||
|
|
<form id="multiselect-form" action="/<?php echo $_SESSION['role'] ?>/project/list/multiselect" method="POST">
|
||
|
|
<button type="submit" id="edit-selected" style="display: none;" name="edit" class="btn btn-primary">Edit Selected</button> <!-- Button for edit action -->
|
||
|
|
<button type="submit" id="delete-selected" style="display: none;" name="delete" class="btn btn-danger">Delete Selected</button> <!-- Button for delete action -->
|
||
|
|
<table class="table table-hover dark-header">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th></th>
|
||
|
|
<th>ID</th>
|
||
|
|
<th>Project Name</th>
|
||
|
|
<!-- <th>Slot</th> -->
|
||
|
|
|
||
|
|
<th>Days</th>
|
||
|
|
<th>Score Threshold</th>
|
||
|
|
<th>Actual Score</th>
|
||
|
|
<th>Alert Check</th>
|
||
|
|
<th>Webhook</th>
|
||
|
|
<th></th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<?php foreach ($data['data'] as $key => $value) {
|
||
|
|
$role = $_SESSION['role'] ;
|
||
|
|
echo ' <tr>';
|
||
|
|
echo '<td><input type="checkbox" name="selected[]" value="' . $value->id . '"></td>'; // Checkbox for multiselect
|
||
|
|
echo ' <td>' . $value->id . ' <br/><a class=" text-info" href="/' . $role . '/project/edit/' . $value->id . '">edit</a> <a class="text-danger" href="/'. $role .'/project/delete/' . $value->id . '">delete</a></td>';
|
||
|
|
// echo ' <td>' . $value->id . ' <br/><a class="text-danger" href="/project/delete/' . $value->id . '">delete</a></td>';
|
||
|
|
echo ' <td>' . $value->project_name . ' </td>';
|
||
|
|
// echo ' <td>' . $value->slot . ' </td>';
|
||
|
|
|
||
|
|
echo ' <td>' . $value->days . ' </td>';
|
||
|
|
echo ' <td>' . $value->score_threshold . ' </td>';
|
||
|
|
echo ' <td>' . $value->actual_score . ' </td>';
|
||
|
|
|
||
|
|
echo ' <td><div class="btn-group btn-group-toggle" data-toggle="buttons">
|
||
|
|
<label class="btn btn-primary active">
|
||
|
|
<input type="radio" name="options" value="' . $value->alert . '" data-id="' . $value->id . '" onclick="alert_toggle(this)" class="toggle-option" autocomplete="off" ' . ($value->alert == "On" ? 'checked' : '') . ' > ' . $value->alert . '
|
||
|
|
</label>
|
||
|
|
|
||
|
|
</div></td>';
|
||
|
|
echo ' <td>' . $value->webhook . ' </td>';
|
||
|
|
echo ' <td><a style="cursor: pointer;" class="btn-link link-underline text-underline" target="__blank" data-id="' . $value->id . '" onclick="checkCal(this)">Check</a>
|
||
|
|
<a style="cursor: pointer;" class="btn-link link-underline text-underline" target="__blank" data-id="' . $value->id . '" onclick="dupl(this)">Duplicate</a>
|
||
|
|
<a style="cursor: pointer;" class="btn-link link-underline text-underline" target="__blank" data-id="' . $value->id . '" onclick="authorize(this)">Authorize</a>
|
||
|
|
</td>';
|
||
|
|
echo '</tr>';
|
||
|
|
}
|
||
|
|
?>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal fade" id="calModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||
|
|
<div class="modal-dialog modal-dialog-centered" role="document">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div id="makingWishLoading" style="display:none;">
|
||
|
|
<div class=" spinner-border text-light" role="status">
|
||
|
|
<span class="sr-only">Loading...</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="modal-header text-center">
|
||
|
|
<h5 class="modal-title w-100" id="wishModalLable">Calendar</h5>
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="wishModalCloseBtn">
|
||
|
|
<span aria-hidden="true">×</span>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<form id="calForm">
|
||
|
|
<div class="form-group">
|
||
|
|
<label for="wish-title">Calendar ID</label>
|
||
|
|
<input type="text" class="form-control" id="calendar_id" placeholder="" style="border: 1px solid #ced4da;" required>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal-footer">
|
||
|
|
<button id="submit_cal" class="btn btn-primary btn-block" target="__blank" onclick="duplicate(this)">Submit</button>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<?php
|
||
|
|
// Retrieve parameters
|
||
|
|
$total = $data['total'];
|
||
|
|
$currentPage = $data['page'];
|
||
|
|
$perPage = 10;
|
||
|
|
|
||
|
|
// Calculate the number of pages
|
||
|
|
$totalPages = ceil($total / $perPage);
|
||
|
|
|
||
|
|
// Define a range of pages to show at any given time
|
||
|
|
$range = 2; // This can be adjusted as needed
|
||
|
|
|
||
|
|
$startPage = ($currentPage - $range) > 0 ? ($currentPage - $range) : 1;
|
||
|
|
$endPage = ($currentPage + $range) < $totalPages ? ($currentPage + $range) : $totalPages;
|
||
|
|
|
||
|
|
?>
|
||
|
|
<!-- Pagination -->
|
||
|
|
<nav aria-label="Page navigation">
|
||
|
|
<ul class="pagination">
|
||
|
|
<li class="ml-2">
|
||
|
|
<a href="?page=1" aria-label="Previous">
|
||
|
|
<span aria-hidden="true">««</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<li class="ml-2">
|
||
|
|
<a href="?page=<?= ($currentPage - 1) > 0 ? $currentPage - 1 : 1 ?>" aria-label="Previous">
|
||
|
|
<span aria-hidden="true">«</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<?php
|
||
|
|
for ($i = $startPage; $i <= $endPage; $i++) {
|
||
|
|
echo '<li class="ml-2' . ($currentPage == $i ? ' active' : '') . '"><a href="?page=' . $i . '">' . $i . '</a></li>';
|
||
|
|
}
|
||
|
|
?>
|
||
|
|
<li class="ml-2">
|
||
|
|
<a href="?page=<?= ($currentPage + 1) < $totalPages ? $currentPage + 1 : $totalPages ?>" aria-label="Next">
|
||
|
|
<span aria-hidden="true">»</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<li class="ml-2">
|
||
|
|
<a href="?page=<?= $totalPages ?>" aria-label="Next">
|
||
|
|
<span aria-hidden="true">»»</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// Attach click event to the toggle buttons
|
||
|
|
function alert_toggle(element) {
|
||
|
|
|
||
|
|
// Get the selected value (Yes or No)
|
||
|
|
var projectId = $(element).attr("data-id");
|
||
|
|
var selectedValue = $(element).val();
|
||
|
|
console.log(projectId)
|
||
|
|
console.log(selectedValue)
|
||
|
|
if (selectedValue == "On") {
|
||
|
|
var values = "Off"
|
||
|
|
}
|
||
|
|
if (selectedValue == "Off") {
|
||
|
|
var values = "On"
|
||
|
|
}
|
||
|
|
// Make an AJAX request to update the database
|
||
|
|
$.ajax({
|
||
|
|
type: 'POST',
|
||
|
|
url: '/alert-toggle', // Replace with the actual path to your update script
|
||
|
|
data: {
|
||
|
|
projectId: projectId,
|
||
|
|
selectedValue: values
|
||
|
|
},
|
||
|
|
success: function(response) {
|
||
|
|
// Handle the response from the server (if needed)
|
||
|
|
console.log(response);
|
||
|
|
window.location.reload()
|
||
|
|
},
|
||
|
|
error: function(error) {
|
||
|
|
console.error('Error updating data:', error);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
function dupl(element) {
|
||
|
|
var projectId = $(element).data("id");
|
||
|
|
$('#submit_cal').attr('data-id', projectId);
|
||
|
|
$("#calModal").modal("show");
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function checkCal(element) {
|
||
|
|
event.preventDefault();
|
||
|
|
|
||
|
|
|
||
|
|
// var calendarId = $("#calendar_id").val();
|
||
|
|
// var projectId = $("#submit_cal").attr("data-id");
|
||
|
|
var projectId = $(element).data("id");
|
||
|
|
|
||
|
|
// console.log(calendarId)
|
||
|
|
console.log(projectId)
|
||
|
|
|
||
|
|
var spinner = document.createElement('span');
|
||
|
|
spinner.className = 'spinner-border spinner-border-sm';
|
||
|
|
element.appendChild(spinner);
|
||
|
|
|
||
|
|
// Disable the button
|
||
|
|
element.classList.add('disabled');
|
||
|
|
try {
|
||
|
|
$.ajax({
|
||
|
|
type: 'POST',
|
||
|
|
url: '/check-calendar',
|
||
|
|
data: {
|
||
|
|
project_id: projectId,
|
||
|
|
},
|
||
|
|
success: function(response) {
|
||
|
|
|
||
|
|
element.removeChild(spinner);
|
||
|
|
element.classList.remove('disabled');
|
||
|
|
console.log(typeof response);
|
||
|
|
if (response == "Accepted") {
|
||
|
|
alert("Webhook triggered")
|
||
|
|
} else {
|
||
|
|
if (response == "low" || response == 'Low') {
|
||
|
|
alert("Point is higher than mininum point set")
|
||
|
|
} else {
|
||
|
|
alert(response)
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
// Optionally, handle success actions or update UI
|
||
|
|
// $("#calModal").modal("hide");
|
||
|
|
// $("#calForm")[0].reset();
|
||
|
|
|
||
|
|
window.location.reload();
|
||
|
|
},
|
||
|
|
error: function(error) {
|
||
|
|
console.error('Error updating data:', error);
|
||
|
|
// Optionally, display an error message or handle errors
|
||
|
|
// $("#calModal").modal("hide");
|
||
|
|
// $("#calForm")[0].reset();
|
||
|
|
|
||
|
|
}
|
||
|
|
});
|
||
|
|
} catch (e) {
|
||
|
|
notify("Unknown error occurred!");
|
||
|
|
console.log(e);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function duplicate(element) {
|
||
|
|
event.preventDefault();
|
||
|
|
|
||
|
|
var calendarId = $("#calendar_id").val();
|
||
|
|
// var projectId = $("#submit_cal").attr("data-id");
|
||
|
|
var projectId = $(element).data("id");
|
||
|
|
if (calendarId == "") {
|
||
|
|
alert('Calendar Id is empty')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
// console.log(calendarId)
|
||
|
|
console.log(projectId)
|
||
|
|
try {
|
||
|
|
$.ajax({
|
||
|
|
type: 'POST',
|
||
|
|
url: '/<?php echo $_SESSION['role'] ?>/duplicate',
|
||
|
|
data: {
|
||
|
|
project_id: projectId,
|
||
|
|
calendar_id: calendarId
|
||
|
|
},
|
||
|
|
success: function(response) {
|
||
|
|
console.log(typeof response);
|
||
|
|
if (response == "Accepted") {
|
||
|
|
alert("Webhook triggered")
|
||
|
|
} else {
|
||
|
|
if (response == "low" || response == 'Low') {
|
||
|
|
alert("Point is higher than mininum point set")
|
||
|
|
} else {
|
||
|
|
alert(response)
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
// Optionally, handle success actions or update UI
|
||
|
|
window.location.reload()
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
error: function(error) {
|
||
|
|
console.error('Error updating data:', error);
|
||
|
|
alert('Error updating data:')
|
||
|
|
window.location.reload()
|
||
|
|
|
||
|
|
// Optionally, display an error message or handle errors
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
});
|
||
|
|
} catch (e) {
|
||
|
|
notify("Unknown error occurred!");
|
||
|
|
console.log(e);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// Event binding
|
||
|
|
$(document).ready(function() {
|
||
|
|
// $('#submit_cal').on('click', submitCal);
|
||
|
|
});
|
||
|
|
|
||
|
|
document.addEventListener('DOMContentLoaded', function() {
|
||
|
|
// Get all checkboxes
|
||
|
|
var checkboxes = document.querySelectorAll('input[type="checkbox"]');
|
||
|
|
|
||
|
|
// Add event listener to checkboxes
|
||
|
|
checkboxes.forEach(function(checkbox) {
|
||
|
|
checkbox.addEventListener('change', function() {
|
||
|
|
// Check if any checkbox is checked
|
||
|
|
var anyChecked = Array.from(checkboxes).some(function(cb) {
|
||
|
|
return cb.checked;
|
||
|
|
});
|
||
|
|
|
||
|
|
// Show/hide the buttons based on checkbox state
|
||
|
|
document.getElementById('edit-selected').style.display = anyChecked ? 'inline-block' : 'none';
|
||
|
|
document.getElementById('delete-selected').style.display = anyChecked ? 'inline-block' : 'none';
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
function authorize(element) {
|
||
|
|
var projectId = $(element).data("id");
|
||
|
|
// Get current page from URL query parameter
|
||
|
|
var urlParams = new URLSearchParams(window.location.search);
|
||
|
|
var currentPage = urlParams.get('page') || 1;
|
||
|
|
window.location.href = '/ghl/authorize/' + projectId + 'p' + currentPage + '?redirect_uri=' + window.location.pathname;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
// document.getElementById("multiselect-form").addEventListener("submit", function(event) {
|
||
|
|
// event.preventDefault(); // Prevent default form submission
|
||
|
|
|
||
|
|
// // Display confirmation dialog
|
||
|
|
// if (confirm("Are you sure you want to proceed?")) {
|
||
|
|
// // If user confirms, submit the form
|
||
|
|
// this.submit();
|
||
|
|
// } else {
|
||
|
|
// // If user cancels, do nothing
|
||
|
|
// return false;
|
||
|
|
// }
|
||
|
|
// });
|
||
|
|
</script>
|