点餐小程序实战教程11数据源设计

server/2024/9/25 20:58:50/

目录

  • 1 设计图
  • 2 创建数据源
    • 2.1 菜品分类
    • 2.2 菜品表
  • 3 创建管理应用
  • 4 设置上架下架功能
  • 总结

我们用了10篇讲解了一下用户管理及权限设计,有了用户和权限相当于有了骨架,但是我们还需要有良好的设计来确保我们的小程序的开发顺利进行。

在数据源的设计中,有一个比较好用的工具就是E-R图。他的中文名字叫实体关系图。所谓的实体可以理解为我们需要设计的表,所谓的关系就是表和表之间的关系。

我们本篇分析一下我们的点餐小程序的E-R设计

1 设计图

在这里插入图片描述
我们这里的设计是分两条线,一条是和餐厅相关的,我们拆分了三个实体,餐厅、餐桌和员工

餐厅主要记录餐厅的位置信息、营业时间和联系电话,当然如果是连锁店可能好需要考虑餐厅的城市信息

餐桌,我们通常会有编号,还有就是当前的状态,如果空闲、使用中,还有就是容纳的人数

员工我们已经在过往的篇幅中着重介绍了,包括员工的姓名、性别、联系方式、角色,后续可能会增加入职时间,当前的状态,比如上班、倒休、请假,方便日常的排班

第二条主线就是我们的点餐业务线了,包含了顾客、订单、菜品这些主要信息

顾客可以下单,订单里包括总价和菜品的详情,而订单详情记录点的菜品及数量、单价这些关键信息

在顾客浏览信息的时候我们可能会按照分类比如热菜、凉菜、冷饮这些分类供用户进行选择

在E-R图里还有关系的概念,我们主要是要记录主子表,即我们设计图里的1:N 的关系,1的一方表示主表,N的一方表示子表。

在微搭中是用关联关系来表达主子表的

2 创建数据源

图纸画好了之后,我们就需要照图施工。打开应用编辑器,在侧边栏打开数据源,点击创建

2.1 菜品分类

在这里插入图片描述
先创建菜品分类表
在这里插入图片描述
菜品分类我们需要两列,分别是名称和排序

点击添加列,输入名称,类型选择文本
在这里插入图片描述
在这里插入图片描述
名称我们设置为主列字段,继续添加一列,序号,类型选择数字
在这里插入图片描述
在这里插入图片描述

2.2 菜品表

继续增加我们的数据源,这次创建菜品表
在这里插入图片描述
先添加一列,名称,类型选择文本,设置为主列字段
在这里插入图片描述
继续添加一列,菜品分类,类型选择关联关系,数据源选择菜品分类
在这里插入图片描述
在我们的E-R图里,作为N的一方我们是要添加外键,在微搭里就是关联关系

继续添加一列,价格,类型选择数字
在这里插入图片描述
继续添加一列,图片,类型选择图片
在这里插入图片描述
继续添加一列,上架状态,类型选择枚举,枚举值为待上架、已上架、已下架

在这里插入图片描述
在这里插入图片描述

3 创建管理应用

我们的数据源搭建好了之后,通常需要有一个管理后台来维护数据。在微搭中也是通过自定义应用来搭建后台应用的。

打开应用,创建空白应用
在这里插入图片描述
切换应用的模式,切换成PC模式
在这里插入图片描述
点击创建页面的图标
在这里插入图片描述
选择表格与表单页,选择菜品分类数据源,选择左侧布局
在这里插入图片描述
选择数据表格,排序字段选择序号,升序
在这里插入图片描述
切换到页面布局,选择左侧导航布局
在这里插入图片描述
选中布局导航,点击右边的魔术棒图标
在这里插入图片描述
只保留列表页,并且设置一个自己喜欢的图标
在这里插入图片描述
再切换回页面设计,点击实时预览图标
在这里插入图片描述
这样我们的导航菜单就搭建好了
在这里插入图片描述
继续按照上述步骤,点击创建页面图标,这次数据源选择菜品表
在这里插入图片描述
在这里插入图片描述
点击页面布局,点击添加平级菜单
在这里插入图片描述
选择我们的菜品列表页面
在这里插入图片描述
切换到页面设计,设置筛选器,勾选必要的查询条件
在这里插入图片描述

4 设置上架下架功能

除了组件提供的默认功能外,我们还需要给菜品添加上架下架功能。先给菜品分类录入数据
在这里插入图片描述
然后录入菜品
在这里插入图片描述
在操作列,添加按钮,修改按钮的内容为上架,类型设置为链接
在这里插入图片描述
继续添加按钮,按钮内容修改为下架,类型设置为链接
在这里插入图片描述
按钮添加好了之后就是给按钮设置事件,点击按钮,设置点击事件,方法选择数据源方法
在这里插入图片描述
在这里插入图片描述
名称选择菜品,方法选择修改单条
在这里插入图片描述
查询条件设置为数据标识等于表格所在行的数据标识
在这里插入图片描述
将上架状态修改为2
在这里插入图片描述
下架的设置也是一样的,只是状态修改为3

数据源修改了之后,需要继续刷新一下表格数据
在这里插入图片描述

总结

我们本篇主要介绍了数据源的设计方法,讲解了E-R图该如何画,我们目前这个小程序项目识别了哪些实体。

接着介绍了数据源的创建方法,以及如何用自定义应用搭建管理后台。数据源设计还是非常重要的,好的设计在后续功能迭代时可以提供很大的便利,需要在实际中通过项目锻炼设计能力。


http://www.ppmy.cn/server/122008.html

相关文章

828华为云征文|Flexus X实例GitLab部署构建流水线-私人一体化代码仓库~

目录 前言Gitlab 环境准备 GitLab部署 拉取GitLab镜像 创建映射目录 运行GitLab容器 修改gitlab.rb配置 开放端口 切换语言 创建项目 添加ssh密钥 克隆代码 CICD 什么是CICD Gitlab中使用CICD 什么是Runner 安装GitLab Runner 获取注册令牌 runner注册 交互…

MySQL(面试题 - 同类型归纳面试题)

目录 一、MySQL 数据类型 1. 数据库存储日期格式时,如何考虑时区转换问题? 2. Blob和text有什么区别? 3. mysql里记录货币用什么字段类型比较好? 4. MySQL如何获取当前日期? 5. 你们数据库是否支持emoji表情存储&…

大表数据如何在OceanBase中进行表分区管理的实践

背景 将Zabbix的数据库迁移至OceanBase后,以其中的几个大表作为案例,本文将分享如何利用ODC(OceanBase 开发者工具),来进行自动管理OB数据库中的表分区的方案。 因为原始表里已经有大量的数据,如果贸然对…

基于yolov8的红外小目标无人机飞鸟检测系统python源码+onnx模型+评估指标曲线+精美GUI界面

【算法介绍】 基于YOLOv8的红外小目标无人机与飞鸟检测系统是一项集成了前沿技术的创新解决方案。该系统利用YOLOv8深度学习模型的强大目标检测能力,结合红外成像技术,实现了对小型无人机和飞鸟等低空飞行目标的快速、准确检测。 YOLOv8作为YOLO系列的…

Vue 3 Composition API 实战技巧:组件间通信与SPA架构

在上一期专栏中,我们探讨了Vue 3 Composition API的基本用法,并通过几个实用示例展示了如何利用Composition API来管理组件内部的状态。然而,在构建大型应用时,组件间通信的复杂度会显著增加。本篇专栏将介绍如何使用Composition …

淘宝扭蛋机小程序,扭蛋机文化下的新体验

在数字化时代中,扭蛋机逐渐从传统的线下机器转移到了线上互联网中,市场得到了创新发展。扭蛋机小程序具有便捷、多样化、个性化的特点,迎合了当下消费者的线上消费习惯,又能够让扭蛋机玩家体验到新鲜有趣的扭蛋。 扭蛋机是一种热…

9/24作业

1. 分文件编译 分什么要分文件编译? 防止主文件过大,不好修改,简化编译流程 1) 分那些文件 头文件:所有需要提前导入的库文件,函数声明 功能函数:所有功能函数的定义 主函数:main函数&…

UDS诊断-面试题2

bilibili视频推荐: 车载测试面试题UDS诊断协议,你知道什么是UDS诊断?ECU是什么?刷写ECU_哔哩哔哩_bilibili 总结: 1.汽车诊断UDS含义: 一套统一的诊断服务命令。 2.具体操作流程: 使用电脑…