jamesp/ppr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Working

Browse Source
This commit is contained in:
James Pattinson
2025-03-14 18:52:35 +00:00
parent f0d26295d8
commit a8d87582c9
2 changed files with 68 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
action.php
View File

@@ -33,6 +33,10 @@
background-color: #f9f9f9; background-color: #f9f9f9;
} }
.details th {
text-align: right; /* Justify table headings to the right */
}
.details p { .details p {
margin: 10px 0; margin: 10px 0;
font-size: 16px; font-size: 16px;
@@ -71,12 +75,12 @@
background-color: #0056b3; background-color: #0056b3;
} }
input { .editable {
padding: 5px; padding: 5px;
font-size: 16px; font-size: 16px;
border: 1px solid #ddd; border: 1px solid #ddd;
border-radius: 5px; border-radius: 5px;
width: 50%; width: 90%;
box-sizing: border-box; box-sizing: border-box;
} }
@@ -85,6 +89,25 @@
outline: none; outline: none;
} }
.edit-button {
margin-left: 10px;
padding: 5px 10px;
font-size: 0.9rem;
background-color: transparent;
border: none;
cursor: pointer;
transition: 0.3s;
}
.edit-button img {
width: 20px;
height: 20px;
}
.edit-button:hover img {
filter: brightness(0.8);
}
</style> </style>
</head> </head>
<body> <body>
@@ -117,13 +140,20 @@ document.addEventListener("DOMContentLoaded", function () {
} }
}); });
}); });
// Select all edit buttons
document.querySelectorAll(".edit-button").forEach((button) => {
button.addEventListener("click", function () {
editField(button);
});
});
}); });
/** /**
* Enables editing for the field * Enables editing for the field
*/ */
function editField(button) { function editField(button) {
let element = button.previousElementSibling; let element = button.parentElement.nextElementSibling.firstElementChild;
if (element.tagName === "INPUT") { if (element.tagName === "INPUT") {
element.readOnly = false; element.readOnly = false;
element.focus(); element.focus();
@@ -131,18 +161,6 @@ function editField(button) {
element.contentEditable = true; element.contentEditable = true;
element.focus(); 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 () { element.addEventListener("blur", function () {
if (element.tagName === "INPUT") { if (element.tagName === "INPUT") {
@@ -150,10 +168,6 @@ function editField(button) {
} else { } else {
element.contentEditable = false; element.contentEditable = false;
} }
button.textContent = "Edit";
button.onclick = function() {
editField(button);
};
}, { once: true }); }, { once: true });
} }
@@ -266,28 +280,26 @@ function opDetail() {
// Output data of the row // Output data of the row
$row = $result->fetch_assoc(); $row = $result->fetch_assoc();
echo '<div class="container">'; echo '<div class="container">';
echo '<div class="details"><p><strong>Aircraft Reg: </strong>' . $row['ac_reg'] . "</p>"; echo '<table class="details">';
echo "<p><strong>Aircraft Type:</strong> " . $row['ac_type'] . "</p>"; echo '<tr><th>Aircraft Reg:</th><td></td><td>' . $row['ac_reg'] . '</td></tr>';
echo "<p><strong>Callsign:</strong> " . $row['ac_call'] . "</p>"; echo '<tr><th>Aircraft Type:</th><td></td><td>' . $row['ac_type'] . '</td></tr>';
echo "<p><strong>Captain's Name:</strong> " . $row['captain'] . "</p>"; echo '<tr><th>Callsign:</th><td></td><td>' . $row['ac_call'] . '</td></tr>';
echo "<p><strong>Arriving From:</strong> " . $row['in_from'] . "</p>"; echo '<tr><th>Captain\'s Name:</th><td></td><td>' . $row['captain'] . '</td></tr>';
echo "<p><strong>POB IN:</strong> " . $row['pob_in'] . "</p>"; echo '<tr><th>Arriving From:</th><td><button class="edit-button" onclick="editField(this)"><img src="edit.png" alt="Edit"></button></td><td><span class="editable" data-column="in_from">' . $row['in_from'] . '</span></td></tr>';
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 '<tr><th>POB IN:</th><td></td><td>' . $row['pob_in'] . '</td></tr>';
echo '<tr><th>ETA:</th><td><button class="edit-button" onclick="editField(this)"><img src="edit.png" alt="Edit"></button></td><td><input type="datetime-local" class="editable" data-column="eta" value="' . date('Y-m-d\TH:i', strtotime($row['eta'])) . '" readonly></td></tr>';
echo "<p><strong>Fuel Required:</strong> " . $row['fuel'] . "</p>"; echo '<tr><th>Fuel Required:</th><td></td><td>' . $row['fuel'] . '</td></tr>';
echo '<tr><th>POB OUT:</th><td><button class="edit-button" onclick="editField(this)"><img src="edit.png" alt="Edit"></button></td><td><input type="number" class="editable" data-column="pob_out" value="' . $row['pob_out'] . '" readonly></td></tr>';
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 '<tr><th>Outbound To:</th><td><button class="edit-button" onclick="editField(this)"><img src="edit.png" alt="Edit"></button></td><td><span class="editable" data-column="out_to">' . $row['out_to'] . '</span></td></tr>';
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 '<tr><th>ETD:</th><td><button class="edit-button" onclick="editField(this)"><img src="edit.png" alt="Edit"></button></td><td><input type="datetime-local" class="editable" data-column="etd" value="' . date('Y-m-d\TH:i', strtotime($row['etd'])) . '" readonly></td></tr>';
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 '<tr><th>Email Address:</th><td></td><td>' . $row['email'] . '</td></tr>';
echo '<tr><th>Phone:</th><td></td><td>' . $row['phone'] . '</td></tr>';
echo "<p><strong>Email Address:</strong> " . $row['email'] . "</p>"; echo '<tr><th>Notes:</th><td></td><td>' . $row['notes'] . '</td></tr>';
echo "<p><strong>Phone:</strong> " . $row['phone'] . "</p>"; echo '<tr><th>PPR created at:</th><td></td><td>' . $row['submitted_dt'] . ' by ' . $row['created_by'] . '</td></tr>';
echo '</table>';
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 // Fetch journal entries
$journalSql = "SELECT * FROM journal WHERE ppr_id = " . $_GET['id']; $journalSql = "SELECT * FROM journal WHERE ppr_id = " . $_GET['id'] . " ORDER BY id DESC";
$journalResult = $conn->query($journalSql); $journalResult = $conn->query($journalSql);
$journalCount = $journalResult->num_rows; $journalCount = $journalResult->num_rows;
@@ -386,16 +398,28 @@ function toggleJournal() {
margin-left: 10px; margin-left: 10px;
padding: 5px 10px; padding: 5px 10px;
font-size: 0.9rem; font-size: 0.9rem;
background-color: #007bff; background-color: transparent;
color: white;
border: none; border: none;
border-radius: 3px;
cursor: pointer; cursor: pointer;
transition: 0.3s; transition: 0.3s;
} }
.edit-button:hover { .edit-button img {
background-color: #0056b3; width: 20px;
height: 20px;
}
.edit-button:hover img {
filter: brightness(0.8);
}
.editable {
background-color: transparent;
transition: background-color 0.3s ease;
}
.editable:focus {
background-color: white;
} }
</style> </style>

BIN
edit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB