📚 Σκοπός της Εργασίας

Δημιουργία συστήματος καταστήματος με 3 πίνακες βάσης δεδομένων. Θα εφαρμόσετε τις γνώσεις από τις ενότητες 1-5 για να δημιουργήσετε μια πλήρη web εφαρμογή.

🎯 Θέμα: Σύστημα Καταστήματος

🎯 Τι θα δημιουργήσετε (3 Σελίδες)

welcome.html: Καλωσόρισμα με JavaScript + φόρμα παραγγελίας
process_order.php: Επεξεργασία παραγγελίας + αποθήκευση στη βάση
view_orders.php: Εμφάνιση όλων των παραγγελιών

📊 Δομή Βάσης Δεδομένων (3 Πίνακες)

📦 products

🔑 id
📝 name
💰 price

👤 customers

🔑 id
📝 name
📧 email

🛒 orders

🔑 id
👤 customer_id
📦 product_id
🔢 quantity
💵 total_price

📋 Μέρος 1: Βάση Δεδομένων

Βήμα 1α: Δημιουργία Βάσης

Ανοίξτε phpMyAdmin: http://localhost/phpmyadmin
Δημιουργήστε νέα βάση με όνομα: shop_db
Επιλέξτε Collation: utf8mb4_general_ci

Βήμα 1β: Δημιουργία Πινάκων

Πίνακας 1: products

Πεδίο	Type	Length	Index	A_I
id	INT	-	PRIMARY	✓
name	VARCHAR	100	-
price	DECIMAL	10,2	-

📝 Προσθέστε Προϊόντα

Στην καρτέλα "Insert", προσθέστε 5 προϊόντα της επιλογής σας (π.χ. Laptop, Ποντίκι, Πληκτρολόγιο, Οθόνη, Ηχεία)

Πίνακας 2: customers

Πεδίο	Type	Length	Index	A_I
id	INT	-	PRIMARY	✓
name	VARCHAR	100	-
email	VARCHAR	100	-

Πίνακας 3: orders

Πεδίο	Type	Length	Index	A_I
id	INT	-	PRIMARY	✓
customer_id	INT	-	-
product_id	INT	-	-
quantity	INT	-	-
total_price	DECIMAL	10,2	-

📋 Μέρος 2: welcome.html

Τι πρέπει να έχει το welcome.html:

🔹 Α' Μέρος: HTML

Τίτλος σελίδας: "Κατάστημα"
Header με το όνομα του καταστήματος
Μια φόρμα με method="POST" και action="process_order.php"

🔹 Β' Μέρος: Η Φόρμα

Η φόρμα πρέπει να έχει τα εξής πεδία:

Όνομα Πελάτη: <input type="text" name="customer_name" required>
Email: <input type="email" name="customer_email" required>
Επιλογή Προϊόντος: <select name="product_id"> με 5 options (ένα για κάθε προϊόν)
Ποσότητα: <input type="number" name="quantity" value="1" min="1">
Checkbox Μέλος: <input type="checkbox" name="is_member" value="yes">
Κουμπί Submit: <button type="submit">Ολοκλήρωση</button>

💡 Hint για το dropdown:

Κάθε <option> πρέπει να έχει value ίσο με το ID του προϊόντος (1, 2, 3, 4, 5) και το text να είναι το όνομα και η τιμή του προϊόντος.

🔹 Γ' Μέρος: JavaScript

Προσθέστε στο τέλος του <body>:

Ένα alert() με μήνυμα καλωσορίσματος
Ένα prompt() που ρωτάει το όνομα του χρήστη
Ένα άλλο alert() που λέει "Γεια σου [όνομα]!"

🔹 Δ' Μέρος: CSS

Προσθέστε CSS για να κάνετε τη φόρμα όμορφη (χρώματα, padding, borders, κλπ)

📋 Μέρος 3: process_order.php

Τι πρέπει να κάνει το process_order.php:

🔹 Βήμα 1: Σύνδεση με Βάση

💡 Hint:

Χρησιμοποιήστε new mysqli() με τα στοιχεία:

servername: "localhost"
username: "root"
password: ""
database: "shop_db"

Μην ξεχάσετε να κάνετε έλεγχο για connect_error

🔹 Βήμα 2: Λήψη Δεδομένων

Πάρτε τα δεδομένα από τη φόρμα χρησιμοποιώντας $_POST:

$_POST["customer_name"]
$_POST["customer_email"]
$_POST["product_id"]
$_POST["quantity"]
Για το checkbox, χρησιμοποιήστε isset($_POST["is_member"])

🔹 Βήμα 3: SELECT για την τιμή του προϊόντος

Κάντε ένα SELECT query για να πάρετε τα στοιχεία του προϊόντος από τον πίνακα products:

💡 Hint:

Φτιάξτε το query: "SELECT * FROM products WHERE id = $product_id"

Εκτελέστε το με: $conn->query($sql)

Ελέγξτε αν υπάρχουν αποτελέσματα: $result->num_rows > 0

Πάρτε τα δεδομένα: $row = $result->fetch_assoc()

🔹 Βήμα 4: Υπολογισμοί

Υπολογίστε το σύνολο: τιμή × ποσότητα
Αν είναι μέλος, υπολογίστε έκπτωση 10%
Υπολογίστε το τελικό ποσό

🔹 Βήμα 5: INSERT στον πίνακα customers

Αποθηκεύστε τον πελάτη στη βάση:

💡 Hint:

Φτιάξτε το query: "INSERT INTO customers (name, email) VALUES ('$customer_name', '$customer_email')"

Εκτελέστε και πάρτε το ID: $customer_id = $conn->insert_id

🔹 Βήμα 6: INSERT στον πίνακα orders

Αποθηκεύστε την παραγγελία:

💡 Hint:

Χρειάζεστε: customer_id, product_id, quantity, total_price (το τελικό ποσό)

🔹 Βήμα 7: Εμφάνιση Αποτελεσμάτων

Δημιουργήστε μια όμορφη σελίδα HTML που δείχνει:

Μήνυμα επιτυχίας
Στοιχεία πελάτη
Στοιχεία παραγγελίας (προϊόν, ποσότητα, τιμές)
Link για νέα παραγγελία
Link για προβολή παραγγελιών

💡 Hint για HTML εντός PHP:

Μπορείτε να κάνετε echo HTML κώδικα ή να κλείσετε το PHP tag και να γράψετε κανονικό HTML

📋 Μέρος 4: view_orders.php

Τι πρέπει να κάνει το view_orders.php:

🔹 Βήμα 1: Σύνδεση με Βάση

Όπως στο process_order.php

🔹 Βήμα 2: SELECT όλων των παραγγελιών

💡 Hint:

Query: "SELECT * FROM orders ORDER BY id DESC"

Το ORDER BY id DESC δείχνει τις νεότερες πρώτα

🔹 Βήμα 3: Εμφάνιση σε πίνακα HTML

Δημιουργήστε έναν HTML πίνακα με:

Headers: ID Παραγγελίας, ID Πελάτη, ID Προϊόντος, Ποσότητα, Τελικό Ποσό
Loop με while($row = $result->fetch_assoc())
Για κάθε row, εμφανίστε τα δεδομένα

💡 Hint για το loop:

Μέσα στο while, κάντε echo τις γραμμές του πίνακα

Για το τελικό ποσό, χρησιμοποιήστε number_format($row["total_price"], 2)

🔹 Βήμα 4: CSS & Link

Προσθέστε CSS για τον πίνακα
Προσθέστε link για νέα παραγγελία

📊 Κριτήρια Αξιολόγησης

Κριτήριο	Μοριοδότηση	Τι ελέγχεται
HTML Δομή & Forms	15%	Σωστή δομή, σωστά attributes στη φόρμα
CSS Styling	10%	Όμορφη εμφάνιση, καλή οργάνωση
JavaScript	10%	Λειτουργία alert/prompt
SELECT Query	15%	Σωστό query, χρήση fetch_assoc()
INSERT Queries	25%	Σωστή αποθήκευση σε 2 πίνακες
PHP Logic	15%	Υπολογισμοί, χρήση $_POST
Λειτουργικότητα	10%	Όλα λειτουργούν σωστά

📦 Παραδοτέα

✅ Τι πρέπει να παραδώσετε:

welcome.html - Φόρμα παραγγελίας
process_order.php - Επεξεργασία & αποθήκευση
view_orders.php - Εμφάνιση παραγγελιών
database_export.sql - Export της βάσης από phpMyAdmin
screenshots/ - 3 screenshots:
- Πίνακας products με προϊόντα
- Πίνακας customers με δοκιμαστικά δεδομένα
- Πίνακας orders με παραγγελίες

💡 Σειρά Εργασίας - Πώς να ξεκινήσετε:

Δημιουργήστε τη βάση shop_db
Δημιουργήστε τους 3 πίνακες
Προσθέστε 5 προϊόντα στον πίνακα products
Αρχίστε με το welcome.html (πιο εύκολο)
Συνεχίστε με το process_order.php (πιο δύσκολο)
Τελειώστε με το view_orders.php
Δοκιμάστε 2-3 παραγγελίες
Τραβήξτε screenshots
Κάντε export τη βάση

📚 Χρήσιμα Παραδείγματα από τις Σημειώσεις

Που θα βρείτε βοήθεια:

Ενότητα 1: HTML Forms
Ενότητα 2: CSS Styling
Ενότητα 3: JavaScript (alert, prompt)
Ενότητα 4: PHP με $_POST, mysqli, SELECT, INSERT, fetch_assoc()
Ενότητα 5: phpMyAdmin, δημιουργία πινάκων

❓ Συχνές Ερωτήσεις

Ε: Πώς παίρνω την τιμή από το dropdown;

Α: $product_id = $_POST["product_id"];

Ε: Πώς ελέγχω αν το checkbox είναι checked;

Α: if (isset($_POST["is_member"])) { ... }

Ε: Πώς κάνω loop στα αποτελέσματα του SELECT;

Α: while ($row = $result->fetch_assoc()) { ... }

Ε: Πώς παίρνω το ID που μόλις έκανα INSERT;

Α: $id = $conn->insert_id;

Ε: Πώς κάνω export τη βάση;

Α: phpMyAdmin → Επιλέξτε τη βάση → "Export" → "Go"

📚 Σκοπός της Εργασίας

🎯 Θέμα: Σύστημα Καταστήματος

🎯 Τι θα δημιουργήσετε (3 Σελίδες)

📊 Δομή Βάσης Δεδομένων (3 Πίνακες)

📦 products

👤 customers

🛒 orders

📋 Μέρος 1: Βάση Δεδομένων

Βήμα 1α: Δημιουργία Βάσης

Βήμα 1β: Δημιουργία Πινάκων

Πίνακας 1: products

📝 Προσθέστε Προϊόντα

Πίνακας 2: customers

Πίνακας 3: orders

📋 Μέρος 2: welcome.html

Τι πρέπει να έχει το welcome.html:

🔹 Α' Μέρος: HTML

🔹 Β' Μέρος: Η Φόρμα

💡 Hint για το dropdown:

🔹 Γ' Μέρος: JavaScript

🔹 Δ' Μέρος: CSS

📋 Μέρος 3: process_order.php

Τι πρέπει να κάνει το process_order.php:

🔹 Βήμα 1: Σύνδεση με Βάση

💡 Hint:

🔹 Βήμα 2: Λήψη Δεδομένων

🔹 Βήμα 3: SELECT για την τιμή του προϊόντος

💡 Hint:

🔹 Βήμα 4: Υπολογισμοί

🔹 Βήμα 5: INSERT στον πίνακα customers

💡 Hint:

🔹 Βήμα 6: INSERT στον πίνακα orders

💡 Hint:

🔹 Βήμα 7: Εμφάνιση Αποτελεσμάτων

💡 Hint για HTML εντός PHP:

📋 Μέρος 4: view_orders.php

Τι πρέπει να κάνει το view_orders.php:

🔹 Βήμα 1: Σύνδεση με Βάση

🔹 Βήμα 2: SELECT όλων των παραγγελιών

💡 Hint:

🔹 Βήμα 3: Εμφάνιση σε πίνακα HTML

💡 Hint για το loop:

🔹 Βήμα 4: CSS & Link

📊 Κριτήρια Αξιολόγησης

📦 Παραδοτέα

✅ Τι πρέπει να παραδώσετε:

💡 Σειρά Εργασίας - Πώς να ξεκινήσετε:

📚 Χρήσιμα Παραδείγματα από τις Σημειώσεις

Που θα βρείτε βοήθεια:

❓ Συχνές Ερωτήσεις

Ε: Πώς παίρνω την τιμή από το dropdown;

Ε: Πώς ελέγχω αν το checkbox είναι checked;

Ε: Πώς κάνω loop στα αποτελέσματα του SELECT;

Ε: Πώς παίρνω το ID που μόλις έκανα INSERT;

Ε: Πώς κάνω export τη βάση;

🎉 Καλή Επιτυχία!