[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-public-AUgPvs9x":3,"public-project-articles-AUgPvs9x":17},{"id":4,"uuid":5,"project_id":6,"title":7,"content":8,"type":9,"status":10,"public_enabled":10,"views":11,"sort":12,"created_at":13,"updated_at":14,"project_title":15,"project_slug":16},277,"AUgPvs9x",38,"16. 开发在线点餐功能（三）","我们点餐的数据存储在页面上，没有存到数据库，所以页面刷新会清空数据\n所以点餐的过程中不能刷新页面，要一次性点餐完成，然后下单\n\n## 订单模块SQL\n\n```sql\nCREATE TABLE `orders` (\n  `id` int(11) NOT NULL AUTO_INCREMENT COMMENT 'ID',\n  `content` varchar(1000) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '菜单内容',\n  `total` decimal(10,0) DEFAULT NULL COMMENT '总价',\n  `user_id` int(11) DEFAULT NULL COMMENT '点餐人',\n  `time` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '点餐时间',\n  `status` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '订单状态',\n  `order_no` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '订单编号',\n  PRIMARY KEY (`id`)\n) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci COMMENT='订单信息';\n```\n\n## 前端下单的逻辑\n\n```vue\n\u002F\u002F 下单逻辑\nconst save = () => {\n  if (data.orderList.length === 0) {\n    ElMessage.warning('请选择餐品')\n    return\n  }\n  let content = ''\n  data.orderList.forEach(item => {\n    content += item.name + 'x' + item.num + '，'\n  })\n  content = content.substring(0 , content.length - 1)  \u002F\u002F  理论上来说 最后会多出一个逗号，所以我们去掉最后一个逗号即可 菜单的内容： 腊肠炒芹菜x1, 糖醋排骨x2\n  let orderData = {  content:  content, total: data.orderTotal, userId: data.user.id, status: '待出餐'}\n  request.post('\u002Forders\u002Fadd', orderData).then(res => {\n    if (res.code === '200') {  \u002F\u002F 下单成功\n      ElMessage.success('下单成功，请在我的订单里查看订单状态')\n      data.dialogShow = false\n    } else {\n      ElMessage.error(res.msg)\n    }\n  })\n}\n```\n\n## 后台下单逻辑\n\n```java\npublic void add(Orders orders) {\n    \u002F\u002F 设置唯一的订单号\n    String orderNo = IdUtil.fastSimpleUUID();\n    orders.setOrderNo(orderNo);\n    orders.setTime(DateUtil.now());  \u002F\u002F 当前的年月日 时分秒\n    ordersMapper.insert(orders);\n}\n```\n\n## 排查问题，页面不显示某个字段的数据怎么办？\n\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2024\u002Fpng\u002F751015\u002F1719459595117-fb666eef-201f-4552-b8c4-2fb099886165.png#averageHue=%23fdf9f9&clientId=uac216608-bd4e-4&from=paste&height=328&id=u2eb529e5&originHeight=410&originWidth=1669&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=50598&status=done&style=none&taskId=u8b320256-06c1-49e4-8e48-51b032cf0ee&title=&width=1335.2)\n\n1. 看页面，页面的表格的字段写的对不对\n\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2024\u002Fpng\u002F751015\u002F1719459676015-82fca3e7-a0ee-4712-838c-ad1145936019.png#averageHue=%23302e2c&clientId=uac216608-bd4e-4&from=paste&height=417&id=ub1a26211&originHeight=521&originWidth=925&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=102707&status=done&style=none&taskId=u20883091-907e-4ebf-88ce-5af43717bba&title=&width=740)\n\n2. 看网络，看网络有没有返回数据\n\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2024\u002Fpng\u002F751015\u002F1719459539988-9a86e5b0-1771-49a7-96eb-80ca218770d2.png#averageHue=%23faf8f7&clientId=uac216608-bd4e-4&from=paste&height=467&id=u7db493ab&originHeight=584&originWidth=1486&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=63830&status=done&style=none&taskId=u4217da6d-f36d-418b-97b1-2e02135398f&title=&width=1188.8)\n\n3. 看后台，看看你的接口是怎么写的，看看你的sql有没有报错\n\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2024\u002Fpng\u002F751015\u002F1719459766958-d35b6127-5a04-4b1e-8b66-7c5c560d28c2.png#averageHue=%23cb4d39&clientId=uac216608-bd4e-4&from=paste&height=477&id=udd8ecbd9&originHeight=596&originWidth=1647&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=142135&status=done&style=none&taskId=u8f409c62-37b7-4c5f-8781-c3a02cfc1ff&title=&width=1317.6)\n\n**最后解决问题：实体类缺少了字段**\n![image.png](https:\u002F\u002Fcdn.nlark.com\u002Fyuque\u002F0\u002F2024\u002Fpng\u002F751015\u002F1719459925416-3020b9e4-bb98-448e-a212-df48fee0dae5.png#averageHue=%23302c2b&clientId=uac216608-bd4e-4&from=paste&height=471&id=uc801d7f4&originHeight=589&originWidth=689&originalType=binary&ratio=1.25&rotation=0&showTitle=false&size=58992&status=done&style=none&taskId=u4db8bf17-b48b-43c8-b129-c3b277296e5&title=&width=551.2)\n\n## 用户只能看到自己的订单\n\n```plsql\n\u003Cselect id=\"selectAll\" resultType=\"com.example.entity.Orders\">\n    select orders.*, user.name userName from orders\n    left join user on orders.user_id = user.id\n    \u003Cwhere>\n        \u003Cif test=\"userName != null\">\n            and user.name like concat('%', #{userName}, '%')\n        \u003C\u002Fif>\n        \u003Cif test=\"userId != null\">\n            and orders.user_id = #{userId}\n        \u003C\u002Fif>\n    \u003C\u002Fwhere>\n    order by orders.id desc\n\u003C\u002Fselect>\n```\n\n前端查询的时候做条件判断，只有用户登录查询的时候，才传userId数据\n\n```vue\nconst load = () => {\n  request.get('\u002Forders\u002FselectPage', {\n    params: {\n      pageNum: data.pageNum,\n      pageSize: data.pageSize,\n      userName: data.userName,\n      userId: data.user.role === 'USER' ? data.user.id : null\n    }\n  }).then(res => {\n    data.tableData = res.data?.list || []\n    data.total = res.data.total\n  })\n}\n```","coding",1,716,469,"2024-06-27 12:22:01","2026-05-03 22:49:02","SpringBoot3+Vue3的在线点餐系统","online-ordering",{"project":18,"items":19},{"id":6,"title":15,"slug":16},[20,27,34,41,48,55,62,69,76,83,90,97,104,111,118,125],{"id":21,"uuid":22,"project_id":6,"title":23,"type":9,"status":10,"public_enabled":10,"views":24,"sort":25,"created_at":26,"updated_at":14,"project_title":15,"project_slug":16},58,"JOJVoOQd","01. 在线点餐系统介绍",2745,102,"2025-01-09 09:49:39",{"id":28,"uuid":29,"project_id":6,"title":30,"type":9,"status":10,"public_enabled":10,"views":31,"sort":32,"created_at":33,"updated_at":14,"project_title":15,"project_slug":16},59,"Tt7tzqbb","02. 脚手架介绍",2364,103,"2025-01-09 09:54:51",{"id":35,"uuid":36,"project_id":6,"title":37,"type":9,"status":10,"public_enabled":10,"views":38,"sort":39,"created_at":40,"updated_at":14,"project_title":15,"project_slug":16},60,"h74qSg8n","03. 开发登录功能",1974,104,"2024-04-16 02:30:00",{"id":42,"uuid":43,"project_id":6,"title":44,"type":9,"status":10,"public_enabled":10,"views":45,"sort":46,"created_at":47,"updated_at":14,"project_title":15,"project_slug":16},61,"uv8MFWZg","04. 开发后台登录接口",1729,105,"2024-04-16 02:29:56",{"id":49,"uuid":50,"project_id":6,"title":51,"type":9,"status":10,"public_enabled":10,"views":52,"sort":53,"created_at":54,"updated_at":14,"project_title":15,"project_slug":16},62,"jd2xjxUG","05. 开发普通用户登录功能",1145,106,"2024-04-16 02:29:27",{"id":56,"uuid":57,"project_id":6,"title":58,"type":9,"status":10,"public_enabled":10,"views":59,"sort":60,"created_at":61,"updated_at":14,"project_title":15,"project_slug":16},63,"TnvWfP4t","06. 开发普通用户注册功能",861,107,"2024-04-16 02:29:23",{"id":63,"uuid":64,"project_id":6,"title":65,"type":9,"status":10,"public_enabled":10,"views":66,"sort":67,"created_at":68,"updated_at":14,"project_title":15,"project_slug":16},64,"j9QNZGZU","07. 开发管理员后台接口",873,108,"2024-04-16 02:29:17",{"id":70,"uuid":71,"project_id":6,"title":72,"type":9,"status":10,"public_enabled":10,"views":73,"sort":74,"created_at":75,"updated_at":14,"project_title":15,"project_slug":16},65,"Sle0aiDs","08. 开发管理员管理页面并对接后台接口",821,109,"2024-04-16 02:29:13",{"id":77,"uuid":78,"project_id":6,"title":79,"type":9,"status":10,"public_enabled":10,"views":80,"sort":81,"created_at":82,"updated_at":14,"project_title":15,"project_slug":16},66,"msAf9SFh","09. 开发文件上传功能",659,110,"2024-04-16 02:29:09",{"id":84,"uuid":85,"project_id":6,"title":86,"type":9,"status":10,"public_enabled":10,"views":87,"sort":88,"created_at":89,"updated_at":14,"project_title":15,"project_slug":16},67,"8FBiQ4ue","10. 个人资料管理",736,111,"2024-04-16 02:29:06",{"id":91,"uuid":92,"project_id":6,"title":93,"type":9,"status":10,"public_enabled":10,"views":94,"sort":95,"created_at":96,"updated_at":14,"project_title":15,"project_slug":16},252,"hi7dGSTj","11. 顾客信息管理",643,431,"2024-06-20 15:59:16",{"id":98,"uuid":99,"project_id":6,"title":100,"type":9,"status":10,"public_enabled":10,"views":101,"sort":102,"created_at":103,"updated_at":14,"project_title":15,"project_slug":16},253,"2vquH0pr","12. 餐桌管理",879,432,"2024-06-03 22:12:16",{"id":105,"uuid":106,"project_id":6,"title":107,"type":9,"status":10,"public_enabled":10,"views":108,"sort":109,"created_at":110,"updated_at":14,"project_title":15,"project_slug":16},254,"F8DqfdBe","13. 开发餐品管理功能.",731,433,"2024-06-03 22:12:43",{"id":112,"uuid":113,"project_id":6,"title":114,"type":9,"status":10,"public_enabled":10,"views":115,"sort":116,"created_at":117,"updated_at":14,"project_title":15,"project_slug":16},275,"G20uzwaW","14. 开发在线点餐功能（一）",768,467,"2024-06-27 12:21:02",{"id":119,"uuid":120,"project_id":6,"title":121,"type":9,"status":10,"public_enabled":10,"views":122,"sort":123,"created_at":124,"updated_at":14,"project_title":15,"project_slug":16},276,"0bl3zvbT","15. 开发在线点餐功能（二）",609,468,"2024-06-27 12:21:30",{"id":4,"uuid":5,"project_id":6,"title":7,"type":9,"status":10,"public_enabled":10,"views":11,"sort":12,"created_at":13,"updated_at":14,"project_title":15,"project_slug":16}]