117 lines
5.6 KiB
Markdown
117 lines
5.6 KiB
Markdown
# 页面设计: 租户管理/创作者中心 (Tenant Management)
|
|
|
|
> **路由**: `/creator/*` > **布局**: `LayoutMain` (复用门户布局,采用侧边栏分栏结构)
|
|
> **结构**: 与个人中心一致的左侧导航布局,保持视觉与操作连续性
|
|
|
|
## 1. 布局结构 (Structure)
|
|
|
|
管理模块直接集成在 C 端门户中,作为“创作者中心”存在。
|
|
|
|
- **导航栏**: 复用全局 `TopNavbar`,用户可通过头像下拉菜单的“管理入口”进入。
|
|
- **页面框架**:
|
|
- **左侧 (Sidebar)**: 独立于个人中心的管理菜单(内容管理、订单管理、租户设置)。
|
|
- **右侧 (Main)**: 管理列表或表单容器,背景为 `bg-white` 圆角卡片。
|
|
|
|
---
|
|
|
|
## 2. 核心功能模块
|
|
|
|
### 2.1 管理概览 (Dashboard) `/creator`
|
|
|
|
- **核心指标卡片 (Key Metrics)**:
|
|
- **总关注用户**: 显示累计粉丝数及较前一日的增长变化 (+/-)。
|
|
- **订单收益**:
|
|
- [累计总收益]: 账户所有已结算金额。
|
|
- [近30天收益]: 动态展示最近一个月的收入规模。
|
|
- **订单统计**:
|
|
- [累计订单量]: 总成交笔数。
|
|
- [待处理订单]: 待发货或退款申请中的实时数量提示。
|
|
- **内容表现**: 累计阅读量 (PV) 与 获赞总数。
|
|
- **趋势分析图表 (Charts)**:
|
|
- **收益/订单趋势**: 支持切换 [近 7 天] / [近 30 天] 的柱状图,直观展示收入波动。
|
|
- **粉丝增长曲线**: 折线图展示每日新增粉丝趋势。
|
|
- **快捷入口**: [发布新内容] [处理退款申请]。
|
|
- **公告通知**: 创作者专属公告(如:平台分成比例调整通知)。
|
|
|
|
### 2.2 内容管理 (Content Management) `/creator/contents`
|
|
|
|
- **列表展示**:
|
|
- **字段**: 封面 | **曲种/剧目** | 价格 | 状态 | 阅读/收益 | 操作。
|
|
- **状态说明 (Audit Status)**:
|
|
- `已发布`: 绿色,正常在线。
|
|
- `审核中`: 橙色,平台正在处理。
|
|
- `驳回`: 红色。**交互**: 点击状态标签弹出气泡或弹窗显示具体的“驳回原因”,支持一键进入编辑。
|
|
- `草稿`: 灰色。
|
|
- **发布编辑器 (WYSIWYG Editor - 戏曲定制版)**:
|
|
- **头部元数据 (Metadata)**:
|
|
- **曲种**: (必选) 下拉选择后台配置的曲种 (如 京剧/越剧)。
|
|
- **标题组合**:
|
|
- [剧目名] (必填, 如《锁麟囊》)
|
|
- [选段名] (可选, 如"春秋亭")
|
|
- [附加信息] (可选, 如"程砚秋")
|
|
- _预览_: 自动拼接展示 `《锁麟囊》春秋亭 (程砚秋)`。
|
|
- **工具栏功能**:
|
|
- **基础排版**: H1/H2/H3, 加粗, 下划线, 列表, 居中/对齐。
|
|
- **戏曲专用**:
|
|
- **剧本模式**: 专门的 [角色: 台词] 格式块,自动悬挂缩进。
|
|
- **唱段属性**: 插入音频时可选填 **定调 (Key)** (如 C 大调/D 大调) 和 **板式** (如 原板/流水)。
|
|
- **注音工具**: 支持给生僻字添加拼音标注 (Ruby),解决尖团音等阅读障碍。
|
|
- **媒体 (仅支持上传)**: 图片, 视频 (支持断点续传), 音频, 附件。**不支持外链**。
|
|
- **操作**: 撤销, 重做, 清除格式, 插入分割线。
|
|
- **交互体验**:
|
|
- **自动保存**: 编辑器右上角实时显示状态 "正在保存..." / "所有更改已保存"。
|
|
- **大文件支持**: 针对高清戏曲视频优化上传稳定性。
|
|
- **发布属性设置 (Publish Settings)**:
|
|
- **位置**: 右侧栏 (宽屏) 或 底部抽屉 (窄屏),点击 [发布设置] 展开。
|
|
- **字段**:
|
|
- **封面图**: (必填) 点击上传,支持裁切预览。
|
|
- **摘要**: (可选) 自动提取前 50 字或手动输入。
|
|
- **戏曲属性**:
|
|
- **主定调**: 下拉选择 (C/D/E/F/G/A/B 等)。
|
|
- **行当**: 生/旦/净/末/丑。
|
|
- **标签**: (可选) 搜索并多选,支持新增。
|
|
- **价格策略**:
|
|
- Radio Group: [免费] | [付费] | [会员免费]。
|
|
- **付费设置**:
|
|
- **价格**: 输入金额 (¥)。
|
|
- **试看/试听**:
|
|
- Switch 开关 [开启试看]。
|
|
- 输入时长: 默认 `60` 秒 (支持自定义,针对戏曲长视频建议设为 3-5 分钟)。
|
|
- **操作**: [存草稿] [立即发布]。
|
|
|
|
### 2.3 订单管理 (Order Management) `/creator/orders`
|
|
|
|
- **列表展示**:
|
|
- 记录所有购买该租户内容的订单。
|
|
- **字段**: 订单号 | 内容标题 | 买家昵称 | 实付金额 | 下单时间 | 状态。
|
|
- **管理干预 (Order Intervention)**:
|
|
- **状态流转**:
|
|
- 正常: `已支付` -> `已完成`。
|
|
- 退款: `退款申请中` (买家发起) -> `已退款` (同意) / `退款拒绝`。
|
|
- **操作按钮**:
|
|
- [查看详情]: 弹窗显示买家信息与支付凭证。
|
|
- [处理退款]: (仅针对退款申请) 弹出审核框,选择 [同意退款] 或 [拒绝]。
|
|
- [发送私信]: 快速联系买家。
|
|
|
|
### 2.4 租户资料设置 (Tenant Settings) `/creator/settings`
|
|
|
|
- **内容**:
|
|
- 修改租户主页的封面图 (Cover)、名称、简介。
|
|
- 资质材料上传(用于等级提升或认证)。
|
|
- **同步**: 此处修改后,租户公开主页 (`/t/:id`) 同步更新。
|
|
|
|
---
|
|
|
|
## 3. 交互细节与权限
|
|
|
|
### 3.1 权限拦截
|
|
|
|
- **访问控制**: 非租户管理员访问 `/creator` 直接跳转至“租户申请”页或 403。
|
|
- **身份显示**: 在管理页面顶部显著位置显示“当前正在管理:[租户名称]”,防止多账号混淆。
|
|
|
|
### 3.2 适老化管理体验
|
|
|
|
- **大按钮**: 所有的“发布”、“编辑”按钮均采用 `h-12` 以上高度。
|
|
- **状态感知**: 每一个操作(如保存草稿)都有明确的 Toast 反馈。
|
|
- **自动保存**: 编辑器支持本地离线保存,防止误关闭导致内容丢失。
|