- WIP: reworked the order function and added error handling for it

- added a function to save the user_id in the sessionStorage of the browser
This commit is contained in:
Fabian 2025-04-26 19:23:04 +02:00
parent c5ef5d49c0
commit 40e5db6551
5 changed files with 100 additions and 91 deletions

View File

@ -36,19 +36,16 @@
<label for="ort">Ort:</label> <label for="ort">Ort:</label>
<input type="text" id="ort" name="ort" required placeholder="Ort"> <input type="text" id="ort" name="ort" required placeholder="Ort">
<label for="telefon Nr">Telefon Nr (optional):</label>
<input type="tel" id="telefon Nr" name="telefon" placeholder="Telefon Nr">
<label for="ArtikelNr">Artikel Nr.:</label> <label for="ArtikelNr">Artikel Nr.:</label>
<textarea id="ArtikelNr" name="ArtikelNr" rows="4" required placeholder="Artikel Nr."></textarea> <textarea id="ArtikelNr" name="ArtikelNr" rows="4" required placeholder="Artikel Nr."></textarea>
<a href="/bestellung" class="button-submit" id="bestellformular">Bestellung absenden</a> <a href="/bestellung" class="button-submit" id="sendOrder">Bestellung absenden</a>
</form> </form>
</div> </div>
</main> </main>
<script> <script>
document.getElementById('bestellform').addEventListener('bestellformular', async (event) => { document.getElementById('bestellform').addEventListener('sendOrder', async (event) => {
event.preventDefault(); // Verhindert das Standardformularverhalten event.preventDefault(); // Verhindert das Standardformularverhalten
const userId = document.getElementById('KundenNr').value; const userId = document.getElementById('KundenNr').value;

View File

@ -27,17 +27,27 @@
<script> <script>
async function ladeBestellung() { 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.')
} else if (user_id <= 1) {
try { try {
const response = await fetch('/api/bestellung/daten'); const response = await fetch('/api/bestellung/daten', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(user_id)
})
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
document.getElementById('kundenNr').textContent = user_id
document.getElementById('kundenNr').textContent = data.kundenNr; document.getElementById('produktId').textContent = data.product_id
document.getElementById('produktId').textContent = data.artikelNr; //document.getElementById('produktName').textContent = data.
document.getElementById('produktName').textContent = data.produktName; document.getElementById('preis').textContent = data.total + ' €'
document.getElementById('preis').textContent = data.preis + ' €';
} else { } else {
console.error('Fehler beim Laden der Bestelldaten.'); console.error('Fehler beim Laden der Bestelldaten.');
} }
@ -45,6 +55,7 @@
console.error('Fehler: ', error); console.error('Fehler: ', error);
} }
} }
}
window.addEventListener('DOMContentLoaded', ladeBestellung); window.addEventListener('DOMContentLoaded', ladeBestellung);
</script> </script>

View File

@ -37,8 +37,8 @@
document.getElementById('submit').addEventListener('click', async (event) => { document.getElementById('submit').addEventListener('click', async (event) => {
event.preventDefault() event.preventDefault()
const email = document.getElementById('email').value; const email = document.getElementById('email').value
const password = document.getElementById('password').value; const password = document.getElementById('password').value
try { try {
const response = await fetch('/api/user/login', { const response = await fetch('/api/user/login', {
@ -50,6 +50,7 @@
}) })
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
sessionStorage.setItem("user_id", data.id)
alert('Login erfolgreich!'); alert('Login erfolgreich!');
window.location.href = '/'; // Redirect to home page after login window.location.href = '/'; // Redirect to home page after login
} else { } else {

View File

@ -75,6 +75,7 @@
}) })
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
sessionStorage.setItem("user_id", data.id)
alert('Nutzer erfolgreich hinzugefügt! Ihre Kundennummer: ' + data.id) alert('Nutzer erfolgreich hinzugefügt! Ihre Kundennummer: ' + data.id)
} else { } else {
alert('Fehler bei der Registrierung.') alert('Fehler bei der Registrierung.')

View File

@ -169,27 +169,26 @@ app.post('/api/user/login', (req, res) => {
}) })
app.post('/api/bestellung', (req, res) => { app.post('/api/bestellung', (req, res) => {
const { userId, productId} = req.body;
// 1. Produktpreis holen const { user_id, product_id} = req.body;
const productSql = 'SELECT price FROM product WHERE productId = ?'; const sql = 'INSERT INTO order_items (user_id, product_id, quantity) VALUES (?, ?, 1)'
const producNameSql = 'SELECT name FROM product WHERE productId = ?';
db.query(productSql, [productId], (err, productResults) => {
if (err || productResults.length === 0) { db.query(sql, [user_id, product_id], (err, results) => {
if (err || results.length === 0) {
console.error('Fehler beim Abrufen des Produkts: ', err); console.error('Fehler beim Abrufen des Produkts: ', err);
return res.status(500).json({ message: 'Produkt nicht gefunden oder Serverfehler' }); return res.status(500).json({ message: 'Produkt nicht gefunden oder Serverfehler' });
} }
res.status(201).json({message: 'Produkt bestellt', id: results.insertId})
const productPrice = productResults[0].price;
}); });
}); });
app.get('/api/bestellung/daten', (req, res) => { app.get('/api/bestellung/daten', (req, res) => {
const user_id = req.body;
db.query(sql, [userId], (err, results) => { const sql = 'SELECT * FROM order_items WHERE user_id = ? '
db.query(sql, [user_id], (err, results) => {
if (err) { if (err) {
console.error('Fehler beim Abrufen der Bestellung: ', err); console.error('Fehler beim Abrufen der Bestellung: ', err);
return res.status(500).json({ message: 'Fehler beim Abrufen der Bestellung' }); return res.status(500).json({ message: 'Fehler beim Abrufen der Bestellung' });