Skip to content

编辑器界面说明

路径:UI管理 → 页面配置 → 进入某页面的 设计 界面。

整体布局

电脑宽屏

区域功能
顶栏工具栏返回、撤销/重做、清空、导入导出、预览、保存
左侧组件库按分类展示可添加的组件,点击即插入画布
中间画布750rpx 宽手机预览框,含状态栏与导航栏模拟
右侧属性面板「属性」「样式」两个 Tab;未选中组件时为页面配置
AI 面板(可选)右侧或独立栏,描述需求生成布局

手机管理端

底部四个 Tab 切换:组件 | 画布 | AI | 属性,功能与宽屏一致。

顶栏工具栏

按钮作用
返回回到页面配置列表(未保存会提示)
撤销 / 重做回退或恢复编辑操作
清空删除画布上全部组件(需确认)
导出 JSON下载当前页面配置,用于备份或迁移
导入 JSON从文件恢复布局(覆盖当前画布)
预览截取手机框截图,弹层查看效果(不发布)
保存写入服务器;可选更新列表封面图

画布操作

操作方法
选中组件点击画布上的组件块
取消选中点击画布空白或导航栏下方空白
调整顺序选中后使用 上移 / 下移
复制复制 生成一份相同配置的组件
删除删除 移除该组件

选中时组件周围有高亮边框,右侧同步显示其属性。

右侧属性面板

未选中组件时 — 页面配置

根据页面类型不同,面板标题为 页面配置圈子配置服务表单

通用页面配置(首页、自定义页等):

分组可配置项
页面背景背景颜色
顶部背景图图片、背景图高度
导航栏是否显示标题/返回按钮、标题文字与对齐、导航栏样式(默认/胶囊/自定义/无)
胶囊导航胶囊颜色、圆角、阴影等(选胶囊样式时)
分享分享标题、分享图片

圈子页 额外有头区布局、动态列表是否跟随首页等,见 页面类型 — 社区圈子

服务表单页 额外有履约模式、计价公式等,见 页面类型 — 服务表单

选中组件时

Tab内容
属性该组件的业务内容(文案、图片、数据源、跳转等)
样式尺寸、内外边距、背景、圆角、边框、透明度、阴影

列表 section 类组件有特殊说明,见 样式与点击动作

左侧组件库

组件按 6 大类折叠展示:

  • 基础元素、布局导航、信息展示、社区内容、运营模块、表单/服务

灰色不可点 的组件表示当前页面类型不允许使用(例如首页不能添加表单组件)。

圈子页 左侧还会出现 头区布局笔记卡片模板 等圈子专属配置项,不属于画布组件。

页面列表面板

UI管理 → 页面配置 列表页:

元素说明
封面图保存时生成的截图;无图时显示占位
类型标签首页 / 功能页 / 自定义页 等
状态启用(绿色)或 禁用
设计进入可视化编辑器
启用 / 禁用切换对用户生效的版本
复制复制为新的配置草稿
删除删除该条配置

顶部 区域筛选 决定当前列表与新建页面所属区域。

导入导出使用场景

场景做法
测试环境 → 生产环境测试环境导出 JSON,生产环境同类型页面导入
备份重大改版前导出一份 JSON 存档
多区域快速复用平台默认导出 → 目标区域新建同类型 → 导入 → 微调 → 启用

导入会 覆盖 当前画布全部内容,操作前请确认或先导出备份。

下一步

灵萌 Lingmeng 使用手册