一、简介

表格是最常用的数据展示组件,按照行(记录)和列(字段)格式显示数据。

二、展示效果

(一)PC 端

image.png

(二)移动端

image.png

三、组件数据源

初始化配置时,模型类型可以选择数据表、聚合表、扩展表。

image.png

四、组件设计器

image.png

(一)显示字段

表格展示列

配置表格组件展示的列,支持当前表的字段和关联数据下面一层的字段。

image.png

表格分组

显示字段支持按分组和子表分组展示,模型中有“子表”字段时才显示新建“子表分组”入口。

image.png

展示效果:

image.png

字段配置

image

image

在“显示字段”列表中点击“字段”,修改字段配置:

  • 字段名称:修改字段别名,在表格中按字段别名展示;
  • 对齐方式:数值类型字段默认右对齐,其余字段默认左对齐,支持修改;
  • 列点击:字段在表格中可点击并输出{XX 字段}点击事件;
  • 行内编辑:字段在表格中可直接编辑并输出{XX 字段}改变后事件;,主键 ID、流水号等只读字段不支持设置行内编辑,不显示该入口;
  • 换行显示:字段在表格单元格中超过列宽时换行显示,仅单行文本、多行文本、富文本有该配置项;
  • 统计:可以设置不同字段类型的统计方式,在表格的最后一行显示

image.png

(二)按钮

image.png

按钮类型支持设置显示条件输出变量
工具栏左侧按钮选中的多行数据
工具栏右侧按钮选中的多行数据
操作列按钮操作的单行数据

(三)显示

image.png

  • 首次加载组件刷新数据,顾名思义;
  • 禁用选择列,禁用后表格不显示复选框;
  • 禁用排序,禁用后在表格运行时不显示字段排序的图标

image.png

  • 显示序号,选中后表格的复选框显示序号

image.png

(四)业务规则

image.png

编辑规则

设置满足一定条件的数据才允许行内编辑,需先将字段设置行内编辑。

image.png

样式规则

满足一定的条件的数据的行列填充指定的颜色

image.png

效果展示:

image.png

(五)其他配置

设置默认分页大小

在 组件预览区设置表格的默认分页大小,在组件运行时用户也可以更改分页大小。

image.png

设置表格列宽

在 组件预览区设置表格的显示列宽,在组件运行时用户也可以更改表格列宽。

image.png

五、组件变量

变量 title变量 name读写值类型说明
当前页数据displayRowList只读多行数据
选中的多行数据selectedRowList只读多行数据
操作的单行数据activeRow只读单行数据
筛选条件filter只读筛选条件以下情况的组合筛选: 1、数据源本身的设置筛选条件 2、call方法传入的筛选条件 3、权限设置的条件

六、组件函数

函数 title函数 name参数返回值说明
刷新call筛选条件:筛选条件
刷新当前页refresh

七、组件事件

事件 title事件 name输出参数说明
选中行后selectedChange选中的多行数据:多行数据seletedRowList
点击行后clickRow操作的单行数据:单行数据activeRow
{列}点击后click{FieldName}操作的单行数据:单行数据activeRow
任意字段值改变后afterRowChange操作的单行数据:单行数据activeRow
{XX字段}值改变后after{FieldName}Change操作的单行数据:单行数据activeRow
{XX工具栏按钮}点击后click{Btn}选中的多行数据:多行数据seletedRowList
{XX操作列按钮}点击后click{Btn}操作的单行数据:单行数据activeRow

八、组件权限

image.png

(一)按钮权限

  1. 工具栏按钮
  2. 操作列按钮

(二)数据源权限

设置数据源设置筛选条件

(三)字段权限

操作类型支持配置字段权限未授权的字段对组件的影响
查看[✔]不显示未授权的字段
新增
修改[✔]未授权的字段不支持行内编辑
删除
统计[✔]不显示未授权字段的统计方式及结果

九、使用场景

展示客户及客户的订单明细

image.png

进一步了解极态云,体验产品?

请访问 极态云官网


极态云官方账号
1 声望0 粉丝

JIT 技术,为专业开发全面提速!极态云(jit)是一个基于全新软件开发理论(面向元素开发方法)、全新编程框架、全新开发工具、全新部署运行平台的企业级软件系统开发与运行平台,极大简化了应用系统的开发、部署...