Oinone社区 作者：史, 昂原创文章，如若转载，请注明出处：https://doc.oinone.top/oio4/9203.html
访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验
相关推荐
-
高级组件
本篇主要结合业务场景介绍高级组件的使用方法。 级联选择/树选择 级联选择与树选择是同一类业务场景、不同的交互体验，在这里我们一起说明。 业务场景 行业分类、产品类目/分类等自关联场景，案例以行业分类说明。 操作步骤 Step1：搭建模型 搭建行业模型，在行业模型中创建多对一字段“上级行业”，指多个子行业对应一个上级行业。如下图： Step2：界面设计 创建行业的表格视图，绑定菜单，并且在此视图中增加“跳转动作 – 新增行业”； 创建新增行业表单，将“上级行业”拖进画布中，组件切换为“级联选择”，属性面板配置“选项字段、搜索字段、透出字段”，平台低代码为每个模型自动生成了名称、编码字段，如果不使用平台提供的名称、自建名称时，需要配置这三个字段； 为“上级行业”设置联动关系，自关联默认选择行业、标题定义为行业名称、自关联的字段为上级行业。 配置后发布表格、表单视图，即可获得级联选择效果。 表单视图中将“上级行业”切换为“树选择”组件，在发布后，即可获得树选择效果。 Step3：效果展示 级联选择 树选择
-
企业个性化配置
平台除了帮助企业快速解决业务需求外，还提供了企业文化、风格个性化能力，本章节详细介绍个性化配置。包括：登陆页配置、企业形象配置、系统风格配置。 系统配置 配置入口 配置入口：右上角登陆账号——系统配置——全局配置——登陆页配置、企业形象配置、系统风格配置。 登陆页配置 用户自定义登陆页的主题，一共有六个主题可选择，分别为： 图一：左侧是图片，右侧是登录输入框，Logo在左上角； 图二：右左侧是图片，右侧是登录输入框，Logo在左上角； 图三：底图是图片，登录输入框浮在页面左侧，Logo在左上角； 图四：底图是图片，登录输入框浮在页面中间，Logo在左上角； 图五：底图是图片，登录输入框浮在页面右侧，Logo在左上角； 图六：底图是图片，登录输入框浮在页面中间，Logo在登录框上方。 页面背景 上传登录页背景，支持上传jpg、png格式的图片或mp4、mov、avi格式视频。尺寸建议为1920*1080px，文件大小不超过50MB。 登录页logo：指配置登录页左上角的logo图标。 预览：配置后可在右侧电脑中点击全屏预览效果。 配置示例 企业形象配置 企业形象配置：可设置企业信息、业务应用导航栏logo、浏览器logo，设置完成之后，点击发布之后设置生效。 系统风格配置 系统风格配置，可设置主题（浅色、深色）、尺寸（大、中、小），配置后可全屏预览，发布后即可更换成对应的风格。 下载代码可进行自定义风格。
-
自定义组件
1. 定义组件介绍 平台提供了大多数的通用组件，面对企业个性话需求、复杂的业务场景，我们也提供了自定义组件的能力，帮助企业更快实施业务需求。 自定义组件包含“组件画廊”“组件排序”“元件画廊”“元件属性设计”四个页面。 1.1 组件与元件 在介绍如何自定义组件前，需要先了解以下概念： 组件：页面设计的组件库中看到的是组件。每个组件都有自己的属性面板，通过属性、字段决定组件逻辑，而自定义组件就是需要构建出组件自身的属性信息，再结合业务配置组件的属性、使用组件。 一个组件在不同的业务类型、视图类型、单值/多值，其属性面板是不同的，不同业务类型、视图类型、单值/多值的组合我们成为元件，多种组合即为多个元件，所以一个组件包括多个元件。 元件：一个组件可以对应多个元件。在创建时明确元件所适用的字段业务类型、单/多值、视图类型，在画布中切换元件时，会结合当前组件的字段业务类型、单/多值、所在视图类型确定可以使用哪一个元件。 此处切换的也是元件。 示例：创建一个“下拉选”的组件，其中可以包含“下拉单选”“下拉多选”两个元件。“下拉选”组件从组件库中拖入时，设置单值时使用“下拉单选”元件，设置多值时使用“下拉多选”元件。 2. 组件管理 2.1 组件创建 在组件画廊页面，点击添加组件，在弹窗中完善信息创建组件。 2.2 组件操作 自定义组件支持“搜索、删除、作废、查看引用关系、管理元件、编辑、低无一体、排序”的操作。 搜索：默认搜索可见组件，可切换“全部、可用、废弃”搜索组件，也可使用组件名称搜索。 删除：若组件未被引用，则可以直接删除。 作废：组件作废后，不可在画布中展示，不可在组件切换时使用，但已使用的数据不影响。 查看引用关系：可以查看存在引用关系的页面，支持点击跳转到对应页面的设计页面。仅当组件无引用关系时才支持删除。 管理元件：点击进入元件的管理页面。 编辑：可修改组件名称、组件图表、组件描述。 低无一体：比较复杂，在第5章中单独讲解。 排序：进入排序页，可拖动排序自定义组件。自定义组件会插在系统组件之后。可以点击“查看排序结果”选项页查看最终排序结果。排序同样会更新画布中的组件库顺序。 3. 元件管理 3.1 元件创建 在元件画廊页面，点击添加元件，在弹窗中完善信息创建一个元件。 3.2 元件操作 元件支持“删除、作废、查看引用关系、编辑、设计元件属性”的操作。 删除：若元件未被引用，则可以直接删除。 作废：元件作废后，不影响原来已使用的元件，无法新添加、使用该元件。 查看引用关系：可以查看存在引用关系的页面，支持点击跳转到对应页面的设计页面。仅当元件无引用关系时才支持删除。此处的引用关系数量会小于等于组件引用关系的数量。 编辑：可修改元件名称、支持视图类型、元件描述。 设计元件属性：比较复杂，将在第4章中单独讲解。 4. 设计元件属性 元件属性设计页面主要操作集中在这三部分，分别是①视图切换②属性面板设计区③复制功能 视图切换：元件创建时选择的支持视图类型，在①区域平铺可切换对应视图的属性面板进行设计。 属性面板设计区：可将组件拖入属性面板设计区进行设计，设计的是自定义组件的属性面板，左侧组件库和页面设计的组件库相同，仍然支持创建字段或使用模型字段，右侧进行元数据面板、属性面板设置。 复制功能：可将已设置好的属性面板复制到其他视图，提高设计效率。 5. 低无一体 低无一体简单讲就是组件代码上传，通过载入代码使组件在设计页面和实现页面可见和交互。 系统内置的属性不满足需求时，要用低无一体写代码，定制属性，比如从模型中拖拽设计就是内置的属性，从组件库中设置，就要配合低无一体，否则无效。 首次进入组件设计或组件中的元件变更时需要生成SDK。 生成结束后展示SDK生成时间，并且“下载模版工程”按钮可用。 点击下载模版工程，会自动下载模板工程。 在模版工程中编写前端代码。 根据实际需求上传JS、CSS文件后提交即可。
-
数据大屏
1. 业务场景 数据大屏是利用相应的系统来分析数据，通过图形的形式为企业提供客观、直接的数据分析结果，让业务人员和企业决策者直观面对数据背后的信息，实时监测企业数据，给予更直观的决策场景体验，助力企业数字化运营升级。 2. 操作流程 1）进入数据可视化，进入数据大屏tab，维护分组信息； 2）在二级分组名称后点击“+”【添加数据大屏】，对数据大屏进行设计； 3）创建完成后可以【编辑】数据大屏； 4）数据大屏完善后，可以点击【发布】数据大屏，则数据大屏此时可以被显示器引用播放； 5）如果数据大屏有更新，则可以点击【更新发布】； 6）如果数据大屏数据不再可以公开使用，则需要通过【隐藏】功能将数据大屏的引用权限收起，但不影响已被使用的数据大屏； 7）隐藏后可以【取消隐藏】，数据大屏恢复隐藏前的状态和功能，可以被引用 。 3. 操作流程图解 3.1 创建分组 1）操作流程：创建分组 2）操作路径：数据可视化-数据大屏-创建分组 3）点击搜索框后的「+」创建一级分组，输入一级分组名称后，点击一级分组后的「+」创建二级分组，输入二级分组名称后，此时分组创建完成，可以在二级分组下创建数据大屏 3.2 编辑分组名称 1）操作流程：选择分组-编辑分组名称 2）操作路径：数据可视化-数据大屏-编辑分组名称 3）鼠标移动至需要修改的分组上，点击出现的「编辑图标」，可以修改分组名称，修改后分组名称实时更新 3.3 删除分组 1）操作流程：选择分组-删除分组 2）操作路径：数据可视化-数据大屏-删除分组 3）鼠标移动至需要删除的分组上，当分组下无报表时出现「删除图标」，可以点击图标后删除分组，删除一级分组时对应所有的二级分组也会被删除，删除后消失，只有分组下没有数据大屏的分组才能直接删除成功 3.4 创建数据大屏 1）操作流程：选择二级分组-创建数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-创建数据大屏 3）鼠标移动至需要创建数据大屏的二级分组上，出现「+」，点击图标后=需要填写数据大屏标题 a数据大屏标题：最大支持20个字，支持汉字、数字、大小写字母、-；同个一级分组下不允许重复； 4）输入标题后进入设计页面 3.5 编辑数据大屏 1）操作流程：选择数据大屏-编辑数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-编辑数据大屏 3）只能编辑未发布或者已发布但没有被隐藏的数据大屏，且存在三种编辑情况 a. 第一种：点击数据大屏标题后的编辑图标，仅能编辑数据大屏标题； b. 第二种：点击数据大屏中的数据大屏标题、备注后的编辑图标，可以直接编辑数据大屏标题； c. 第三种：点击【编辑】按钮，进入数据大屏设计页面，带出已有的组件内容，编辑时的规则与创建时一致，编辑后可以点击保存进行更新，如果未保存直接返回，则编辑无效； 4）编辑后实时生效，数据大屏信息保持展示最新效果 3.6 删除数据大屏 1）操作流程：选择数据大屏-删除数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-删除数据大屏 3）未发布或者已发布但没有被隐藏的数据大屏，并且没被引用，才展示数据大屏菜单名称后的删除图标 4）删除后数据大屏消失 3.7 复制 1）操作流程：选择数据大屏-复制数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-复制数据大屏 3）点击【复制】按钮，复制成功，名称为copy of 原数据大屏标题，展示在原数据大屏分组的最后一个 3.8 发布 1）操作流程：选择数据大屏-发布数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-发布 3）选择单个未发布且没有被隐藏的数据大屏，点击【发布】按钮，数据大屏状态变为已发布，展示最近发布时间； 4）如果数据大屏发布后有更新内容，会展示的更新类型：更新数据大屏信息/更新数据大屏内容 3.9 查看最近一次发布的版本 1）操作流程：选择数据大屏-查看最近一次发布的版本 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-更新发布数据大屏 3）当数据大屏发布后有更新，在最近发布时间左侧展示【查看】，在最近发布时间下展示更新的类型，点击查看可以查看最近发布的版本 3.10 更新发布 1）操作流程：选择数据大屏-更新发布数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-更新发布数据大屏 3）选择单个已发布且没有被隐藏的数据大屏，并且该数据大屏在上次发布后有所更新，可以点击【更新发布】按钮，将最新的数据大屏内容发布至业务系统，业务系统引用的数据大屏为最新内容； 4）如果更新了内容，但未点击更新发布，则展示的仍是上次发布的数据大屏 3.11 隐藏 1）操作流程：选择数据大屏-隐藏数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-隐藏数据大屏 3）数据大屏默认不隐藏，点击数据大屏左侧的是否隐藏可以切换 a. 未发布的数据大屏，较隐藏前，不可以操作【发布】，可以【取消隐藏】； b. 已发布的数据大屏，较隐藏前，只能操作【导出图片、导出excel、取消隐藏】； 4）隐藏后的数据大屏不可以被用于展示在其他大屏上，但不影响已经被引用的数据 3.12 取消隐藏 1）操作流程：选择数据大屏-取消隐藏数据大屏 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-取消隐藏数据大屏 3）隐藏后的数据大屏可以取消隐藏，切换是否隐藏=否，取消隐藏后，数据大屏恢复隐藏前的状态和功能，可以被引用 3.13 查看引用 1）流程：选择图表-查看被哪些报表/数据大屏/页面引用 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-更多-查看引用 3）选择具体的数据大屏，查看当前数据大屏被引用的所有信息 3.14 不允许别人编辑 1）流程：选择数据大屏-不允许别人编辑 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-更多-不允许别人编辑 3）选择自己创建的数据大屏，对数据大屏是否允许其他人编辑进行设置；如果设置为不允许，则其他人无法编辑数据大屏 3.15 不允许别人引用 1）流程：选择图表-更多-不允许别人引用 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-更多-不允许别人引用 3）选择自己创建的数据大屏，对数据大屏是否允许他人引用进行设置；如果设置为不允许，则其他人无法选择到 3.16 导出图片 1）操作流程：选择数据大屏-导出图片 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-导出图片 3）选择数据大屏后，点击【导出图片】按钮可以将当前数据大屏导出为图片 3.17 导出EXCEL 1）操作流程：选择数据大屏-导出EXCEL 2）操作路径：数据可视化-数据大屏-二级分组-数据大屏-数据大屏导出EXCEL 3）选择数据大屏后，点击【导出EXCEL】按钮可以将当前数据大屏包含的图表导出为EXCEL 4. 数据大屏设计页面 4.1 缩放自适应 1）流程：创建数据大屏-进入数据大屏设计页面 2）操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3）进入页面后，默认按照当前屏幕展示最适合的数据大屏尺寸，可以通过+、-进行自定义缩放，每次缩放10% 4.2 全屏 1）流程：创建数据大屏-进入数据大屏设计页面 2）操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3）进入页面后，设置完成，可以【全屏】查看效果，按esc退出全屏 4.3 保存 1) 流程：创建数据大屏-进入数据大屏设计页面 2) 操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3) 进入页面后，设置完成后进行保存，数据大屏保持最新内容 4.4 添加、编辑、删除组件 1）流程：创建数据大屏-进入数据大屏设计页面 2）操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3）可以添加图表、文本、通用标题、倒计时、时间器、图片、轮播图、视频、边框等组件；图表组件中，一个图表只能添加一次，其他组件不限制数量； 4）所有组件添加后均可进行设置样式，有编辑权限的图表组件可以通过【编辑】图标直接进入图表设计页面； 5）添加后均可删除，删除后组件不再展示在数据大屏画布中，可以重新添加 4.5 数据大屏设置 1）操作流程：创建数据大屏-进入数据大屏设计页面 2）操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3）设置数据大屏时可以设置屏幕的宽高、背景颜色、背景图片、主题 a. 宽高：根据数据大屏需要投放的屏幕大小进行设置； b. 背景颜色：当数据大屏无图片背景时可以调整背景颜色； c. 背景图片：支持为数据大屏上传一张图片作为背景； d. 主题模版：可任选其一，需要先选定模版后再进行设计，不然设计完后再修改模版，会清空已选组件。 4.6 图表组件设置 1）操作流程：创建数据大屏-进入数据大屏设计页面 2）操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3）拖入图表组件，可与边框合为一体，可以设置图表的显示内容、边框信息、动画效果、刷新频率 a. 图表显示内容：展示标题、副标题、描述、标签、图例，一屏展示条数，原图表有的内容在设置展示后展示在数据大屏，原图表没有的内容设置展示后不生效； b. 边框信息：包括边框样式、背景颜色、边框线条颜色、展示边框标题、边框标题内容、边框标题颜色、边框标题字体大小； c. 动画效果：可以设置自动轮播，为是时可以设置结束后停顿时长、速度、切换形式； d. 刷新频率：设置图表获取数据的频率，自动刷新、刷新频率。 4.7 文本组件设置 1）操作流程：创建数据大屏-进入数据大屏设计页面 2）操作路径：数据可视化-数据大屏-创建/编辑-设计页面 3）拖入文本组件后，可以输入多行文本，可以设置内容、对齐方式、字体大小、字体加粗、字体颜色、背景颜色、边框样式、文字滚动、结束后停顿、速度 4）当文字滚动开启时，文字会按照一行展示，通过设置结束后停顿和速度来控制文字滚动的效果 4.8 通用标题组件设置…
