从表单到数据看板：低代码列表引擎如何用8个模块搞定全场景需求？

在低代码开发领域，列表页作为数据展示与交互的核心载体，它的配置能力直接决定了应用的实用性。
列表页是专为管理和展示数据而存在的页面，它广泛应用于各种业务场景中，如用户管理、订单追踪、产品目录、库存监控等。无论是需要快速浏览数据概况，还是需要对特定条目进行详细操作，列表页都能提供直观、便捷的操作。
在JVS低代码开发中，列表引擎是核心能力引擎之一。通过配置数据、配置字段、配置按钮可以实现各种列表页的展示配置。
页面布局遵循模块化设计理念，列表页包含对数据的查询条件、数据的明细展示，包括对数据的形态展示控制等。

列表页设计器功能架构

平台提供可视化设计界面，如下图：

①：列表页的数据模型的名称与查看展示，可以修改数据模型的名称。（在列表页保存后会自动修改数据模型）
②：列表页 操作栏设置，包括宽度与固定开关
③：列表页设计器的预览效果，在配置了对应设置后，可以立即看到设计结果。
④：列表页所有的字段展示，选择每个字段时，可以看到右侧 详细的属性面板，可以拖动字段的展示位置。
⑤：字段的详细配置展示，包括基础的字段信息、样式信息、扩展的相关设置
⑥：列表页的按钮设置
⑦：列表页的排序设置
⑧：列表页的表头设置（支持二级表头）
⑨：保存按钮，点击保存按钮后，如果增加了字段，系统会自动对模型进行修改配套。
列表页设计页面的核心功能一共分为8个模块，分别是：数据模型、列表字段的增加、字段样式设置、扩展设置、甘特图、按钮配置、排序过滤、复杂表头设置。

数据模型

点击模型名称旁的齿轮设置，系统会弹出数据模型的配置窗口

可以看到进入模型详情的设置页面，分别有模型字段管理、索引管理和数据脱敏配置,如下图所示：

• 模型字段：展示本模型里头的所有字段名称
• 索引管理：展示对模型中的索引管理，其中包括唯一性设置
• 脱敏设置：主要用于对数据模型中的脱敏展示

列表字段的增加

点击批量添加，采用了如下图设计的模式，字段为中文名称，每一行为一个字段，默认去除空格

字段基础设置

系统提供创建人、创建时间、修改人、修改时间的字段，即任何一条数据创建修改时都会携带着这几个数据，系统自动记录，无需要用户手动创建。

字段样式设置

字段样式包括：字段展示宽度、字段展示类型、字段颜色标识、动态样式。
动态样式可以根据数据值动态设置显示颜色背景及文字。

设置更多的字段颜色配置

字段宽度控制设置

效果如下所示：

排序按钮设置与点击快速复制按钮：

配置效果如下：

动态字段颜色控制，点击新增时，可以对内容进行动态控制，例如字段的状态等

扩展设置

列表页可配置公式和表单，如下图：

公式配置

表单设计

甘特图设置

如下图所示，点击齿轮按钮进入设置页面

注意：计划开始时间、计划结束时间、实际开始时间、实际结束时间设置项必填，选择模型下的日期组件字段，如选择非日期字段无效

①：计划颜色，根据选择的字段在列表页对应行数据上展示响应颜色
②：实际颜色，根据选择的字段在列表页对应行数据上展示响应颜色
不设置则默认是黑色和灰色却分
③：动态颜色，根据设置的字段值动态展示颜色
最终效果如下：

按钮配置

内置了新增、删除、修改、详情、导入、导出、模板下载这几个按钮，不能删除以外，可以自定义按钮，并且可以自行删除

按钮能触发逻辑、表单、发起网络请求

排序过滤

选择要排序字段名称，再选中是降序还是升序

复杂表头

【添加表头】输入表头名称，按照下图操作顺序执行

在线demo：https://frame.bctools.cn
基础框架开源地址：https://gitee.com/software-minister/jvs