建立一个校园点餐系统需要考虑许多方面,包括用户管理、菜单管理、订单管理等。下面是一个基本的设计思路和代码实现,分为前端和后端。
后端设计思路:
- 用户管理模块:处理用户注册、登录、信息修改等功能。
- 菜单管理模块:包括菜品的添加、删除、修改和查询等功能。
- 订单管理模块:处理用户下单、订单查询、订单状态更新等功能。
- 数据库设计:使用MySQL存储用户信息、菜单信息、订单信息等。
- 缓存管理:使用Redis缓存热门菜品、用户信息等,提高系统性能。
后端代码实现:
用户管理模块
# user_management.py
import mysql.connector
class UserManagement:
def __init__(self):
self.conn = mysql.connector.connect(
host="localhost",
user="username",
password="password",
database="campus_food_ordering"
)
self.cursor = self.conn.cursor()
def register_user(self, username, password, email):
# Check if user already exists
self.cursor.execute("SELECT * FROM users WHERE username = %s", (username,))
if self.cursor.fetchone():
return False, "Username already exists"
# Insert new user
self.cursor.execute("INSERT INTO users (username, password, email) VALUES (%s, %s, %s)",
(username, password, email))
self.conn.commit()
return True, "User registered successfully"
def login_user(self, username, password):
self.cursor.execute("SELECT * FROM users WHERE username = %s AND password = %s",
(username, password))
user = self.cursor.fetchone()
if user:
return True, "Login successful"
else:
return False, "Invalid username or password"
def update_user_info(self, username, new_password=None, new_email=None):
if new_password:
self.cursor.execute("UPDATE users SET password = %s WHERE username = %s",
(new_password, username))
if new_email:
self.cursor.execute("UPDATE users SET email = %s WHERE username = %s",
(new_email, username))
self.conn.commit()
return True, "User information updated successfully"
菜单管理模块
# menu_management.py
import mysql.connector
class MenuManagement:
def __init__(self):
self.conn = mysql.connector.connect(
host="localhost",
user="username",
password="password",
database="campus_food_ordering"
)
self.cursor = self.conn.cursor()
def add_dish(self, name, price, description):
self.cursor.execute("INSERT INTO menu (name, price, description) VALUES (%s, %s, %s)",
(name, price, description))
self.conn.commit()
return True, "Dish added successfully"
def delete_dish(self, dish_id):
self.cursor.execute("DELETE FROM menu WHERE id = %s", (dish_id,))
self.conn.commit()
return True, "Dish deleted successfully"
def update_dish(self, dish_id, new_price=None, new_description=None):
if new_price:
self.cursor.execute("UPDATE menu SET price = %s WHERE id = %s",
(new_price, dish_id))
if new_description:
self.cursor.execute("UPDATE menu SET description = %s WHERE id = %s",
(new_description, dish_id))
self.conn.commit()
return True, "Dish information updated successfully"
def search_dish(self, keyword):
self.cursor.execute("SELECT * FROM menu WHERE name LIKE %s", ('%' + keyword + '%',))
dishes = self.cursor.fetchall()
return dishes
订单管理模块
# order_management.py
import mysql.connector
class OrderManagement:
def __init__(self):
self.conn = mysql.connector.connect(
host="localhost",
user="username",
password="password",
database="campus_food_ordering"
)
self.cursor = self.conn.cursor()
def place_order(self, user_id, dish_id, quantity):
self.cursor.execute("INSERT INTO orders (user_id, dish_id, quantity) VALUES (%s, %s, %s)",
(user_id, dish_id, quantity))
self.conn.commit()
return True, "Order placed successfully"
def get_user_orders(self, user_id):
self.cursor.execute("SELECT * FROM orders WHERE user_id = %s", (user_id,))
orders = self.cursor.fetchall()
return orders
def update_order_status(self, order_id, new_status):
self.cursor.execute("UPDATE orders SET status = %s WHERE id = %s",
(new_status, order_id))
self.conn.commit()
return True, "Order status updated successfully"
前端设计思路:
- 用户界面:提供注册、登录、个人信息修改等功能。
- 菜单界面:展示菜单,支持搜索、添加购物车等操作。
- 购物车界面:展示用户已选择的菜品和数量,支持修改数量、删除等操作。
- 订单界面:展示用户的历史订单和当前订单状态。
前端代码实现:
这部分可以使用HTML、CSS和JavaScript实现,将提供完整的HTML、CSS和JavaScript代码来实现校园点餐系统的前端交互和页面布局。
HTML代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Campus Food Ordering System</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="menu">
<h2>Menu</h2>
<input type="text" id="searchInput" placeholder="Search...">
<div id="menuItems">
<!-- Menu items will be displayed here -->
</div>
</div>
<div id="cart">
<h2>Shopping Cart</h2>
<ul id="cartItems">
<!-- Cart items will be displayed here -->
</ul>
<button id="checkoutBtn">Checkout</button>
</div>
<div id="orders">
<h2>Order History</h2>
<ul id="orderHistory">
<!-- User orders will be displayed here -->
</ul>
</div>
<script src="script.js"></script>
</body>
</html>
CSS代码
/* styles.css */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
#menu, #cart, #orders {
float: left;
width: 30%;
padding: 20px;
box-sizing: border-box;
}
#menu {
border-right: 1px solid #ccc;
}
#menu h2, #cart h2, #orders h2 {
margin-top: 0;
}
#searchInput {
width: 100%;
padding: 8px;
margin-bottom: 10px;
}
#menuItems, #cartItems, #orderHistory {
list-style-type: none;
padding: 0;
}
#menuItems li, #cartItems li, #orderHistory li {
margin-bottom: 10px;
border: 1px solid #ccc;
padding: 10px;
}
#checkoutBtn {
display: block;
margin-top: 10px;
padding: 10px 20px;
background-color: #007bff;
color: #fff;
border: none;
cursor: pointer;
}
#checkoutBtn:hover {
background-color: #0056b3;
}
JavaScript代码
// script.js
document.addEventListener("DOMContentLoaded", function() {
const menuItems = document.getElementById("menuItems");
const cartItems = document.getElementById("cartItems");
const orderHistory = document.getElementById("orderHistory");
const searchInput = document.getElementById("searchInput");
const checkoutBtn = document.getElementById("checkoutBtn");
// Dummy data for demonstration
const menu = [
{ id: 1, name: "Hamburger", price: 5.99 },
{ id: 2, name: "Pizza", price: 8.99 },
{ id: 3, name: "Salad", price: 4.99 }
];
const cart = [];
const orders = [
{ id: 1, dish: "Hamburger", quantity: 2, status: "Delivered" },
{ id: 2, dish: "Pizza", quantity: 1, status: "In progress" }
];
// Populate menu items
function populateMenu() {
menuItems.innerHTML = "";
menu.forEach(item => {
const li = document.createElement("li");
li.textContent = `${item.name} - $${item.price}`;
li.setAttribute("data-id", item.id);
menuItems.appendChild(li);
});
}
// Populate cart items
function populateCart() {
cartItems.innerHTML = "";
cart.forEach(item => {
const li = document.createElement("li");
li.textContent = `${item.name} x${item.quantity} - $${item.price * item.quantity}`;
cartItems.appendChild(li);
});
}
// Populate order history
function populateOrderHistory() {
orderHistory.innerHTML = "";
orders.forEach(order => {
const li = document.createElement("li");
li.textContent = `${order.dish} x${order.quantity} - ${order.status}`;
orderHistory.appendChild(li);
});
}
// Add item to cart
function addToCart(itemId) {
const selectedItem = menu.find(item => item.id === parseInt(itemId));
const existingItem = cart.find(item => item.id === selectedItem.id);
if (existingItem) {
existingItem.quantity++;
} else {
cart.push({ ...selectedItem, quantity: 1 });
}
populateCart();
}
// Search menu items
searchInput.addEventListener("input", function() {
const keyword = this.value.trim().toLowerCase();
const filteredMenu = menu.filter(item => item.name.toLowerCase().includes(keyword));
populateMenu(filteredMenu);
});
// Checkout
checkoutBtn.addEventListener("click", function() {
// Perform checkout process
alert("Checkout completed!");
});
// Initial population
populateMenu();
populateCart();
populateOrderHistory();
// Event delegation for adding items to cart
menuItems.addEventListener("click", function(event) {
if (event.target.tagName === "LI") {
const itemId = event.target.getAttribute("data-id");
addToCart(itemId);
}
});
});
这些代码实现了校园点餐系统的基本前端交互和页面布局,包括展示菜单、搜索菜品、添加购物车、展示购物车内容、结账等功能。在实际项目中,还需要添加更多的功能和样式来完善用户体验。