1849 lines
24 KiB
Markdown
1849 lines
24 KiB
Markdown
# 慧愈科技官网后台功能需求设计文档 V1.0
|
||
|
||
> 项目名称:慧愈科技官方网站后台管理系统
|
||
> 文档版本:V1.0
|
||
> 日期:2026-08-10
|
||
> 目标:为慧愈科技官网提供统一、易维护、可审计、可扩展的内容管理后台,并确保前台官网始终保持高级、可信、统一的品牌形象。
|
||
|
||
---
|
||
|
||
# 1. 项目背景
|
||
|
||
慧愈科技官网的核心目标不是做一个复杂的业务系统,而是建立一个长期稳定、可信、清晰、便于搜索引擎和 AI 理解的官方信息源。
|
||
|
||
官网前台整体采用“一页式长页面 + 顶部吸顶导航 + 页面锚点联动”的浏览体验,核心展示内容包括:
|
||
|
||
- 慧愈科技品牌与公司信息;
|
||
- 卢慧老师官方介绍;
|
||
- 理念与方法;
|
||
- 课程与产品;
|
||
- 官方信息;
|
||
- 品牌动态 / 官方声明;
|
||
- 陪伴团队;
|
||
- 联系方式与官方渠道。
|
||
|
||
后台的核心任务,是让运营人员无需修改代码即可维护上述内容。
|
||
|
||
---
|
||
|
||
# 2. 后台产品定位
|
||
|
||
后台不是通用 CMS,也不做复杂页面搭建器。
|
||
|
||
一期后台定位为:
|
||
|
||
> **面向慧愈科技官网的专用内容管理系统。**
|
||
|
||
核心原则:
|
||
|
||
1. 前台结构固定,后台主要负责改内容;
|
||
2. 首页模块允许排序、显示/隐藏,但不允许随意改变整体结构;
|
||
3. 公司、老师、课程、官方账号等信息统一维护,避免重复录入;
|
||
4. 所有关键内容支持草稿、审核、发布和历史版本;
|
||
5. 重要内容修改后可实时预览前台效果;
|
||
6. 内容结构尽量标准化,为后续 SEO 与 AI 信息识别提供基础;
|
||
7. 后台视觉风格与官网保持统一,但更偏专业、清晰、高效。
|
||
|
||
---
|
||
|
||
# 3. 后台整体信息架构
|
||
|
||
后台左侧一级导航:
|
||
|
||
```text
|
||
仪表盘
|
||
|
||
首页管理
|
||
|
||
卢慧老师
|
||
|
||
公司与品牌
|
||
├─ 公司信息
|
||
├─ 品牌信息
|
||
└─ 官方渠道
|
||
|
||
课程与产品
|
||
|
||
内容中心
|
||
├─ 品牌动态
|
||
├─ 官方声明
|
||
└─ 媒体报道
|
||
|
||
陪伴团队
|
||
|
||
素材中心
|
||
|
||
SEO / AI信息
|
||
|
||
系统设置
|
||
├─ 管理员账号
|
||
├─ 角色权限
|
||
├─ 操作日志
|
||
├─ 发布审核
|
||
└─ 网站配置
|
||
```
|
||
|
||
---
|
||
|
||
# 4. 统一 UI 设计规范
|
||
|
||
## 4.1 整体风格
|
||
|
||
后台视觉延续官网风格:
|
||
|
||
- 大面积留白;
|
||
- 浅蓝灰、暖白、低饱和米色为背景;
|
||
- 深海军蓝作为主色;
|
||
- 极浅蓝作为模块背景;
|
||
- 少量暖金作为辅助强调色;
|
||
- 大圆角卡片;
|
||
- 柔和阴影;
|
||
- 不使用高饱和颜色;
|
||
- 不使用传统“企业后台蓝白表格风”;
|
||
- 不使用大量边框;
|
||
- 不使用过密的模块。
|
||
|
||
整体气质:
|
||
|
||
> 安静、克制、高级、专业、可信。
|
||
|
||
---
|
||
|
||
## 4.2 基础布局
|
||
|
||
桌面端:
|
||
|
||
```text
|
||
┌──────────────────────────────────────────────┐
|
||
│ 左侧导航 │ 顶部栏 │
|
||
│ ├───────────────────────────────────┤
|
||
│ │ │
|
||
│ │ 页面主体 │
|
||
│ │ │
|
||
│ │ │
|
||
└──────────────────────────────────────────────┘
|
||
```
|
||
|
||
左侧导航:
|
||
|
||
- 固定宽度约 220px;
|
||
- Logo 位于顶部;
|
||
- 当前菜单使用浅蓝背景高亮;
|
||
- 一级菜单图标 + 文字;
|
||
- 支持折叠。
|
||
|
||
顶部栏:
|
||
|
||
- 页面标题;
|
||
- 全局搜索;
|
||
- 通知;
|
||
- 当前管理员;
|
||
- 快捷预览官网;
|
||
- 退出登录。
|
||
|
||
---
|
||
|
||
## 4.3 通用交互规范
|
||
|
||
所有编辑页面统一支持:
|
||
|
||
- 自动保存草稿;
|
||
- 手动保存;
|
||
- 预览;
|
||
- 提交审核;
|
||
- 发布;
|
||
- 查看历史版本;
|
||
- 恢复历史版本;
|
||
- 显示最后保存时间;
|
||
- 离开未保存页面时提示;
|
||
- 删除前二次确认;
|
||
- 上传图片后即时预览。
|
||
|
||
状态统一:
|
||
|
||
```text
|
||
草稿
|
||
待审核
|
||
已发布
|
||
已下线
|
||
```
|
||
|
||
颜色建议:
|
||
|
||
- 草稿:灰蓝;
|
||
- 待审核:暖橙;
|
||
- 已发布:浅绿;
|
||
- 已下线:灰。
|
||
|
||
---
|
||
|
||
# 5. 登录页
|
||
|
||
## 5.1 页面定位
|
||
|
||
登录页风格与官网首页一致。
|
||
|
||
背景使用:
|
||
|
||
- 山水;
|
||
- 晨光;
|
||
- 湖面;
|
||
- 极简莲花元素;
|
||
- 柔和渐变。
|
||
|
||
左侧作为品牌展示,右侧为登录卡片。
|
||
|
||
---
|
||
|
||
## 5.2 页面结构
|
||
|
||
左侧:
|
||
|
||
- Logo;
|
||
- 品牌主标题;
|
||
- “身心疗愈 · 科技赋能”;
|
||
- 品牌副标题;
|
||
- 背景视觉。
|
||
|
||
右侧登录卡片:
|
||
|
||
- 标题:后台管理登录;
|
||
- 账号;
|
||
- 密码;
|
||
- 验证码;
|
||
- 记住我;
|
||
- 忘记密码;
|
||
- 登录按钮。
|
||
|
||
---
|
||
|
||
## 5.3 登录交互
|
||
|
||
### 账号
|
||
|
||
支持:
|
||
|
||
- 用户名;
|
||
- 手机号;
|
||
- 邮箱。
|
||
|
||
### 密码
|
||
|
||
支持:
|
||
|
||
- 显示 / 隐藏密码;
|
||
- 回车登录。
|
||
|
||
### 验证码
|
||
|
||
一期采用图形验证码。
|
||
|
||
连续登录失败超过设定次数后:
|
||
|
||
- 强制刷新验证码;
|
||
- 可增加短时登录限制。
|
||
|
||
### 登录成功
|
||
|
||
跳转:
|
||
|
||
```text
|
||
/dashboard
|
||
```
|
||
|
||
### 登录失败
|
||
|
||
显示明确原因:
|
||
|
||
- 账号不存在;
|
||
- 密码错误;
|
||
- 验证码错误;
|
||
- 账号已停用。
|
||
|
||
不得只显示“登录失败”。
|
||
|
||
---
|
||
|
||
# 6. 仪表盘
|
||
|
||
## 6.1 页面目标
|
||
|
||
仪表盘只展示真正有用的信息,不堆无意义数据。
|
||
|
||
---
|
||
|
||
## 6.2 顶部欢迎区
|
||
|
||
显示:
|
||
|
||
- 早安 / 下午好 / 晚上好;
|
||
- 管理员姓名;
|
||
- 今日日期;
|
||
- 快捷入口。
|
||
|
||
---
|
||
|
||
## 6.3 核心数据卡片
|
||
|
||
建议一期展示:
|
||
|
||
- 已发布页面数量;
|
||
- 已发布内容数量;
|
||
- 待审核内容数量;
|
||
- 课程与产品数量;
|
||
- 陪伴团队人数;
|
||
- 网站运行状态。
|
||
|
||
如已接入统计工具,可增加:
|
||
|
||
- 近 7 日 PV;
|
||
- 近 7 日 UV;
|
||
- 平均停留时长。
|
||
|
||
不强制一期实现复杂统计。
|
||
|
||
---
|
||
|
||
## 6.4 快捷操作
|
||
|
||
支持:
|
||
|
||
- 编辑首页;
|
||
- 发布文章;
|
||
- 新增课程;
|
||
- 上传素材;
|
||
- 添加团队成员;
|
||
- SEO 设置。
|
||
|
||
---
|
||
|
||
## 6.5 最近更新
|
||
|
||
列表展示:
|
||
|
||
- 更新对象;
|
||
- 操作人;
|
||
- 操作类型;
|
||
- 更新时间;
|
||
- 跳转到对应内容。
|
||
|
||
---
|
||
|
||
## 6.6 待审核内容
|
||
|
||
显示:
|
||
|
||
- 内容标题;
|
||
- 内容类型;
|
||
- 提交人;
|
||
- 提交时间;
|
||
- 快捷审核。
|
||
|
||
---
|
||
|
||
# 7. 首页管理
|
||
|
||
## 7.1 页面目标
|
||
|
||
前台首页是“一页式长页面”。
|
||
|
||
后台首页管理不做自由拖拽建站器,而采用:
|
||
|
||
> **固定模块 + 排序 + 显隐 + 模块内容编辑 + 实时预览。**
|
||
|
||
---
|
||
|
||
## 7.2 页面布局
|
||
|
||
建议三栏:
|
||
|
||
```text
|
||
左侧:页面模块列表
|
||
中间:实时预览
|
||
右侧:当前模块编辑面板
|
||
```
|
||
|
||
---
|
||
|
||
## 7.3 首页模块
|
||
|
||
默认模块:
|
||
|
||
```text
|
||
英雄区
|
||
关于慧愈
|
||
卢慧老师
|
||
理念与方法
|
||
课程与产品
|
||
官方信息
|
||
品牌动态 / 官方声明
|
||
陪伴团队
|
||
页脚
|
||
```
|
||
|
||
---
|
||
|
||
## 7.4 模块操作
|
||
|
||
每个模块支持:
|
||
|
||
- 拖动排序;
|
||
- 显示 / 隐藏;
|
||
- 编辑;
|
||
- 预览;
|
||
- 恢复默认设置。
|
||
|
||
一期不支持删除核心模块。
|
||
|
||
---
|
||
|
||
## 7.5 英雄区
|
||
|
||
字段:
|
||
|
||
- 主标题;
|
||
- 副标题;
|
||
- 简介;
|
||
- CTA 按钮文字;
|
||
- CTA 跳转目标;
|
||
- 背景图片;
|
||
- 背景视频;
|
||
- 是否开启背景动效;
|
||
- 背景亮度;
|
||
- 背景遮罩强度。
|
||
|
||
建议前台动效:
|
||
|
||
- 页面进入时文字淡入;
|
||
- 背景轻微视差;
|
||
- 鼠标移动产生弱视差;
|
||
- 莲花 / 光圈缓慢漂移;
|
||
- 不使用夸张粒子特效。
|
||
|
||
---
|
||
|
||
## 7.6 关于慧愈模块
|
||
|
||
字段:
|
||
|
||
- 模块标题;
|
||
- 英文辅助标题;
|
||
- 简介;
|
||
- 详细介绍;
|
||
- 配图;
|
||
- 跳转按钮;
|
||
- 展示数据卡片。
|
||
|
||
可配置数据卡:
|
||
|
||
- 成立时间;
|
||
- 服务学员;
|
||
- 核心业务;
|
||
- 其他自定义数据。
|
||
|
||
---
|
||
|
||
## 7.7 卢慧老师模块
|
||
|
||
首页只维护首页展示版信息:
|
||
|
||
- 展示标题;
|
||
- 一句话身份;
|
||
- 首页短简介;
|
||
- 人物大图;
|
||
- 3~4 个核心标签;
|
||
- 了解更多按钮。
|
||
|
||
具体详细资料从“卢慧老师”模块统一读取。
|
||
|
||
---
|
||
|
||
## 7.8 理念与方法
|
||
|
||
默认三项:
|
||
|
||
- 觉察;
|
||
- 关系;
|
||
- 成长。
|
||
|
||
每项支持:
|
||
|
||
- 标题;
|
||
- 副标题;
|
||
- 简介;
|
||
- 图片;
|
||
- 跳转链接;
|
||
- hover 动效样式。
|
||
|
||
---
|
||
|
||
## 7.9 课程与产品
|
||
|
||
首页不展示全部课程。
|
||
|
||
后台支持勾选:
|
||
|
||
```text
|
||
首页推荐
|
||
```
|
||
|
||
首页最多建议展示 3~4 个。
|
||
|
||
字段读取自“课程与产品”。
|
||
|
||
---
|
||
|
||
## 7.10 官方信息
|
||
|
||
首页只展示固定入口:
|
||
|
||
- 公司主体;
|
||
- 官方老师;
|
||
- 官方账号;
|
||
- 官方课程。
|
||
|
||
后台可控制:
|
||
|
||
- 是否展示;
|
||
- 排序;
|
||
- 卡片标题;
|
||
- 卡片简介;
|
||
- 图标。
|
||
|
||
---
|
||
|
||
## 7.11 品牌动态 / 官方声明
|
||
|
||
首页显示最近 N 条。
|
||
|
||
后台配置:
|
||
|
||
- 展示数量;
|
||
- 内容类型;
|
||
- 是否优先显示官方声明;
|
||
- 是否展示日期。
|
||
|
||
---
|
||
|
||
## 7.12 陪伴团队
|
||
|
||
首页仅展示精选成员。
|
||
|
||
后台支持:
|
||
|
||
- 首页推荐;
|
||
- 首页排序;
|
||
- 首页最大展示人数。
|
||
|
||
推荐首页最多展示 5~8 人。
|
||
|
||
---
|
||
|
||
## 7.13 实时预览
|
||
|
||
支持:
|
||
|
||
- PC;
|
||
- 平板;
|
||
- 手机。
|
||
|
||
编辑过程中实时预览。
|
||
|
||
预览必须和正式前台使用同一套组件。
|
||
|
||
---
|
||
|
||
# 8. 卢慧老师
|
||
|
||
## 8.1 页面定位
|
||
|
||
卢慧老师是官网核心人物,独立一级菜单。
|
||
|
||
资料分为:
|
||
|
||
```text
|
||
基础资料
|
||
百科介绍
|
||
经历与成果
|
||
课程关联
|
||
外部链接
|
||
SEO 信息
|
||
```
|
||
|
||
---
|
||
|
||
## 8.2 基础资料
|
||
|
||
字段:
|
||
|
||
- 姓名;
|
||
- 英文名;
|
||
- 对外称呼;
|
||
- 一句话身份;
|
||
- 标准简介;
|
||
- 详细介绍;
|
||
- 主头像;
|
||
- 半身照;
|
||
- 横版宣传图;
|
||
- 人物标签;
|
||
- 首页展示摘要。
|
||
|
||
---
|
||
|
||
## 8.3 标准介绍
|
||
|
||
建议保存三种版本:
|
||
|
||
### 一句话介绍
|
||
|
||
建议 20~40 字。
|
||
|
||
### 标准短介绍
|
||
|
||
建议 100~150 字。
|
||
|
||
### 完整介绍
|
||
|
||
不限制字数。
|
||
|
||
---
|
||
|
||
## 8.4 百科介绍
|
||
|
||
字段:
|
||
|
||
- 百科简介;
|
||
- 百科页面 URL;
|
||
- 百科更新时间;
|
||
- 百科截图;
|
||
- 来源说明。
|
||
|
||
用于保持官网与权威公开资料一致。
|
||
|
||
---
|
||
|
||
## 8.5 经历与成果
|
||
|
||
采用时间线管理。
|
||
|
||
字段:
|
||
|
||
- 年份;
|
||
- 月份;
|
||
- 标题;
|
||
- 描述;
|
||
- 图片;
|
||
- 类型;
|
||
- 是否重要;
|
||
- 是否前台展示;
|
||
- 排序。
|
||
|
||
类型:
|
||
|
||
- 从业经历;
|
||
- 课程;
|
||
- 项目;
|
||
- 著作;
|
||
- 荣誉;
|
||
- 媒体;
|
||
- 其他。
|
||
|
||
---
|
||
|
||
## 8.6 核心成果
|
||
|
||
卡片式管理。
|
||
|
||
例如:
|
||
|
||
- 从业年限;
|
||
- 服务时长;
|
||
- 学员数量;
|
||
- 课程数量。
|
||
|
||
字段:
|
||
|
||
- 数值;
|
||
- 单位;
|
||
- 描述;
|
||
- 图标;
|
||
- 排序。
|
||
|
||
---
|
||
|
||
## 8.7 课程关联
|
||
|
||
从“课程与产品”中选择关联。
|
||
|
||
不重复录入课程。
|
||
|
||
---
|
||
|
||
## 8.8 外部权威链接
|
||
|
||
字段:
|
||
|
||
- 平台名称;
|
||
- 链接;
|
||
- 图标;
|
||
- 类型;
|
||
- 是否展示。
|
||
|
||
例如:
|
||
|
||
- 百度百科;
|
||
- 公众号;
|
||
- 视频号;
|
||
- 新闻媒体;
|
||
- 官方采访。
|
||
|
||
---
|
||
|
||
## 8.9 页面预览
|
||
|
||
后台右侧显示人物页面实时预览。
|
||
|
||
---
|
||
|
||
# 9. 公司与品牌
|
||
|
||
---
|
||
|
||
# 9.1 公司信息
|
||
|
||
字段:
|
||
|
||
- 公司法定全称;
|
||
- 公司简称;
|
||
- 英文名称;
|
||
- 成立时间;
|
||
- 公司简介;
|
||
- 统一社会信用代码;
|
||
- 注册地址;
|
||
- 办公地址;
|
||
- 联系电话;
|
||
- 邮箱;
|
||
- 官网域名;
|
||
- ICP 备案号;
|
||
- 公安备案号;
|
||
- Logo;
|
||
- 公司照片。
|
||
|
||
所有前台模块统一引用这里的数据。
|
||
|
||
---
|
||
|
||
# 9.2 品牌信息
|
||
|
||
字段:
|
||
|
||
- 品牌名称;
|
||
- Logo;
|
||
- 品牌简介;
|
||
- 品牌使命;
|
||
- 品牌愿景;
|
||
- 品牌价值观;
|
||
- 品牌关键词;
|
||
- 品牌主张;
|
||
- 品牌视觉说明。
|
||
|
||
---
|
||
|
||
# 9.3 官方渠道
|
||
|
||
每个渠道字段:
|
||
|
||
- 平台;
|
||
- 账号名称;
|
||
- 账号 ID;
|
||
- 主体;
|
||
- 二维码;
|
||
- 官方链接;
|
||
- 简介;
|
||
- 是否启用;
|
||
- 排序。
|
||
|
||
渠道类型:
|
||
|
||
- 微信公众号;
|
||
- 视频号;
|
||
- 小红书;
|
||
- 抖音;
|
||
- 小程序;
|
||
- 客服微信;
|
||
- 官方邮箱;
|
||
- 官方电话;
|
||
- 其他。
|
||
|
||
不做搜索核验功能。
|
||
|
||
前台只直接展示官方渠道。
|
||
|
||
---
|
||
|
||
# 10. 课程与产品
|
||
|
||
## 10.1 列表页
|
||
|
||
支持:
|
||
|
||
- 搜索;
|
||
- 类型筛选;
|
||
- 状态筛选;
|
||
- 首页推荐筛选;
|
||
- 排序;
|
||
- 批量上下线。
|
||
|
||
---
|
||
|
||
## 10.2 产品类型
|
||
|
||
后台可配置,例如:
|
||
|
||
- 直播课程;
|
||
- 长期课程;
|
||
- 实修服务;
|
||
- AI 产品;
|
||
- 小程序;
|
||
- 科技产品;
|
||
- 企业服务。
|
||
|
||
---
|
||
|
||
## 10.3 基础字段
|
||
|
||
- 产品名称;
|
||
- 副标题;
|
||
- 产品类型;
|
||
- 封面;
|
||
- Banner;
|
||
- 简介;
|
||
- 详细介绍;
|
||
- 适合人群;
|
||
- 核心价值;
|
||
- 服务方式;
|
||
- 官方价格;
|
||
- 主讲老师;
|
||
- 上线时间;
|
||
- 当前状态;
|
||
- 官方入口;
|
||
- 是否首页推荐;
|
||
- 首页排序。
|
||
|
||
---
|
||
|
||
## 10.4 产品状态
|
||
|
||
```text
|
||
筹备中
|
||
在售
|
||
暂停
|
||
升级中
|
||
已下架
|
||
```
|
||
|
||
---
|
||
|
||
## 10.5 详情页内容
|
||
|
||
支持富文本。
|
||
|
||
支持:
|
||
|
||
- 标题;
|
||
- 图片;
|
||
- 视频;
|
||
- 引用;
|
||
- 表格;
|
||
- 按钮;
|
||
- FAQ。
|
||
|
||
不做任意自由页面搭建。
|
||
|
||
---
|
||
|
||
# 11. 内容中心
|
||
|
||
## 11.1 内容类型
|
||
|
||
统一文章模型,分类展示:
|
||
|
||
```text
|
||
品牌动态
|
||
官方声明
|
||
媒体报道
|
||
```
|
||
|
||
---
|
||
|
||
## 11.2 内容列表
|
||
|
||
字段:
|
||
|
||
- 标题;
|
||
- 分类;
|
||
- 封面;
|
||
- 摘要;
|
||
- 状态;
|
||
- 作者;
|
||
- 发布时间;
|
||
- 更新时间;
|
||
- 操作。
|
||
|
||
支持:
|
||
|
||
- 搜索;
|
||
- 分类;
|
||
- 状态;
|
||
- 时间;
|
||
- 批量发布;
|
||
- 批量下线。
|
||
|
||
---
|
||
|
||
## 11.3 内容编辑
|
||
|
||
字段:
|
||
|
||
- 标题;
|
||
- 摘要;
|
||
- 封面;
|
||
- 正文;
|
||
- 内容类型;
|
||
- 关联对象;
|
||
- 发布时间;
|
||
- SEO 标题;
|
||
- SEO 描述;
|
||
- 关键词;
|
||
- 发布状态。
|
||
|
||
---
|
||
|
||
## 11.4 官方声明
|
||
|
||
增加字段:
|
||
|
||
- 声明类型;
|
||
- 涉及对象;
|
||
- 声明编号;
|
||
- 是否置顶;
|
||
- 是否首页展示;
|
||
- 附件;
|
||
- 盖章文件。
|
||
|
||
---
|
||
|
||
## 11.5 媒体报道
|
||
|
||
增加:
|
||
|
||
- 媒体名称;
|
||
- 原文 URL;
|
||
- 发布时间;
|
||
- 媒体 Logo;
|
||
- 是否权威来源。
|
||
|
||
---
|
||
|
||
# 12. 陪伴团队
|
||
|
||
## 12.1 定位
|
||
|
||
卢慧老师不放在此列表。
|
||
|
||
该模块管理上百位陪伴老师、辅导老师。
|
||
|
||
---
|
||
|
||
## 12.2 字段
|
||
|
||
- 姓名;
|
||
- 照片;
|
||
- 老师类型;
|
||
- 职位;
|
||
- 简介;
|
||
- 擅长方向;
|
||
- 服务方向;
|
||
- 加入时间;
|
||
- 是否首页推荐;
|
||
- 是否公开展示;
|
||
- 排序。
|
||
|
||
---
|
||
|
||
## 12.3 列表操作
|
||
|
||
支持:
|
||
|
||
- 搜索;
|
||
- 类型筛选;
|
||
- 显示状态;
|
||
- 批量上下线;
|
||
- 批量设置首页推荐;
|
||
- 拖动排序。
|
||
|
||
---
|
||
|
||
# 13. 素材中心
|
||
|
||
## 13.1 素材类型
|
||
|
||
- 图片;
|
||
- 视频;
|
||
- PDF;
|
||
- Logo;
|
||
- 其他附件。
|
||
|
||
---
|
||
|
||
## 13.2 上传
|
||
|
||
支持:
|
||
|
||
- 拖拽上传;
|
||
- 多文件上传;
|
||
- 上传进度;
|
||
- 图片自动压缩;
|
||
- 图片自动生成 WebP;
|
||
- 自动读取尺寸;
|
||
- 自动读取文件大小。
|
||
|
||
---
|
||
|
||
## 13.3 素材字段
|
||
|
||
- 文件名;
|
||
- 类型;
|
||
- URL;
|
||
- 尺寸;
|
||
- 文件大小;
|
||
- ALT 文本;
|
||
- 标签;
|
||
- 上传人;
|
||
- 上传时间;
|
||
- 引用次数。
|
||
|
||
---
|
||
|
||
## 13.4 素材操作
|
||
|
||
- 预览;
|
||
- 替换;
|
||
- 下载;
|
||
- 复制 URL;
|
||
- 查看引用页面;
|
||
- 删除。
|
||
|
||
若素材正在被页面使用,不允许直接删除。
|
||
|
||
需提示:
|
||
|
||
> 当前素材正在被 X 个页面引用,请先解除引用。
|
||
|
||
---
|
||
|
||
# 14. SEO / AI 信息
|
||
|
||
## 14.1 页面 SEO
|
||
|
||
每个前台页面支持:
|
||
|
||
- SEO Title;
|
||
- SEO Description;
|
||
- Keywords;
|
||
- Canonical URL;
|
||
- OG Title;
|
||
- OG Description;
|
||
- OG Image;
|
||
- 是否允许索引。
|
||
|
||
---
|
||
|
||
## 14.2 AI 标准信息
|
||
|
||
针对核心实体维护标准信息。
|
||
|
||
实体包括:
|
||
|
||
```text
|
||
慧愈科技
|
||
深圳市慧愈文化科技有限公司
|
||
卢慧老师
|
||
核心课程
|
||
核心产品
|
||
```
|
||
|
||
每个实体支持:
|
||
|
||
- 标准名称;
|
||
- 别名;
|
||
- 一句话介绍;
|
||
- 100 字介绍;
|
||
- 300 字介绍;
|
||
- 完整介绍;
|
||
- 实体类型;
|
||
- 关联实体;
|
||
- 官方链接;
|
||
- 外部权威链接;
|
||
- 最后更新时间。
|
||
|
||
---
|
||
|
||
## 14.3 结构化数据
|
||
|
||
系统自动生成 JSON-LD。
|
||
|
||
建议:
|
||
|
||
| 页面 | Schema |
|
||
|---|---|
|
||
| 官网首页 | Organization + WebSite |
|
||
| 公司页 | Organization |
|
||
| 卢慧老师 | Person + ProfilePage |
|
||
| 课程 | Product / Service |
|
||
| 内容 | Article |
|
||
| 导航 | BreadcrumbList |
|
||
|
||
后台不要求普通运营人员直接编辑 JSON。
|
||
|
||
---
|
||
|
||
# 15. 系统设置
|
||
|
||
---
|
||
|
||
# 15.1 管理员账号
|
||
|
||
字段:
|
||
|
||
- 姓名;
|
||
- 用户名;
|
||
- 手机号;
|
||
- 邮箱;
|
||
- 角色;
|
||
- 状态;
|
||
- 最后登录时间。
|
||
|
||
支持:
|
||
|
||
- 新建;
|
||
- 编辑;
|
||
- 停用;
|
||
- 重置密码。
|
||
|
||
---
|
||
|
||
# 15.2 角色权限
|
||
|
||
一期角色:
|
||
|
||
```text
|
||
超级管理员
|
||
内容管理员
|
||
审核员
|
||
```
|
||
|
||
### 超级管理员
|
||
|
||
拥有全部权限。
|
||
|
||
### 内容管理员
|
||
|
||
可:
|
||
|
||
- 新建;
|
||
- 编辑;
|
||
- 保存草稿;
|
||
- 提交审核。
|
||
|
||
不可直接发布敏感内容。
|
||
|
||
### 审核员
|
||
|
||
可:
|
||
|
||
- 查看;
|
||
- 审核;
|
||
- 发布;
|
||
- 退回。
|
||
|
||
---
|
||
|
||
# 15.3 发布审核
|
||
|
||
流程:
|
||
|
||
```text
|
||
编辑
|
||
↓
|
||
保存草稿
|
||
↓
|
||
提交审核
|
||
↓
|
||
审核通过
|
||
↓
|
||
发布
|
||
```
|
||
|
||
审核退回:
|
||
|
||
```text
|
||
审核退回
|
||
↓
|
||
填写退回原因
|
||
↓
|
||
编辑重新修改
|
||
↓
|
||
再次提交审核
|
||
```
|
||
|
||
---
|
||
|
||
# 15.4 操作日志
|
||
|
||
记录:
|
||
|
||
- 操作人;
|
||
- 时间;
|
||
- IP;
|
||
- 模块;
|
||
- 操作类型;
|
||
- 目标对象;
|
||
- 修改前内容;
|
||
- 修改后内容。
|
||
|
||
操作类型:
|
||
|
||
- 登录;
|
||
- 新建;
|
||
- 编辑;
|
||
- 发布;
|
||
- 下线;
|
||
- 删除;
|
||
- 恢复版本;
|
||
- 修改权限。
|
||
|
||
---
|
||
|
||
# 15.5 网站配置
|
||
|
||
字段:
|
||
|
||
- 网站名称;
|
||
- 网站 Logo;
|
||
- favicon;
|
||
- 默认 SEO;
|
||
- 联系方式;
|
||
- ICP;
|
||
- 公安备案;
|
||
- 页脚版权;
|
||
- 网站状态;
|
||
- 维护模式;
|
||
- 网站统计代码;
|
||
- robots 设置;
|
||
- sitemap 设置。
|
||
|
||
---
|
||
|
||
# 16. 版本管理
|
||
|
||
所有以下对象必须保留历史版本:
|
||
|
||
- 首页;
|
||
- 卢慧老师;
|
||
- 公司信息;
|
||
- 品牌信息;
|
||
- 课程;
|
||
- 内容文章;
|
||
- 官方声明。
|
||
|
||
每个版本记录:
|
||
|
||
- 版本号;
|
||
- 修改人;
|
||
- 修改时间;
|
||
- 修改原因;
|
||
- 发布人;
|
||
- 发布时间。
|
||
|
||
支持:
|
||
|
||
```text
|
||
查看版本
|
||
对比版本
|
||
恢复版本
|
||
```
|
||
|
||
恢复版本后先恢复为草稿,不直接覆盖线上版本。
|
||
|
||
---
|
||
|
||
# 17. 搜索
|
||
|
||
后台顶部提供全局搜索。
|
||
|
||
可搜索:
|
||
|
||
- 页面;
|
||
- 老师;
|
||
- 课程;
|
||
- 内容;
|
||
- 素材;
|
||
- 官方渠道。
|
||
|
||
支持快捷键:
|
||
|
||
```text
|
||
Ctrl / Cmd + K
|
||
```
|
||
|
||
---
|
||
|
||
# 18. 前台联动要求
|
||
|
||
官网前台采用“一页式长页面”。
|
||
|
||
顶部导航固定吸顶。
|
||
|
||
点击导航:
|
||
|
||
```text
|
||
首页
|
||
关于慧愈
|
||
卢慧老师
|
||
课程与产品
|
||
官方信息
|
||
品牌动态
|
||
联系我们
|
||
```
|
||
|
||
页面平滑滚动到对应模块。
|
||
|
||
用户滚动页面时:
|
||
|
||
- 系统自动判断当前模块;
|
||
- 顶部导航自动切换激活状态;
|
||
- URL 可更新锚点;
|
||
- 浏览器返回行为正常。
|
||
|
||
例如:
|
||
|
||
```text
|
||
/#about
|
||
/#luhui
|
||
/#products
|
||
/#official
|
||
/#news
|
||
/#contact
|
||
```
|
||
|
||
---
|
||
|
||
# 19. 前台动效要求
|
||
|
||
后台不直接控制所有复杂动效,只提供必要开关。
|
||
|
||
整体原则:
|
||
|
||
> 动效用于增强高级感,而不是为了炫技。
|
||
|
||
推荐:
|
||
|
||
### 首屏
|
||
|
||
- 背景缓慢视差;
|
||
- 光晕缓慢移动;
|
||
- 文字进入淡入;
|
||
- 莲花轻微浮动。
|
||
|
||
### 模块进入
|
||
|
||
进入视口:
|
||
|
||
- 上移 20~30px;
|
||
- 渐显;
|
||
- 0.5~0.8 秒。
|
||
|
||
### 卡片 Hover
|
||
|
||
- 轻微抬升;
|
||
- 图片轻微放大;
|
||
- 光影缓慢变化;
|
||
- 箭头轻微移动。
|
||
|
||
禁止:
|
||
|
||
- 快速弹跳;
|
||
- 大幅旋转;
|
||
- 强粒子;
|
||
- 高频闪烁;
|
||
- 大量同时运动元素。
|
||
|
||
---
|
||
|
||
# 20. 响应式要求
|
||
|
||
支持:
|
||
|
||
- 桌面;
|
||
- 平板;
|
||
- 手机。
|
||
|
||
后台最低适配:
|
||
|
||
```text
|
||
1366 × 768
|
||
```
|
||
|
||
主要开发参考:
|
||
|
||
```text
|
||
1920 × 1080
|
||
```
|
||
|
||
前台:
|
||
|
||
- >=1440;
|
||
- 1024~1439;
|
||
- 768~1023;
|
||
- <768。
|
||
|
||
---
|
||
|
||
# 21. 安全要求
|
||
|
||
必须:
|
||
|
||
- HTTPS;
|
||
- 密码加密存储;
|
||
- 登录验证码;
|
||
- Session / Token 过期;
|
||
- 管理操作日志;
|
||
- 权限校验;
|
||
- 防止越权;
|
||
- 富文本 XSS 过滤;
|
||
- 文件上传类型校验;
|
||
- 文件大小限制;
|
||
- CSRF 防护;
|
||
- SQL 注入防护。
|
||
|
||
后台接口不得仅依赖前端按钮隐藏判断权限。
|
||
|
||
---
|
||
|
||
# 22. 性能要求
|
||
|
||
后台:
|
||
|
||
- 普通页面首屏加载 < 2 秒;
|
||
- 列表操作响应 < 500ms;
|
||
- 编辑保存反馈 < 1 秒。
|
||
|
||
前台:
|
||
|
||
- 首屏重点优化;
|
||
- 图片懒加载;
|
||
- WebP / AVIF;
|
||
- CDN;
|
||
- 静态资源缓存;
|
||
- 页面 SEO 友好;
|
||
- 尽量 SSR / SSG;
|
||
- 核心正文必须能被搜索引擎直接读取。
|
||
|
||
---
|
||
|
||
# 23. 一期明确不做
|
||
|
||
一期不做:
|
||
|
||
- 通用低代码页面搭建器;
|
||
- 复杂拖拽建站系统;
|
||
- AI 自动写文章;
|
||
- AI 自动审核;
|
||
- 自动核验账号;
|
||
- 复杂 CRM;
|
||
- 用户注册系统;
|
||
- 在线支付;
|
||
- 课程学习系统;
|
||
- 老师排班系统;
|
||
- 多租户;
|
||
- 多语言;
|
||
- APP;
|
||
- 自动生成复杂运营报表。
|
||
|
||
---
|
||
|
||
# 24. 推荐前端路由
|
||
|
||
后台:
|
||
|
||
```text
|
||
/admin/login
|
||
/admin/dashboard
|
||
|
||
/admin/home
|
||
|
||
/admin/luhui
|
||
|
||
/admin/company
|
||
/admin/brand
|
||
/admin/channels
|
||
|
||
/admin/products
|
||
/admin/products/:id
|
||
|
||
/admin/content
|
||
/admin/content/:id
|
||
|
||
/admin/team
|
||
/admin/team/:id
|
||
|
||
/admin/media
|
||
|
||
/admin/seo
|
||
|
||
/admin/settings/users
|
||
/admin/settings/roles
|
||
/admin/settings/audit
|
||
/admin/settings/site
|
||
```
|
||
|
||
---
|
||
|
||
# 25. 推荐核心数据模型
|
||
|
||
## Company
|
||
|
||
```text
|
||
id
|
||
name
|
||
short_name
|
||
english_name
|
||
description
|
||
established_at
|
||
credit_code
|
||
registered_address
|
||
office_address
|
||
phone
|
||
email
|
||
domain
|
||
icp
|
||
police_icp
|
||
logo
|
||
status
|
||
created_at
|
||
updated_at
|
||
```
|
||
|
||
## Teacher
|
||
|
||
```text
|
||
id
|
||
name
|
||
english_name
|
||
title
|
||
short_bio
|
||
bio
|
||
avatar
|
||
portrait
|
||
banner
|
||
tags
|
||
status
|
||
created_at
|
||
updated_at
|
||
```
|
||
|
||
卢慧老师可以单独固定 teacher_type=core。
|
||
|
||
## Product
|
||
|
||
```text
|
||
id
|
||
name
|
||
subtitle
|
||
type
|
||
cover
|
||
banner
|
||
summary
|
||
content
|
||
audience
|
||
value
|
||
service_mode
|
||
price
|
||
teacher_id
|
||
official_url
|
||
status
|
||
is_home
|
||
sort
|
||
created_at
|
||
updated_at
|
||
```
|
||
|
||
## Article
|
||
|
||
```text
|
||
id
|
||
type
|
||
title
|
||
summary
|
||
cover
|
||
content
|
||
author
|
||
source
|
||
source_url
|
||
status
|
||
published_at
|
||
is_home
|
||
is_top
|
||
created_at
|
||
updated_at
|
||
```
|
||
|
||
## TeamMember
|
||
|
||
```text
|
||
id
|
||
name
|
||
avatar
|
||
role
|
||
type
|
||
bio
|
||
specialties
|
||
joined_at
|
||
is_home
|
||
is_visible
|
||
sort
|
||
created_at
|
||
updated_at
|
||
```
|
||
|
||
## Channel
|
||
|
||
```text
|
||
id
|
||
platform
|
||
name
|
||
account_id
|
||
主体
|
||
qr_code
|
||
url
|
||
description
|
||
status
|
||
sort
|
||
```
|
||
|
||
## Media
|
||
|
||
```text
|
||
id
|
||
name
|
||
type
|
||
url
|
||
width
|
||
height
|
||
size
|
||
alt
|
||
tags
|
||
uploader
|
||
reference_count
|
||
created_at
|
||
```
|
||
|
||
## Revision
|
||
|
||
```text
|
||
id
|
||
entity_type
|
||
entity_id
|
||
version
|
||
snapshot
|
||
operator
|
||
comment
|
||
created_at
|
||
```
|
||
|
||
---
|
||
|
||
# 26. 验收标准
|
||
|
||
## 登录
|
||
|
||
- 登录成功;
|
||
- 登录失败提示明确;
|
||
- 验证码可刷新;
|
||
- 密码可显示 / 隐藏;
|
||
- 登录状态可保持;
|
||
- 退出登录有效。
|
||
|
||
## 首页管理
|
||
|
||
- 模块可排序;
|
||
- 模块可隐藏;
|
||
- 编辑后可预览;
|
||
- PC / 手机可预览;
|
||
- 保存草稿有效;
|
||
- 发布后前台正确更新。
|
||
|
||
## 卢慧老师
|
||
|
||
- 可维护完整人物资料;
|
||
- 可维护时间线;
|
||
- 可关联课程;
|
||
- 可维护外部权威链接;
|
||
- 可实时预览。
|
||
|
||
## 公司与品牌
|
||
|
||
- 公司信息只维护一份;
|
||
- 前台多个位置统一读取;
|
||
- 官方渠道可独立维护。
|
||
|
||
## 课程产品
|
||
|
||
- 支持新增、编辑、上下线;
|
||
- 支持首页推荐;
|
||
- 支持排序;
|
||
- 支持详情页。
|
||
|
||
## 内容中心
|
||
|
||
- 支持品牌动态;
|
||
- 支持官方声明;
|
||
- 支持媒体报道;
|
||
- 支持草稿 / 审核 / 发布。
|
||
|
||
## 陪伴团队
|
||
|
||
- 支持上百位老师;
|
||
- 支持批量管理;
|
||
- 支持首页推荐;
|
||
- 首页不需要展示全部老师。
|
||
|
||
## 素材中心
|
||
|
||
- 支持上传;
|
||
- 支持预览;
|
||
- 支持 ALT;
|
||
- 使用中的素材不可直接删除。
|
||
|
||
## SEO / AI
|
||
|
||
- 页面可配置 SEO;
|
||
- 核心实体有标准介绍;
|
||
- 自动生成基础结构化数据。
|
||
|
||
## 权限
|
||
|
||
- 不同角色权限正确;
|
||
- 所有敏感操作留日志;
|
||
- 后端接口必须校验权限。
|
||
|
||
---
|
||
|
||
# 27. 开发优先级
|
||
|
||
## P0
|
||
|
||
必须完成:
|
||
|
||
- 登录;
|
||
- 仪表盘;
|
||
- 首页管理;
|
||
- 卢慧老师;
|
||
- 公司信息;
|
||
- 品牌信息;
|
||
- 官方渠道;
|
||
- 课程与产品;
|
||
- 内容中心;
|
||
- 陪伴团队;
|
||
- 素材中心;
|
||
- 管理员;
|
||
- 权限;
|
||
- 审核发布;
|
||
- 操作日志;
|
||
- 网站配置。
|
||
|
||
## P1
|
||
|
||
建议一期一起做:
|
||
|
||
- SEO;
|
||
- AI 标准信息;
|
||
- 版本管理;
|
||
- 实时预览;
|
||
- 全局搜索;
|
||
- Sitemap;
|
||
- JSON-LD。
|
||
|
||
## P2
|
||
|
||
后续迭代:
|
||
|
||
- 网站访问分析;
|
||
- 内容质量检查;
|
||
- AI 搜索结果监测;
|
||
- 外部错误信息记录;
|
||
- 更多自动化能力。
|
||
|
||
---
|
||
|
||
# 28. 给 Codex 的实现原则
|
||
|
||
开发时请遵循:
|
||
|
||
1. 不做通用 CMS;
|
||
2. 不做复杂低代码;
|
||
3. 页面结构优先固定;
|
||
4. 后台以“内容编辑效率”为第一目标;
|
||
5. 前台以“高级、干净、大气、可信”为第一目标;
|
||
6. 组件化实现首页各模块;
|
||
7. 后台预览复用前台组件;
|
||
8. 所有核心数据单一来源;
|
||
9. 所有发布内容保留版本;
|
||
10. 所有权限必须后端校验;
|
||
11. 所有公开页面 SEO 友好;
|
||
12. 所有重要文字必须存在 HTML 中,不仅存在图片中;
|
||
13. 动效克制,不影响性能;
|
||
14. 优先保证 PC 端高级感,同时做好移动端响应式;
|
||
15. 前后台 UI 保持统一品牌语言,但后台更强调清晰与效率。
|
||
|
||
---
|
||
|
||
# 29. 最终产品形态
|
||
|
||
最终网站应形成:
|
||
|
||
```text
|
||
前台官网
|
||
↓
|
||
高级品牌展示
|
||
↓
|
||
卢慧老师权威介绍
|
||
↓
|
||
课程 / 产品 / 官方信息
|
||
↓
|
||
品牌动态与官方声明
|
||
↓
|
||
陪伴团队与联系方式
|
||
```
|
||
|
||
后台则形成:
|
||
|
||
```text
|
||
统一事实数据
|
||
↓
|
||
内容编辑
|
||
↓
|
||
实时预览
|
||
↓
|
||
审核
|
||
↓
|
||
发布
|
||
↓
|
||
历史版本与操作留痕
|
||
```
|
||
|
||
后台最终目标不是功能越多越好,而是:
|
||
|
||
> **任何运营人员都能安全、快速、稳定地维护官网,而官网长期保持统一、高级、可信。**
|