Skip to content

列表设计器

列表设计器用于配置业务对象的列表页面,包括显示列、搜索条件和操作按钮。

进入列表设计器

页面管理进入:

  1. 选中一个列表页或列表+表单页,点击「编辑」进入页面设计器
  2. 设计器中的列表区域即列表设计区,配置显示列、搜索条件和操作按钮

选择显示列

  1. 左侧显示该对象所有可用字段
  2. 勾选需要展示的字段,勾选后自动添加到列配置
  3. 在右侧调整列的显示顺序

列属性配置

每列可配置以下属性:

属性说明示例
列标题表头显示文字客户名称
列宽列的宽度(px)200
对齐方式左/中/右对齐左对齐
是否排序点击表头排序
格式化日期/字典/图片等渲染日期格式化为 YYYY-MM-DD

搜索条件配置

  1. 在「搜索条件」区域点击「添加搜索字段」
  2. 选择搜索字段并配置匹配方式:
匹配方式说明适用类型
精确匹配完全相等下拉、数字
模糊匹配LIKE %value%文本
范围匹配大于/小于区间数字、日期
  1. 配置搜索框的布局(一行显示几个搜索条件)

操作按钮配置

列表页默认提供以下操作按钮,可按需开关:

按钮说明默认
新增打开新增表单弹窗
编辑行内编辑按钮
删除行内删除(逻辑删除)
导出导出当前列表数据为 Excel
导入批量导入 Excel 数据
批量删除多选后批量删除

预览效果

配置完成后点击「预览」按钮,可在弹窗中查看列表页的实际运行效果。

下一步

Forge Admin — 基于 Vue3 + Spring Boot 的企业级后台管理框架