告别单调的列表页,探索JVS低代码列表页设计的新思路

列表页是什么?

列表页是管理平台中的基础页面,核心的逻辑是实现数据的增删改查(CRUD),列表页核心的几个要素:页面内容的数据展示、查询条件、页面按钮及按钮触发的逻辑。

列表页配置

具备应用配置权限的用户,可以在列表页目录上,鼠标悬空,系统会弹出列表页设计的菜单,如下图所示:

告别单调的列表页,探索JVS低代码列表页设计的新思路_第1张图片

点击“设计页面”,系统进入列表页设计器,其中包括四个板块的设计内容:

  • 页面基础信息的设计

如下图所示,展示“页面设置”的功能界面

告别单调的列表页,探索JVS低代码列表页设计的新思路_第2张图片

①:点击“笔”图标,修改列表页的名称

②:设置列表页的名称,这里的名称和目录下面的菜单名称相同

③:设置列表页的备注描述

④:列表页的布局设置,其中包括普通列表、左树右表、卡片布局三种模式

⑤:预览列表页最后效果的地址,支持复制和查看

其中包括列表页名称,这里的名称就是目录上展示的页面名称,页面描述会在界面上展示为列表页的备注说明

告别单调的列表页,探索JVS低代码列表页设计的新思路_第3张图片

页面布局有三种模式,普通布局(如上图所示),树表布局(如下图所示),卡片布局(如下图所示)

告别单调的列表页,探索JVS低代码列表页设计的新思路_第4张图片

告别单调的列表页,探索JVS低代码列表页设计的新思路_第5张图片

预览地址是可以直接在浏览器上通过url访问到这个列表页的页面展现。

  • 列表页设计

进入列表页设计界面,本页面主要提供列表页界面展示的数据配置,如下图所示:

告别单调的列表页,探索JVS低代码列表页设计的新思路_第6张图片

①:模型设置,这里是列表页关联的数据模型设置入口

②:列表页的数据设置tab界面

③:字段排序的设置tab界面

④:列表页上的按钮设置的tab页面

⑤:列表页上展现数据时,默认过滤设置tab页面

⑥:列表页上展示数据的详细配置

⑦:增加一列数据字段的操作按钮

⑧:预览配置列表页的效果预览按钮

点击排序条件tab页,展示如下图所示

告别单调的列表页,探索JVS低代码列表页设计的新思路_第7张图片

①:字段下拉选择框,选择需要排序特殊设置的字段

②:系统会自动展示对应字段选择框中的 字段类型

③:排序下拉选择框,选择升序与降序设置

④:删除本条排序设置按钮

⑤:新增一个字段的排序设置

  • 页面权限设置

页面权限包括两种类型的,如下图所示

告别单调的列表页,探索JVS低代码列表页设计的新思路_第8张图片

①:操作权限:对界面的按钮、目录等操作的权限设置(后续章节详细介绍)

②:数据权限:对用户查看的数据内容进行控制(后续章节详细介绍)

  • 数据设置

主要用于列表页从excel文件导入时,对文件导入前的校验,导入后联动触发相应的逻辑,如下图所示

告别单调的列表页,探索JVS低代码列表页设计的新思路_第9张图片

列表页的数据设置核心的能力都是借助逻辑引擎的处理能力,点击前置/后置的逻辑设计,都是跳转逻辑引擎进行相应功能配置。

以上是关于列表页的全面介绍。列表页作为管理平台中的基础页面,发挥着数据增删改查的重要作用。通过理解列表页的核心要素,以及掌握其设计和配置方法,用户可以有效地管理和操作数据,实现高效的数据管理和处理。

在线demo:https://frame.bctools.cn

gitee地址:https://gitee.com/software-minister/jvs

你可能感兴趣的:(前端,低代码,java,gitee,大数据)