|
一、工作方案概述 本系统旨在构建一套基于 SpringBoot 后端 + Vue 后台管理 + 微信小程序用户端 的餐厅点餐系统,实现餐厅点餐、管理、出餐的数字化和智能化。 系统按角色划分为三大端: 1.用户端(微信小程序):菜品浏览、购物车、在线下单、订单跟踪、评价、个人信息管理。 2.后厨端(管理后台子角色):接收订单、制作菜品、确认出餐、查看公告与个人信息。 3.管理员端(后台管理系统):菜品管理、餐桌管理、公告管理、轮播图管理、订单管理、用户与后厨管理。 系统采用前后端分离架构,后端提供 RESTful API,前端各端分别独立运行,互不干扰。数据库使用 MySQL 作为核心数据存储,利用字典表设计实现灵活可扩展的数据结构。 整体方案目标: 1.降低人工点餐成本 2.提升出餐效率 3.实现数据可视化与统一管理 4.提升顾客体验 二、系统框架图
三、数据库设计 数据库以“用户—菜品—订单”为核心三大主线展开,辅助实体包括购物车、评论、公告、系统字典等。 1. 核心实体 (1)用户表 yonghu 存储顾客信息。 关键字段:username、password、name、phone、id_number、email、sex、balance。 (2)后厨表 houchu 存储厨房工作人员信息。 字段与用户类似但角色不同。 (3)菜品表 goods 字段:名称、类别、照片、库存、原价现价、是否上架、销量、简介。 (4)订单表 goods_order 记录单次点餐行为。 字段含订单号、菜品ID、用户ID、餐桌号、数量、实付金额、订单状态、支付方式等。 (5)购物车表 cart 用户临时购物信息 (6)评价表 comment 字段含评价内容、回复内容、评价时间等。 (7)公告表 news 餐厅发布信息。 (8)字典表 dictionary 用于动态管理: 菜品类型 餐桌类型 公告类型 2. 数据库关系概述 用户(1)—(N)订单 用户(1)—(N)购物车 用户(1)—(N)评价 菜品(1)—(N)订单、评价、购物车
四、详细设计 系统详细设计按照三个角色端(用户端、管理端、后厨端)及后端服务进行说明,每个部分包含 主要功能模块 与 具体实现方式,从界面交互、业务逻辑到数据处理均进行全面阐述。 4.1 用户端详细设计(微信小程序) (1)主要模块(功能): 1.用户登录与注册模块 2.首页模块(轮播、公告、热销菜品) 3.菜品浏览与搜索模块 4.菜品详情模块(图文展示、评价) 5.购物车模块 6.订单确认与支付方式选择模块 7.订单列表与状态跟踪模块 8.评价模块 9.个人中心模块 10.用户信息管理模块 (2)具体实现 1. 登录与注册: 使用 input 输入账号和密码,通过 bindinput 与 Vue 数据模型建立双向绑定。 登录按钮触发 onLoginTap(),调用 $api.login 向后端发送 POST 请求。 登录成功后将 token、用户角色、用户 ID 存储于 wx.setStorageSync。 注册页面支持手机号、身份证、邮箱等格式校验,调用 $api.register 注册。 2. 首页展示: 轮播图使用 swiper 组件渲染,数据通过 $api.list('config') 动态获取。 热销菜品使用网格布局,根据销量排序获取推荐数据。 公告列表调用 $api.list('news')。 3. 菜品列表与搜索: 采用 mescroll-uni 实现下拉刷新、上拉加载。 搜索框与分类标签实现动态筛选: 名称关键字搜索 菜品类型搜索 列表项展示:图片 + 名称 + 简介 + 价格 + 销量。 点击项跳转至详情页,通过菜品 ID 调用 $api.info('goods') 获取详情。 4. 菜品详情: 顶部使用 swiper 轮播展示大图。 rich-text 组件渲染图文详情。 显示库存、销量、类型、价格等信息。 展示该菜品的评价,通过 $api.list('comment',goodsId) 获取。 底部按钮:加入购物车、立即购买。 5. 购物车: 商品选中 / 全选 加减数量、自动更新数据库 删除购物车商品 自动计算总金额、总数量。 “立即下单”跳转订单确认页,并把选中的购物车商品存储到本地缓存。 6. 订单确认: 用户选择餐桌号(字典表) 展示购买商品清单 根据支付方式显示价格明细 点击提交后调用 $api.requestConditionDataGet('goodsOrder') 创建订单 自动扣减库存、增加销量 7. 订单列表: 顶部使用导航栏切换订单状态(待接单/制作中/已完成等)。 单个订单展示:图片、订单号、餐桌、数量、价格、状态。 支持退款申请、确认取餐、评价、删除订单等功能 8. 用户评价: 采用 textarea 输入评价内容 支持新增 / 修改 / 删除 数据通过 $api.save 或 $api.update 提交至后端 用户提交后,本订单进入 “已评价” 状态 9. 个人中心: 展示头像、姓名、账户余额 展示订单入口、评价入口、个人信息入口等 支持退出登录 10. 信息编辑: 可修改姓名、手机、身份证、邮箱、性别等 头像通过 $api.upload 上传到服务器 提交时进行格式校验并更新数据库 4.2 管理后台详细设计(Vue + Element UI) (1)主要模块(功能): 1.登录与权限管理 2.用户管理 3.后厨人员管理 4.菜品类别管理 5.菜品管理 6.餐桌类型管理 7.订单管理 8.评价管理 9.公告管理 10.轮播图管理 11.系统配置 12.数据统计 (2)具体实现: 1. 登录与权限: 表单验证:用户名、密码、角色。 登录成功后保存 token、用户 ID、角色到 localStorage。 路由守卫根据角色控制页面访问。 2. 用户管理 / 后厨管理 采用 el-table 展示用户数据。 支持条件查询:姓名、账号、性别等。 新增/修改表单采用 el-form,支持字段校验。 重置密码通过独立接口实现。 头像/照片通过文件上传组件实现。 3. 菜品管理 列表展示菜品名称、类别、库存、价格、状态、销量等信息。 上架/下架按钮通过更新字段 shangxia_types 实现。 库存管理包括新增库存、扣减库存、添加/修改 表单支持上传图片 菜品类型通过字典表动态获取 简介使用富文本编辑器 4. 字典管理(核心灵活性) 菜品类型 餐桌类型 公告类型 字典表字段包括编码、名称、排序号,可灵活扩展系统功能。 5. 订单管理 订单列表展示订单号、菜品、数量、金额、用户、状态等。 特殊流程控制: ①“做餐” → 更新订单状态为“制作中” ②“出餐” → 由后厨操作,更新为“已出餐” ③“退款” → 改变状态并返回余额 ④“评价查看” → 查看用户评价 ⑤删除订单只能在特定状态下操作。 6. 评价管理 展示评价内容、用户、菜品、时间等。 管理员可回评价,更新 reply_text 字段。 支持批量导入导出 Excel。 可使用 ECharts 查看评价数量统计。 7. 公告管理 支持富文本编辑器编辑公告内容 上传公告图片 公告类型从字典表获取 展示列表 + 搜索 + 导入导出 8. 轮播图管理 采用配置表管理首页轮播图 支持增删改查及文件上传 9. 数据统计 使用 ECharts 展示: 菜品销量图 评价分布图 用户增长图 订单状态图 4.3 后厨端详细设计 (1)主要模块: 1.登录与个人信息管理 2.查看公告 3.订单接收 4.制作中处理 5.确认出餐 (2)实现方式说明: 1. 登录与个人信息 复用后台登录接口 后厨账号由管理员创建 可修改手机号、头像等信息 2. 公告查看 调用公告接口 采用列表与详情结构展示 3. 新订单接收 加载订单状态为“未接单”的列表 点击“开始制作”后,订单状态改为“制作中” 记录更新时间 4. 制作完成出餐 点击“出餐”按钮 更新订单状态为“已出餐” 用户端同步显示可取餐 4.4 后端详细设计(SpringBoot) (1)主要模块 1.用户认证模块(Token机制) 2.角色权限模块 3.菜品管理服务 4.购物车服务 5.订单处理服务(含状态机) 6.评价服务 7.公告服务 8.文件上传模块 9.字典模块 10.数据统计模块 (2)具体实现方式 1. 登录认证 用户提交账号密码 → 后端校验密码 生成 token 与过期时间写入 token 表 前端每次请求携带 token,后端拦截器校验 2. 订单状态流转(核心逻辑) 订单字段 goods_order_types 代表状态: 状态码 状态名 操作端 1 待接单 用户端创建 2 已接单(制作中) 后厨 3 已出餐 后厨 4 已完成 用户确认取餐 5 已评价 用户 6 已退款 管理员 后端实现: 每次操作调用不同业务方法 校验状态合法性(防止越级操作) 使用事务控制库存扣减、销量增加等业务 3. 文件上传模块 使用 MultipartFile 实现上传 文件存储在服务器指定目录 返回访问路径给前端 4. 字典模块 接口返回所有类型名称(如菜品类型、餐桌类型) 可动态扩展类型,无需修改前端代码 5. 数据统计模块 SQL 聚合统计 返回前端绘制图表 五、演示界面 用户端界面 登录注册页 首页(轮播图 / 热销菜品 / 公告) 菜品列表 / 搜索 菜品详情(图文 + 评价) 购物车界面 订单确认页 订单列表(含退款、评价等) 个人中心 信息修改页 管理后台界面 登录注册 首页面板 用户管理 后厨管理 字典管理 菜品管理 订单管理(做餐/出餐) 评价管理 公告管理 轮播图管理 六、总结 本系统以 SpringBoot 为后端核心,结合 Vue 管理端与微信小程序用户端,实现了餐厅点餐全流程的信息化处理,包括菜品展示、购物车、下单、订单流转、出餐管理、评价反馈等功能。
|