这是本节的多页打印视图。 点击此处打印.

返回本页常规视图.

页面设计

功能概述

页面是应用呈现给用户浏览内容和交互操作的界面,可视化设计器提供了编辑页面的能力,设计师可以直接拖拽组件到画布中,进行页面布局、属性设置、样式调整等操作,快速高效地完成页面设计。

功能介绍

页面类型

(1)详情页:用于数据的录入、编辑、查看,可通过参数设置页面的打开模式:新建、编辑、查看。详情页预置页面入参ID, 当以编辑或查看模式打开详情页时,需要设置入参ID的值,说明打开的是哪一条数据。详情页需使用到数据控件单一记录,详情请参考单一记录

详情页举例如下:

1718071126775
(2)列表页:用于数据的查询。一般搭建方法是:PC端使用重复表查询搭配筛选控件、移动端重复节(需配置控件状态为只读)搭配筛选控件。详情请参考重复表查询、重复节、筛选控件。

列表页举例如下:

1717750194729

(3)全表编辑页:用于在列表中直接录入数据并展示数据,不需要单独做详情页和列表页,常用于数据字段较少时录入和展示数据。一般是使用重复表录入、树表录入控件进行搭建。详情请参考重复表录入、树表录入。

全表编辑页举例如下:

1718071173317

(4)其他页面:主要用于搭建流程表单的辅助信息页。该类型的页面可以不绑定页面对应实体。详情请参考流程中辅助信息页配置方法

页面设计的基本流程

1、新建页面

进入【菜单】模块,选中Web端或移动端, 添加页面。

注意:PC端页面需要挂在菜单下, 移动端页面需要放到分组下。在新建页面时“适配终端"选择菜单或分组。

1718084107123

2、页面分区布局

根据实际业务页面,在页面设计器中对页面进行分区布局。

(1)在页面属性中,开启页面布局,PC端页面可被分为上、下、左、右、中五个区域,移动端页面可被分为上、中、下三个区域。可根据实际业务开启或关闭某个区域。

注意:如果页面绑定了外框,页面布局将不可用。

1718075005323

(2)使用布局控件对页面进行二次布局。

1718075170064

3、拖入数据控件绑定数据源

(1)如果搭建详情页面, 就拖入单一记录数据控件,在右侧属性中”实体"绑定数据源。

(2)如果搭建列表查询页面,就拖入重复表查询或重复节控件,在右侧属性中”实体"绑定数据源。

绑定数据源后会自动生成子控件。

1718076350686

1718076407932

4、控件配置

每个控件可配置属性、事件、风格。 属性为该组件基本配置; 事件为该组件的交互配置; 风格为该组件的样式配置。详情可参考组件介绍

1718076459770

5、页面保存

设计好页面后,需保存页面,或保存为草稿。为了保证页面能正常运行,保存页面时会对页面和控件配置进行校验, 如有报错,可根据提示信息修改后再保存。

1718076824380

1 - 快捷创建和调整页面的方法

快捷创建和调整页面的方法

基于模板创建页面

新建页面时,先选择页面类型,然后在该类型的模板中,选择合适的模板,基于模板快速生成页面。

1717753589904

基于实体快速生成页面

新建实体后,点击“生成页面", 可选择生成列表页和详情页,将会基于模板快速生成相应的页面。

1717754274898

1717754344557

PC页面一键转移动

搭建步骤:

1、新建页面时,适配终端同时勾选web端和移动端,将会同时创建两端页面,且两端页面建立了关联。

2、设计页面时,切换到移动端,点击”转移动",可将PC端内容直接转换到移动端。可选择全部转换,或仅选择PC端的部分内容进行转换。

注意:

1、PC转移动时,全部转换将会清除当前移动端页面已有内容(控件、页面规则)及外框占位内容。

2、移动端未绑定外框时,如果存在PC外框对应的移动外框(新建外框时同时勾选了PC和移动), 转换时,会加上对应移动外框。 如果不存在对应移动外框,只转PC端的内容区。

3、移动端已绑定外框,PC页面转移动,按占位的名称去匹配,匹配不到的放到中间区的上方。

1717754576064

1717754980263

选择单一记录生成详情页

在页面设计器中选中 单一记录,在实体的 选择数据源 弹窗中选中字段,快速生成详情页。

可以指定生成几列的布局,同时在实体字段中创建的分组也能起到作用,按分组划分字段的区域。

1724745925795

从数据面板拖拽字段

除了拖拽控件进行设计之外,还可以从数据面板直接拖拽字段,省去绑定字段和配置标题等环节。

1724746349371