Menu bar and Upcoming PPR
This commit is contained in:
325
upcoming.php
Normal file
325
upcoming.php
Normal file
@@ -0,0 +1,325 @@
|
||||
<?php
|
||||
include("functions.php");
|
||||
require_db_auth();
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta http-equiv="refresh" content="300">
|
||||
<!-- Include SweetAlert -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Upcoming Movements</title>
|
||||
<style>
|
||||
/* ...existing styles from tower.php... */
|
||||
|
||||
.menu-bar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background-color: #333;
|
||||
padding: 10px 0;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.menu-bar a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
padding: 10px 20px;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.menu-bar a:hover {
|
||||
background-color: #575757;
|
||||
}
|
||||
|
||||
.menu-bar a.active {
|
||||
background-color: #007bff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Table styling */
|
||||
table {
|
||||
width: 80%;
|
||||
border-collapse: collapse;
|
||||
margin: 20px auto;
|
||||
}
|
||||
|
||||
table, th, td {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
th {
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
td {
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 16pt;
|
||||
}
|
||||
|
||||
tr:nth-child(even) {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
|
||||
.highlight100LL {
|
||||
background-color: #ADD8E6 !important;
|
||||
}
|
||||
|
||||
.highlightJET {
|
||||
background-color: yellow !important;
|
||||
}
|
||||
|
||||
/* Add this CSS for the red triangle */
|
||||
.red-triangle {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.red-triangle::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 10px solid red;
|
||||
border-bottom: 10px solid transparent;
|
||||
}
|
||||
|
||||
.red-triangle:hover::after {
|
||||
content: attr(data-notes);
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
border: 1px solid #ddd;
|
||||
padding: 5px;
|
||||
border-radius: 5px;
|
||||
white-space: nowrap;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.checkbox-container {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
margin-bottom: 15px;
|
||||
padding: 10px;
|
||||
background: #f9f9f9;
|
||||
border-radius: 8px;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.heading {
|
||||
width: 80%;
|
||||
margin: 20px auto;
|
||||
background-color: #fff;
|
||||
text-align: center;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 20pt;
|
||||
}
|
||||
|
||||
label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.state-CANCELED {
|
||||
text-decoration: line-through;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.state-LANDED {
|
||||
font-style: italic;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.acreg {
|
||||
padding: 4px;
|
||||
text-align: center;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 10pt;
|
||||
font-style: italic;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="menu-bar">
|
||||
<a href="tower.php">HOME</a>
|
||||
<a href="upcoming.php" class="active">Future PPRs</a>
|
||||
<a href="admin.php">Reports</a>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function markAction(id, action, title, buttonText) {
|
||||
const now = new Date();
|
||||
const currentTime = now.toISOString().slice(11, 16); // Extract HH:MM
|
||||
|
||||
Swal.fire({
|
||||
title: title,
|
||||
html: `<input type="time" id="timepicker" class="swal2-input" value="${currentTime}">`,
|
||||
icon: "info",
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: "#3085d6",
|
||||
cancelButtonColor: "#d33",
|
||||
confirmButtonText: buttonText,
|
||||
preConfirm: () => {
|
||||
const time = document.getElementById("timepicker").value;
|
||||
if (!time) {
|
||||
Swal.showValidationMessage("Please select a time");
|
||||
}
|
||||
return time;
|
||||
}
|
||||
}).then((result) => {
|
||||
if (result.isConfirmed) {
|
||||
const page = `action.php?op=${action}&id=${id}&time=${encodeURIComponent(result.value)}`;
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("GET", page, false); // 'false' makes the request synchronous
|
||||
xhr.send();
|
||||
window.location.reload(true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function markCancel(id) {
|
||||
Swal.fire({
|
||||
title: "Are you sure?",
|
||||
text: "This action will cancel the PPR.",
|
||||
icon: "warning",
|
||||
showCancelButton: true,
|
||||
confirmButtonColor: "#3085d6",
|
||||
cancelButtonColor: "#d33",
|
||||
confirmButtonText: "Yes, cancel it!",
|
||||
cancelButtonText: "No, keep it"
|
||||
}).then((result) => {
|
||||
if (result.isConfirmed) {
|
||||
const page = `action.php?op=cancel&id=${id}`;
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("GET", page, false); // 'false' makes the request synchronous
|
||||
xhr.send();
|
||||
window.location.reload(true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function openDetail(id) {
|
||||
const page = `action.php?op=detail&id=${id}`;
|
||||
var popupWindow = window.open(page, "PopupWindow", "toolbar=no, location=no, directories=no,status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=yes, width=600, height=1100");
|
||||
popupWindow.onload = function () {
|
||||
var contentHeight = popupWindow.document.body.scrollHeight;
|
||||
var contentWidth = popupWindow.document.body.scrollWidth;
|
||||
popupWindow.resizeTo(contentWidth + 20, contentHeight + 180); // Adding padding to prevent clipping
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<center><h2>Upcoming Movements</h2></center>
|
||||
|
||||
<?php
|
||||
|
||||
function renderTableCell($key, $value, $row) {
|
||||
if ($key == 'ETA') {
|
||||
return "<td>" . htmlspecialchars($value ?? '') . (!empty($value) ? " Z" : "") . "</td>";
|
||||
}
|
||||
if ($key == 'ac_reg' && $row['ac_call'] != NULL) {
|
||||
$notes = htmlspecialchars($row['notes'] ?? '');
|
||||
$acCall = htmlspecialchars($row['ac_call'] ?? '');
|
||||
$acReg = htmlspecialchars($value ?? '');
|
||||
if (!empty($row['notes'])) {
|
||||
return "<td class='red-triangle' data-notes='$notes'>$acCall<br><span class='acreg'>$acReg</span></td>";
|
||||
}
|
||||
return "<td>$acCall<br><span class='acreg'>$acReg</span></td>";
|
||||
} elseif ($key == 'ac_reg' && !empty($row['notes'])) {
|
||||
$notes = htmlspecialchars($row['notes'] ?? '');
|
||||
$acReg = htmlspecialchars($value ?? '');
|
||||
return "<td class='red-triangle' data-notes='$notes'>$acReg</td>";
|
||||
} else {
|
||||
return "<td>" . htmlspecialchars($value ?? '') . "</td>";
|
||||
}
|
||||
}
|
||||
|
||||
function renderActionsCell($id) {
|
||||
return "<td>
|
||||
<img src='assets/cancel-icon.webp' title='Cancel PPR' style='width: 25px; height: auto;' onclick='markCancel($id)'>
|
||||
<img src='assets/edit.png' title='Edit Details' style='width: 25px; height: auto;' onclick='openDetail($id)'>
|
||||
</td>";
|
||||
}
|
||||
|
||||
function renderTableRow($row) {
|
||||
$rowHtml = "<tr>";
|
||||
foreach ($row as $key => $value) {
|
||||
if (!in_array($key, ['id', 'ac_call', 'notes'])) { // Exclude 'notes'
|
||||
$rowHtml .= renderTableCell($key, $value, $row);
|
||||
}
|
||||
}
|
||||
$rowHtml .= renderActionsCell($row['id']);
|
||||
$rowHtml .= "</tr>";
|
||||
return $rowHtml;
|
||||
}
|
||||
|
||||
function renderTable($result) {
|
||||
$tableHtml = "<table border='1'>
|
||||
<thead>
|
||||
<tr>";
|
||||
$fields = $result->fetch_fields();
|
||||
foreach ($fields as $field) {
|
||||
if (!in_array($field->name, ['id', 'ac_call', 'notes'])) { // Exclude 'notes'
|
||||
$tableHtml .= "<th>" . htmlspecialchars($field->name ?? '') . "</th>";
|
||||
}
|
||||
}
|
||||
$tableHtml .= "<th>Actions</th></tr></thead><tbody>";
|
||||
|
||||
while ($row = $result->fetch_assoc()) {
|
||||
$tableHtml .= renderTableRow($row);
|
||||
}
|
||||
|
||||
$tableHtml .= "</tbody></table>";
|
||||
return $tableHtml;
|
||||
}
|
||||
|
||||
$conn = connectDb();
|
||||
$sql = "SELECT id, ac_reg, ac_type, ac_call, eta AS ETA, fuel, in_from, pob_in, notes
|
||||
FROM submitted
|
||||
WHERE DATE(eta) > CURDATE()
|
||||
ORDER BY eta ASC;";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result->num_rows > 0) {
|
||||
echo renderTable($result);
|
||||
} else {
|
||||
echo "<center>No upcoming movements found.</center>";
|
||||
}
|
||||
|
||||
$conn->close();
|
||||
?>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user