画面管理

用于管理所有已创建的画面。通过画面管理，用户可以在不同的前台之间进行切换，以显示对应前台的画面内容。同时，画面管理还提供了目录管理及对画面的新增、删除、修改、分享等操作。

tip

1. 初次使用系统时，画面中已内置菜单画面和首页画面，可通过预览查看前台效果；

画面目录

画面目录中包括全部画面、关注画面、回收站、无目录画面以及用户创建的画面目录。其中，全部画面、关注画面、无目录画面和回收站为固定项，用户创建的画面目录可进行修改或删除。

配置说明

1. 全部画面：展示当前前台下的全部画面；
2. 关注画面：展示当前前台下的关注的画面，用户只能查看自己关注的画面；
3. 回收站：回收站中是未彻底删除的画面，进入回收站的画面，将被保留7天，7天内可以进行恢复，7天后将彻底删除。也可在回收站中直接将画面删除，那么该画面将被彻底删除；
4. 创建目录：点击画面目录右侧的图标，弹出创建目录弹窗，输入目录名称后点击提交，画面目录便可创建成功，同一个前台下目录名称不能重名；
5. 创建子目录：选中目录，点击右侧的创建目录图标，可创建子目录；
6. 修改画面目录名称：选中目录，点击右侧的图标或双击目录名称，可修改目录名称；
7. 目录层级关系调整：目录可以通过拖拽形式，调整目录之间的层级关系。

画面列表区域

画面列表区域是用于展示画面及其相关操作功能的区域。在这个区域中，用户可以直观地查看已创建的画面，并进行相应的操作。

配置说明

1. 过滤画面：可在搜索框中输入关键字，进行画面搜索，搜索框支持模糊搜索；
   
2. 画面排序方式：画面排序：支持按修改时间排序和按创建时间排序，默认是按创建时间倒序排序。
   
3. 更多操作：包含批量导入、批量导出和批量删除。
   
   批量导入：可以批量导入画面，仅支持压缩包格式文件上传，选择完文件后，可选择画面导入的目录，不选择目录，默认导入全部画面中，若选择目录，则导入到选择的目录中；
   批量导出：可选择多个画面进行批量导出，可全选画面，也可通过画面卡片的复选框选择画面，选择完画面后，点击批量导出按钮导出画面，导出为压缩包格式文件；若取消批量导出，点击取消按钮，退出批量导出操作区域；
   批量删除：可以选择需要删除的画面进行删除，也可取消批量删除功能。画面批量删除后会放置到回收站，保留7天，可以进行恢复，7天后将彻底删除！
4. 每页显示条数:可设置画面每页显示条数，默认每页显示24条。
   
5. 画面卡片上的功能操作说明
   

• 预览：前台预览画面；
• 编辑画面：进入画面编辑页面；
• 复制画面：可复制画面。
• 分享画面：可分享画面，分享画面时需要设置查看者的权限，操作如下：
  • 开启登录查看后，查看者阅览该分享链接需要进行登录操作，画面的相关权限以查看者的权限为主；
  • 关闭登录查看后，查看者无需登录即可查看，但可以通过权限设置限定查看者对该画面的相关权限。若未进行权限设置，查看者的相关权限将继承分享者的权限。
    说明：当页面管理中设置了父级页面时，分享画面中配置增加【显示层级页面】配置项，开启显示层级页面后，画面分享时会显示页面管理中已创建父级页面。
• 分片：开启后，一次性或分片式加载组件,开启后解决画面组件数量较多时一次性加载缓慢问题。开启分片功能，画面卡片右上侧将显示分片图标。
  
• 删除画面：点击删除画面图标“”，可删除画面，可选择是否彻底删除，若选择彻底删除，该画面将被彻底删除，若未选择彻底删除，该画面将会放置到回收站，保留7天，可以进行恢复，7天后将彻底删除！
  
• 关注画面：点击关注画面图标“”，可关注画面，关注的画面也可以通过画面目录中的关注画面进行查看。
• 修改画面名称：可以通过双击画面名称，修改画面名称。

添加画面

画面的搭建是前台系统配置中不可或缺的一步。点击页面右上方的添加画面按钮，进行画面的添加。添加画面时，可根据需要选择模板。若不选择模板，则会生成一个空白的画面。选择模板时，模板中包括画面模板和布局模板，用户可以根据需要自行选择，方便快速搭建所需的画面。

配置说明

1. 画面名称：可自定义输入画面名称，同一个前台下，同一个目录下的画面名称不可重复；
2. 所属目录：选择画面的所属目录，选择后，画面可通过选择目录来查看画面；若未选择目录，画面可在全部画面中查看；
3. 模板介绍：模板包括画面模板和布局模板；

• 画面模板：模块包括PC模版和手机端模版；模板库中内置了行业中通用的画面模板，可选择适合当前画面的模板使用，选择画面模板后，新建的画面中将会引用模板的内容，减少了用户搭建所需的时间，未来AIRIOT的模板库会不断更新，满足各行各业使用；
  
• 布局模板：布局模板库中内置了通用的布局方式，用户可选择适合当前画面的布局模板使用。选择布局模板后，新建的画面将会应用该模板的布局方式，让用户在搭建画面时更加高效和便捷；

画面添加完成时，进入画面编辑页面。

画面编辑

画面编辑页面，是用来制作可视化页面的，可以进行web、app、大屏等页面的制作，画面中内置多种可视化组件，通过拖拉点拽的形式即可搭建画面，画面支持多种数据源，让组件数据的绑定更加灵活，满足各类物联网平台可视化场景的应用需求。

画面编辑页面主要分为五部分，分别是：顶部工具栏区域、底部工具栏区域、左侧操作区域（组件库、项目树、资源、自定义组件）、右侧属性配置区域和中间的画布区域，下面是详细的使用说明：

顶部工具栏区域

1. 返回：点击返回图标，将会退出当前的画面编辑页面，返回到可视化的管理页面；
2. 画面名称：此处显示画面名称；
3. 草稿/发布：画面编辑分为两种状态：草稿状态和发布状态，当画面发布后，画面状态为发布状态，只有发布状态的画面才可以在前台进行查看；未发布或画面在发布之后再次进行修改时，均为草稿状态；保存只是保存草稿的操作，发布成功后的画面会自动保存为一个版本，可在版本记录中查看版本，并恢复对应的版本，则画面返回该版本的画面。
   
   
4. 框选：点击框选ICON后，鼠标进入框选状态。移动到画布上方，长按鼠标左键进行框选,同时选择多个组件。框选完成后，可以对选中的组件进行统一配置，如删除、编辑布局、样式等。同时支持在组件树中，通过长按shift+鼠标点选的方式选择多个组件。
   

• 拖拽调整位置：框选后，按住鼠标左键拖动选中的组件群组，将其移动到目标位置。
• 修改对齐方式：框选后，使用对齐工具调整选中组件的对齐方式，例如左对齐、右对齐、顶对齐或底对齐等。
• 修改相同属性：框选后，可以同时修改选中组件的相同属性（如布局、颜色、字体、大小等），提高编辑效率。
• 批量功能：框选后，按Delete键将所选组件删除。

5. 格式刷：格式刷功能可将一个组件的属性复制并粘贴到其他组件上，从而实现快速一致的样式和属性设置。使用格式刷功能可以提高编辑效率，确保多个组件之间的样式一致性。

• 画面使用格式刷

  • 选择源组件：点击选中想要复制属性的组件。
  • 激活格式刷：在工具栏中点击格式刷图标，格式刷将被激活，此时已经将源组件的属性复制，鼠标移入画布及组件上方时，单机左键，选择粘贴的属性范围，确定后将粘贴所选属性到组件上。
  • 框选粘贴属性：鼠标激活格式刷后，激活框选功能，鼠标移入画布及组件上方时，长按左键框选组件，松开左键框选结束，选择粘贴的属性范围，确定后将粘贴所选属性到框选的组件上。
    

• 组件树使用格式刷

  • 选择源组件：点击选中想要复制属性的组件。
  • 组件树粘贴属性：在工具栏中点击格式刷图标，格式刷将被激活，此时已经将源组件的属性复制。鼠标移入到目录树上方，单选或者多选项目树组件时，在组件操作中找到【粘贴组件属性】，选择粘贴的属性范围，确定后将所选属性粘贴到所选的组件上。

6. 自动保存：画面的自动保存功能，开启后，系统会自动将修改的内容保存下来；关闭自动保存后，若需要保存画面，需要手动保存或者Ctrl+S快捷键方式保存画面。
7. 脚本管理：用于管理当前画面的脚本，包括自定义脚本方法和当前画面的脚本编辑。在脚本管理页面，用户可以编辑当前画面的脚本代码；
   

• 左侧列表：是已经进行了脚本编辑的的组件列表，点击组件，可查看对应组件的脚本内容；
  • 弹窗组件脚本，提供弹窗关闭前执行事件与弹窗关闭后执行事件等相关脚本示例，方便用户使用；
  • 输出类型组件，提供了获取组件输出值的对应方法；
• 创建函数：创建自定义函数，创建成功的函数可在当前系统下的所有画面中调用，方便代码的复用。创建成功的函数保存在函数中的【自定义函数】，再次使用该函数时，可随时调用，方便用户的脚本编辑；
• 独立页面编辑：点击独立页面编辑按钮后，脚本弹窗以浏览器页面形式打开，可边调试边修改，方便画面制作。
  
• 函数：包括系统内置的函数方法和自定义的函数，均可根据需要进行调用；
  • 系统函数：系统预定义的函数，提供了常用的功能和操作。
    • 表：查询表列表、根据id查询表详情、新增表、修改表、删除表。
    • 表数据：查询某个表数据、根据id查询表数据详情、查询是否有表的添加权限、新增一条表数据、修改表数据、删除表数据。
    • MD5：MD5加密。
    • 指令：执行指令。
  • 画面函数：用于操作和控制画面元素。
    • 查询画面变量
    • 获取数据源数据
    • 添加/修改画面变量
    • 删除画面变量
    • 查询系统变量
    • 修改系统变量
    • 修改画面组件属性
  • 自定义函数：用户根据具体需求编写的函数，可以实现特定的逻辑和功能。
  • 二次开发函数：在现有系统基础上进行扩展开发所创建的函数，通常用于增强或定制系统功能。
  • ECMAScript中函数:JavaScript语言中的标准函数，用于实现各种脚本和编程逻辑。
  • html对dom操作的函数:用于操作HTML文档对象模型（DOM）的函数，能够动态修改页面内容和结构。
  • Web存储:用于在客户端浏览器中存储数据的函数，包括localStorage和sessionStorage。
  • Web Sql:用于在浏览器中执行SQL数据库操作的函数，方便进行数据存储和查询。
  • Web Worker:用于在后台线程中运行脚本的函数，能够在不影响页面性能的情况下执行复杂计算。

• 属性方法：右侧的组件树上可以获取到组件的属性和方法进行使用；
• 预览：可以预览组件在编写脚本后的效果，预览时用户可以通过控制台查看相关接口返回的数据结构，判断是否符合脚本的处理预期；
• 保存：保存脚本中的的内容操作，每个组件的脚本编写后，均需要保存，若未保存，切换到其他组件时，其组件的脚本编写内容将会清除。

8. 数据源：数据源可以作为画面中的组件绑定数据使用，支持多种数据源，其中内置的示例数据包括图表数据、表格的数据，这两种数据不可修改、删除，可被绑定及用于数据示例用；用户可以根据需要创建所需类别的数据源，共有七种类型数据源，分别是模拟数据、平台接口、混合数据、报表数据、数据接口、历史数据、实时数据、表数据、视图数据；每个数据源可建对应子数据源，满足各类型的数据源要求，下面是详细的使用说明：

• 图表示例：用于图表的示例数据，不可修改或者删除，可以作为组件的数据源进行绑定，辅助用户理解图表数据的数据格式。
  

  • 动态值：开启动态值后，数据会动态变化；
  • 间隔：设置动态值变换时间间隔；
  • 推荐组件：根据生成的数据格式推荐组件；当数据格式为表格类型时，推荐表格组件，当数据格式为图表类型时，推荐折线图、柱状图组件。点击推荐的组件时，推荐的组件将增加在画布下。

• 表格示例 ：用于表格数据的示例，不可修改或者删除，可以作为组件的数据源进行绑定，辅助用户理解表格数据的数据格式；

• 模拟数据：用户可以自定义模拟数据，按照需要的图表数据格式或表格数据格式创建数据源。模拟数据可以创建相应的子数据源，子数据源将继承父级数据源的 JSON 数据。目前子数据源只支持脚本修改。双击数据源名称区域可修改名称；（下方有相同功能将不在说明）

• 平台接口 ：可以从平台接口获取数据作为数据源，子数据源创建同模拟数据，这里不再说明；
  
  • 接口地址：下拉中选择常用的数据查询接口，也可以手动输入接口地址；
  • 请求方法：根据需要填写，获取数据以get、post为主；
  • 请求头：根据接口查询数据的的规则要求填写；
  • 请求参数：根据接口查询数据的规则要求填写；
  • 预处理数据：只有接口数据返回数据为数组格式时，支持预数据处理，否则依然返回源数据；
  • 轮询时间：填写接口数据更新数据的时间间隔，单位秒，不填写，数据不进行更新；
  • 提交请求：当未完成接口配置时，该按钮为置灰状态，无法点击；当上方配置符合要求时，按钮可点击状态。请求成功后，JSON将展示该接口返回的数据；

• 混合数据：可以将数据源中的已经创建好的数据混合进行使用，形成一个新的数据源；

  • 数据源：选择已经创建好的数据源。

• 报表数据:可以获取报表管理中的报表结果作为数据源；

• 报表选择：选择报表管理中创建的报表；
• 时间：选择报表的查询时间；
• 类目：设置类目轴数据，填写起始单元格和结束单元格，只能选择一行或一列中的数据，如A1:A10; 若指定A1单元格下所有数据，则填写A1:down，若指定A1单元格右侧所有数据，则填写A1:right；
• 数据：设置指标数据，规则同类目。

• 数据接口：可以从数据接口获取数据作为数据源,其余功能介绍同模拟数据，这里不再说明;支持数据接口数据源的导入导出操作。
  

  • 分组：选择数据接口中创建的数据分组；
  • 接口：选择数据接口；

• 历史数据：可以获取数据点的历史数据作为数据源；
  

  • 时间类型：设置时间类型后，使用该数据图表的X轴类型需设置类目轴；

  • 类型：选择时间或时刻，当选择类型为时间时，只需定义历史数据的查询时间范围即可，例如从当前开始统计前1季度的数据；当选择时间为时刻时，还需定义统计周期，即历史数据统计的是当前时间中每个周期的数据；
    

  • 时间选择：选择查询时间的的范围；

    tip

    当历史数据源查询范围为“介于”时，增加班次记录绑定，其他查询范围不支持此功能。绑定班次后，可实现查询指定日期班次的历史数据，详细使用介绍请到班次表中画面历史数据源绑定说明查看。

  • 周期 :选择查询的周期；

  • 时刻时间：选择时刻时间；

  • 时间分组：定义时间分组后，历史数据会按照分组时间对数据进行平均值的聚合计算；

  • 数据点：添加数据点信息，可添加多个数据点；点击添加数据点按钮后，再次点击数据点设置按钮，选择需要查询历史数据的数据点；
    
    设备：选择设备，当数据点选择的是表级别的数据点，则可以通过选择设备来查询对应的历史数据；
    数据点：选择需要查询历史数据的数据点；可直接选择设备级别上的数据点，则可直接查询对应数据点的历史信息；或选择表级别的数据点，便需选择设备，才可查询对应数据点的历史数据；
    内置查询：可对数据点的值进行过滤，只查询符合条件的数据；
    
    小数位数：设置保留的小数位数；
    项目名称：设置查询数据的字段标题名，默认为表名-数据点名；
    

  • 数据项：数据项是对数据点进行聚合计算得出的值，当需要对数据点进行聚合计算时，需通过数据项选择数据点及指定聚合方法等来查询历史数据；
    
    分组字段：分组字段包括设备编号、部门、数据点属性；比如选择了设备表后，不选择具体设备，分组字段选择按照设备编号则查询表下数据点按照设备编号分组进行聚合运算； 聚合方法：包括平均值、中位值、数量、最小值、最大值、求和、首个值、最末值，不选择时，默认为平均值；
    列值：选择数据点，也可对数据进行运算，包括数学函数和聚合函数，详见下图；
    

  • 轮询时间：设置数据更新间隔时间，单位s；若不填写，当页面刷新的时候，数据会进行更新；

  • 转换格式：可转换表格数据或自定义，自定义需要进行脚本编辑转换：

• 实时数据：实时数据即显示绑定数据点的实时数据信息;
  

  • 数据时段：设置实时数据的统计时段；

• 表数据：获取数据管理、数据集中的表数据作为数据源；也支持对表中数据进行聚合，以聚合后的数据作为数据源;
  

  • 数据：选择数据的来源，来源于数据表或是数据集；下方的配置项将根据选择的数据进行联动；
    • 【数据表】
      ① 数据表：选择需要查询或者聚合处理的数据表，包括系统内置的报警表和日志表以及表管理中的设备表、部门表、数据分析表和普通表；
      ② 过滤条件：设置数据表的过滤条件，不设置时，数据表记录不进行过滤；
      ③ 开启聚合：是指是否聚合，开启聚合时，需要设置分组及数据列，不开启聚合时，需要配置查询字段级排序；
      ④ 分组：开启聚合时需设置分组的字段，可以进行多个分组，设置分组后，将根据分组分别进行聚合计算；当选择的分组字段时多选的选择器时，下方联动显示【按选项值统计】配置项，选择是时，则按照选择器的选项为维度进行统计，选择否时，则按照已经选择的值进行统统计。
      
      ⑤ 数据列：选择聚合方法，聚合方法详见下图；
      
      ⑥ 查询字段：为表中的所有字段；
      ⑦ 查询条数：为查询的总条数；大于0的正整数，不可输入0、负数、小数；当输入的查询条数大于数据总条数，则查询全部数据； 查询起始条数：为查询的起始条数，查询起始条数为大于0的正整数，不可输入0、负数、小数，是从第几条开始查的配置项，为空时，为从第一条开始查，当输入的查询条数大于数据总条数，则查不到数据；
  • 【数据集】
    ① 数据集：选择需要查询或者聚合处理的数据集。
    其他配置项详见数据表下的说明。当选择的为关联数据集且表中字段的key相同时，字段后方会显示表名称，让用户选择更加清晰。

• 视图数据：可以获取数据视图中的数据作为数据源；
  

  • 数据视图：选择数据视图中的数据，将该数据作为数据源；
  • 指标筛选：当选择数据视图后，指标筛选可进行修改、添加或者绑定，点击发送查询数据，数据源的指标筛选修改不影响数据视图的数据配置；
  • 过滤条件：当选择数据视图后，过滤条件可进行修改、添加或者绑定，点击发送查询数据，数据源的过滤条件修改不影响数据视图的数据配置。 当视图中字段的key相同时，字段后方会显示表名称，让用户选择更加清晰。
    

tip

1. 数据源的名称不可为空，不可重复。
2. 数据源中平台接口、数据接口、历史数据、实时数据、聚合数据的返回的数据格式适用于图表或者表格时，对应的tap会亮起，提示该数据格式可应用于图表或者表格；
   
3. 当画布中父级组件绑定了数据源，子组件未绑定数据源时，可继承使用父级组件的数据源，若子组件绑定数据，则以子组件绑定的数据源为主

9. 画面变量：可定义画面中使用的变量，变量类型包括自动、数组、对象、字符串、公式；组件可绑定画面变量，根据编辑变量来控制组件的属性相关配置等；

• 自动：根据数据类型自动识别变量类型，无需手动指定。适用于数据类型不固定或变化的情况。
• 数组：设置数组类型的变量。
• 对象：设置对象类型的变量。
• 字符串：设置字符串类型的变量。
• 公式：设置公式类型变量，可以通过变量和运算符进行动态计算。

10. 风格：可定义画面的风格，系统内置清新风格与暗黑风格， 若需要修改，可直接在对应风格的基础上进行修改，修改后点击另存为按钮，填写对应表单，生成新风格，新风格可应用于当前系统下的所有画面；
    tip

    注意：当设置了前台的主题、同时设置了画面风格和组件样式时，优先级为组件的样式>画面风格>前台主题。

11. 后退：操作向后退一步，返回对应的画面编辑状态；
12. 前进：操作向前进一步，返回对应的画面编辑状态；
13. 历史操作记录：可以查看历史的操作记录，可选择回到相应的历史画面；
14. 预览：可以预览画面的前台展示效果；
15. 保存：保存当前画面的编辑内容。请注意，在多人同时打开同一画面的情况下，仅允许第一个打开画面的用户进行保存。其他用户在此情况下将无法保存该画面。
16. 保存版本：在画面编辑中，可对编辑的画面保存为版本，生成版本记录，可以通过选择版本记录，对该版本进行恢复，返回对应的画面编辑状态的界面；
17. 发布：发布画面，发布成功后，如果当前页面在前台显示需手动刷新以查看最新的发布内容；
18. 分享画面：可以将画面进行分享，具体分享权限设置请详看可视化中的画面卡片上的功能操作说明；
19. 导入：导入画面的zip格式文件，可跨项目导入；当画面中有组件时，导入画面的zip文件，则当前画面的原内容将被覆盖，展示导入的zip文件的画面内容；
20. 导出：将画面导出为zip格式文件，导出的文件可以导入其他画面中应用；

底部工具栏区域

底部工具栏包括适配设备、设备尺寸、源代码、缩放和快捷键说明；

1. 设备适配：显示当前画面的适配设备，用于查看当前画面在对应设备下的显示效果，设配设备只能选择当前设配下的型号；
2. 设备尺寸：显示设配设备的设备尺寸，用户可根据实际的终端设备尺寸进行设置，预览时，即可查看当前画面在该运行设备尺寸下的展示效果；
3. 源代码：用来展示当前画面的源代码，源代码不可进行修改，仅用于用户查看画面代码使用；
4. 缩放：进行画面的放大缩小操作，也可通过快捷键（摁住【Ctrl】+鼠标滚轮）的形式进行放大或缩小画面；
5. 快捷键说明：快捷键说明分为排列、工具及SVG三种；
   
   

左侧操作区域

1. 组件库：组件库中的是系统内置组件，在画面制作时，可以根据需要到组件库中找到所需的组件，通过拖拉点拽便将组件加入到画布中,组件库中共有12类，具体的组件使用说明，请到对应的组件介绍中查看。

• 基础容器，查看使用说明。
• 通用组件，查看使用说明。
• 数据图表，查看使用说明。
• 业务组件，查看使用说明。
• 基础表单，查看使用说明。
• 视图及元素查看使用说明。
• GIS组件，查看使用说明。
• 视频组件，查看使用说明。
• 三维组件，查看使用说明。
• APP组件，查看使用说明。
• 页面元素，查看使用说明。
• 二开组件，画面组件支持二次开发，开发的新组件可放置到二开组件分类下，当二开组件下没有组件时，隐藏该分类。

2. 项目：项目树中的组件列表是已经添加到画布中的组件树，当同类型组件添加到画面中时，组件树中的组件名称会自动增加序号，方便用户查看使用；用户可以通过项目树定位画布中的组件，也可以通过点击画布中的组件，定位项目树；在项目树中的组件对应的操作有显示/隐藏、复制、创建自定义组件、删除，详看下面具体的使用说明：
   

• 锁定：锁定组件后，画布中无法通过单选或框选选中该组件，但仍可在项目树中选中并配置其属性；外层组件组被锁定后，内部组件会继承锁定状态，无法在画布上选中。快捷键：锁定： Ctrl/Command+K；取消锁定：Ctrl/Command+Shift+K。

• 显示/隐藏：点击切换该组件在画布区域中的显示和隐藏状态，组件的显示和隐藏仅用于画面的编辑时，预览画面时，会显示所有组件；

• 删除：删除当前的组件；

• 复制：复制当前组件；

• 粘贴：粘贴组件，当选择容器粘贴时，组件粘贴到容器内部，当选择普通组件粘贴时，粘贴到普通组件同级；

• 复制并粘贴：复制当前组件并粘贴；

• 创建自定义组件：可以将单个组件或者组件组创建为自定义组件；当您想要多次复用一个配置好相关属性的组件组时，可以通过创建自定义组件的功能将其保存到自定义组件中。当您需要在画布中使用该组件时，只需要从自定义组件中将其拖拽到画布上，组件的属性将会被保留。
  

• 名称：填写自定义组件的名称，可自定义设置，不可重名；

• 分类：选择自定义组件中的所属分类，若不选择，则该组件将在自定义组件【未分类】中查看；

• 权限：选择自定义组件的查看权限，包括仅个人可见和公开；拥有仅个人可见权限的组件只有创建用户才可以在自定义组件列表中查看，若该组件拖入到画布中，其他用户也可以查看，但不能修改该组件的属性；公开权限的组件则该组件所有用户均可在自定义组件中查看并使用；

• 属性：可以设置当前自定义组件的属性，该属性将作为画面变量，自定义组件中的组件件可绑定该变量；在配置项自定义属性中修改相应配置时，所有绑定该属性变量的组件的相应的属性值也会同步更新；

  • 选择形式：自定义组件的属性类型设置包括字段类型和组件属性类型两种。字段类型允许用户根据需求创建不同类型的属性，并在内部组件中绑定使用，适用于简单的属性配置。组件属性类型则将已有组件的基本属性作为自定义属性，适用于将组件的内部属性配置为自定义属性，确保在绑定时实现与组件属性数据格式的匹配和统一。
    • 字段类型：设置不同类型的属性，如设置文本属性，则字段类型选择文本。
      文本：可设置类型为文本的自定义属性，可以填写默认值；
      数字：可设置类型为数字的自定义属性，可以填写默认值；
      布尔：可设置类型为布尔的自定义属性，可以设置默认值，默认值为true，则勾选布尔值；
      颜色：可设置类型为颜色的自定义属性，可以设置颜色默认值，通过颜色选择器进行选择设置；
      图片：可设置类型为图片的自定义属性， 可以上传图片作为默认值
      滑动输入条：可设置类型为滑动输入条类型的自定义属性， 可以通过拖动滑动输入条设置初始值；
      表：可设置类型为表的自定义属性；
      表记录：可设置类型为表记录的自定义属性；
      数据点：可设置类型为数据点的自定义属性；
      公式：可设置类型为公式的自定义属性；
      对象：可设置类型为对象的自定义属性，需设置内部对象元素；
      数组：可设置类型为数组的自定义属性，需设置内部数组元素。
  • 组件属性：需选择组件，再选择组件的配置属性，则将组件的属性作为自定义属性。
  • 名称：设置自定义属性的名称。
  • 内部属性：可设置是否为内部属性，内部属性不会在组件属性面板中显示，一般用于组件内部绑定内部属性，可通过事件修改内部属性值，实现内部属性变化的需求。如当数据源绑定内部属性，通过事件修改内部属性时，数据源可重新获取数据，实现数据的重新请求获取。

• 【自定义组件的属性介绍】

  • 自定义属性：可以修改组件绑定的属性，修改后，绑定该属性变量的组件的相应的属性值也会同步更新；

  • 自定义组件基本属性配置区域：

    • 组件属性：展示自定义组件所设置的属性，可修改自定义属性，则绑定该属性的组件的值都会同步修改。
    • 解除绑定：解除绑定后，该组件将恢复为普通组件，从自定义组件中消失，画面中已经应用该组件的也将恢复为普通组件，将不会在自定义组件配置的同步更新范围内；

tip

自定义组件支持多层嵌套，用户可以在新自定义组件中添加已经创建的自定义组件进行组合，但需注意在画布中只能同时修改一个组件，若需修改内部的自定义组件，需单独将内部的自定义组件拖入画布编辑，保存后嵌套的内部自定义组件的修改将生效。

• 资源：资源展示系统内置了可用资源组件，同时也支持在线资源下载。用户可以根据资源类别进行筛选，选择适合的资源组件拖入到画面中使用。未来，AIRIOT的资源库将不断更新，以满足各行各业的求。
  
  • 在线资源：点击在线资源，可查看AIRIOT提供的在线资源。
    
    （1）当资源已下载时，资源卡片显示已下载的icon标识。鼠标悬停在卡片上时，可以直接应用该资源。应用后，画布中将添加该资源。
    
    （2）当资源未下载时， 鼠标悬停在卡片上时，可以下载并应用该资源。下载并应用后，画布中将添加该资源。
    （3）下载的资源存储在媒体库下载资源>资源库中，若在文件夹下删除文件，则应用过该资源的组件将丢失文件。
  • 资源卡片列表：展示了内置资源和已下载的在线资源。其中，内置资源无法删除，而下载的在线资源可以删除。删除后，已应用该资源的组件将丢失相应文件。
• 自定义组件：可以将多次复用的组件保存为自定义组件，使用时可直接拖入画布中使用，方便快捷搭建画面。例如可以将配置好图表画面件创建为【自定义组件】，当用户再次使用时，可直接通过【自定义组件】将该组件加入到画布中使用。
  
• 内置：内置组件时系统内置的自定义组件，用户不可直接修改，需另存为新的自定义组件后进行编辑。
• 添加分类：为【自定义组件】增加分类管理，作为【自定义组件】的分类使用，分类名称不可重复；
• 删除分类：点击分类名称的对应右侧的删除图标，可以删除该分类，分类下的【自定义组件】将保存在未分类下；
• 自定义组件设置：点击自定义组件上的设置图标，可以编辑、导出和删除自定义组件；；
  
  • 编辑：可以修改自定义组件的名称、分类、权限及属性；
  • 另存：将自定义组件保存为新的自定义组件；
  • 导出：可导出自定义组件，导出格式为[ 名称 ].airc.zip格式文件；
  • 删除：可删除自定义组件，删除后，所有使用该自定义组件将被删除。
• 导入：可以导入自定义组件，仅支持[ 名称 ].airc.zip格式文件，导入的文件需设置名称，可选择分类和权限，当不选择分类时，将导入到未分类下。同时，自定义组件支持拖拽到画布区域，实现自定义组件导入的效果。

属性配置区域

属性配置区域可以对画布或者组件进行属性的配置，属性包括基本属性设置，样式设置，动画设置和事件配置。

画布的属性配置说明

1. 宽度：设置画布的宽度，宽度的单位有%、px、auto，其中%是针对父级的容器的的百分比进行设置、px是具体的像素值、auto是根据显示设备的尺寸进行自适应。
2. 高度：同宽度的使用说明介绍。
3. 自适应：当画面的显示尺寸与预设比例不符时，用户可以开启此功能。切换为“开启”。此时，画面将根据所连接的显示设备进行自动适配。
4. 等比缩放：当自适应功能开启时，用户可以选择启用等比缩放。此功能确保组件的尺寸按比例调整，避免变形。开启后，所有组件的宽高比例将保持一致，适应不同屏幕尺寸。
5. 空白填充色：开启自适应时,设置画面未覆盖区域填充色。
6. 数据：绑定数据变量作为当前画面的数据来源，包括表、记录数据点、画面变量、数据源、系统设置、数据字典、迭代项等；
7. 数据表：选择表管理中的表，作为当前画面的数据来源；
8. 表记录：选择数据表中的表记录，作为当前画面的数据来源；
9. 布局方式：布局方式包括自由、弹性、栅格、堆叠；
   

• 自由：自由布局的情况下，容器中可放多个组件，组件可以自由拖拽、缩放和摆放，自由布局的基础属性配置如图：

  • 自适应：点击是，自由容器内组件会根据自由容器尺寸进行缩放；
  • 原始尺寸：计算缩放倍数的参照值的宽和高（单位px）；
  • 等比缩放：点击是，则等比缩放 ；

• 弹性：弹性布局用于设定画面的整体布局，可实现内部组件摆放的的自适应，设置画面中组件的对齐方式，不可直接随意摆放组件位置；
  

  • 布局配置： 包括两种布局类型，分别为水平布局和垂直布局；水平布局和垂直布局均可在水平与垂直方向做布局排列；

• 栅格：栅格布局将容器分割成若干行和列，单个组件可以占一个或多个栅格元素，组件之间不可重叠摆放；
  

  • 列数：设置栅格的列数、默认平均分成12列；
  • 行高度：栅格的每一行子元素的高度；
  • 子元素间距：设置子元素之间的间距；
  • 容器内边距：设置子元素与容器的内边距；
  • 自动填充：自动填充包括水平、垂直和自由三种；
    当组件的布局方式为栅格容器时，子组件的布局为列坐标、行坐标设置和占列数、占行数设置

• 堆叠：堆叠布局可以将多个组件堆叠在一起，使它们在视觉上重叠并在屏幕上占据相同的空间。这些组件按照层次结构排列，每个组件在前一个组件的上方。堆叠布局通常用于创建层叠效果的情况下使用。

• 封面：可以通过截图或上传两种方式设置当前画面的封面图像，该封面图像会在画面编辑的画面卡片通过缩略图的形式展示。

• 绑定数据：部分配置项支持数据绑定，可以通过公式、逻辑模式或脚本模式三种不同的模式进行变量数据的绑定。

  • 绑定模式：

    • 公式模式：通过简单的数学公式或运算符来绑定和计算变量数据。
    • 逻辑模式：使用条件语句和逻辑运算符来绑定数据，根据不同的条件返回相应的结果。
    • 脚本模式：通过编写脚本代码（例如JavaScript）来实现更复杂的数据绑定和处理逻辑，可以灵活地操作和处理数据。

  • 绑定内容：

    • 记录数据点：选择数据点，数据点的展示形式支持平铺展示和分组展示，可通过上方的切换按钮进行选择，支持按设备名称模糊搜索；

    • 画面变量：选择画面变量中创建的变量；

    • 组件输出值：当前画面中组件输出数据；

    • 上下文数据：选择上下文中的数据；

    • 迭代项：迭代容器组件迭代出的结果数据；

    • 数据源：选择数据源中的数据；

    • 浏览器参数：可创建浏览器参数、路由参数变量，实现页面运行时将浏览器参数及路由器变量传输到画面中；当这里设置的浏览器参数、路由器参数的变量与画面在前台访问时的浏览器地址的参数和路由器参数一致时，将会把浏览器的参数传输到画面中。

    • 系统设置：选择系统设置中的数据；

    • 数据字典：选择数据字典中的数据，；

    • 用户信息：选择用户信息的数据，包含用户相关属性等数据，包含用户ID、用户名、邮箱、电话、用户角色、表管理、表管理记录、部门以及扩展字段等。

    • 主题颜色：当颜色选择器绑定时，绑定的弹窗内会显示【主题颜色】标签页，可绑定主题颜色。
      

说明：当父级容器组件已绑定数据时，子组件绑定数据时可以通过获取父级容器的数据进行绑定。如下图所示，下图展示了父级容器绑定了数据表 B，子组件可选择绑定父容器中已有的数据。

当绑定为选择器时，可通过下方切换绑定的内容，包括原始值和名称。当绑定名称时，若字段配置中选项的名称修改，需要重新进行绑定。

当绑定为关联字段时，可通过下方切换绑定的内容，包括原始值和名称。

组件的属性配置说明

1. 布局

• 横坐标：设置组件的横坐标。
• 纵坐标：设置组件的纵坐标。
• 宽度：设置组件的宽度。
• 高度：设置组件的高度。

tip

组件的宽度和高度支持绑定变量，实现组件尺寸的动态调整。通过绑定变量，组件的宽高将随变量的变化而自动更新。当组件的宽度设置为固定比例式时，如果绑定了宽度或高度，固定比例将被取消，以适应新的尺寸设置。

• 保存默认配置：保存当前组件的宽度和高度配置作为默认设置，再次使用同类型组件时应用此配置。可进行清除，清除后，默认配置将被删除且不再应用。

2. 加载状态：绑定变量实现组件的加载状态，当变量为false时，组件为加载状态，为true时，组件加载完。
3. 放大镜：设置组件在前台预览时放大倍数。 当开启放大镜后，鼠标悬浮到组件上时，显示放大按钮，点击可实现组件放大效果。
4. 组件脚本：编写组件脚本，同脚本管理的相关说明；
5. 参数：设置参数，脚本编辑中可获取参数值；

• 例如：这是一个文本组件，定义了参数名为：airiot，参数值为：让物联网项目更简单，想要文本内容显示这个参数值，脚本可如下编辑:
  

6. 安全区：定义组件的所属安全区，包括查看安全区和执行安全区；当用户的安全区和组件安全区相同时，用户有该组件的查看或执行的权限。

6. 隐藏组件：通过绑定变量实现组件的显示与隐藏，当变量结果为(true)是显示，结果为(false)时隐藏组件,可结合动画使用。
其余详见组件的使用说明。

样式设置

点击样式图标，可设置画布的基础属性、画布背景、画布中的文字和画布外观。若基础属性中的样式及布局中的大小设定均不能满足用户对于对于组件样式的需求，可以在样式中通过css脚本实现组件样式的个性化编写；

1. 透明度：设置组件的透明度，值范围为0~1；
2. 鼠标指针：设置鼠标经过样式，指针类型有链接指针（一只手）、十字线、移动、文本、等待和帮助；
3. 内容溢出：设置当组件中内容溢出时，如何显示，包括隐藏溢出内容、滚动和自动；
4. 滤镜色相：设置设置色相参数来改变组件显示的颜色，调整范围为0°- 360°；
5. 旋转角度：设置角度参数来改变组件的方向和位置，角度范围为0°- 360°；
6. 偏移：设置横向偏移量和纵向偏移量来调整组件的位置，单位为px；
7. 缩放：设置横向缩放比例和纵向缩放比例来调整组件的大小；
8. 背景颜色：设置组件的背景色；
9. 背景图：设置组件的背景图片，支持本地上传或媒体库上传图片；
10. 字体：设置组件中的文字使用的字体，支持上传字体文件或者在媒体库中选择字体文件；
11. 颜色：设置组件中的文字的颜色；
12. 字号：设置组件中的文字的字号,字号单位有px、pt、em、rem、%；
13. 行高：设置文本行之间的垂直间距；
14. 间距：设置文本之间的水平间距；
15. 样式：设置文本样式，包括加粗、斜体、下划线；
16. 对齐方式：设置文本在组件内的对齐方式，包括左对齐、居中对齐、右对齐；
17. 边框：设置组件的边框的样式，包括颜色、宽度等；
18. 阴影：设置组件的阴影效果；
19. 圆角: 设置组件的圆角效果；
20. css脚本：用于编辑组件CSS样式的脚本编辑器，当样式中配置不满足特定需求时，可通过css脚本实现定制；
21. 背景图：设置背景图，可通过本地或者媒体库上传图片作为背景图；
22. 字体：设置字体样式；

动画

可以设置画布或组件的动画效果；

1. 启用动画：设置是否开启动画；
2. 示例预览：预览动画设置效果；
3. 执行控制：控制动画是否执行；
4. 进场方式：组件在进入画面时的出现方式，有弹跳进入、淡入、脉冲等方式；
5. 进场时长：单位为毫秒；
6. 出场方式和时长说明同进场
7. 启用循环动画：开启后，动画循环播放；
8. x轴平移量：开启后，动画会沿设定平移量进行平移；
9. y轴平移量：开启后，动画会沿设定平移量进行平移；
10. 旋转角度：组件的旋转角度；
11. 运动时间：动画的运动时间，单位毫秒；
12. 延迟时间：动画延迟时间，单位毫秒；
13. 运动曲线：运动曲线包括线性运动、加速度运动、低速开始、低速结束和低速开始和结束；
14. 是否逆向播放：点击是，动画逆向播放；

事件

事件是在画面编辑中提供的一种组件交互配置，可以通过应用模板及编辑事件进行配置，下面进行事件配置功能进行讲解。
创建的事件将已卡片的形式展示在事件tab下，卡片上提供快捷操作按钮，可进行修改和删除；

1. 应用模板：应用模板包括脉冲和取反两种模板；
   

• 选择脉冲时，选择的指令按下和松开显示两个不同的值，上升值为按下的值，下降值为松开的值，模板设置后，按下和松开事件自动生成动作；
  
• 选择取反时，选择的数据点取相反的值，此时单击事件自动形成动作；
  

2. 编辑事件：设置触发的条件、执行动作及动作配置进行事件创建；一个完整的交互事件由触发的交互条件+执行动作+动作配置三部分组成，；

• 触发的交互条件:触发交互条件配置了动作时，在交互条件的右侧会显示动作的数量，方便用户了解交互条件下配置的动作数量。 不同的组件会显示不同的交互条件，例如输入类组件的交互条件会增加值变化；

  • 单击：鼠标单击作为事件的触发的交互条件；
  • 双击：鼠标双击作为事件的触发的交互条件；
  • 移入：鼠标移入作为事件的触发的交互条件；
  • 移出：鼠标移出作为事件的触发的交互条件；
  • 按下：按下移出作为事件的触发的交互条件；
  • 松开：松开移出作为事件的触发的交互条件；
  • 值变化：当值变化时作为事件的触发条件；

• 执行动作及动作配置：选择执行动作，执行动作包括页面跳转、修改表数据、修改画面变量、修改数据字典、修改数据点属性、修改系统配置、修改用户信息、调用手动流程、执行指令、执行脚本、发送请求、修改迭代项变量；
  

• 页面跳转：可以跳转URL、画面、画面回放，下面将对详细配置进行说明：
  

  • 名称：填写动作的名称；
  • 延时（毫秒）：设置事件延时执行的时间；
  • 依赖动作：当存在多个动作时，可以定义动作间的依赖关系，即当动作A执行后，动作B才会执行，否则不执行，设定延时时间，定义依赖动作间的延时执行，例如A动作执行完多久执行B动作；（注意：依赖动作只能应用于同一个组件同一个触发交互条件下的多动作依赖，不可跨组件，不可跨交互条件）
  • 二次确认：选择是，执行动作需要进行二次确认
  • 二次确认配置：设置二次确认内容配置项
  • 输入登陆者密码：选择时，二次确认需要输入登陆者的密码；
  • 同弹窗是否再次需要输入密码：其他有二次确认的弹窗是否需要再次输入登录者的密码；
  • 提示内容：设置二次提示的文字内容；
  • 提示文字颜色：设置二次提示的文字颜色；
  • 提示文字大小：设置二次提示的文字大小；
  • 提示图标：选择提示图标；
  • 提示图标颜色：设置提示图标的颜色；
  • 提示对齐位置：设置二次确认弹窗的对齐位置；
  • 详细配置：页面跳转的详细配置；
  • 跳转目标：选择目标，包括URL、画面、画面回放；
    • 当画面中包含GIS时，进行回放时，设备层可以根据画面的时间进行轨迹回放，也可以根据步进进行跳跃展示。设备信息卡片如果包含数据点，点击展示的应该也是回放时间点的数据值。
      
  • URL：当选择跳转目标URL时，输入需要跳转的链接地址；
  • 画面选择：当选择跳转目标画面时，选择需要跳转的画面；
  • 打开方式：定义链接地址在当前页面还是新页面打开；
  • 显示提示：提示是否跳转成功；
  • 权限限制：用户和角色的权限设置；
  • 用户列表：选择权限的用户列表；
  • 角色列表：选择权限的角色列表；
  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 修改表数据：可以修改表数据的字段中的值；其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，故不再赘述，下面将对详细配置进行说明；
  

  • 表名称：选择表管理中表；
  • 表记录：选择表中的记录；
  • 触发时修改：点击是，执行事件时，弹窗提醒需要输入需要修改的表数据的值；点击否，则执行事件时，表记录中的值会根据字段和值直接修改;
  • 字段：选择表记录中需要修改的字段；
  • 值：填写需要修改后的值；
  • 执行结果提示：设置事件执行成功、失败的提示内容及时长。默认执行成功时，提示“执行成功”，时间为3s，执行失败时，提示“执行失败”，时间为3s；
    
    显示内容：可开启从接口获取，开启后，显示内容中需填写提示的属性名，例如: message，则执行结果提示接口中message里的提示。
  • 成功动作：当事件执行成功时，需继续执行的动作，可进行多选；
  • 失败动作：当事件执行失败时，需继续执行的动作，可进行多选；
  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 修改画面变量：触发事件动作时，可修改画面变量；其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，故不再赘述，下面将对详细配置进行说明；
  

  • 变量：选择需要修改的画面变量；
  • 变量值：定义修改后变量的值（当页面刷新，变量会恢复为原始值）；
  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 修改数据字典：触发事件动作时，可修改数据字典的值；其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，执行结果提示说明同修改表数据，故不再赘述，下面将对详细配置进行说明；
  

  • 数据字典：选择需要修改的数据字典，支持选择到对象下的具体的元素，并根据元素的类型显示对应的输入组件；
  • 变量值：定义修改后数据字典的值；
  • 成功动作：当事件执行成功时，需继续执行的动作，可进行多选；
  • 失败动作：当事件执行失败时，需继续执行的动作，可进行多选；
  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 修改数据点属性：触发事件动作时，可修改数据点属性；其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，执行结果提示说明同修改表数据，故不再赘述，下面将对详细配置进行说明；
  

  • 增加数据点属性：点击添加按钮， 可以添加数据点属性；
    

      + 触发时修改：事件触发时即时修改数据点属性
      + 数据点：选择需要修改数据点属性的数据点；
      + 属性选择：选择需要修改的属性
      + 属性值：填写修改的值  

  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 执行指令：触发事件动作时，可执行指令；其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，执行结果提示说明同修改表数据，故不再赘述，下面将对电子签名、电子签名设置及详细配置进行说明；
  

  • 电子签名：执行指令事件时，是否需要权限验证；

  • 电子签名配置：电子签名的配置；
    

  • 事由说明：选择是，则执行指令操作时，需填写事由说明，已经执行指令的事由说明可在操作日志中查看；

  • 用户列表：选择可以电子签名认证的用户，只有被选择的用户才可以进行执行指令的电子签名认证，已经执行指令的用户可在操作日志中查看；

  • 授权人：选择执行指令的授权人，已经执行指令的授权人可在操作日志中查看；

  • 详细配置：配置执行指令的操作配置项；
    

  • 指令类型：可通过选择设备、设备表或数据点来选择指令；

    • 当指令类型选择设备时，需选择具体设备和指令，事件触发时，被选择的设备执行指令；

    • 当指令类型选择表时，需选择表、筛选设备和选择指令，选中表下符合条件的设备执行该指令；

    • 当指令选择数据点时，外层组件需选择具体设备，例如组件组容器中加一个按钮，组件组需选择设备，执行指令时，该设备下的数据点写入值新的值；

  • 顺序：设置指令执行的顺序；

    • 并行：满足条件的设备同时执行指令；
    • 串行：满足条件的设备只能一个一个执行指令，例如a设备指令执行完在执行b设备指令；
    • 全部：配置全部指令下发给驱动，驱动负责串行还是并行或者其他的执行方式，取决于具体驱动的实现；
      

  • 指令：选择需要执行的指令；

  • 触发时修改：点击是，执行事件时，弹窗提醒需要输入执行指令的值；点击否，则执行事件时，数据点值会根据写入值直接修改；

  • 写入值：事件触发时直接修改情况下的指令中的值，根据指令配置而显示，也可以自定义修改；

  • 返回值绑定变量：指令执行成功后，返回值可以通过绑定变量获取到；

  • 执行进度绑定变量：通过绑定变量获取指令执行进度，当发送中，变量返回值为true，发送完成后，变量返回值为false，可应用于loading显示时的变量绑定；

  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 执行脚本：用户可以通过编辑脚本定义触发事件后的执行动作，其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，故不再赘述，下面将对详细配置进行说明；
  

  • 脚本语言：选择脚本语言，暂时支持javascript；
  • 脚本编辑：打开脚本编辑器，进行脚本编辑；

• 发送请求：触发事件动作时，可调用平台内部接口或数据接口模块配置的接口。其中名称、延时（毫秒）、依赖动作、二次确认、二次确认配置与页面跳转配置相同，执行结果提示说明同修改表数据，故不再赘述，下面将对详细配置进行说明；
  

  • 内部请求
    1.接口地址：提供六种内置接口类型供直接选择，用户也可以切换到填写模式，手动输入平台内部接口地址。内部接口地址可以直接填写以 /core 后的地址，需包含 /core。
    2.请求方法：根据需要填写，包括GET、POST、PUT、PATCH、DELETE。
    3.请求头：根据需要填写。
    4.请求参数：根据需要填写。
  • 数据接口
    1.分组：选择数据接口中创建的数据分组。
    2.接口：选择数据接口。
  • 输出值：开启后，当事件触发执行时，会输出动作的变量。可以通过绑定弹窗中的事件输出值进行绑定。

• 修改系统配置：触发事件动作时，可修改系统配置中的系统名称、系统图片、系统背景、系统版权信息、系统语言；操作同修改数据点属性中相关的操作。

• 修改用户信息：触发事件动作时，可修改用户信息中的邮箱、电话、系统语言；操作同修改数据点属性中相关的操作。

• 调用手动流程：触发事件动作时，执行手动触发节点的流程。
  

  • 流程选择：选择中台流程管理中已经发布且起始节点为手动触发的流程。
  • 参数表单：填写手动触发节点定义的参数列表。

• 修改迭代项变量：触发事件动作时，可修改迭代项变量，这个事件只有迭代容器内部的组件可以查看并设置执行，操作同修改画面变量。

画布区域

画布是承载画面搭建的内容定义区域，在画布中通过组件的组合及属性的配置实现画面的搭建，所有组件只能在画布区域内编辑，画布外的区域无法编辑；
组件在自由容器中拖拽针对容器也可以有对齐的标线提示；

组件的操作说明

画布中的组件都赋予了针对组件的操作功能，分别有创建自定义组件、导出、复制、删除、置顶、置底、上移一层、下移一层。接下来，让我们详细了解这些功能的使用说明：

1. 创建自定义组件：可以将单个组件或者组件组创建为自定义组件；当您想要多次复用一个配置好相关属性的组件组时，可以通过创建自定义组件的功能将其保存到自定义组件中。当您需要在画布中使用该组件时，只需要从自定义组件中将其拖拽到画布上，组件的属性将会被保留。更详细的操作说明请参见【项目树】中【创建自定义组件】的使用介绍。
   
2. 导出：导出该组件；
3. 复制：复制该组件；
4. 输出：删除该组件；
5. 置顶：置顶该组件；
6. 置底：置底该组件；
7. 上移一层：上移一层该组件；
8. 当组件为自定义组件时，组件操作增加【编辑当前自定义组件】、【另存为新的自定义组件】按钮。点击【编辑当前自定义组件】，自定义组件进入编辑状态，可进行编辑，保存后，所有应用该自定义组件将全部更新。

• 更新当前自定义组件：当开启编辑后，自定义组件操作增加【更新当前自定义组件】按钮，更新后所有应用该自定义组件将全部更新。

tip

注意：

1. 同一画面中，只允许同时编辑一个自定义组件。
2. 当画面中存在编辑状态自定义组件发布时，将导致该组件的更新无法保存并同步。

• 取消编辑：当开启编辑后，自定义组件操作增加【取消编辑】按钮，取消编辑后，该自定义组件在当前画面的编辑状态进行的操作内容均会清除。
  

• 另存为新的自定义组件：当自定义组件为非编辑状态时，显示【另存为新的自定义组件】按钮，点击后，可将当前自定义组件另存为新的自定义组件。