五、列表设计

1. 列表简介

1.1. 功能简介

列表就是对表单提交的数据进行集中管理,是可以查看全部数据的地方。用户可以在列表界面对数据进行批量操作,比如勾选多条数据批量做提交或删除等操作,用户也可以在列表对数据进行导入和导出操作。

1.2. 应用场景

举例1:做数据分析时,需要通过表单列表将表单数据全部导出。

举例2:要查看仅自己关注的数据时,通过表单列表设置过滤条件筛选对应的数据。

举例3:要对数据进行批量操作时,比如批量提交、批量删除,就需要在表单列表上勾选需要操作的数据行。

2. 列表设置

管理员进入设计表单界面后,可以切换到「列表设计」页面对表单列表中字段的显示和排序、数据的筛选以及列表的视图显示方式进行配置,管理员配置的显示参数及视图方案对此工作区下的所有用户生效,同时普通用户也可以在运行时的表单列表界面上进行相关的配置并保存为个人的视图方案,配置方法与设计时中的配置方法相同。

设计时配置入口:

descript

运行时配置入口:

descript

2.1. 字段配置

1)单击字段配置按钮进入配置界面,勾选需要在列表显示的字段

descript

2)如果要显示表体的字段则显选择对应的表体再勾选相应的字段

descript

3)可以拖动字段的顺序设置字段在列表中显示的位置

descript

4)列表字段显示的高级配置

descript

  • 帮助提示:配置后列表的字段后面会显示此帮助提示,对此字段的内容进行解释。

descript

descript

  • 列标题对齐:标题可以设置居左对齐、居中对齐和居右对齐,效果区别如下:

descript

  • 内容对齐:与标题对齐类似,用于控制列内容的对齐方式,效果区别如下:

descript

  • 列固定:用于控制列表查看时哪些列固定,被设置左侧列固定的字段则固定显示在列表的最左侧,列表横向滚动查看数据时被固定的列则保持不动,可以同时设置固定多列。

descript

例如以下左侧固定了编号和采购类型两个字段,在列表拖动滚动条向右查看数据时这两列始终保持显示:

descript

与左侧固定类似,设置为右侧固定时,此字段将一直显示在列表的右侧,不受横向数据滚动查看的影响。

descript

取消设置固定列时则列表的所有字段内容跟着横向滚动条一起滚动显示。

  • 渲染为超链接:设置超链接后通过点击字段内容可以打开此表单查看明细

descript

设置超链接的字段显示为链接:

descript

点击链接则打开表单详情:

descript

  • 字段宽度:用于设置此字段在列表上显示的宽度,通过鼠标拖动字段宽度进行设置

descript

2.2. 筛选配置

每个用户都可以自定义筛选条件,并保存到视图方案中,方便下次直接使用。

descript

1)点击「添加条件」,选择筛选字段

descript

2)设置筛选条件,根据选择的筛选字段的类型不同可选相应的比较符

  • 当字段类型为文本时,条件比较符可选:等于、不等于、包含、开头是、结尾是、不包含、为空、不为空

descript

  • 当字段类型为单选、多选和关联数据时,条件比较符可选:是、不是、为空、不为空

descript

  • 当字段类型为日期和时间时,条件比较符可选:等于、不等于、早于、晚于、在范围内、为空、不为空

descript

  • 当字段类为数值时,条件比较符可选:等于、不等于、小于、大于、小于等于、大于等于、为空、不为空

descript

  • 当字段类型为开关等这种布尔值时,条件比较符可选:等于、不等于

descript

3)比较值的设置,比较值的下拉选项包含“常量”、“字段”、“变量”,当条件比较符为“为空”和“不为空”的时候则不显示比较值的选项。

descript

  • 当条件值为常量时,文本类型字段则可直接输入文本内容进行比较,单选/多选类型的字段则显示其选项供用户勾选,关联数据类型的字段可选关联表单中的资料,日期和时间类型的字段则可通过日期控件选择具体的日期和时间,布尔值类型的字段则显示勾选框,效果分别如下图所示:

descript

descript

descript

descript

descript

  • 当条件值为字段时,则可选择当前表单中的所有字段信息,如果选择的两个条件字段是无法比较的,例如选择了数字类型的字段与文本类型的字段进行比较,那么这种则作为无效的过滤条件无法筛选出相应的数据。

descript

  • 当条件为变量时,指这个条件值不是固定的,会随着当前用户和时间来动态取值。

例如当条件字段是系统的创建人时,对应的变量取用户,那么就能过滤出创建人等于当前用户的数据,不同的用户就动态过滤出自己创建的数据了。

descript

另外当条件字段是日期类型的字段时,也可选择对应的变量:最近30天、本季、最近14天、当前日期、本月、本周、本年、最近7天,筛选时则会按查询当前的动态4时间过滤出对应的数据。descript

4)继续添加其他筛选字段,并设置条件关系(且/或)。

descript

当需要多个条件时,首先需要选择两个条件之间是【且】的关系,还是【或】的关系。一旦选定,后面字段的关系都是一样的,不能改变。 即同为且、同为或。

descript

5)添加条件组

descript

条件组是由多个条件组成的,条件组里可嵌套条件组,最多支持三层嵌套,到了第三层条件组只允许添加条件,不允许添加条件组。筛选时会根据条件组里面的条件关系筛选出数据再与条件组之外的其他条件的条件关系一起进行最终数据的筛选。

descript

6)条件的删除

点击条件后面的叉号删除此行条件,点击条件组后面的叉号则删除此条件组。

descript

  1. 筛选条件保存

条件设置完成完点击确定后再点击保存到视图方案才完成筛选条件的保存。

descript

descript

2.3. 排序配置

选择表单内的字段进行排序,排序方式可选择升序或降序,并且可以选择多个字段进行组合排序:

descript

可以拖动参与排序字段的顺序:

descript

2.4. 视图配置

主要对列表视图的展示样式进行配置

descript

  • 行高的配置

配置影响列表单元格的高度显示,可选高、中、低三种行高

descript

descript

  • 选择模式的配置

主要影响列表左侧勾选框的功能,为「无」时列表不显示勾选框,为「单选」时列表显示的勾选框一次只能选中1行,为「多选」时列表显示的勾选框可以同时选中多行,根据不同的使用场景用户可灵活配置。

descript

  • 显示边框

开启显示边框则每列数据都显示明显的单元格,如下所示:

descript

  • 显示斑马纹

开启显示斑马纹则列表每行数据呈灰白交替的颜色进行区分,如下所示:

descript

  • 显示序列号

开启显示序列号后在列表的左侧会显示每行的序号,如下所示:

descript

  • 每页条数

用于控制列表一页展示多少条数据,可选100条/页、200条/页、300条/页、500条/页、1000条/页,这里设置只是一个默认值,在运行时用户仍可手工自行切换选择当前需要展示多少条数据。

descript

descript

  • 按钮的配置

列表上的按钮分为未选中态按钮和选中态按钮,未选中态指列表没有勾选数据时就已经显示的按钮,选中态按钮指的是列表勾选数据之后才显示的按钮:

descript

descript

按钮设置中的按钮只有勾选的在列表上才会显示,不勾选则不显示:

descript

可以修改按钮的名称和按钮类型,设置为主按钮的将在列表上呈蓝底高亮显示:

descript

可以添加按钮分组对功能相近的按钮进行分组归类,比如导入、导出:

descript

descript

  • 展示操作列的配置

对于可按行操作的按钮可以配置显示在列表行末端,对此行数据进行相关操作。

descript

最多展示操作数控制直接显的按钮的个数,超多的按钮则隐藏,通过点击“更多”展开,效果如下:

descript

  • 左树右列的配置

左树右列用于将列表上的数据按某一分组维度进行分组后,以分组维度作为树节点让列表数据呈树状进行展示,选择不同的分组则相应显示此分组下的数据,常见的有物料基础资料按物料分组进行展示;个税申报系统中按人员的报送状态对员工进行分组展示等。

descript

开启左树右列设置分组维度时树状模型关系可以选择本表关联和多表关联。

  1. 树状模型关系选择本表关联的在分组维度中可以选择当前表单中的单选类型和关联数据(单选)类型的字段以及每个表单预置的创建人和状态字段,一次最多支持选择3个分组维度。

descript

添加分组维度后可以对维度字段进行设置,当分组字段的类型为关联数据类型时可设置情况如下:

descript

配置项字段类型是否必填控制说明
显示类型单选下拉分组维度在左树的标题显示格式。 当分组字段的字段类型为关联数据时,配置项可编辑, 下拉选项包含:“编码”、“名称”、“编码(名称)”、“名称(编码)”,默认值为“编码(名称)”。
排序字段单选下拉可选择表单内的所有字段。 按选择的字段进行排序。
排序方式单选下拉分组维度根据所选的“显示类型”的显示顺序。 下拉选析包含:“升序”、“降序”。 比如按显示类型为“编码(名称)”的升序显示。 据原有数据的显示顺序显示。
显示全部数据开关此项为关联数据类型字段的特有配置项,仅当分组字段的字段类型为关联数据时显示。 用于控制左侧的分组维度是否显示“全部数据”这个分组。

当分组字段的类型为单选类型时可设置是否“允许多选”,开启“允许多选”时各分组可以一起选择:

descript

开启“允许多选”时可以同时配置是否“显示全部选中”,开启“显示全部选中”时则在左侧树中显示“全部选中”节点,勾选“部选中”全相当于把左侧树的所有节点数据都选中。

descript

关闭“允许多选”时则一次只能选择一个分组:

descript

“显示全部数据”开启时则左侧树中显示“全部数据”的分组节点,否则仅显示分组维度的节点:

descript

物料按分组左树右列展示设置示例:

首先,先创建基础资料类型表单并开启“树形模型”,如新建物料分组:

descript

点击确定后进行此表单设计时,自动生成一个“上级分组”字段,调整分组需要录入的数据,如分组编码、分组名称之后保存并发布此表单。

descript

表单发布后关联的基础资料会自动更新成关联表单本身:

descript

运行时新增分组信息,新增的分组为最上层的分组时,“上级分组”保留为空:

descript

新增次级分组时则需要选择对应的上级分组:

descript

其次,在需要引用上述分组资料的表单中配置数据关联关系,例如刚才建立了物料分组的树形模型,这时在物料资料表单中如果需要按这个分组信息作为左树右列的分组维度,那么需要在物料资料表单拖一个关联数据类型的字段,可命名为“物料分组”,并在关联基础资料中选择之前创建的“物料分组”,保存并发布。

descript之后,我们在新增物料资料时就能选择到对应的分组信息:

descript

最后,我们在物料资料的左树右列配置中选择“物料分组”字段作为分组维度:

descript

展示效果如下:

descript

  1. 树状模型关系选择多表关联的,例如人事组织架构要按“组织->部门->员工”的层级来进行左树展示组织->部门的层级,右列显示对应分组下的数据,就需要配置组织资料、部门资料的多个表单的树形关联。

descript

首先需要先创建树状模型,在运行时中依次打开“设置管理”->“后台管理”:

descript

创建树状模型,例如创建“组织架构”的树形模型:

descript

设置树形模型时,选择“组织”作为顶层的树节点:

descript

增加子节点,例如“组织”下展开显示的是“子组织”,则新增子级关联并选择“组织”资料:

descript

descript

由于“部门”也可以直接挂在顶层“组织”上,因此增加二级组织的同级关联为“部门”资料:

descript

descript

设置“部门”资料与上级的“组织”的层级关系是通过“部门”资料上的“上级部门”字段来归属的:

descript

由于“部门”下又可以下挂子部门,因此需要在“部门”下级再增加“部门”资料,也是通过“上级部门”字段来归属。

descript

descript

这样就配置完成一个“组织->部门->员工”的组织树模型,员工资料通过部门字段的值归属到对应的部门分组下,在组织架构资料的左树右列配置中选择此树状模型,过滤规则中选择组织与部门的层级关联字段,展示效果如下:

descript

descript

2.5. 保存视图方案

视图配置完成后出现保存按钮,点击将视图配置保存到当前方案,

descript

2.6. 复制视图方案

descript

复制后生成一个新的视图方案,可以修改方案名称:

descript

descript

2.7. 删除视图方案

除系统预置的视图方案外都可以进行删除:

descript

2.8. 视图方案的权限

系统管理员在设计时中配置的视图方案,在对应工作区下的所有用户可使用,用户在运行时中配置的视图方案为个人方案,仅用户自己可以使用。

Last Updated:
Contributors: huangyongqing