- WIP: order system to save orders and display them to the buyer

- fixed an error so the summary of an order can now be shown but is still empty
This commit is contained in:
Fabian 2025-04-27 19:28:26 +02:00
parent 60f056b8ec
commit c9c0608898
3 changed files with 53 additions and 51 deletions

View File

@ -45,6 +45,10 @@
</main>
<script>
if(sessionStorage.getItem('user_id')){
document.getElementById('KundenNr').value = sessionStorage.getItem('user_id')
}
document.getElementById('sendOrder').addEventListener('click', async (event) => {
event.preventDefault(); // Verhindert das Standardformularverhalten
@ -66,7 +70,7 @@
if (response.ok) {
alert('Bestellung erfolgreich!');
//window.location.href = '/bestellung.html'; // Weiterleitung zur Bestellübersicht
window.location.href = '/bestellung'; // Weiterleitung zur Bestellübersicht
} else {
alert('Fehler bei der Bestellung: ' + result.message);
}

View File

@ -1,65 +1,63 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ihre Bestellung</title>
<link rel="stylesheet" href="/Styles/bestellung/bestellung.css">
<link rel="stylesheet" href="/Styles/styles-main.css">
<script src="/header_footer"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ihre Bestellung</title>
<link rel="stylesheet" href="/Styles/bestellung/bestellung.css">
<link rel="stylesheet" href="/Styles/styles-main.css">
<script src="/header_footer"></script>
</head>
<body>
<!-- Header wird hier dynamisch geladen -->
<div id="header-placeholder"></div>
<main>
<main>
<h2>Ihre Bestellung:</h2>
<div id="bestellung">
<!-- Platzhalter für die Bestellinformationen -->
<div class="bestell-info-card">
<p><strong>Kundennummer:</strong> <span id="kundenNr"></span></p>
<p><strong>Produkt-ID:</strong> <span id="produktId"></span></p>
<p><strong>Produktname:</strong> <span id="produktName"></span></p>
<p><strong>Preis:</strong> <span id="preis"></span></p>
</div>
<!-- Platzhalter für die Bestellinformationen -->
<div class="bestell-info-card">
<p><strong>Kundennummer:</strong> <span id="kundenNr"></span></p>
<p><strong>Produkt-ID:</strong> <span id="produktId"></span></p>
<p><strong>Produktname:</strong> <span id="produktName"></span></p>
<p><strong>Preis:</strong> <span id="preis"></span></p>
</div>
</div>
</main>
</main>
<script>
async function ladeBestellung() {
const user_id = sessionStorage.getItem('user_id')
console.log('User ID: ', user_id)
if (!user_id){
console.log("is null")
alert('Sie sind nicht eingeloggt! Bitte loggen sie sich ein damit diese Seite angezeigt werden kann.')
window.location.href = '/login'
} else if (user_id <= 1) {
try {
const response = await fetch('/api/bestellung/daten', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(user_id)
})
async function ladeBestellung() {
const user_id = sessionStorage.getItem('user_id')
if (!user_id) {
alert('Sie sind nicht eingeloggt! Bitte loggen sie sich ein damit diese Seite angezeigt werden kann.')
window.location.href = '/login'
} else if (user_id >= 1) {
try {
const response = await fetch('/api/bestellung/daten', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({user_id: user_id})
})
if (response.ok) {
const data = await response.json();
console.log(data)
document.getElementById('kundenNr').textContent = user_id
document.getElementById('produktId').textContent = data.product_id
//document.getElementById('produktName').textContent = data.
document.getElementById('preis').textContent = data.total + ' €'
} else {
console.error('Fehler beim Laden der Bestelldaten.');
if (response.ok) {
const data = await response.json();
console.log(data)
document.getElementById('kundenNr').textContent = user_id
//document.getElementById('produktId').textContent = data.product_id
//document.getElementById('produktName').textContent = data.
document.getElementById('preis').textContent = data.total + ' €'
} else {
console.error('Fehler beim Laden der Bestelldaten.');
}
} catch (error) {
console.error('Fehler: ', error);
}
}
} catch (error) {
console.error('Fehler: ', error);
}
}
}
window.addEventListener('DOMContentLoaded', ladeBestellung);
window.addEventListener('DOMContentLoaded', ladeBestellung);
</script>
<!-- Footer wird dynamisch geladen -->

View File

@ -130,7 +130,7 @@ app.get('/api/products/sportwagen', async (req, res) => {
app.post('/api/user/registration', (req, res) => {
// SQL-Query für Nutzerregistration
const {name, lower_name, email, passwd} = req.body;
const sql = "INSERT INTO user (name, lower_name, email, passwd, passwd_hash_algo) VALUES (?, ?, ?, ?, 'none')"
const sql = "INSERT INTO webshop.user (name, lower_name, email, passwd, passwd_hash_algo) VALUES (?, ?, ?, ?, 'none')"
// Query abschicken
db.query(sql, [name, lower_name, email, passwd], (err, results) => {
@ -172,8 +172,8 @@ app.post('/api/bestellung', (req, res) => {
const {user_id, product_id} = req.body;
const sql1 = 'INSERT INTO order_details (, user_id, payment_id, total) VALUES (?, null, null)'
const sql2 = 'INSERT INTO order_items (user_id, product_id, quantity, order_id) VALUES (?, ?, 1, ?)';
const sql1 = 'INSERT INTO webshop.order_details (user_id, payment_id, total) VALUES (?, 1, 0)'
const sql2 = 'INSERT INTO webshop.order_items (user_id, product_id, quantity, order_id) VALUES (?, ?, 1, ?)';
db.query(sql1, [user_id, 1, 100.00], (err1, result1) => {
if (err1) {
@ -190,11 +190,11 @@ app.post('/api/bestellung', (req, res) => {
});
});
app.get('/api/bestellung/daten', (req, res) => {
app.post('/api/bestellung/daten', (req, res) => {
const user_id = req.body;
const sql = 'SELECT oi.user_id, oi.product_id, p.product_name, p.price FROM order_items oi INNER JOIN product p ON oi.product_id = p.id WHERE user_id = ? '
const sql = 'SELECT oi.user_id, oi.product_id, p.name AS product_name, p.price FROM order_items oi INNER JOIN product p ON oi.product_id = p.id WHERE oi.user_id = ? '
db.query(sql, [user_id], (err, results) => {
if (err) {
console.error('Fehler beim Abrufen der Bestellung: ', err);