Add order management functionality with order overview, retrieval, and completion features

This commit is contained in:
vista-man
2025-02-27 09:07:20 +01:00
parent 4fdf3510bd
commit 82c987d891
10 changed files with 197 additions and 0 deletions

View File

@@ -0,0 +1,35 @@
<?php
include 'config.php';
// Set header to JSON
header('Content-Type: application/json');
// Get the POST data
$data = json_decode(file_get_contents('php://input'), true);
$order_number = $data['order_number'] ?? '';
if (empty($order_number)) {
echo json_encode(['success' => false, 'message' => 'Order number is required']);
exit;
}
// Delete the order from the database
$sql = "DELETE FROM orders WHERE order_number = ?";
$stmt = $conn->prepare($sql);
if ($stmt === false) {
error_log("Failed to prepare statement: " . $conn->error);
echo json_encode(['success' => false, 'message' => 'Failed to prepare statement']);
exit;
}
$stmt->bind_param("s", $order_number);
if ($stmt->execute()) {
echo json_encode(['success' => true]);
} else {
error_log("Failed to execute statement: " . $stmt->error);
echo json_encode(['success' => false, 'message' => 'Failed to execute statement']);
}
$stmt->close();
$conn->close();
?>

27
website/get_orders.php Normal file
View File

@@ -0,0 +1,27 @@
<?php
include 'config.php';
// Set header to JSON
header('Content-Type: application/json');
// Fetch orders from the database
$sql = "SELECT order_number, items, total_price, order_time FROM orders ORDER BY order_time DESC";
$result = $conn->query($sql);
if ($result === false) {
error_log("Failed to fetch orders: " . $conn->error);
echo json_encode(['error' => 'Failed to fetch orders']);
exit;
}
$orders = [];
while ($row = $result->fetch_assoc()) {
$row['items'] = json_decode($row['items'], true); // Decode the JSON items
$row['total_price'] = (float)$row['total_price']; // Ensure total_price is a number
$orders[] = $row;
}
echo json_encode($orders);
$conn->close();
?>

BIN
website/media/beker.jpeg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

BIN
website/media/bestek.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

BIN
website/media/breaker.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

BIN
website/media/images.jpeg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

BIN
website/media/kwark.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 279 KiB

BIN
website/media/rietjes.jpeg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 KiB

45
website/orders.css Normal file
View File

@@ -0,0 +1,45 @@
body {
font-family: Arial, sans-serif;
background-color: #f9f9f9;
padding: 20px;
text-align: center;
}
h1 {
color: #F56E28;
}
.orders-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
}
.order {
background-color: white;
border: 2px solid #F56E28;
border-radius: 10px;
padding: 20px;
width: 300px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
text-align: left;
}
.order h2 {
margin-top: 0;
color: #F56E28;
}
.order p {
margin: 5px 0;
}
.order ul {
list-style-type: none;
padding: 0;
}
.order li {
margin: 5px 0;
}

90
website/orders.html Normal file
View File

@@ -0,0 +1,90 @@
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bestellingen Overzicht</title>
<link rel="stylesheet" href="orders.css">
</head>
<body>
<h1>Bestellingen Overzicht</h1>
<div id="orders-container" class="orders-container">
<!-- Orders will be dynamically inserted here -->
</div>
<script>
function fetchOrders() {
fetch('get_orders.php')
.then(response => response.json())
.then(orders => {
const ordersContainer = document.getElementById('orders-container');
ordersContainer.innerHTML = ''; // Clear existing orders
orders.forEach(order => {
const orderElement = document.createElement('div');
orderElement.classList.add('order');
const orderNumber = document.createElement('h2');
orderNumber.innerText = `Order ${order.order_number}`;
orderElement.appendChild(orderNumber);
const orderTime = document.createElement('p');
orderTime.innerText = `Tijd: ${order.order_time}`;
orderElement.appendChild(orderTime);
const itemsList = document.createElement('ul');
order.items.forEach(item => {
const itemElement = document.createElement('li');
itemElement.innerText = `${item.title} - €${item.price.toFixed(2)}`;
itemsList.appendChild(itemElement);
});
orderElement.appendChild(itemsList);
const totalPrice = document.createElement('p');
totalPrice.innerText = `Totaal: €${Number(order.total_price).toFixed(2)}`;
orderElement.appendChild(totalPrice);
const completeCheckbox = document.createElement('input');
completeCheckbox.type = 'checkbox';
completeCheckbox.id = `complete-${order.order_number}`;
completeCheckbox.addEventListener('change', () => completeOrder(order.order_number));
const completeLabel = document.createElement('label');
completeLabel.htmlFor = `complete-${order.order_number}`;
completeLabel.innerText = 'Complete';
orderElement.appendChild(completeCheckbox);
orderElement.appendChild(completeLabel);
ordersContainer.appendChild(orderElement);
});
})
.catch(error => console.error('Error fetching orders:', error));
}
function completeOrder(orderNumber) {
fetch('complete_order.php', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ order_number: orderNumber })
})
.then(response => response.json())
.then(data => {
if (data.success) {
fetchOrders(); // Refresh the orders list
} else {
alert('Failed to complete order');
}
})
.catch(error => console.error('Error completing order:', error));
}
// Fetch orders every 5 seconds
setInterval(fetchOrders, 5000);
fetchOrders(); // Initial fetch
</script>
</body>
</html>