赵忠林
ffab0ec25c
- 设计并实现了开发者中心与企业控制台两大模块 - 按用户角色区分开发者和企业客户，支持多项目类型及成员管理 - 新增项目管理、应用管理、API Key管理及成员邀请等多功能页面 - 实现应用版本发布、消息通知中心、权限审批与开发者申请流程 - 完成CI/CD流水线、运营监控、发票管理、SSO单点登录功能 - 搭建SDK下载中心、工单系统、FAQ系统、数据导入导出等模块 - 优化后端API，支持已登录和未注册用户不同加入应用流程 - 前端按钮统一采用微信手机号授权，完善用户授权体验 - 修复多个页面的JSX语法错误及依赖导入问题，替换部分组件库 - 增加详细的类型定义文件，提升项目类型安全 - 新增超过55个页面及60个API接口，扩展应用功能和服务体系 - 完成全面的样式设计，实现一致的视觉风格和交互体验
446 lines
14 KiB
Markdown
446 lines
14 KiB
Markdown
# 小程序改造方案 - 开发者中心 & 企业控制台
|
||
|
||
> 制定时间：2026-04-12
|
||
> 项目中心：以「项目」为核心构建所有功能
|
||
|
||
---
|
||
|
||
## 一、整体架构设计
|
||
|
||
### 1.1 用户角色划分
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────────────────┐
|
||
│ 小程序端 │
|
||
├─────────────────────────┬───────────────────────────────────┤
|
||
│ 🛠️ 开发者角色 │ 🏢 企业客户角色 │
|
||
│ (Developer) │ (Enterprise) │
|
||
├─────────────────────────┼───────────────────────────────────┤
|
||
│ • 拥有开发者权限的用户 │ • 拥有企业权限的用户 │
|
||
│ • 可开发/发布应用 │ • 可管理企业应用、成员、账单 │
|
||
│ • 独立于企业存在 │ • 属于某个企业组织 │
|
||
│ │ • 可申请成为开发者 │
|
||
└─────────────────────────┴───────────────────────────────────┘
|
||
```
|
||
|
||
### 1.2 角色获取方式
|
||
|
||
| 角色 | 获取方式 | 说明 |
|
||
|------|---------|------|
|
||
| 开发者 | 申请审核制 | 用户主动申请 → 资料审核 → 获得开发者权限 |
|
||
| 企业客户 | 购买产品 | 下单支付 → 自动开通企业账号 → 成为企业主 |
|
||
|
||
---
|
||
|
||
## 二、页面结构设计
|
||
|
||
### 2.1 入口设计
|
||
|
||
```
|
||
首页 (pages/index/index)
|
||
├── 产品展示区
|
||
├── 快捷入口区
|
||
│ ├── 🛠️ 开发者中心 (开发者角色入口)
|
||
│ └── 🏢 企业控制台 (企业客户入口)
|
||
└── 底部 TabBar (商城/购物车/我的)
|
||
```
|
||
|
||
**注意**：两个入口对普通用户可见，但需要对应角色权限才能进入。
|
||
|
||
### 2.2 开发者中心 (developer/)
|
||
|
||
```
|
||
developer/
|
||
├── index.tsx # 开发者工作台
|
||
│ ├── 我的项目列表
|
||
│ ├── 快捷操作 (新建项目、查看文档)
|
||
│ └── 开发者动态/通知
|
||
│
|
||
├── project/
|
||
│ ├── index.tsx # 项目列表
|
||
│ ├── create.tsx # 创建项目
|
||
│ └── [id]/
|
||
│ ├── index.tsx # 项目概览
|
||
│ ├── settings.tsx # 项目设置
|
||
│ ├── members.tsx # 项目成员
|
||
│ ├── api-keys.tsx # API Key 管理
|
||
│ ├── deployments.tsx # 部署记录
|
||
│ └── logs.tsx # 运行日志
|
||
│
|
||
├── app/ # 应用管理
|
||
│ ├── index.tsx # 应用列表
|
||
│ ├── create.tsx # 创建应用
|
||
│ └── [id]/
|
||
│ ├── index.tsx # 应用详情
|
||
│ ├── version.tsx # 版本管理
|
||
│ ├── config.tsx # 应用配置
|
||
│ └── publish.tsx # 发布管理
|
||
│
|
||
├── market/ # 开发者市场
|
||
│ ├── index.tsx # 市场首页
|
||
│ ├── templates.tsx # 模板市场
|
||
│ └── plugins.tsx # 插件市场
|
||
│
|
||
├── orders/ # 开发订单 (已有)
|
||
│ └── index.tsx
|
||
│
|
||
├── developer/ # 开发者中心
|
||
│ ├── index.tsx # 开发者设置
|
||
│ ├── profile.tsx # 个人资料
|
||
│ ├── credentials.tsx # 开发者凭证
|
||
│ └── notification.tsx # 通知设置
|
||
│
|
||
└── docs/ # 文档中心
|
||
├── index.tsx # 文档首页
|
||
├── quickstart.tsx # 快速开始
|
||
├── api-docs.tsx # API 文档
|
||
└── sdk-download.tsx # SDK 下载
|
||
```
|
||
|
||
### 2.3 企业控制台 (enterprise/)
|
||
|
||
```
|
||
enterprise/
|
||
├── index.tsx # 企业工作台
|
||
│ ├── 企业概览仪表盘
|
||
│ ├── 快捷入口 (应用/成员/账单)
|
||
│ └── 最新动态
|
||
│
|
||
├── apps/ # 企业应用
|
||
│ ├── index.tsx # 应用列表
|
||
│ ├── [id]/
|
||
│ │ ├── index.tsx # 应用详情
|
||
│ │ ├── monitor.tsx # 运营监控
|
||
│ │ ├── analytics.tsx # 数据分析
|
||
│ │ └── settings.tsx # 应用设置
|
||
│ └── purchase.tsx # 购买应用
|
||
│
|
||
├── members/ # 成员管理
|
||
│ ├── index.tsx # 成员列表
|
||
│ ├── invite.tsx # 邀请成员
|
||
│ ├── roles.tsx # 角色权限
|
||
│ └── audit.tsx # 权限审批
|
||
│
|
||
├── orders/ # 订单账单
|
||
│ ├── index.tsx # 订单列表
|
||
│ ├── detail.tsx # 订单详情
|
||
│ ├── invoice.tsx # 发票管理
|
||
│ └── bills.tsx # 账单明细
|
||
│
|
||
├── billing/ # 费用中心
|
||
│ ├── index.tsx # 费用概览
|
||
│ ├── consumption.tsx # 消费明细
|
||
│ ├── recharge.tsx # 充值中心
|
||
│ └── coupons.tsx # 优惠券
|
||
│
|
||
├── enterprise/ # 企业设置
|
||
│ ├── index.tsx # 企业设置
|
||
│ ├── info.tsx # 企业信息
|
||
│ ├── domain.tsx # 域名配置
|
||
│ ├── security.tsx # 安全设置
|
||
│ └── notification.tsx # 通知设置
|
||
│
|
||
└── developer/ # 开发者入口
|
||
├── index.tsx # 开发者介绍
|
||
└── apply.tsx # 申请开发者
|
||
```
|
||
|
||
---
|
||
|
||
## 三、核心功能设计
|
||
|
||
### 3.1 项目管理 (项目中心)
|
||
|
||
**项目类型**：
|
||
| 类型 | 说明 | 适用角色 |
|
||
|------|------|---------|
|
||
| 基础项目 | 免费，限制功能 | 所有开发者 |
|
||
| 专业项目 | 付费，功能完整 | 开发者/企业 |
|
||
| 企业项目 | 全功能，支持团队协作 | 企业 |
|
||
|
||
**项目核心属性**：
|
||
```typescript
|
||
interface Project {
|
||
id: string
|
||
name: string // 项目名称
|
||
type: 'basic' | 'pro' | 'enterprise'
|
||
owner: string // 所有者 (开发者ID 或 企业ID)
|
||
ownerType: 'developer' | 'enterprise'
|
||
description?: string // 项目描述
|
||
icon?: string // 项目图标
|
||
status: 'active' | 'suspended' | 'archived'
|
||
createdAt: string
|
||
updatedAt: string
|
||
|
||
// 关联信息
|
||
apps: string[] // 关联的应用
|
||
members: ProjectMember[] // 项目成员
|
||
apiKeys: ApiKey[] // API Key
|
||
|
||
// 统计
|
||
appCount: number
|
||
memberCount: number
|
||
apiCallCount: number // API 调用次数
|
||
storageUsed: number // 存储使用量
|
||
}
|
||
```
|
||
|
||
### 3.2 开发者角色功能
|
||
|
||
**权限项**：
|
||
| 权限 | 说明 | 默认 |
|
||
|------|------|------|
|
||
| project.create | 创建项目 | ✅ |
|
||
| project.edit | 编辑项目 | ✅ |
|
||
| project.delete | 删除项目 | ✅ |
|
||
| app.create | 创建应用 | ✅ |
|
||
| app.publish | 发布应用 | ✅ |
|
||
| apiKey.manage | 管理 API Key | ✅ |
|
||
| market.access | 访问市场 | ✅ |
|
||
| docs.access | 访问文档 | ✅ |
|
||
|
||
**开发者特有功能**：
|
||
- ✅ 创建和管理个人项目
|
||
- ✅ 开发、测试、发布应用
|
||
- ✅ 访问模板/插件市场
|
||
- ✅ 生成和管理 API Key
|
||
- ✅ 查看开发者文档和 SDK
|
||
- ✅ 提交工单和技术支持
|
||
|
||
### 3.3 企业客户角色功能
|
||
|
||
**权限项**：
|
||
| 权限 | 说明 | 适用角色 |
|
||
|------|------|------|
|
||
| enterprise.manage | 企业管理 | 企业主 |
|
||
| app.manage | 应用管理 | 企业主/管理员 |
|
||
| member.invite | 邀请成员 | 企业主/管理员 |
|
||
| member.role | 分配角色 | 企业主/管理员 |
|
||
| order.view | 查看订单 | 所有成员 |
|
||
| billing.view | 查看账单 | 企业主/财务 |
|
||
| billing.pay | 支付充值 | 企业主/财务 |
|
||
|
||
**企业特有功能**：
|
||
- ✅ 企业仪表盘和数据概览
|
||
- ✅ 应用运营监控
|
||
- ✅ 成员邀请和权限管理
|
||
- ✅ 订单管理和发票
|
||
- ✅ 费用中心和充值
|
||
- ✅ 企业信息配置
|
||
|
||
### 3.4 角色切换机制
|
||
|
||
```
|
||
用户登录
|
||
│
|
||
├── 开发者身份
|
||
│ └── 可进入开发者中心
|
||
│
|
||
├── 企业身份
|
||
│ └── 可进入企业控制台
|
||
│
|
||
└── 两者皆有
|
||
└── 可切换身份入口
|
||
├── [开发者] 🛠️ 开发者中心
|
||
└── [企业] 🏢 企业控制台
|
||
```
|
||
|
||
---
|
||
|
||
## 四、开发优先级与里程碑
|
||
|
||
### Phase 1：基础框架 ⭐ 必须上线
|
||
|
||
**目标**：建立核心框架，实现最小可用产品
|
||
|
||
| 模块 | 页面 | 工作量 | 优先级 |
|
||
|------|------|--------|--------|
|
||
| 入口设计 | 首页快捷入口 + 身份切换 | ⭐⭐ | P0 |
|
||
| 开发者工作台 | 开发者首页/概览 | ⭐⭐⭐ | P0 |
|
||
| 项目管理 | 项目列表 + 创建 | ⭐⭐⭐⭐ | P0 |
|
||
| 应用管理 | 应用列表 + 创建 | ⭐⭐⭐⭐ | P0 |
|
||
| 企业工作台 | 企业首页/概览 | ⭐⭐⭐ | P0 |
|
||
| 企业应用 | 应用列表 + 详情 | ⭐⭐⭐⭐ | P0 |
|
||
|
||
### Phase 2：核心功能 ⭐ 必须上线
|
||
|
||
**目标**：完成核心业务闭环
|
||
|
||
| 模块 | 页面 | 工作量 | 优先级 |
|
||
|------|------|--------|--------|
|
||
| API Key | 生成/查看/禁用 | ⭐⭐⭐ | P0 |
|
||
| 项目成员 | 邀请/移除/角色 | ⭐⭐⭐ | P0 |
|
||
| 应用发布 | 版本管理/发布 | ⭐⭐⭐ | P0 |
|
||
| 企业成员 | 列表/邀请/角色 | ⭐⭐⭐⭐ | P0 |
|
||
| 订单管理 | 列表/详情 | ⭐⭐⭐ | P0 |
|
||
| 账单查看 | 消费明细 | ⭐⭐⭐ | P0 |
|
||
|
||
### Phase 3：增强功能 🔄 后续迭代
|
||
|
||
| 模块 | 页面 | 工作量 | 优先级 |
|
||
|------|------|--------|--------|
|
||
| 开发者申请 | 申请流程/审核 | ⭐⭐⭐ | P1 |
|
||
| 权限审批 | 权限申请/审批 | ⭐⭐⭐ | P1 |
|
||
| 市场浏览 | 模板/插件市场 | ⭐⭐⭐⭐ | P1 |
|
||
| 运营监控 | 数据看板 | ⭐⭐⭐⭐ | P1 |
|
||
| 开发者文档 | API文档/SDK | ⭐⭐⭐⭐ | P1 |
|
||
| 消息通知 | 通知中心 | ⭐⭐⭐ | P1 |
|
||
|
||
### Phase 4：高级功能 🔄 后续迭代
|
||
|
||
| 模块 | 页面 | 工作量 | 优先级 |
|
||
|------|------|--------|--------|
|
||
| CI/CD | 流水线管理 | ⭐⭐⭐⭐⭐ | P2 |
|
||
| 部署管理 | 一键部署 | ⭐⭐⭐⭐ | P2 |
|
||
| 数据分析 | 高级统计 | ⭐⭐⭐⭐ | P2 |
|
||
| 工单系统 | 技术支持 | ⭐⭐⭐ | P2 |
|
||
| 发票管理 | 电子发票 | ⭐⭐⭐ | P2 |
|
||
| SSO | 单点登录 | ⭐⭐⭐⭐⭐ | P2 |
|
||
|
||
---
|
||
|
||
## 五、与现有模块的关系
|
||
|
||
### 5.1 独立开发，不依赖现有模块
|
||
|
||
| 新建模块 | 说明 |
|
||
|---------|------|
|
||
| developer/ | 开发者中心全套功能 |
|
||
| enterprise/ | 企业控制台全套功能 |
|
||
|
||
### 5.2 共享基础设施
|
||
|
||
| 共享内容 | 说明 |
|
||
|---------|------|
|
||
| 用户认证 | 复用 passport 模块的登录体系 |
|
||
| 用户状态 | 复用 globalData/storage 中的用户信息 |
|
||
| 消息通知 | 可复用 notification 组件 |
|
||
| 基础 UI | 复用组件库样式 |
|
||
|
||
### 5.3 不复用模块
|
||
|
||
- ❌ 不复用 shop/ (商城) - 独立的企业应用体系
|
||
- ❌ 不复用 dealer/ (分销) - 独立的开发者体系
|
||
- ❌ 不复用 user/order (用户订单) - 使用新的企业订单体系
|
||
|
||
---
|
||
|
||
## 六、技术实现建议
|
||
|
||
### 6.1 目录结构
|
||
|
||
```
|
||
src/
|
||
├── developer/ # 🛠️ 开发者模块
|
||
│ ├── index.tsx # 开发者入口
|
||
│ ├── project/ # 项目管理
|
||
│ ├── app/ # 应用管理
|
||
│ ├── market/ # 市场
|
||
│ └── docs/ # 文档
|
||
│
|
||
├── enterprise/ # 🏢 企业模块
|
||
│ ├── index.tsx # 企业入口
|
||
│ ├── apps/ # 企业应用
|
||
│ ├── members/ # 成员管理
|
||
│ ├── orders/ # 订单账单
|
||
│ ├── billing/ # 费用中心
|
||
│ └── settings/ # 企业设置
|
||
│
|
||
└── shared/ # 共享
|
||
├── components/ # 共享组件
|
||
├── types/ # 类型定义
|
||
└── api/ # API 接口
|
||
```
|
||
|
||
### 6.2 路由配置
|
||
|
||
```typescript
|
||
// app.config.ts
|
||
export default {
|
||
subpackages: [
|
||
{
|
||
root: "developer",
|
||
pages: [
|
||
"index",
|
||
"project/index",
|
||
"project/create",
|
||
"project/[id]/index",
|
||
"project/[id]/settings",
|
||
"app/index",
|
||
"app/create",
|
||
"app/[id]/index",
|
||
// ...
|
||
]
|
||
},
|
||
{
|
||
root: "enterprise",
|
||
pages: [
|
||
"index",
|
||
"apps/index",
|
||
"apps/[id]/index",
|
||
"members/index",
|
||
"members/invite",
|
||
"orders/index",
|
||
"orders/detail",
|
||
// ...
|
||
]
|
||
}
|
||
]
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 七、API 接口设计建议
|
||
|
||
### 7.1 项目相关
|
||
|
||
| 接口 | 方法 | 说明 |
|
||
|------|------|------|
|
||
| /api/project/list | GET | 项目列表 |
|
||
| /api/project/create | POST | 创建项目 |
|
||
| /api/project/:id | GET/PUT/DELETE | 项目 CRUD |
|
||
| /api/project/:id/members | GET/POST/DELETE | 项目成员 |
|
||
| /api/project/:id/keys | GET/POST/DELETE | API Key |
|
||
|
||
### 7.2 应用相关
|
||
|
||
| 接口 | 方法 | 说明 |
|
||
|------|------|------|
|
||
| /api/app/list | GET | 应用列表 |
|
||
| /api/app/create | POST | 创建应用 |
|
||
| /api/app/:id | GET/PUT/DELETE | 应用 CRUD |
|
||
| /api/app/:id/version | POST | 发布版本 |
|
||
|
||
### 7.3 企业相关
|
||
|
||
| 接口 | 方法 | 说明 |
|
||
|------|------|------|
|
||
| /api/enterprise/info | GET | 企业信息 |
|
||
| /api/enterprise/members | GET/POST | 成员管理 |
|
||
| /api/enterprise/roles | GET/POST | 角色管理 |
|
||
| /api/enterprise/orders | GET | 订单列表 |
|
||
| /api/enterprise/bills | GET | 账单明细 |
|
||
|
||
---
|
||
|
||
## 八、下一步行动
|
||
|
||
### 立即开始 (Phase 1)
|
||
|
||
1. ✅ 创建 developer/ 和 enterprise/ 目录结构
|
||
2. ✅ 设计 API 接口文档 (与后端对齐)
|
||
3. ✅ 开发首页入口组件
|
||
4. ✅ 开发工作台基础页面
|
||
|
||
### 需要确认
|
||
|
||
- [ ] 后端 API 是否已准备好？
|
||
- [ ] 数据库表结构是否已设计？
|
||
- [ ] 是否需要支持微信小程序码扫码登录？
|
||
|
||
---
|
||
|
||
**文档版本**：v1.0
|
||
**最后更新**：2026-04-12
|