🍽️ DineBook — คู่มือฉบับสมบูรณ์
Live URL: https://codehub.sj88ai.com/dinebook/
Source: /workspace/dinebook/index.html (65KB, 2,200+ lines)
Version: v1.0
Color: Orange #f97316
Category: Booking & Reservation
📋 Overview
DineBook เป็นระบบจองโต๊ะร้านอาหาร พร้อม visual floor plan ที่แสดงโซน VIP/Main/Outdoor อย่างชัดเจน เลือกได้ 24 โต๊ะ พร้อมเมนูแนะนำ + รีวิว + PromptPay
✨ Features
| Feature |
Description |
| 🍽️ 10 ร้านอาหาร |
ซูชิ, ซีฟู้ด, ไทย, อิตาเลียน, BBQ, สเต๊ก, คาเฟ่, ส้มตำ, มังสวิรัติ, ของหวาน |
| 🪑 Visual Floor Plan |
24 โต๊ะ 3 โซน: VIP (1-8), Main (9-16), Outdoor (17-24) |
| ⏰ 20 Time Slots |
11:00-22:00 ทุก 30 นาที |
| 👥 Guest Capacity |
1-12 คน |
| ❤️ Wishlist |
บันทึกร้านโปรด |
| 📜 Menu Catalog |
เมนูแนะนำในแต่ละร้าน |
| ⭐ Reviews |
รีวิว 5 ดาว |
| 💳 PromptPay |
ชำระค่ามัดจำ 200 บาท/ท่าน |
| 📊 Owner Dashboard |
สถิติ + bar chart + heatmap |
🛠️ User Guide
1. การจองโต๊ะ
- เปิด https://codehub.sj88ai.com/dinebook/
- เลือกประเภทอาหาร (Sushi/Thai/BBQ/...) จาก category tiles
- คลิกที่การ์ดร้าน → เปิด modal
- ดูเมนู + รีวิว + เลือก "จองโต๊ะทันที"
- เลือก: วันที่ + จำนวนคน + เวลา + โต๊ะ
- กรอก special request
- ยืนยัน → PromptPay 200฿/ท่าน
2. Floor Plan Walkthrough
- 🟡 สีเหลือง = VIP (1-8) - หรูหรา
- ⚪ สีขาว = โซนหลัก (9-16) - ธรรมดา
- 🟢 สีเขียว = ระเบียง (17-24) - แอร์ open-air
- ❌ ขีดฆ่า = ไม่ว่าง
- Capacity แสดงใต้โต๊ะ: 2p/4p/6p
💻 Code Structure
RESTAURANTS = [
{id, name, cuisine, emoji, bg, rating, price, menu:[{cat, items:[{name,price,desc}]}]},
... 10 items
];
MY_RESERVATIONS = [
{id, restId, date, time, guests, table, status, total},
... 5 mock
];
// Key functions
renderRestaurants(filter)
openRest(id) // opens detail modal
openBooking(id) // opens booking modal
selectTable(id)
selectTime(time)
confirmBooking() // finalizes + shows PromptPay
🎯 Suggested Improvements (10 ข้อ)
🔥 High Impact
- 🗓️ Date-specific availability — ปฏิทินแสดงโต๊ะว่าง/ไม่ว่างตามวันจริง
- 📍 Restaurant Map — แผนที่แสดงที่ตั้งร้านอาหาร
- 💬 Live Chat กับร้าน — ถามเมนูพิเศษ/เวลา
- 📷 Upload รูปอาหาร — ให้ลูกค้าถ่ายรูป + รีวิว
🟡 Medium Impact
- 🍱 Set Menu แนะนำ — คอร์ส 3-5 จาน ราคาพิเศษ
- 🎉 Group Booking — จองคนเยอะ 10+ คน
- 💰 Loyalty Points — สะสมแต้ม
- 🍷 Wine Pairing — จับคู่ไวน์กับอาหาร
🟢 Nice to Have
- 🎁 Gift Card — ซื้อ gift card ให้เพื่อน
- 🤖 AI Recommendation — แนะนำร้านตามประวัติ
🐛 Known Issues
- โต๊ะ "ไม่ว่าง" เป็น random ทุกครั้งที่ refresh
- ไม่มี multi-day booking
📊 Stats
- Lines: 2,200+
- Restaurants: 10
- Tables: 24 (3 zones)
- Time slots: 20
- File size: 65KB
📌 Live: https://codehub.sj88ai.com/dinebook/
