平台页面模板

平台页面模板是一组可复用的页面布局配置，用于沉淀标准页面结构，让开发者基于模板快速创建页面、复用布局，保证同类页面风格一致。

概述

页面模板通过可视化布局器配置页面的组件结构与排列，本身不承载业务数据，只在页面搭建时被加载使用。它属于「开发设置」中与页面相关的基础资源：

在 开发设置 → 页面模板 或 元数据管理 → 页面模板 页签中管理模板。
一个模板由一份布局配置（Layout）与基础属性（名称、分类、描述）构成。
在页面布局器中通过加载模板，将模板布局导入到当前页面使用。

模板不包含图表组件，且有两类用途不同的模板（见下文「模板分类」）。

配置项

模板的基础属性在列表的「新建 / 编辑」弹窗中维护。

配置项	说明
名称	模板名称，必填，用于标识与引用
分类	模板类型：页面构建模板 / 视图移动端渲染，必填，创建后不可修改
描述	模板的用途说明

模板分类

模板按用途分为两类，不同分类在布局编辑器中支持的组件集合不同。

页面构建模板（MetaPage）

用于标准页面的布局配置，支持完整的页面组件集合。

分类	组件
布局组件	基础容器、Tab 容器、Step 容器、分段控制器
元数据组件	视图、表单、数据详情、数据详情（表单模式）、审批流、审批流操作
UI 组件	警告提示、分割线、标签、图片、Markdown编辑器、富文本、自定义HTML、图标
其他组件	微组件、二维码、评论、功能按钮

视图移动端渲染（MetaView）

用于移动端视图的布局配置，支持布局组件、占位组件与 UI 组件。

分类	组件
布局组件	基础容器、Tab 容器、Step 容器、分段控制器
占位组件	字段占位符 #1 ~ #30（由视图列表字段绑定填充）、按钮占位符 #31 ~ #40（由视图列表行按钮绑定填充）、React 占位组件（自定义 React 代码渲染绑定的占位内容，可重复使用）
UI 组件	警告提示、分割线、标签、图片、Markdown编辑器、富文本、自定义HTML、图标

组件配置同源

两类模板使用的页面组件与平台页面完全一致，各组件的作用、配置项与属性详见对应组件的文档（上表已链接）。

布局编辑器

点击模板名称会以新窗口打开布局编辑器（与平台页面使用同一套布局器，操作方式参见布局器）：

左侧组件面板按模板分类展示受支持的组件，中间画布为布局区域。
布局为空时，编辑器默认放置一个「基础容器」作为起始布局。
占位组件为单例组件：同一布局中每个占位序号只能使用一次，且占位符自身（或包含占位符的容器）不支持复制，复制按钮会自动隐藏；React 占位组件不受此限制，可重复拖拽。
顶部工具栏展示模板名称、最近修改时间与分类标签。
与页面编辑器不同的是，模板编辑器不提供「页面设置 / 加载模板」等页面级操作，仅用于编辑并保存布局。

模板管理

操作	说明
新建	填写名称、分类、描述后创建，创建后可点击名称进入布局编辑器
编辑	修改模板的名称与描述（分类不可修改）
查看详情	以抽屉展示模板的全部属性
配置布局	点击模板名称进入布局编辑器，配置组件结构并保存

使用场景

标准化页面：为列表页、详情页、表单页等常用页面类型沉淀标准模板。
移动端适配：为移动端视图创建专用模板，保证移动端渲染结构一致。
快速交付：在页面中加载模板，减少重复搭建成本。

下一步

模板全局属性 - 了解模板属性的类型与存储格式
布局器 - 掌握布局器的操作方式
页面 - 在平台页面中使用模板
页面 - 了解页面的整体概念

属性明细

以下内容面向技术实现与 AI 检索。

属性表

属性名	类型	含义	取值/存储值
`Name`	string	模板名称，必填	展示名称
`Category`	int	模板分类，必填	`0` 页面构建模板 / `1` 视图移动端渲染
`Description`	string	模板描述	纯文本，可为空
`Customized`	bool	是否被自定义过	`true` / `false`
`CustomCreated`	bool	是否由用户自定义创建	`true` / `false`
`Layout`	`WidgetItem[]`	模板布局配置	组件树，JSON 序列化存储
`Properties`	object	自定义属性	当前为空对象 `{}`，预留扩展

分类枚举

枚举	值	中文名
`MetaPageTemplateCategory.MetaPage`	`0`	页面构建模板
`MetaPageTemplateCategory.MetaView`	`1`	视图移动端渲染

存储示例

模板数据存储在数据表 system_metapagetemplate 中，Layout 以 JSON 字符串形式存储：

{
  "_id": "7e6d5c4b-3a29-4817-9f6e-5d4c3b2a1908",
  "Name": "标准详情页",
  "Category": 0,
  "Description": "左右两栏的详情页布局",
  "Customized": false,
  "CustomCreated": true,
  "Layout": [
    {
      "id": "3f9c...",
      "uid": "f8c226b6-7b98-45a8-8c71-abeb21e2941a",
      "dragType": "Row",
      "originalType": "Row",
      "widgetType": "Row",
      "widgetTypeName": "基础容器",
      "children": [],
      "meta": { "ColumnSpace": "5" }
    }
  ],
  "Properties": {}
}

接口	说明
`POST /api/MetaPageTemplate/GetList`	分页获取模板列表
`POST /api/MetaPageTemplate/Create`	新建模板
`POST /api/MetaPageTemplate/Edit`	编辑模板
`GET /api/MetaPageTemplate/Get`	获取模板详情
`POST /api/MetaPageTemplate/SaveLayout`	保存模板布局

概述​

配置项​

模板分类​

页面构建模板（MetaPage）​

视图移动端渲染（MetaView）​

布局编辑器​

模板管理​

使用场景​

下一步​

属性明细​

属性表​

分类枚举​

存储示例​

相关接口​

概述

配置项