电话 400-111-2626

# 使用场景

列表的界面由查询条件、功能按钮(添加、编辑、详情、删除、导入、导出等)、列表字段组成;主要实现数据的增删改查。

效果展示:

# 页面设计

列表配置步骤:点击【+】——>点击【添加基础页面】——>点击【创建列表】——>绑定表单——>添加显示字段——>属性设置

【PC页面-列表】配置视频教程 (opens new window) 企业微信截图_16818051028387.png 企业微信截图_16818072941093.png 企业微信截图_16818074536298.png 企业微信截图_16818075504240.png 目前【基础页面】的画布区只能拖入一个列表,当画布区存在【列表】组件时,组件区的其他组件置灰,不可选中。

如上图,为列表的三个模块组件:

(1)查询条件

查询条件用于在前台列表中进行数据筛选,通过查询字段显示需要查看的数据。 企业微信截图_16818084275741.png

点击“编辑”图标,勾选的组件会显示在查询条件中(需在绑定表单后,在右侧属性区【字段设置】中先新增相关字段)

管理端查询条件开放所有字段,不设置为列表显示字段也支持配置为查询条件 PC列表上的查询条件,可配置列表显示字段外的其他字段。

image.png

注意:本次仅开放查询条件支持配置的字段如下:

image.png

(2)按钮区

按钮区目前支持的按钮有【添加】、【删除】、【导入】、【导出】、【打印】、【二维码打印】、【一键修改值】、【自定义开发】、【发起流程】

(3)列表区

列表区分为字段区和操作区,字段区是显示表单字段,操作区可放置按钮组件,可对选中的单条数据进行操作,支持的按钮有【添加】、【编辑】、【详情】、【删除】、【打印】、【一键修改值】、【自定义开发】。

image.png

# 属性设置

企业微信截图_16818091469539.png

# 基础设置

企业微信截图_16818705992533.png

1、绑定表单

查看详细说明 (opens new window)

2、列表名称

查看详细说明 (opens new window)

3、支持复选

复选框配置后,列表的最左测显示复选框;若【删除】和【一键修改值】的按钮放在按钮区时,需要勾选复选框才能选择列表数据并进行对应的操作。

image.png

4、显示序号

企业微信截图_16818706566139.png

列表左侧显示序号

image.png

5、列表编辑

功能开启时,支持在PC应用门户列表页实时编辑字段数据。 开启【列表编辑】开关后,需选择列表中的【编辑】按钮进行绑定,列表实时编辑功能将与被绑定的按钮拥有一致的操作权限和字段权限。

:当【编辑】按钮不可见时,该用户则无法使用实时编辑功能。

企业微信截图_16818707093643.png

【编辑】按钮的权限

显示效果

列表即时编辑功能支持人员、部门组件

image.png

列表即时编辑入口:

image.png

6、列表分页

企业微信截图_16818708492119.png

列表分页勾选后,运行平台支持选择每页显示的数据数

image.png

7、状态选项卡

企业微信截图_16818709081166.png

在列表中快速筛选出选择框组件的数据。只能选择【单项选择】组件,配置后在运行平台列表顶部显示。

8、数据排序

当数据排序为空时,列表数据以创建时间降序排列。

若配置了排序字段,则根据排序字段排序,例如:以选择框排序,则使用选择框中的选项值进行升降序排列。

9、数据过滤

若配置了数据过滤,则只有满足条件的数据才能在列表中显示。详情查看公共组件-数据过滤 (opens new window)

10、数据统计

PC运行端的列表页面实现针对数据列的数据统计功能

image.png

列表即时编辑入口:

image.png

# 树状图

1、支持配置树状菜单作为表格的筛选条件,实现选中树状菜单不同数据时,表格数据数据动态刷新。

配置限制:

  1. 最多可设置5个字段作为分组。
  2. 支持的字段类型:单行文本

后台配置:

运行端显示:

2、高级排序规则

无论升降序,都按照该节点所有数据中的最小值进行排序,例如:

有以下数据需要按照【部位】分组,且需要按照【开始时间】升序排序(即开始时间越早的分组排在越前)。

排序规则:取每个【部位】分组中,【开始时间】的最小值进行升降序排序。

配置如下:

实现效果为G2栋的最小开始时间小于G1栋,因此在树状列表中排在上:

配置限制:

  1. 最多可设置3个字段作为分组的排序字段。
  2. 支持的字段类型:单行文本、数字、日期。
  3. 单行文本按照ASCII码进行排序。

# 表格设置

企业微信截图_1681871011355.png

1、操作列按钮

全部显示:操作列的按钮全部显示(除了设置了可见条件的按钮)。

效果展示:

全部隐藏:操作列显示···,当鼠标移到···上时,显示操作按钮。

效果展示:

2、表格样式

提供四种不同表格样式:

(1) 有竖边框无斑马纹

(2) 有竖边框有斑马纹

(3) 无竖边框无斑马纹

(4) 无竖边框有斑马纹

3、行高

支持根据列表内容,设置不同的行高,使页面更美观。

)

4、列宽 可根据需要配置不同的列宽。 企业微信截图_16818719796303.png

# 字段设置

1、初始化列表字段为空,完成表单绑定后,自动配置显示字段。

企业微信截图_16818713193799.png

2、默认显示当前表单内的所有字段。

若表单显示字段超过20个,则需要手动调整需要显示的字段。

企业微信截图_1681871372337.png

3、创建人、创建时间、修改时间是系统字段,需要手动配置是否显示在列表中。

企业微信截图_16818712748284.png

4、在自定义选项中,支持调整显示字段排序。

企业微信截图_16818714111307.png

5、支持调整每个字段的可见权限、跳转设置与字段列宽。

企业微信截图_16818714733926.png

企业微信截图_16818715263799.png

(1)字段可见范围

  • 全部可见:默认全部可见,即全部角色都可以在列表中看到该字段;
  • 部分可见:配置字段的可见权限,选中的角色可以在列表中看到字段;

企业微信截图_16818716195371.png

(2)跳转设置 通过设置跳转目标,允许用户在运行端的列表中,通过点击某个字段的值跳转到其他页面。而【关联参数】配置项,可以用来实现跳转过去后,页面根据传递参数筛选出列表数据。

  • 不跳转:默认不跳转
  • 跳转到其他页面:配置跳转到本应用的其中一个页面

企业微信截图_16818718725134.png

1 / 0