深浅模式
页面类型说明
在 UI管理 → 页面配置 中,每种 页面类型 对应客户端的不同位置,且 可用组件不同。
新建页面时在弹窗中选择类型;列表左侧可按类型筛选。
类型总览
| 类型 | 列表名称 | 客户端位置 | 编辑方式 |
|---|---|---|---|
home | 应用首页 | 底部 Tab 首页 | 可视化画布 |
feature | 功能页面 | 底部 Tab 发现/圈子 等 | 可视化画布 |
profile | 个人中心 | 我的 Tab 内个人中心 | 面板配置页 |
news | 消息中心 | 消息 Tab | 面板配置页 |
settings | 设置中心 | 设置页 | 面板配置页 |
user_guidance | 用户引导 | 新用户引导流程 | 面板配置页 |
official_intro | 官网介绍 | 全站介绍页 | 面板配置页 |
custom | 自定义页面 | 独立页面,需自行配置跳转 | 可视化画布 |
forum | 社区圈子 | 单个圈子详情页 | 可视化画布 + 头区配置 |
errand_service | 服务表单 | 跑腿等服务下单页 | 可视化画布(仅表单组件) |
Tab 页面
应用首页(home)
- 用户打开 App 默认看到的 第一个 Tab 页
- 可用除「表单/服务」外的 全部内容组件
- 常与 筛选标签 + 笔记列表 组合
功能页面(feature)
- 第二个 Tab 常用作 发现页 / 圈子广场
- 组件规则与首页相同
- 在 TabBar 配置 中绑定到对应 Tab 路由
TIP
首页与功能页都通过 TabBar 进入,但 UI 配置 分开保存。改首页不会自动改功能页。
面板配置页
以下类型 不进入三栏画布,而是专用 配置表单(列表卡片上按钮为 配置):
| 类型 | 主要配置内容 |
|---|---|
| 个人中心 | 用户头像区样式、功能卡片列表、菜单入口 |
| 消息中心 | 消息 Tab 结构、订阅消息入口卡片 |
| 设置中心 | 设置项分组与跳转链接 |
| 用户引导 | 引导步骤文案与图片 |
| 官网介绍 | 介绍页模块与文案 |
保存后同样在列表中 启用 才对用户生效。
独立页面
自定义页面(custom)
- 独立分包页面,不占用 Tab 位
- 需通过 金刚区、按钮、TabBar、通知 等配置 点击动作 跳转到该页
- 客户端路径形如:
/pages_user/custom-page/index?page_type=你的页面类型标识 - 新建时系统会生成唯一
page_type(如custom_xxx)
适用:活动页、专题页、静态介绍页。
社区圈子(forum)
圈子详情页的 UI,包含两部分:
1. 左侧组件库 — 圈子专属(非画布组件)
| 配置项 | 选项 | 作用 |
|---|---|---|
| 头区布局 | 默认 / 居中 / 卡片 | 圈子顶部封面与信息排版 |
| 动态列表卡片模板 | 模板 1 / 2 / 3 | 帖子的展示样式 |
| 跟随首页 | 是 / 否 | 列表样式是否与首页笔记列表一致 |
2. 画布可添加组件
仅 筛选标签 + 笔记列表(与首页相比,筛选联动目标固定为笔记)。
服务表单(errand_service)
用于 跑腿下单、可配置服务 等场景:
- 组件库 仅显示表单/服务 16 个组件
- 隐藏轮播、社区、榜单等内容组件
- 必须包含 提交底栏(每页唯一,固定吸底)
- 右侧额外 服务表单 Tab:履约模式、计价公式、模板编码等
需配合 跑腿 业务与区域配置使用。
各类型可用组件对照
| 组件分类 | home / feature / custom | forum | errand_service |
|---|---|---|---|
| 基础元素 | ✅(按钮在表单页隐藏) | ✅ | ❌ 仅表单内按钮 |
| 布局导航 | ✅ | 仅筛选标签 | ❌ |
| 信息展示 | ✅(结束文本在表单页隐藏) | ✅ | ❌ |
| 社区内容 | ✅ | 仅笔记列表 | ❌ |
| 运营模块 | ✅ | ❌ | ❌ |
| 表单/服务 | ❌ | ❌ | ✅ 全部 |
互斥与唯一性规则
以下规则在编辑器中自动限制(重复添加会提示或置灰):
| 规则 | 说明 |
|---|---|
| 筛选标签 | 每页 最多 1 个 |
| 圈子列表 / 笔记列表 / 瀑布流 | 三选一,每页最多 1 个 |
| 提交底栏 | 服务表单页 最多 1 个 |
| 表单组件 | 仅 服务表单 页可添加 |
与 TabBar 的关系
- TabBar 决定底部有几个 Tab、图标与跳转路由
- 页面配置 决定用户进入该 Tab 后看到的内容
- 两者 按区域分别存储,需分别保存
示例:TabBar 第二个 Tab 指向发现页路由 → 编辑 功能页面(feature) 类型的 UI → 分别 保存 并 启用。
详见 TabBar 配置。
