工业App开发与应用 课件 项目2 工业App数据建模与页面设计

工业APP数据建模目录一、数据建模二、低代码开发平台的“数据建模”一、数据建模一、数据建模在计算机世界中，数据模型用来描述数据及其联系的组织方式、表达方式和存取路径。为了把现实世界中的具体事物抽象、组织为某一数据库管理系统（DataBaseManagementSystem，DBMS）支持的数据模型一般先将现实世界的事物及联系抽象成信息世界的概念模型，然后再抽象成机器世界的数据模型。1.概念模型是按用户的观点对数据和信息建模，是对现实世界的事物及其联系的第一级抽象，它不依赖于具体的计算机系统。实体-联系方法（Entity-RelationshipApproach）也称为E-R模型，是一种常用的概念模型表示方法。现实世界由一组称作实体的基本对象以及对象间的联系构成，该方法用E-R图来描述实体型、属性和联系。2.逻辑模型数据模型属于计算机世界中的模型，按计算机的观点对数据建模，是对现实世界的事物及其联系的第二级抽象，有严格的形式化定义，用于数据库管理系统DBMS实现。2.逻辑模型数据库技术的关系型数据模型应用最广泛用表的集合来表示数据和数据间的联系。数据在用户观点下由一组关系组成，每个关系的数据结构是一张规范化的二维表，它由行（元组）和列（属性）组成。3.物理模型物理模型是对数据最底层的抽象，描述数据在磁盘或磁带上的存储方式和存取方法。从逻辑模型到物理模型的转换由数据库管理系统DBMS自动完成，用户一般不必考虑物理级细节。二、低代码开发平台的“数据建模”低代码开发平台介绍01-低代码开发技术，可以通过图形化的用户界面拖拽组件模型驱动开发、部署工业App，不同经验水平的业务人员和IT部门的开发人员可以共同创建、迭代、发布，降低工业App开发成本和难度。低代码开发平台介绍数据建模指为工业APP准备数据，包括应用本身数据，如业务执行数据、档案数据、多档案之间的关联数据；应用外部关联数据，如协作数据、三方系统数据、外部数据等。低代码开发平台介绍可视化低代码全代码可以实现低代码甚至无代码的数据建模工作。二、低代码开发平台的“数据建模”01-02-低代码开发平台通过“数据建模”功能页面帮助开发者构建应用中的实体数据对象，提供应用中数据存储的基本服务开发者只需要操作实体对象无需关心数据持久化过程中的数据存取、数据同步、读写分离等底层操作。二、低代码开发平台的“数据建模”数据建模实体查询枚举可以分别进行可视化开发实体查询在当前应用下自行创建的实体，即环境中存储应用数据的对象，提供数据新建、修改、发布和删除等操作功能。基于实体通过关联合并等一系列操作返回的数据集合。枚举提供枚举数据供实体中的单选选项和多选选项进行引用和选择，枚举管理功能实现增删改查相关操作。实体建模低代码开发平台“数据建模”主要操作是完成实体模型创建，平台“实体模型”指的就是应用中的实体数据对象。实体建模总结工业APP数据建模数据建模内涵数据处理抽象转换过程概念模型数据模型物理模型低代码开发平台的“数据建模”功能页面实体建模思考1简述计算机技术中数据处理抽象和转换过程？思考2简述低代码开发平台的“数据建模”功能？工业APP实体建模目录一、认识实体二、实体建模基本操作一、认识实体一、认识实体01-02-实体（Entity）是指客观存在的任何具体或抽象的事物，具有某种属性可以加以区分。实体往往指某类事物的集合，把每一类数据对象的个体称为实体。1.实体低代码开发平台的“实体”模型包括实体名称、编码、父实体、描述信息、引用接口、业务属性和系统属性等。1.实体01-02-实体名称用于后面使用实体展示，编码对应数据库中的表名，此二者不可与其他实体命名重复。父实体为可选项，新增子实体时需下拉选择，无父实体则不填。父实体和子实体关系即数据库中主表从表关系。1.实体03-04-业务属性是当前实体的数据核心，用户基于需求场景进行新增。唯一性校验是在新增业务属性后保证字段的唯一性的功能，可以自定义某些字段是唯一值，不许重复。1.实体系统属性仅查看，不可手动修改。通过引用接口功能可快速创建系统属性，从而满足业务数据特殊的需求实体引用接口名称含义审批实现审批流的功能业务流实现单据间推单、拉单、回写等业务功能交易类型实现交易类型复杂的业务流程树型结构实现树表页面时需要勾选自动编码实现编码的自动生成，如单据流水号，可配置编码规则档案状态勾选后，基于该实体创建的页面会添加停用、启动功能主组织引用组织部门，适用于需要权限过滤的情况审批业务流交易类型树型结构2.业务属性业务属性是当前实体的数据核心，是用户基于当前需求场景进行数据建模的主要过程。业务属性编码、名称、类型引用、标签文本、日期、时间、日期时间、数值、整数、单选、多选、单选引用、多选引用、定位、开关、超链接等。2.业务属性若属性类型为单选或多选，引用框内填写需要的枚举；若属性类型为单选引用或多选引用，引用框填入自建已发布实体名。二、实体建模基本操作二、实体建模基本操作01-02-Yonbuilder平台内进行实体对象建模，需要先进入应用构建服务创建应用新增枚举，再根据概念模型设计新增实体、添加其属性和引用接口并保存发布。应用构建新建应用新增枚举实体建模创建实体并编辑新增实体复制已有实体Exce导入实体保存发布实体1.应用构建新建应用1.应用构建单击右上角“新建应用”按钮，选择“空白模板”，单击“下一步”按钮选择不同的领域会有不同的引用业务接口，此处选择“应用构建服务”应用名称自定义应用引擎，即服务环境配置，此处选择“公共引擎”图标选择，是应用在平台显示的图标，可以根据需要选择新增枚举1.应用构建1.应用构建“数据建模”页面下包含“实体”、“查询”和“枚举”三个页签。“枚举”页内可以看到本应用自建和共享的枚举列表，提供枚举值给实体属性进行单选或多选。1.应用构建2.实体建模选择“数据建模”→“实体”，页面上“新增实体”、“复制已有”、“导入”三种操作方式均可以创建实体。新增实体2.实体建模2.实体建模2.实体建模复制已有实体平台支持复制已有实体，单击下拉按钮“复制已有”可进入所复制实体的编辑框，需重新编辑实体名称和编码，避免重复2.实体建模Excel导入实体平台支持Excel导入实体的创建方式，单击“导入”→“导入Excel”，下载模板并按格式填写后上传。3.实体发布新增实体页面单击“保存”，实体列表内状态会显示为“未发布”，选中该实体，可编辑、发布、删除等。实体“保存”为“未发布”3.实体发布实体“发布”在实体编辑页面单击“保存并发布”或单击列表上悬停显示的“发布”按钮均可发布实体。对于有层级关系的情况已发布的实体支持修改，修改后状态为“更新”，修改内容需要进行发布后才会生效。父实体的新增和发布需先于子实体完成，或一体化发布。被单选引用/多选引用的实体需要先发布。总结实体建模实体创建基本操作认识实体实体模型组成业务属性应用构建和新增枚举新增实体的三种操作方式实体发布思考1简述数据建模时实体和枚举的区别？思考2简述低代码开发平台实体建模的业务属性类型？工业APP页面建模目录一、页面建模二、常用页面布局模板一、页面建模一、页面建模01-低代码开发平台的“页面建模”当用户执行某个动作时根据数据模型驱动页面设计，提供构成应用的功能页面设计器、分析报表设计器配置出单据、分析报表等各类页面，同时支持前后端扩展，实现单据页面、业务事件的构建和交互过程的个性化扩展。1.页面建模应用让我们来看下yonbuilder平台的页面建模功能包含哪些应用用于创建构建应用的各类页面。用于创建参照页面，将经常用到的页面作为参照模板，方便后期使用。用于设计应用内所有需要打印页面的打印模板。2.页面类型yonbuilder平台把页面分为三类。单据将数据建模时数据库已经存在的字段根据实际需要汇聚在一起，形成具有业务逻辑的单据页面。单卡、单表、左树右表、左树右卡、树形表、一主多子、主子孙、行编辑表、空页面等。2.页面类型yonbuilder平台把页面分为三类。分析为数据的智能分析与展示提供便利，可选择的模板有仪表板、报表、分析卡片和已有页面引用等，可以直接从这个入口创建智能分析页面。第三方在应用中引入第三方的链接页面，通过URL直接引用即可。二、常用页面布局模板二、常用页面布局模板01-平台页面功能提供多种预置模板和多种布局容器及组件，支持流式排列和自由布局的页面组装，实现可视化应用开发。1.事件常用的单据页面常用模板单卡和列表是最基本的页面模板，另有主子结构的一主多子和主子孙模板，还有含有树形结构的左树右表、左树右卡、树形表模板，此外还有行编辑表、空页面等模板。1.单卡和列表“单卡”通常用于配置一个节点的编辑页面，用于录入业务数据。“列表”通常用于配置一个节点的浏览页面来展现全貌，创建页面选择预置模板时可勾选同时生成列表，在列表页面可查看、删除已有档案。1.单卡和列表物料档案页面建模时选择单卡模板并且同时生成列表，在物料档案卡片页面新增物料，在物料档案列表页面查找和删除已有的物料档案。2.主子结构“一主多子”模板用于创建主子布局页面列表卡片可以展示父实体和子实体数据信息，会根据子表的个数自动按页签创建多个子表。支持单主列表及主子列表的选择

。2.主子结构“一主多子”模板用于创建主子布局页面采购清单的父实体详细数据卡片页面可新增采购申请同时编辑清单明细2.主子结构“一主多子”模板用于创建主子布局页面列表页面选择主子列表选项，可查询、浏览采购申请单，选中单条记录可查看清单明细，支持编辑、删除、复制等操作。2.主子结构这是一主多子列表页面示例一主多子2.主子结构这是一主多子列表页面示例卡片页面可以新增采购申请同时编辑清单明细；列表页面选择主子列表选项，可查询、浏览采购申请单选中单条记录可查看清单明细，还可编辑、删除、复制等操作。2.主子结构主子孙由列表和卡片两个页面组成，区别于一主多子，主子孙模板会在子表增加一个对孙表的触发，用于录入或显示某行对应的孙表数据。3.树形结构“左树右卡”是左侧树右侧卡结构的页面模板，用于构建数据本身有层级关系的页面。比如部门树。3.树形结构“左树右表”模板由左树右表页面和卡片页面组成左树右表页面的列表是一个浏览态的列表，与单列表的作用相同，卡片页面是一个编辑态的页面，用于数据的录入，比如员工档案。3.树形结构“树形表”模板由树形表页面和卡片页面组成，是左树右卡的另一种展现。上述与树形有关的页面，所绑定的实体数据建模需勾选引用接口“树形结构”。4.行编辑表是一个可批量编辑的列表页面，常用于字段数量不多的公共档案录入。最终效果是在列表页中可以添加功能按钮，对当前行数据进行查看、编辑、删除等操作。总结工业APP页面建模页面建模主要应用页面类型页面参照打印模板单据（具有业务逻辑的页面）分析第三方常用页面布局模板（单据）单卡、列表主子结构树形结构行编辑表一主多子主子孙左树右表左树右卡树形表思考1简述低代码开发平台页面建模包含哪几类页面？思考2简述低代码开发平台常用的单据页面布局模板？主子页面设计目录一、页面设计过程二、主子页面设计操作一、页面设计过程一、页面设计过程应用建模实体建模实体建模选择页面类型选择模板（eg.一主多子）绑定元数据生成单据页面新建页面非空设置默认值设置自动编码设置参照显示与参照带入数据规则配置保存预览如果修改实体属性需重新发布元数据二、主子页面设计操作采购申请单1.新建页面选择“一主多子”页面布局模板1.新建页面编辑页面属性，绑定元数据1.新建页面新建页面完成2.页面布局调整进入页面设计器基本属性属性样式动作2.页面布局调整字段显示/隐藏设置点击空白处选中表单2.页面布局调整容器名称修改与布局调整2.页面布局调整容器名称修改与布局调整单机空白处选中表格2.页面布局调整添加按钮拖拽放入修改名称3.数据规则配置页面设计器除了进行外观调整，还可直接配置实现一部分数据填写和显示的规则，无需代码实现非空设置默认值设置自动编码设置参照显示与参照带入3.数据规则配置非空设置3.数据规则配置默认值设置3.数据规则配置自动编码3.数据规则配置自动编码3.数据规则配置参照显示与参照带入4.页面效果预览完成页面设计后，保存预览可查看页面设计效果录入采购申请子表采购清单增行选择物料编码填写采购数量自动编码预览卡片页面4.页面效果预览预览采购申请单列表页面总结主子页面设计页面设计过程页面设计操作页面布局调整效果预览数据规则配置新建页面思考1简述低代码开发平台PC端页面设计器常用分区和功能？思考2简述页面设计参照带入配置的应用？移动端页面设计目录一、移动端布局二、移动端卡片模板三、移动端页面设计器一、移动端布局1.静态布局网页最外层容器有固定的大小，所有的内容以该容器为标准，超出宽高的部分用滚动条来实现滚动查阅一般用于PC端，用于移动端不适合2.流式布局也叫百分比布局或自适应布局240*400360*640元素的宽度按照屏幕分辨率自动进行适配调整%（百分比）px（像素）流式布局优点解决类似设备不同分辨率之间的兼容01流式布局在相对其原始设计而言过小或过大的屏幕上显示可能不协调可通过响应式布局和弹性布局来解决一、移动端布局01-02-YonBuilder平台的移动端页面设计器，对常用布局做了易用性封装其组件可以设计绝大部分CSS样式移动端

组件样式三个单位px（像素）是固定尺寸01根元素的字体大小%（百分比）是指屏幕比例02rem（自适应）全称是fontsizeoftherootelement03二、移动端卡片模板1.移动端页面模板目前支持单卡（表）和一主多子和空页面3种页面模板2.移动端卡片模板有纯文字卡片、图文卡片、小图卡片三种排版可选由纯文字组成纯文字卡片图文混排，用于有图片内容的单据图文卡片比图文卡片更简洁，常用于信息较少的单据或子表卡片小图片卡默认按元数据实体的字段顺序依次匹配卡片字段绑定只匹配图片类型的字段图片位置可匹配除图片和附件之外所有的字段非图片位置三、移动端页面设计器三、移动端页面设计器添加设置1.移动端组件库设计页面布局的容器类组件布局容器绑定实体数据的容器类组件数据容器渲染页面内容显示的组件基础控件提供给用户交互操作并提交数据的组件表单控件常用页面交互及调用移动设备能力的组件功能组件单据流程相关操作组件业务组件从外部获取并显示数据的组件接口组件2.移动端样式设计设置组件的整体宽度和高度宽高设置先在画布中选择组件，在右侧属性样式页进行调整支持rem(自适应)px(固定尺寸)%(屏幕比例)三种单位设置组件及子组件文本的大小、颜色、字符形状等字符设置设置组件的边框和圆角边框设置设置组件的内外边距边距设置流式布局、标签和图片三个组件支持阴影设置阴影设置设置组件的背景，支持颜色或URL图片链接背景设置3.事件触发按钮有单击事件动作页设置组件的事件触发脚本或命令常用组件事件文本框有获取焦点、失去焦点、值改变事件页面有页面初始化事件等前端函数：执行前端脚本待选操作后端函数：执行后端脚本执行命令：执行系统预置的命令前端动作：执行常用的前端动作3.预览调试总结移动端页面设计移动端布局移动端卡片模板移动端页面设计器组件属性样式动作画布思考1简述低代码开发平台移动端页面设计器常用分区和功能？思考2列举移动端页面设计常用的三种单位？移动端首页设计目录一、移动端首页二、首页常用表现形式三、首页设计示例一、移动端首页一、移动端首页01-02-首页通常是打开应用后进入用户视野的第一个页面展示APP的主要功能模块和信息，方便用