402 lines
12 KiB
PHP
402 lines
12 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Row Details</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #f4f4f4;
|
|
}
|
|
|
|
.container {
|
|
width: 80%;
|
|
margin: 20px auto;
|
|
background-color: #fff;
|
|
padding: 20px;
|
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
h2 {
|
|
color: #333;
|
|
text-align: center;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.details {
|
|
padding: 15px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 5px;
|
|
background-color: #f9f9f9;
|
|
}
|
|
|
|
.details p {
|
|
margin: 10px 0;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.details p strong {
|
|
color: #333;
|
|
}
|
|
|
|
.back-link {
|
|
display: inline-block;
|
|
margin-top: 20px;
|
|
text-decoration: none;
|
|
color: #fff;
|
|
background-color: #007BFF;
|
|
padding: 10px 15px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.back-link:hover {
|
|
background-color: #0056b3;
|
|
}
|
|
|
|
button {
|
|
padding: 10px 20px;
|
|
font-size: 1rem;
|
|
background-color: #007bff;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
transition: 0.3s;
|
|
}
|
|
|
|
button:hover {
|
|
background-color: #0056b3;
|
|
}
|
|
|
|
input {
|
|
padding: 5px;
|
|
font-size: 16px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 5px;
|
|
width: 50%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
input:focus {
|
|
border-color: #007bff;
|
|
outline: none;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<script>
|
|
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
let id = "<?php echo $_GET['id'];?>";
|
|
|
|
// Select all editable elements
|
|
document.querySelectorAll(".editable").forEach((element) => {
|
|
let oldValue = element.value || element.textContent.trim(); // Store initial value
|
|
|
|
element.addEventListener("focus", function () {
|
|
oldValue = this.value || this.textContent.trim(); // Store old value when focused
|
|
});
|
|
|
|
element.addEventListener("blur", function () {
|
|
let newValue = this.value || this.textContent.trim();
|
|
let column = this.getAttribute("data-column");
|
|
|
|
if (newValue !== oldValue) {
|
|
sendUpdate(id, column, oldValue, newValue, element);
|
|
}
|
|
});
|
|
|
|
element.addEventListener("keydown", function (event) {
|
|
if (event.key === "Enter") {
|
|
event.preventDefault(); // Prevent new line
|
|
this.blur(); // Trigger blur event to save changes
|
|
}
|
|
});
|
|
});
|
|
});
|
|
|
|
/**
|
|
* Enables editing for the field
|
|
*/
|
|
function editField(button) {
|
|
let element = button.previousElementSibling;
|
|
if (element.tagName === "INPUT") {
|
|
element.readOnly = false;
|
|
element.focus();
|
|
} else {
|
|
element.contentEditable = true;
|
|
element.focus();
|
|
}
|
|
button.textContent = "Save";
|
|
button.onclick = function() {
|
|
if (element.tagName === "INPUT") {
|
|
element.readOnly = true;
|
|
} else {
|
|
element.contentEditable = false;
|
|
}
|
|
button.textContent = "Edit";
|
|
button.onclick = function() {
|
|
editField(button);
|
|
};
|
|
};
|
|
|
|
element.addEventListener("blur", function () {
|
|
if (element.tagName === "INPUT") {
|
|
element.readOnly = true;
|
|
} else {
|
|
element.contentEditable = false;
|
|
}
|
|
button.textContent = "Edit";
|
|
button.onclick = function() {
|
|
editField(button);
|
|
};
|
|
}, { once: true });
|
|
}
|
|
|
|
/**
|
|
* Sends the updated data to the server
|
|
*/
|
|
function sendUpdate(flightId, column, oldValue, newValue, element) {
|
|
fetch("update_data.php", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/x-www-form-urlencoded" },
|
|
body: `id=${flightId}&column=${encodeURIComponent(column)}&old_value=${encodeURIComponent(oldValue)}&new_value=${encodeURIComponent(newValue)}`
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
console.log(`Updated: ${data.column} changed from '${data.old_value}' to '${data.new_value}'`);
|
|
oldValue = newValue; // ✅ Update oldValue to prevent reverting
|
|
} else {
|
|
alert("Error updating data");
|
|
if (element.tagName === "INPUT") {
|
|
element.value = oldValue; // ❌ Revert ONLY if update fails
|
|
} else {
|
|
element.textContent = oldValue; // ❌ Revert ONLY if update fails
|
|
}
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error("Fetch error:", error);
|
|
if (element.tagName === "INPUT") {
|
|
element.value = oldValue; // ❌ Revert only on network failure
|
|
} else {
|
|
element.textContent = oldValue; // ❌ Revert only on network failure
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
<?php
|
|
include("functions.php");
|
|
require_db_auth();
|
|
|
|
function opCancel() {
|
|
$conn = connectDb();
|
|
$sql = "UPDATE submitted SET status = 'CANCELED' where id = " . $_GET['id'];
|
|
$result = $conn->query($sql);
|
|
logJournal($conn, $_GET['id'], "Marked Canceled");
|
|
$conn->close();
|
|
}
|
|
|
|
function opLanded() {
|
|
|
|
$date = date('Y-m-d');
|
|
$time = urldecode($_GET['time']);
|
|
$landed_dt = $date . ' ' . $time;
|
|
|
|
$conn = connectDb();
|
|
$sql = "UPDATE submitted SET status = 'LANDED', landed_dt = ? WHERE id = ?";
|
|
|
|
$stmt = $conn->prepare($sql);
|
|
$stmt->bind_param("si", $landed_dt, $_GET['id']);
|
|
|
|
$stmt->execute();
|
|
$stmt->close();
|
|
|
|
logJournal($conn, $_GET['id'], "Marked Landed at time " . $time);
|
|
|
|
$conn->close();
|
|
|
|
}
|
|
|
|
function opDeparted() {
|
|
|
|
$date = date('Y-m-d');
|
|
$time = urldecode($_GET['time']);
|
|
$departed_dt = $date . ' ' . $time;
|
|
|
|
$conn = connectDb();
|
|
$sql = "UPDATE submitted SET status = 'DEPARTED', departed_dt = ? WHERE id = ?";
|
|
|
|
$stmt = $conn->prepare($sql);
|
|
$stmt->bind_param("si", $departed_dt, $_GET['id']);
|
|
|
|
$stmt->execute();
|
|
$stmt->close();
|
|
|
|
logJournal($conn, $_GET['id'], "Marked Departed at time " . $time);
|
|
|
|
$conn->close();
|
|
|
|
}
|
|
|
|
function opDelete() {
|
|
$conn = connectDb();
|
|
$sql = "UPDATE submitted SET status = 'DELETED' where id = " . $_GET['id'];
|
|
$result = $conn->query($sql);
|
|
logJournal($conn, $_GET['id'], "Marked Deleted");
|
|
$conn->close();
|
|
}
|
|
|
|
function opDetail() {
|
|
$conn = connectDb();
|
|
$sql = "SELECT * FROM submitted WHERE id = " . $_GET['id'];
|
|
$result = $conn->query($sql);
|
|
|
|
if ($result->num_rows > 0) {
|
|
// Output data of the row
|
|
$row = $result->fetch_assoc();
|
|
echo '<div class="container">';
|
|
echo '<div class="details"><p><strong>Aircraft Reg: </strong>' . $row['ac_reg'] . "</p>";
|
|
echo "<p><strong>Aircraft Type:</strong> " . $row['ac_type'] . "</p>";
|
|
echo "<p><strong>Callsign:</strong> " . $row['ac_call'] . "</p>";
|
|
echo "<p><strong>Captain's Name:</strong> " . $row['captain'] . "</p>";
|
|
echo "<p><strong>Arriving From:</strong> " . $row['in_from'] . "</p>";
|
|
echo "<p><strong>POB IN:</strong> " . $row['pob_in'] . "</p>";
|
|
echo "<p><strong>ETA:</strong> <input type=\"datetime-local\" class=\"editable\" data-column=\"eta\" value=\"" . date('Y-m-d\TH:i', strtotime($row['eta'])) . "\" readonly> <button class=\"edit-button\" onclick=\"editField(this)\">Edit</button></p>";
|
|
|
|
echo "<p><strong>Fuel Required:</strong> " . $row['fuel'] . "</p>";
|
|
|
|
echo "<p><strong>POB OUT:</strong> <input type=\"number\" class=\"editable\" data-column=\"pob_out\" value=\"" . $row['pob_out'] . "\" readonly> <button class=\"edit-button\" onclick=\"editField(this)\">Edit</button></p>";
|
|
echo "<p><strong>Outbound To:</strong> <span class=\"editable\" data-column=\"out_to\">" . $row['out_to'] . "</span> <button class=\"edit-button\" onclick=\"editField(this)\">Edit</button></p>";
|
|
echo "<p><strong>ETD:</strong> <input type=\"datetime-local\" class=\"editable\" data-column=\"etd\" value=\"" . date('Y-m-d\TH:i', strtotime($row['etd'])) . "\" readonly> <button class=\"edit-button\" onclick=\"editField(this)\">Edit</button></p>";
|
|
|
|
echo "<p><strong>Email Address:</strong> " . $row['email'] . "</p>";
|
|
echo "<p><strong>Phone:</strong> " . $row['phone'] . "</p>";
|
|
|
|
echo "<p><strong>Notes:</strong> " . $row['notes'] . "</p>";
|
|
echo "<p><i>PPR created at:</strong> " . $row['submitted_dt'] . " by " . $row['created_by'] . "</p></div>";
|
|
|
|
// Fetch journal entries
|
|
$journalSql = "SELECT * FROM journal WHERE ppr_id = " . $_GET['id'];
|
|
$journalResult = $conn->query($journalSql);
|
|
$journalCount = $journalResult->num_rows;
|
|
|
|
// Add button to toggle journal entries
|
|
echo '<br><button onclick="window.close()">Close Window</button>';
|
|
echo ' <button onclick="toggleJournal()">Show Journal Entries (' . $journalCount . ')</button>';
|
|
echo '<div id="journal-entries" style="display:none;">';
|
|
echo '<h3>Journal Entries</h3>';
|
|
echo '<table class="journal-table">';
|
|
echo '<tr><th>Timestamp</th><th>User</th><th>Entry</th></tr>';
|
|
|
|
if ($journalCount > 0) {
|
|
while ($journalRow = $journalResult->fetch_assoc()) {
|
|
echo '<tr>';
|
|
echo '<td>' . $journalRow['entry_dt'] . '</td>';
|
|
echo '<td>' . $journalRow['user'] . '</td>';
|
|
echo '<td>' . $journalRow['entry'] . '</td>';
|
|
echo '</tr>';
|
|
}
|
|
} else {
|
|
echo '<tr><td colspan="3">No journal entries found.</td></tr>';
|
|
}
|
|
|
|
echo '</table>';
|
|
echo '</div>';
|
|
echo '</div>';
|
|
} else {
|
|
echo "No details found for the given ID.";
|
|
}
|
|
$conn->close();
|
|
}
|
|
|
|
switch($_GET['op']) {
|
|
case "cancel":
|
|
opCancel();
|
|
break;
|
|
case "landed":
|
|
opLanded();
|
|
break;
|
|
case "departed":
|
|
opDeparted();
|
|
break;
|
|
case "delete":
|
|
opDelete();
|
|
break;
|
|
case "detail":
|
|
opDetail();
|
|
break;
|
|
|
|
default:
|
|
|
|
}
|
|
?>
|
|
|
|
<script>
|
|
function toggleJournal() {
|
|
var journalEntries = document.getElementById("journal-entries");
|
|
var toggleButton = document.querySelector("button[onclick='toggleJournal()']");
|
|
if (journalEntries.style.display === "none") {
|
|
journalEntries.style.display = "block";
|
|
toggleButton.textContent = "Hide Journal Entries";
|
|
} else {
|
|
journalEntries.style.display = "none";
|
|
toggleButton.textContent = "Show Journal Entries";
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.journal-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.journal-table th, .journal-table td {
|
|
border: 1px solid #ddd;
|
|
padding: 8px;
|
|
text-align: left;
|
|
}
|
|
|
|
.journal-table th {
|
|
background-color: #f2f2f2;
|
|
color: #333;
|
|
}
|
|
|
|
.journal-table tr:nth-child(even) {
|
|
background-color: #f9f9f9;
|
|
}
|
|
|
|
.journal-table tr:hover {
|
|
background-color: #f1f1f1;
|
|
}
|
|
|
|
.edit-button {
|
|
margin-left: 10px;
|
|
padding: 5px 10px;
|
|
font-size: 0.9rem;
|
|
background-color: #007bff;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 3px;
|
|
cursor: pointer;
|
|
transition: 0.3s;
|
|
}
|
|
|
|
.edit-button:hover {
|
|
background-color: #0056b3;
|
|
}
|
|
</style>
|
|
|