管理端界面优化

2025-12-26 17:58:59 +08:00 · 2025-12-26 17:58:59 +08:00 · 40a95ee5da
commit 40a95ee5da
parent 148297e8d2
13 changed files with 2551 additions and 0 deletions
--- a/Zhibo/admin/API接口梳理报告.md
+++ b/Zhibo/admin/API接口梳理报告.md
@ -0,0 +1,645 @@
+# 管理端 API 接口梳理报告
+
+> 📅 更新日期：2025-12-26
+> 📊 API 文件总数：95 个
+> 📈 接口函数总数：约 420+ 个
+
+---
+
+## 一、API 概览
+
+### 1.1 基础配置
+| 配置项 | 值 |
+|--------|-----|
+| 基础URL | `SettingMer.apiBaseURL` |
+| 超时时间 | 60000ms |
+| 认证方式 | Header: `Authori-zation: token` |
+| 响应格式 | `{ code: 200, data: {}, message: '' }` |
+
+### 1.2 API 文件统计
+| 模块分类 | 文件数 | 接口数(约) |
+|----------|--------|-----------|
+| 用户管理 | 2 | 35 |
+| 直播房间 | 1 | 16 |
+| 礼物管理 | 2 | 5 |
+| 财务管理 | 12 | 45 |
+| 内容管理 | 7 | 30 |
+| 社交功能 | 10 | 25 |
+| 装饰道具 | 7 | 30 |
+| 运营活动 | 8 | 35 |
+| 帮助反馈 | 5 | 15 |
+| 代理管理 | 3 | 10 |
+| 系统设置 | 18 | 80 |
+| 微信相关 | 1 | 35 |
+| 其他模块 | 19 | 60 |
+| **合计** | **95** | **420+** |
+
+---
+
+## 二、API 文件完整清单
+
+### 2.1 用户管理 (2个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `user.js` | 30 | 用户CRUD、等级、标签、分组、登录认证 |
+| `userDynamic.js` | 5 | 用户动态、评论管理 |
+
+### 2.2 直播房间 (1个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `room.js` | 16 | 房间管理、类型管理、背景图管理 |
+
+### 2.3 礼物管理 (2个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `giftDetail.js` | 2 | 送礼明细 |
+| `giftRewardRecord.js` | 3 | 打赏记录 |
+
+### 2.4 财务管理 (12个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `financial.js` | 11 | 提现申请、充值、资金监控 |
+| `financialOrder.js` | 3 | 财务订单 |
+| `withdraw.js` | 3 | 提现管理 |
+| `withdrawAmount.js` | 6 | 提现金额配置 |
+| `withdrawPending.js` | 4 | 待审核提现 |
+| `withdrawApproved.js` | 2 | 已审核提现 |
+| `coinDetail.js` | 2 | 金币明细 |
+| `diamondDetail.js` | 2 | 钻石明细 |
+| `charmDetail.js` | 2 | 魅力值明细 |
+| `exchangeDetail.js` | 2 | 兑换明细 |
+| `exchangeRecord.js` | 2 | 兑换记录 |
+| `goldDiamondConfig.js` | 4 | 金币钻石配置 |
+
+### 2.5 内容管理 (7个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `dynamic.js` | 4 | 动态管理 |
+| `article.js` | 5 | 文章管理 |
+| `banner.js` | 6 | 轮播图管理 |
+| `sensitiveWord.js` | 5 | 敏感词管理 |
+| `systemMessage.js` | 5 | 系统消息 |
+| `chatPhrase.js` | 5 | 聊天常用语 |
+| `comment.js` | 6 | 评论管理 |
+
+### 2.6 社交功能 (10个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `familyList.js` | 2 | 家族列表 |
+| `familyLevel.js` | 5 | 家族等级 |
+| `familyMember.js` | 3 | 家族成员 |
+| `fanGroup.js` | 2 | 粉丝团 |
+| `fans.js` | 4 | 粉丝管理 |
+| `followRecord.js` | 1 | 关注记录 |
+| `blacklist.js` | 4 | 黑名单管理 |
+| `session.js` | 3 | 会话管理 |
+| `matchText.js` | 2 | 匹配文本 |
+| `socialDynamic.js` | 7 | 社交动态 |
+
+### 2.7 装饰道具 (7个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `mount.js` | 5 | 坐骑管理 |
+| `mountList.js` | 2 | 坐骑列表 |
+| `mountOrder.js` | 2 | 坐骑订单 |
+| `mountPurchaseRecord.js` | 2 | 坐骑购买记录 |
+| `headwear.js` | 5 | 头饰管理 |
+| `charmLevel.js` | 5 | 魅力等级 |
+| `nobleLevel.js` | 5 | 贵族等级 |
+
+### 2.8 运营活动 (8个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `lotteryPrize.js` | 7 | 抽奖奖品 |
+| `lotteryProbability.js` | 5 | 抽奖概率 |
+| `noviceTask.js` | 4 | 新手任务 |
+| `invite.js` | 2 | 邀请管理 |
+| `platformActivity.js` | 5 | 平台活动 |
+| `marketing.js` | 4 | 营销管理 |
+| `distribution.js` | 5 | 分销管理 |
+| `sign.js` | 3 | 签到管理 |
+
+### 2.9 帮助反馈 (5个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `feedback.js` | 1 | 用户反馈 |
+| `report.js` | 2 | 举报管理 |
+| `reportList.js` | 2 | 举报列表 |
+| `appeal.js` | 4 | 申诉管理 |
+| `customerService.js` | 5 | 客服联系方式 |
+
+### 2.10 代理管理 (3个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `agent.js` | 4 | 代理管理 |
+| `agentMessage.js` | 3 | 代理消息 |
+| `agentWithdraw.js` | 3 | 代理提现 |
+
+### 2.11 系统设置 (18个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `system.js` | 7 | 附件分类、图片管理 |
+| `systemConfig.js` | 14 | 系统配置 |
+| `systemSetting.js` | 8 | 文件上传、图片管理 |
+| `systemFormConfig.js` | 12 | 表单配置、通知管理 |
+| `systemGroup.js` | 10 | 系统分组、页面设计 |
+| `systemGroupData.js` | 5 | 分组数据 |
+| `systemVersion.js` | 5 | 版本管理 |
+| `systemadmin.js` | 14 | 管理员、菜单权限 |
+| `role.js` | 6 | 角色管理 |
+| `roleApi.js` | 2 | 角色详情、菜单 |
+| `schedule.js` | 4 | 定时任务 |
+| `sms.js` | 3 | 短信配置 |
+| `logistics.js` | 14 | 城市、物流、运费模板 |
+| `configApi.js` | 3 | 配置API |
+| `configTabApi.js` | 5 | 配置Tab管理 |
+| `categoryApi.js` | 5 | 分类API |
+| `storePoint.js` | 14 | 提货点、核销员 |
+| `customerServiceGroup.js` | 4 | 客服分组 |
+
+### 2.12 微信相关 (1个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `wxApi.js` | 35 | 微信菜单、模板消息、关键字回复、小程序 |
+
+### 2.13 其他模块 (19个文件)
+| 文件名 | 接口数 | 主要功能 |
+|--------|--------|----------|
+| `req.js` | 1 | 请求基础封装 |
+| `dashboard.js` | 3 | 仪表盘数据 |
+| `statistic.js` | 5 | 统计数据 |
+| `order.js` | 8 | 订单管理 |
+| `orderManage.js` | 5 | 订单管理扩展 |
+| `store.js` | 10 | 商品管理 |
+| `devise.js` | 1 | 装修设计列表 |
+| `pagediy.js` | 8 | 页面DIY |
+| `authInformation.js` | 3 | 认证信息 |
+| `carAuth.js` | 4 | 车辆认证 |
+| `certification.js` | 4 | 认证管理 |
+| `chat.js` | 5 | 聊天管理 |
+| `chatPayConfig.js` | 5 | 聊天付费配置 |
+| `memberPackage.js` | 5 | 会员套餐 |
+| `purchaseDetail.js` | 2 | 购买明细 |
+| `receiveGiftDetail.js` | 2 | 收礼明细 |
+| `rechargeOrder.js` | 3 | 充值订单 |
+| `liveRecharge.js` | 3 | 直播充值 |
+| `diamondRechargeAmount.js` | 5 | 钻石充值金额 |
+
+---
+
+## 三、核心 API 接口详情
+
+### 3.1 用户管理 (user.js)
+```javascript
+// 登录认证
+login(data)                    // POST /admin/login
+getInfo(token)                 // GET  /admin/getAdminInfoByToken
+logout()                       // GET  /admin/logout
+captchaApi()                   // GET  /admin/validate/code/get
+getLoginPicApi()               // GET  /admin/getLoginPic
+
+// 用户CRUD
+userListApi(params)            // GET  /admin/user/list
+userUpdateApi(params, data)    // POST /admin/user/update
+userInfoApi(params)            // GET  /admin/user/info
+userDeleteApi(params)          // GET  /admin/user/delete
+userLevelUpdateApi(data)       // POST /admin/user/update/level
+
+// 用户等级
+levelListApi()                 // GET  /admin/system/user/level/list
+levelSaveApi(data)             // POST /admin/system/user/level/save
+levelUpdateApi(params, data)   // POST /admin/system/user/level/update/{id}
+levelDeleteApi(id)             // POST /admin/system/user/level/delete/{id}
+
+// 用户标签
+tagListApi(params)             // GET  /admin/user/tag/list
+tagSaveApi(data)               // POST /admin/user/tag/save
+tagUpdateApi(params, data)     // POST /admin/user/tag/update
+tagDeleteApi(params)           // GET  /admin/user/tag/delete
+
+// 用户分组
+groupListApi(params)           // GET  /admin/user/group/list
+groupSaveApi(data)             // POST /admin/user/group/save
+groupUpdateApi(params, data)   // POST /admin/user/group/update
+groupDeleteApi(params)         // GET  /admin/user/group/delete
+```
+
+### 3.2 直播房间 (room.js)
+```javascript
+// 房间管理
+roomListApi(params)                    // GET  /admin/room/live/list
+liveRoomCreateApi(data)                // POST /admin/room/live/create
+liveRoomUpdateApi(data)                // POST /admin/room/live/update
+liveRoomDeleteApi(id)                  // POST /admin/room/live/delete/{id}
+liveRoomToggleStatusApi(id, data)      // POST /admin/room/live/toggle-status/{id}
+liveRoomChatHistoryApi(roomId, params) // GET  /admin/room/live/chat/{roomId}
+roomDetailApi(id)                      // GET  /admin/room/detail/{id}
+
+// 房间类型
+roomTypeListApi(params)                // GET  /admin/room/type/list
+roomTypeCreateApi(data)                // POST /admin/room/type/create
+roomTypeUpdateApi(data)                // POST /admin/room/type/update
+roomTypeDeleteApi(id)                  // POST /admin/room/type/delete/{id}
+roomTypeStatusApi(data)                // POST /admin/room/type/updateStatus
+
+// 房间背景
+roomBackgroundListApi(params)          // GET  /admin/room/background/list
+roomBackgroundCreateApi(data)          // POST /admin/room/background/create
+roomBackgroundUpdateApi(data)          // POST /admin/room/background/update
+roomBackgroundDeleteApi(id)            // POST /admin/room/background/delete/{id}
+```
+
+### 3.3 财务管理 (financial.js)
+```javascript
+// 提现申请
+applyListApi(params)           // GET  /admin/finance/apply/list
+applyBalanceApi(data)          // POST /admin/finance/apply/balance
+applyUpdateApi(data)           // POST /admin/finance/apply/update
+applyStatusApi(data)           // POST /admin/finance/apply/apply
+
+// 充值管理
+topUpLogListApi(params)        // GET  /admin/user/topUpLog/list
+balanceApi(data)               // POST /admin/user/topUpLog/balance
+topUpLogDeleteApi(params)      // GET  /admin/user/topUpLog/delete
+refundApi(data)                // POST /admin/user/topUpLog/refund
+
+// 资金监控
+monitorListApi(params)         // GET  /admin/finance/founds/monitor/list
+monitorListOptionApi()         // GET  /admin/finance/founds/monitor/list/option
+brokerageListApi(params)       // GET  /admin/finance/founds/monitor/brokerage/record
+```
+
+### 3.4 系统管理 (systemadmin.js)
+```javascript
+// 管理员
+adminList(params)              // GET  /admin/system/admin/list
+adminAdd(pram)                 // POST /admin/system/admin/save
+adminUpdate(pram)              // POST /admin/system/admin/update
+adminDel(pram)                 // GET  /admin/system/admin/delete
+adminInfo(pram)                // GET  /admin/system/admin/info
+updateStatusApi(params)        // GET  /admin/system/admin/updateStatus
+
+// 菜单权限
+menuListApi(params)            // GET  /admin/system/menu/list
+menuAdd(data)                  // POST /admin/system/menu/add
+menuUpdate(data)               // POST /admin/system/menu/update
+menuDelete(id)                 // POST /admin/system/menu/delete/{id}
+menuInfo(id)                   // GET  /admin/system/menu/info/{id}
+menuUpdateShowStatus(params)   // POST /admin/system/menu/updateShowStatus
+
+// 敏感操作日志
+sensitiveListApi(params)       // GET  /admin/log/sensitive/list
+```
+
+### 3.5 系统配置 (systemConfig.js)
+```javascript
+configCheckUnique(params)      // GET  /admin/system/config/check
+configDelete(params)           // GET  /admin/system/config/delete
+configInfo(params)             // GET  /admin/system/config/info
+configList(params)             // GET  /admin/system/config/list
+configSave(data)               // POST /admin/system/config/save
+configSaveForm(data)           // POST /admin/system/config/save/form
+configUpdate(data)             // POST /admin/system/config/update
+getSiteLogoApi()               // GET  /admin/system/config/get/site/logo
+getUploadTypeApi()             // GET  /admin/system/config/get/upload/type
+clearCacheApi()                // POST /admin/system/config/clear/cache
+changeColorApi()               // GET  /admin/system/config/get/change/color
+saveColorApi(data)             // POST /admin/system/config/save/change/color
+getParamsListApi(params)       // GET  /admin/system/config/params/list
+saveParamsApi(data)            // POST /admin/system/config/params/save
+```
+
+### 3.6 角色管理 (role.js)
+```javascript
+getRoleList(pram)              // GET  /admin/system/role/list
+addRole(pram)                  // POST /admin/system/role/save
+updateRole(pram)               // POST /admin/system/role/update
+delRole(pram)                  // GET  /admin/system/role/delete
+getInfo(pram)                  // GET  /admin/system/role/info/{id}
+updateRoleStatus(pram)         // GET  /admin/system/role/updateStatus
+menuCacheList()                // GET  /admin/system/menu/cache/tree
+```
+
+### 3.7 微信相关 (wxApi.js)
+```javascript
+// 微信菜单
+menuCreate(data)               // POST /admin/wechat/menu/public/create
+menuDelete(data)               // POST /admin/wechat/menu/public/delete
+menuInfo(pram)                 // POST /admin/wechat/menu/public/get
+wechatMenuApi(params)          // GET  /admin/wechat/menu/public/get
+wechatMenuAddApi(data)         // POST /admin/wechat/menu/public/create
+
+// 微信模板消息
+wechatTemplateListApi(params)  // GET  /admin/wechat/template/list
+wechatTemplateSaveApi(data)    // POST /admin/wechat/template/save
+wechatTemplateUpdateApi(id, data) // POST /admin/wechat/template/update/{id}
+wechatTemplateDeleteApi(id)    // GET  /admin/wechat/template/delete/{id}
+wechatTemplateStatusApi(id, params) // POST /admin/wechat/template/update/status/{id}
+
+// 关键字回复
+replyListApi(params)           // GET  /admin/wechat/keywords/reply/list
+replySaveApi(data)             // POST /admin/wechat/keywords/reply/save
+replyUpdateApi(params, data)   // POST /admin/wechat/keywords/reply/update
+replyDeleteApi(params)         // GET  /admin/wechat/keywords/reply/delete
+replyStatusApi(params)         // POST /admin/wechat/keywords/reply/status
+
+// 小程序模板
+publicTempListApi(params)      // GET  /admin/wechat/program/public/temp/list
+myTempListApi(params)          // GET  /admin/wechat/program/my/temp/list
+myTempSaveApi(data)            // POST /admin/wechat/program/my/temp/save
+myTempUpdateApi(params, data)  // POST /admin/wechat/program/my/temp/update
+myTempStatusApi(params)        // GET  /admin/wechat/program/my/temp/update/status
+tempAsyncApi()                 // GET  /admin/wechat/program/my/temp/async
+```
+
+---
+
+## 四、API 目录结构
+
+```
+src/api/
+├── 用户管理
+│   ├── user.js              # 用户、等级、标签、分组、登录
+│   └── userDynamic.js       # 用户动态、评论
+│
+├── 直播相关
+│   ├── room.js              # 房间、类型、背景图
+│   ├── giftDetail.js        # 送礼明细
+│   └── giftRewardRecord.js  # 打赏记录
+│
+├── 财务管理
+│   ├── financial.js         # 提现申请、充值、资金监控
+│   ├── financialOrder.js    # 财务订单
+│   ├── withdraw.js          # 提现管理
+│   ├── withdrawAmount.js    # 提现金额配置
+│   ├── withdrawPending.js   # 待审核提现
+│   ├── withdrawApproved.js  # 已审核提现
+│   ├── coinDetail.js        # 金币明细
+│   ├── diamondDetail.js     # 钻石明细
+│   ├── charmDetail.js       # 魅力值明细
+│   ├── exchangeDetail.js    # 兑换明细
+│   ├── exchangeRecord.js    # 兑换记录
+│   └── goldDiamondConfig.js # 金币钻石配置
+│
+├── 内容管理
+│   ├── dynamic.js           # 动态管理
+│   ├── article.js           # 文章管理
+│   ├── banner.js            # 轮播图
+│   ├── sensitiveWord.js     # 敏感词
+│   ├── systemMessage.js     # 系统消息
+│   ├── chatPhrase.js        # 聊天常用语
+│   └── comment.js           # 评论管理
+│
+├── 社交功能
+│   ├── familyList.js        # 家族列表
+│   ├── familyLevel.js       # 家族等级
+│   ├── familyMember.js      # 家族成员
+│   ├── fanGroup.js          # 粉丝团
+│   ├── fans.js              # 粉丝管理
+│   ├── followRecord.js      # 关注记录
+│   ├── blacklist.js         # 黑名单
+│   ├── session.js           # 会话管理
+│   ├── matchText.js         # 匹配文本
+│   └── socialDynamic.js     # 社交动态
+│
+├── 装饰道具
+│   ├── mount.js             # 坐骑管理
+│   ├── mountList.js         # 坐骑列表
+│   ├── mountOrder.js        # 坐骑订单
+│   ├── mountPurchaseRecord.js # 坐骑购买记录
+│   ├── headwear.js          # 头饰管理
+│   ├── charmLevel.js        # 魅力等级
+│   └── nobleLevel.js        # 贵族等级
+│
+├── 运营活动
+│   ├── lotteryPrize.js      # 抽奖奖品
+│   ├── lotteryProbability.js # 抽奖概率
+│   ├── noviceTask.js        # 新手任务
+│   ├── invite.js            # 邀请管理
+│   ├── platformActivity.js  # 平台活动
+│   ├── marketing.js         # 营销管理
+│   ├── distribution.js      # 分销管理
+│   └── sign.js              # 签到管理
+│
+├── 帮助反馈
+│   ├── feedback.js          # 用户反馈
+│   ├── report.js            # 举报管理
+│   ├── reportList.js        # 举报列表
+│   ├── appeal.js            # 申诉管理
+│   └── customerService.js   # 客服联系方式
+│
+├── 代理管理
+│   ├── agent.js             # 代理管理
+│   ├── agentMessage.js      # 代理消息
+│   └── agentWithdraw.js     # 代理提现
+│
+├── 系统设置
+│   ├── system.js            # 附件分类
+│   ├── systemConfig.js      # 系统配置
+│   ├── systemSetting.js     # 文件上传
+│   ├── systemFormConfig.js  # 表单配置、通知
+│   ├── systemGroup.js       # 系统分组
+│   ├── systemGroupData.js   # 分组数据
+│   ├── systemVersion.js     # 版本管理
+│   ├── systemadmin.js       # 管理员、菜单
+│   ├── role.js              # 角色管理
+│   ├── roleApi.js           # 角色API
+│   ├── schedule.js          # 定时任务
+│   ├── sms.js               # 短信配置
+│   ├── logistics.js         # 物流配置
+│   ├── configApi.js         # 配置API
+│   ├── configTabApi.js      # 配置Tab
+│   ├── categoryApi.js       # 分类API
+│   ├── storePoint.js        # 提货点
+│   └── customerServiceGroup.js # 客服分组
+│
+├── 微信相关
+│   └── wxApi.js             # 微信菜单、模板、小程序
+│
+└── 其他
+    ├── req.js               # 请求封装
+    ├── dashboard.js         # 仪表盘
+    ├── statistic.js         # 统计
+    ├── order.js             # 订单
+    ├── orderManage.js       # 订单管理
+    ├── store.js             # 商品
+    ├── devise.js            # 装修设计
+    ├── pagediy.js           # 页面DIY
+    ├── authInformation.js   # 认证信息
+    ├── carAuth.js           # 车辆认证
+    ├── certification.js     # 认证管理
+    ├── chat.js              # 聊天
+    ├── chatPayConfig.js     # 聊天付费
+    ├── memberPackage.js     # 会员套餐
+    ├── purchaseDetail.js    # 购买明细
+    ├── receiveGiftDetail.js # 收礼明细
+    ├── rechargeOrder.js     # 充值订单
+    ├── liveRecharge.js      # 直播充值
+    └── diamondRechargeAmount.js # 钻石充值
+```
+
+
+---
+
+## 五、API 设计规范
+
+### 5.1 URL 命名规范
+```
+/admin/{模块}/{资源}/{操作}
+
+示例：
+/admin/user/list              # 用户列表
+/admin/user/update            # 更新用户
+/admin/user/delete/{id}       # 删除用户
+/admin/room/type/list         # 房间类型列表
+/admin/system/config/save     # 保存配置
+```
+
+### 5.2 请求方法规范
+| 操作类型 | HTTP方法 | URL示例 |
+|----------|----------|---------|
+| 查询列表 | GET | `/admin/user/list` |
+| 查询详情 | GET | `/admin/user/info/{id}` |
+| 新增数据 | POST | `/admin/user/save` |
+| 更新数据 | POST | `/admin/user/update` |
+| 删除数据 | GET/POST | `/admin/user/delete/{id}` |
+| 切换状态 | POST | `/admin/user/updateStatus` |
+
+### 5.3 响应格式规范
+```javascript
+// 成功响应
+{
+  "code": 200,
+  "data": { ... },
+  "message": "success"
+}
+
+// 列表响应
+{
+  "code": 200,
+  "data": {
+    "list": [...],
+    "total": 100
+  },
+  "message": "success"
+}
+
+// 错误响应
+{
+  "code": 401,  // 401-未授权, 403-无权限, 500-服务器错误
+  "data": null,
+  "message": "错误信息"
+}
+```
+
+### 5.4 分页参数规范
+```javascript
+{
+  page: 1,        // 当前页码
+  limit: 10,      // 每页条数
+  keywords: '',   // 搜索关键词
+  status: '',     // 状态筛选
+  startTime: '',  // 开始时间
+  endTime: ''     // 结束时间
+}
+```
+
+---
+
+## 六、API 使用示例
+
+### 6.1 常用导入
+```javascript
+// 用户管理
+import { userListApi, userUpdateApi, userDeleteApi } from '@/api/user'
+
+// 房间管理
+import { roomListApi, roomTypeListApi } from '@/api/room'
+
+// 财务管理
+import { withdrawListApi, withdrawAuditApi } from '@/api/withdraw'
+
+// 系统配置
+import { configList, clearCacheApi } from '@/api/systemConfig'
+
+// 角色管理
+import { getRoleList, addRole, updateRole } from '@/api/role'
+```
+
+### 6.2 调用示例
+```javascript
+// 列表查询
+const params = { page: 1, limit: 10, keywords: '' }
+const res = await userListApi(params)
+// res.data = { list: [...], total: 100 }
+
+// 新增数据
+const data = { name: 'xxx', status: 1 }
+await userSaveApi(data)
+
+// 更新数据
+const data = { id: 1, name: 'xxx' }
+await userUpdateApi(data)
+
+// 删除数据
+await userDeleteApi({ id: 1 })
+```
+
+---
+
+## 七、问题与优化建议
+
+### 7.1 命名不一致问题
+| 问题 | 现状 | 建议 |
+|------|------|------|
+| 删除方法不一致 | GET/POST 混用 | 统一使用 POST |
+| 列表命名不一致 | `list`/`lst` 混用 | 统一使用 `list` |
+| 详情命名不一致 | `info`/`detail` 混用 | 统一使用 `detail` |
+| 新增命名不一致 | `save`/`create`/`add` 混用 | 统一使用 `create` |
+
+### 7.2 重复文件建议合并
+| 文件组 | 建议 |
+|--------|------|
+| `report.js` + `reportList.js` | 合并为 `report.js` |
+| `mount.js` + `mountList.js` | 合并为 `mount.js` |
+| `role.js` + `roleApi.js` | 合并为 `role.js` |
+
+### 7.3 建议统一命名规范
+```javascript
+// 推荐命名格式
+xxxListApi()      // 列表
+xxxDetailApi()    // 详情
+xxxCreateApi()    // 新增
+xxxUpdateApi()    // 更新
+xxxDeleteApi()    // 删除
+xxxStatusApi()    // 状态切换
+```
+
+---
+
+## 八、统计汇总
+
+### 8.1 按操作类型统计
+| 操作类型 | 数量(约) | 占比 |
+|----------|---------|------|
+| 列表查询 | 95 | 23% |
+| 详情查询 | 45 | 11% |
+| 新增操作 | 55 | 13% |
+| 更新操作 | 70 | 17% |
+| 删除操作 | 55 | 13% |
+| 状态切换 | 35 | 8% |
+| 其他操作 | 65 | 15% |
+| **合计** | **420** | **100%** |
+
+### 8.2 新增API模块 (2025-12-26)
+| 文件名 | 接口数 | 说明 |
+|--------|--------|------|
+| `appeal.js` | 4 | 申诉管理 |
+| `certification.js` | 4 | 认证管理 |
+| `fans.js` | 4 | 粉丝管理 |
+| `comment.js` | 6 | 评论管理 |
+| `socialDynamic.js` | 7 | 社交动态 |
+
+---
+
+*报告生成完毕*
--- a/Zhibo/admin/UI界面优化修改报告.md
+++ b/Zhibo/admin/UI界面优化修改报告.md
@ -0,0 +1,518 @@
+# 管理端 UI 界面优化修改报告
+
+> 生成时间：2025-12-26
+> 最后更新：2025-12-26
+> 基于：UI界面分析报告.md、UI界面设计报告.md、API接口梳理报告.md
+
+---
+
+## 一、优化概述
+
+本次优化根据 UI 界面分析报告和设计报告，对管理端进行了系统性的界面优化和功能完善，主要包括：
+
+1. **创建公共组件** - 抽取通用组件，提高代码复用性
+2. **优化空壳界面** - 将无功能的空壳界面改造为完整功能界面
+3. **合并重复界面** - 将功能重复的界面合并为统一界面
+4. **统一设计规范** - 按照设计报告统一样式和交互
+5. **修复兼容性问题** - 修复 ES6+ 可选链语法兼容性问题
+6. **侧边栏菜单优化** - 消除重复菜单按钮，扩展侧边栏宽度
+7. **API接口梳理** - 完成95个API文件、420+接口的完整梳理
+8. **文档更新** - 更新UI界面分析报告和API接口梳理报告
+
+---
+
+## 二、新增公共组件
+
+### 2.1 组件列表
+
+| 组件名称 | 路径 | 功能说明 |
+|----------|------|----------|
+| SearchForm | `components/common/SearchForm.vue` | 通用搜索表单组件 |
+| StatusTag | `components/common/StatusTag.vue` | 状态标签组件，支持多种预设类型 |
+| DataPagination | `components/common/DataPagination.vue` | 通用分页组件 |
+| index.js | `components/common/index.js` | 组件统一导出和全局注册 |
+
+### 2.2 组件特性
+
+**SearchForm 组件**
+- 支持插槽自定义搜索项
+- 内置搜索和重置按钮
+- 统一的表单样式
+
+**StatusTag 组件**
+- 预设类型：enable(启用/禁用)、process(待处理/已处理)、audit(审核状态)
+- 支持自定义状态映射
+- 统一的标签样式
+
+**DataPagination 组件**
+- 支持 v-model 双向绑定
+- 统一的分页布局
+- 可配置每页条数选项
+
+---
+
+## 三、界面优化详情
+
+### 3.1 提现管理 (withdraw/index.vue)
+
+**优化前**：空壳界面，无实际功能
+
+**优化后**：
+- ✅ Tab 切换：待审核提现 / 已审核提现
+- ✅ 完整的搜索筛选功能
+- ✅ 提现审核（通过/拒绝）
+- ✅ 拒绝原因弹窗
+- ✅ 提现详情弹窗
+- ✅ 提现方式标签（微信/支付宝/银行卡）
+- ✅ 金额高亮显示
+
+**合并界面**：
+- `withdraw/pending/index.vue` → 合并到主界面 Tab
+- `withdraw/approved/index.vue` → 合并到主界面 Tab
+
+
+### 3.2 申诉管理 (appeal/index.vue)
+
+**优化前**：空壳界面，无实际功能
+
+**优化后**：
+- ✅ 完整的搜索筛选（申诉人、类型、状态、时间）
+- ✅ 申诉类型：封号申诉、禁言申诉、处罚申诉、其他
+- ✅ 申诉详情弹窗（含证据图片）
+- ✅ 申诉处理弹窗（通过/驳回 + 处理说明）
+- ✅ 删除功能
+
+**新增 API**：`api/appeal.js`
+- `appealListApi` - 申诉列表
+- `appealDetailApi` - 申诉详情
+- `appealProcessApi` - 处理申诉
+- `appealDeleteApi` - 删除申诉
+
+---
+
+### 3.3 认证管理 (certification/index.vue)
+
+**优化前**：空壳界面，无实际功能
+
+**优化后**：
+- ✅ 完整的搜索筛选（用户信息、认证类型、审核状态、时间范围）
+- ✅ 统计卡片（待审核、已通过、已拒绝、总申请）
+- ✅ 用户信息展示（头像+昵称+手机号）
+- ✅ 身份证号脱敏显示
+- ✅ 认证详情弹窗（含身份证正反面、手持照片）
+- ✅ 审核功能（通过/拒绝 + 备注）
+
+**新增 API**：`api/certification.js`
+- `certificationListApi` - 认证列表
+- `certificationDetailApi` - 认证详情
+- `certificationAuditApi` - 审核认证
+- `certificationDeleteApi` - 删除认证
+
+---
+
+### 3.4 粉丝管理 (fans/index.vue)
+
+**优化前**：空壳界面，无实际功能
+
+**优化后**：
+- ✅ 完整的搜索筛选（主播信息、粉丝信息、等级、时间）
+- ✅ 主播/粉丝信息展示（头像+昵称+ID）
+- ✅ 粉丝等级标签（不同等级不同颜色）
+- ✅ 亲密度、送礼价值显示
+- ✅ 粉丝详情弹窗
+- ✅ 移除粉丝关系功能
+
+**新增 API**：`api/fans.js`
+- `fansListApi` - 粉丝列表
+- `fansDetailApi` - 粉丝详情
+- `fansRemoveApi` - 移除粉丝关系
+- `fansStatsApi` - 粉丝统计
+
+---
+
+### 3.5 评论管理 (comment/index.vue)
+
+**优化前**：空壳界面，无实际功能
+
+**优化后**：
+- ✅ Tab 切换：动态评论 / 直播评论 / 商品评论
+- ✅ 完整的搜索筛选（评论人、内容、状态、时间）
+- ✅ 批量操作（批量删除、批量通过）
+- ✅ 评论详情弹窗（含回复列表）
+- ✅ 评论审核（通过/拒绝）
+- ✅ 点赞数、回复数显示
+
+**新增 API**：`api/comment.js`
+- `commentListApi` - 评论列表
+- `commentDetailApi` - 评论详情
+- `commentDeleteApi` - 删除评论
+- `commentBatchDeleteApi` - 批量删除
+- `commentAuditApi` - 审核评论
+- `commentReplyApi` - 回复评论
+
+---
+
+### 3.6 社会动态管理 (newtask/index.vue)
+
+**优化前**：命名错误（newtask），功能不完整
+
+**优化后**：
+- ✅ 正确命名为"社会动态管理"
+- ✅ 完整的搜索筛选（发布者、分区、审核状态、时间）
+- ✅ 动态内容展示（图片预览）
+- ✅ 互动数据显示（点赞、评论、分享）
+- ✅ 动态详情弹窗
+- ✅ 发布动态功能（含图片上传）
+- ✅ 审核功能（通过/拒绝）
+
+**新增 API**：`api/socialDynamic.js`
+- `socialDynamicListApi` - 动态列表
+- `socialDynamicDetailApi` - 动态详情
+- `socialDynamicAddApi` - 添加动态
+- `socialDynamicUpdateApi` - 更新动态
+- `socialDynamicDeleteApi` - 删除动态
+- `socialDynamicAuditApi` - 审核动态
+
+---
+
+### 3.7 重复界面处理
+
+以下界面已改为重定向页面，自动跳转到对应的完整功能界面：
+
+| 原界面 | 跳转目标 | 说明 |
+|--------|----------|------|
+| `sensitive/index.vue` | `/sensitiveWord/list` | 敏感词管理 |
+| `report/index.vue` | `/reportFeedback/reportList` | 举报管理 |
+| `task/index.vue` | `/noviceTask/list` | 任务管理 |
+
+---
+
+## 四、文件变更清单
+
+### 4.1 新增文件 (12个)
+
+```
+src/components/common/
+├── SearchForm.vue          # 搜索表单组件
+├── StatusTag.vue           # 状态标签组件
+├── DataPagination.vue      # 分页组件
+└── index.js                # 组件导出
+
+src/api/
+├── appeal.js               # 申诉管理 API
+├── certification.js        # 认证管理 API
+├── fans.js                 # 粉丝管理 API
+├── comment.js              # 评论管理 API
+└── socialDynamic.js        # 社会动态 API
+
+src/router/modules/
+└── appeal.js               # 申诉管理路由
+```
+
+### 4.2 修改文件 (30+个)
+
+```
+src/views/
+├── withdraw/index.vue      # 提现管理（重构为Tab切换）
+├── appeal/index.vue        # 申诉管理（完整功能）
+├── certification/index.vue # 认证管理（完整功能）
+├── fans/index.vue          # 粉丝管理（完整功能）
+├── comment/index.vue       # 评论管理（完整功能）
+├── newtask/index.vue       # 社会动态管理（完整功能）
+├── sensitive/index.vue     # 重定向到 sensitiveWord
+├── report/index.vue        # 重定向到 reportFeedback
+└── task/index.vue          # 重定向到 noviceTask
+
+src/router/modules/         # 21+个路由文件优化 alwaysShow
+src/theme/app.scss          # 侧边栏宽度扩展
+src/router/index.js         # 新增申诉管理路由注册
+jsconfig.json               # 修复类型定义问题
+```
+
+
+---
+
+## 五、侧边栏菜单优化
+
+### 5.1 侧边栏宽度扩展
+
+**修改文件**：`src/theme/app.scss`
+
+**优化内容**：
+- 侧边栏宽度从 206px 扩展到 220px
+- 确保中文菜单文字能完整显示
+
+```scss
+.layout-aside-width-default {
+  width: 220px !important;  // 原为 206px
+  transition: width 0.2s ease;
+  box-shadow: 1px 1px 4px rgba(0, 21, 41, 0.08);
+}
+```
+
+### 5.2 单子菜单重复按钮优化
+
+**问题描述**：部分路由模块只有一个子菜单，但设置了 `alwaysShow: true`，导致侧边栏显示父菜单和子菜单两个按钮，点击后跳转同一页面。
+
+**解决方案**：将单子菜单路由的 `alwaysShow` 改为 `false`，使其只显示一个菜单按钮。
+
+**优化的路由文件（共27个）**：
+
+| 路由文件 | 菜单名称 |
+|----------|----------|
+| `withdraw.js` | 提现管理 |
+| `sensitiveWord.js` | 敏感词管理 |
+| `fanGroup.js` | 粉丝团管理 |
+| `banner.js` | Banner管理 |
+| `session.js` | 会话管理 |
+| `social.js` | 社交管理 |
+| `chatPayConfig.js` | 聊天付费配置 |
+| `goldDiamondConfig.js` | 金币钻石配置 |
+| `invite.js` | 邀请管理 |
+| `headwear.js` | 头饰管理 |
+| `systemMessage.js` | 系统消息 |
+| `chatPhrase.js` | 聊天短语 |
+| `clientVersion.js` | 客户端版本管理 |
+| `exchange.js` | 兑换管理 |
+| `follow.js` | 关注管理 |
+| `giftReward.js` | 礼物打赏管理 |
+| `mountPurchase.js` | 购买坐骑管理 |
+| `charm.js` | 魅力值管理 |
+| `couple.js` | 夫妻相管理 |
+| `interact.js` | 互动管理 |
+| `verifycode.js` | 验证码管理 |
+| `order.js` | 订单管理 |
+| `orderManage.js` | 订单管理 |
+| `platformActivity.js` | 平台活动管理 |
+| `auth.js` | 认证管理 |
+| `config.js` | 配置管理 |
+| `member.js` | 会员管理 |
+| `level.js` | 贵族等级管理 |
+| `dynamic.js` | 动态管理 |
+
+### 5.3 新增路由模块
+
+| 路由文件 | 菜单名称 | 说明 |
+|----------|----------|------|
+| `appeal.js` | 申诉管理 | 新增路由，指向 `/views/appeal/index.vue` |
+
+---
+
+## 六、兼容性修复记录
+
+### 6.1 可选链语法修复
+
+项目 Babel 配置不支持 ES2020 可选链操作符 `?.`，已将所有使用可选链的代码改为兼容写法：
+
+| 原写法 | 修复后写法 |
+|--------|-----------|
+| `res.data?.list` | `res.data && res.data.list` |
+| `res.data?.total` | `res.data && res.data.total` |
+| `arr?.[0]` | `arr && arr[0]` |
+| `f.response?.url` | `f.response && f.response.url` |
+
+**涉及文件**：
+- `views/withdraw/index.vue`
+- `views/appeal/index.vue`
+- `views/certification/index.vue`
+- `views/comment/index.vue`
+- `views/fans/index.vue`
+- `views/newtask/index.vue`
+
+### 6.2 jsconfig.json 修复
+
+修复了 TypeScript 类型定义报错问题：
+
+```json
+{
+  "compilerOptions": {
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["src/*"]
+    },
+    "typeRoots": []
+  },
+  "exclude": ["node_modules", "dist"]
+}
+```
+
+添加 `"typeRoots": []` 禁用隐式类型库加载，解决 `bson` 和 `minimatch` 类型定义找不到的问题。
+
+---
+
+## 七、API 接口梳理
+
+### 7.1 API 统计
+
+| 指标 | 数量 |
+|------|------|
+| API 文件总数 | 95 个 |
+| 接口函数总数 | 约 420+ 个 |
+| 业务模块数 | 18 个 |
+
+### 7.2 API 模块分布
+
+| 模块分类 | 文件数 | 接口数(约) |
+|----------|--------|-----------|
+| 用户管理 | 2 | 35 |
+| 直播房间 | 1 | 16 |
+| 礼物管理 | 2 | 5 |
+| 财务管理 | 12 | 45 |
+| 内容管理 | 7 | 30 |
+| 社交功能 | 10 | 25 |
+| 装饰道具 | 7 | 30 |
+| 运营活动 | 8 | 35 |
+| 帮助反馈 | 5 | 15 |
+| 代理管理 | 3 | 10 |
+| 系统设置 | 18 | 80 |
+| 微信相关 | 1 | 35 |
+| 其他模块 | 19 | 60 |
+
+### 7.3 新增 API 模块 (5个)
+
+| 文件名 | 接口数 | 说明 |
+|--------|--------|------|
+| `appeal.js` | 4 | 申诉管理 |
+| `certification.js` | 4 | 认证管理 |
+| `fans.js` | 4 | 粉丝管理 |
+| `comment.js` | 6 | 评论管理 |
+| `socialDynamic.js` | 7 | 社交动态 |
+
+---
+
+## 八、文档更新
+
+### 8.1 更新的文档
+
+| 文档名称 | 更新内容 |
+|----------|----------|
+| `API接口梳理报告.md` | 完整梳理95个API文件，420+接口 |
+| `UI界面分析报告.md` | 更新界面统计、模块分类、目录结构 |
+| `UI界面优化修改报告.md` | 记录所有优化改动 |
+
+### 8.2 API接口梳理报告内容
+
+- API 概览和基础配置
+- 18个模块的API文件清单
+- 核心API接口详情（user.js、room.js、financial.js等）
+- API目录结构总览
+- API设计规范（URL命名、请求方法、响应格式）
+- API使用示例
+- 问题与优化建议
+- 统计汇总
+
+### 8.3 UI界面分析报告内容
+
+- 界面统计总览（71个目录，185个页面）
+- 13个模块的界面分类
+- 重复界面分析（5组）
+- 空壳界面清单（11个）
+- 界面完整度统计
+- 目录结构总览
+- 优化建议
+
+
+---
+
+## 九、设计规范遵循
+
+本次优化严格遵循 UI 界面设计报告中的规范：
+
+### 9.1 布局规范
+- ✅ 使用 `el-card` 包裹内容区域
+- ✅ 搜索表单使用 `inline` + `size="small"`
+- ✅ 表格使用 `border` + `size="mini"`
+- ✅ 分页使用 `background` 样式
+
+### 9.2 间距规范
+- ✅ 表单下间距使用 `mb20`
+- ✅ 分页上间距使用 `mt20`
+- ✅ 按钮间距统一
+
+### 9.3 组件规范
+- ✅ 弹窗宽度：500px~700px
+- ✅ 输入框宽度：140px~180px
+- ✅ 下拉框宽度：100px~120px
+- ✅ 日期选择器宽度：140px~240px
+
+### 9.4 交互规范
+- ✅ 删除操作需二次确认
+- ✅ 审核操作需填写备注
+- ✅ 表格支持 loading 状态
+- ✅ 分页支持每页条数切换
+
+---
+
+## 十、后续建议
+
+### 10.1 待优化界面
+
+以下界面仍为空壳状态，建议后续优化：
+
+| 路径 | 说明 |
+|------|------|
+| `chatpay/index.vue` | 聊天付费 |
+| `coinexchange/index.vue` | 金币兑换 |
+| `giftnum/index.vue` | 礼物数量 |
+| `interact/index.vue` | 互动管理 |
+| `sysconfig/index.vue` | 系统配置 |
+| `verifycode/index.vue` | 验证码管理 |
+| `version/index.vue` | 版本管理 |
+
+### 10.2 建议改进
+
+1. **全局注册公共组件** - 在 main.js 中引入 `components/common/index.js`
+2. **统一 API 响应处理** - 在 request.js 中统一处理 `res.data` 和 `res` 的差异
+3. **添加 TypeScript 类型** - 为 API 和组件添加类型定义
+4. **抽取更多公共组件** - 如用户信息展示组件、图片预览组件等
+5. **合并重复API文件** - `report.js` + `reportList.js`、`mount.js` + `mountList.js`
+6. **统一API命名规范** - 列表用 `xxxListApi`，详情用 `xxxDetailApi`
+
+### 10.3 建议删除的重复界面
+
+| 路径 | 原因 |
+|------|------|
+| `views/sensitive/` | 与 sensitiveWord 重复 |
+| `views/report/` | 与 reportFeedback 重复 |
+| `views/task/` | 与 noviceTask 重复 |
+| `views/newtask/` | 命名错误，功能不明 |
+
+---
+
+## 十一、总结
+
+### 11.1 本次优化成果
+
+| 项目 | 数量 |
+|------|------|
+| 新增文件 | 12 个 |
+| 修改界面 | 9 个 |
+| 新增 API 模块 | 5 个 |
+| 创建公共组件 | 3 个 |
+| 合并重复界面 | 3 个 |
+| 优化路由文件 | 27+ 个 |
+| 更新文档 | 3 个 |
+
+### 11.2 优化效果
+
+- ✅ 消除了27个重复的菜单按钮
+- ✅ 侧边栏宽度扩展，中文完整显示
+- ✅ 6个空壳界面改造为完整功能界面
+- ✅ 3个重复界面改为重定向
+- ✅ 完成95个API文件的完整梳理
+- ✅ 更新3份技术文档
+- ✅ 修复ES6+语法兼容性问题
+- ✅ 修复TypeScript类型定义问题
+
+### 11.3 界面完整度提升
+
+| 指标 | 优化前 | 优化后 |
+|------|--------|--------|
+| 功能完整界面 | 约 85 个 | 约 130 个 |
+| 空壳界面 | 约 35 个 | 约 15 个 |
+| 重复界面 | 约 25 个 | 约 10 个 |
+| 完整度 | 47% | 70% |
+
+---
+
+*报告更新完毕 - 2025-12-26*
--- a/Zhibo/admin/UI界面分析报告.md
+++ b/Zhibo/admin/UI界面分析报告.md
@ -0,0 +1,407 @@
+# 管理端 UI 界面分析报告
+
+> 📋 相关文档：[UI界面设计报告.md](./UI界面设计报告.md)
+> 📝 更新时间：2025-12-26
+
+---
+
+## 一、界面统计总览
+
+### 1.1 总体数据
+| 指标 | 数量 |
+|------|------|
+| views 目录总数 | 71 个 |
+| Vue 页面文件总数 | 约 185 个 |
+| 功能完整的界面 | 约 130 个 |
+| 占位/空壳界面 | 约 15 个 |
+| 重复/冗余界面 | 约 10 个 |
+
+---
+
+## 二、界面模块分类
+
+### 2.1 用户管理模块 (6个目录, 15个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `user/list/` | index, edit, userDetails, level | 用户列表、编辑、详情、等级 |
+| `user/grade/` | index, creatGrade | 等级管理 |
+| `user/group/` | index | 用户分组 |
+| `user/chat/` | index | 用户聊天 |
+| `user/notice/` | index | 用户通知 |
+| `user/sign/` | index, list | 签到管理 |
+
+### 2.2 直播房间模块 (4个目录, 5个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `room/list/` | index | 房间列表 |
+| `room/type/` | index | 房间类型 |
+| `room/background/` | index | 房间背景 |
+| `room/` | index | 房间入口 |
+
+### 2.3 礼物管理模块 (4个目录, 5个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `gift/` | index | 礼物管理 |
+| `giftnum/` | index | 礼物数量 |
+| `giftreward/record/` | index | 礼物打赏记录 |
+| `financial/giftDetail/` | index | 礼物明细 |
+
+### 2.4 财务管理模块 (18个目录, 22个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `financial/withdraw/` | index | 提现管理 |
+| `financial/coinDetail/` | index | 金币明细 |
+| `financial/diamondDetail/` | index | 钻石明细 |
+| `financial/charmDetail/` | index | 魅力值明细 |
+| `financial/exchangeDetail/` | index | 兑换明细 |
+| `financial/purchaseDetail/` | index | 购买明细 |
+| `financial/receiveGiftDetail/` | index | 收礼明细 |
+| `financial/rechargeOrder/` | index | 充值订单 |
+| `financial/liveRecharge/` | index | 直播充值 |
+| `financial/diamondRechargeAmount/` | index | 钻石充值金额 |
+| `financial/withdrawAmount/` | index | 提现金额配置 |
+| `financial/brokerage/` | index | 佣金管理 |
+| `financial/operating/` | index | 运营数据 |
+| `financial/order/` | index | 财务订单 |
+| `financial/record/` | index | 财务记录 |
+| `withdraw/pending/` | index | 待审核提现 |
+| `withdraw/approved/` | index | 已审核提现 |
+| `withdraw/amount/` | index | 提现金额 |
+
+### 2.5 内容管理模块 (10个目录, 15个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `dynamic/list/` | index | 动态列表 |
+| `dynamic/comment/` | index | 动态评论 |
+| `comment/dynamic/` | index | 评论管理(动态) |
+| `comment/reply/` | index | 评论回复 |
+| `content/article/` | list, edit | 文章管理 |
+| `content/articleclass/` | list | 文章分类 |
+| `banner/` | index | 轮播图管理 |
+| `systemMessage/list/` | index | 系统消息 |
+| `chatphrase/list/` | index | 聊天常用语 |
+| `sensitiveWord/list/` | index | 敏感词管理 |
+
+### 2.6 社交功能模块 (12个目录, 15个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `family/list/` | index | 家族列表 |
+| `family/level/` | index | 家族等级 |
+| `family/member/` | index | 家族成员 |
+| `fanGroup/list/` | index | 粉丝团 |
+| `fans/` | index | 粉丝管理 |
+| `follow/record/` | index | 关注记录 |
+| `blacklist/` | index, user, room | 黑名单管理 |
+| `session/list/` | index | 会话管理 |
+| `couple/matchText/` | index | 夫妻相匹配 |
+| `charm/level/` | index | 魅力等级 |
+| `noble/` | index, list, edit | 贵族管理 |
+| `level/user/` | index | 用户等级 |
+
+### 2.7 装饰道具模块 (4个目录, 5个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `mount/list/` | index | 坐骑列表 |
+| `mount/order/` | index | 坐骑订单 |
+| `mountpurchase/record/` | index | 坐骑购买记录 |
+| `headwear/` | index | 头饰管理 |
+
+### 2.8 运营活动模块 (10个目录, 12个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `lottery/prize/` | index | 抽奖奖品 |
+| `lottery/probability/` | index | 抽奖概率 |
+| `noviceTask/list/` | index | 新手任务 |
+| `noviceTask/signin/` | index | 签到任务 |
+| `noviceTask/userTask/` | index | 用户任务 |
+| `activity/platform/` | index | 平台活动 |
+| `distribution/config/` | index | 分销配置 |
+| `invite/list/` | index | 邀请管理 |
+| `marketing/*` | 多个 | 营销活动(优惠券、秒杀等) |
+| `exchange/record/` | index | 兑换记录 |
+
+### 2.9 帮助反馈模块 (6个目录, 7个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `help/feedback/` | index | 用户反馈 |
+| `help/report/` | index | 举报管理 |
+| `help/customerService/` | index | 客服联系方式 |
+| `help/customerServiceGroup/` | index | 客服分组 |
+| `reportFeedback/reportList/` | index | 举报列表 |
+| `appeal/` | index | 申诉管理 |
+
+### 2.10 代理管理模块 (3个目录, 4个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `agent/list/` | index | 代理列表 |
+| `agent/message/` | index | 代理消息 |
+| `agent/withdraw/` | index | 代理提现 |
+
+### 2.11 系统设置模块 (20个目录, 35个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `systemSetting/administratorAuthority/` | 多个 | 权限管理 |
+| `systemSetting/setting/` | index | 系统设置 |
+| `systemSetting/notification/` | index | 通知设置 |
+| `systemSetting/logistics/` | 多个 | 物流管理 |
+| `systemSetting/deliverGoods/` | 多个 | 发货管理 |
+| `maintain/user/` | index, update | 管理员管理 |
+| `maintain/devconfig/` | 多个 | 开发配置 |
+| `maintain/formConfig/` | index, edit | 表单配置 |
+| `maintain/picture/` | index | 图片管理 |
+| `maintain/schedule/` | 多个 | 定时任务 |
+| `maintain/clearCache/` | index | 清除缓存 |
+| `maintain/logistics/` | 多个 | 物流配置 |
+| `config/params/` | index | 参数配置 |
+| `clientVersion/list/` | index | 客户端版本 |
+| `sms/*` | 多个 | 短信配置 |
+| `appSetting/wxAccount/` | 多个 | 微信配置 |
+| `chatPayConfig/list/` | index | 聊天付费配置 |
+| `goldDiamondConfig/list/` | index | 金币钻石配置 |
+| `auth/car/` | index | 车辆认证 |
+| `certification/` | index | 认证管理 |
+
+### 2.12 页面设计模块 (3个目录, 5个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `design/devise/` | index, creatDevise | 装修设计 |
+| `design/theme/` | index | 主题设置 |
+| `design/viewDesign/` | index | 预览设计 |
+
+### 2.13 其他模块 (10个目录, 15个页面)
+| 目录 | 页面 | 功能 |
+|------|------|------|
+| `dashboard/` | index | 仪表盘 |
+| `login/` | index, auth-redirect | 登录 |
+| `order/` | index, orderDetail, orderSend | 订单管理 |
+| `orderManage/list/` | index | 订单列表 |
+| `store/*` | 多个 | 商品管理 |
+| `error-page/` | 401, 404 | 错误页面 |
+| `error-log/` | index | 错误日志 |
+| `redirect/` | index | 重定向 |
+| `mobile/*` | 多个 | 移动端相关 |
+| `detail/` | index | 详情页 |
+
+---
+
+## 三、重复界面分析
+
+### 3.1 敏感词管理（重复）
+| 路径 | 状态 |
+|------|------|
+| `views/sensitive/index.vue` | 空壳/重复 |
+| `views/sensitiveWord/list/index.vue` | ✅ 完整 |
+
+### 3.2 举报管理（重复）
+| 路径 | 状态 |
+|------|------|
+| `views/report/index.vue` | 空壳/重复 |
+| `views/help/report/index.vue` | ✅ 完整 |
+| `views/reportFeedback/reportList/index.vue` | ✅ 完整 |
+
+### 3.3 评论管理（重复）
+| 路径 | 状态 |
+|------|------|
+| `views/comment/index.vue` | 入口页 |
+| `views/comment/dynamic/index.vue` | ✅ 完整 |
+| `views/dynamic/comment/index.vue` | ✅ 完整(重复) |
+
+### 3.4 任务管理（重复）
+| 路径 | 状态 |
+|------|------|
+| `views/task/index.vue` | 空壳 |
+| `views/newtask/index.vue` | 空壳 |
+| `views/noviceTask/list/index.vue` | ✅ 完整 |
+
+### 3.5 物流管理（重复）
+| 路径 | 状态 |
+|------|------|
+| `views/maintain/logistics/` | 物流配置 |
+| `views/systemSetting/logistics/` | 物流配置(重复) |
+
+---
+
+## 四、空壳/占位界面清单
+
+以下界面仅有基础模板，无实际功能：
+
+| 路径 | 说明 |
+|------|------|
+| `views/chatpay/index.vue` | 聊天付费(空壳) |
+| `views/coinexchange/index.vue` | 金币兑换(空壳) |
+| `views/giftnum/index.vue` | 礼物数量(空壳) |
+| `views/interact/index.vue` | 互动(空壳) |
+| `views/sysconfig/index.vue` | 系统配置(空壳) |
+| `views/verifycode/index.vue` | 验证码(空壳) |
+| `views/version/index.vue` | 版本(空壳) |
+| `views/sensitive/index.vue` | 敏感词(重复) |
+| `views/report/index.vue` | 举报(重复) |
+| `views/task/index.vue` | 任务(重复) |
+| `views/newtask/index.vue` | 新任务(空壳) |
+
+---
+
+## 五、界面完整度统计
+
+| 评级 | 数量 | 占比 |
+|------|------|------|
+| ✅ 功能完整 | 130 | 70% |
+| ⚠️ 基本可用 | 30 | 16% |
+| ❌ 空壳/待开发 | 15 | 8% |
+| 🔄 重复冗余 | 10 | 6% |
+
+
+---
+
+## 六、目录结构总览
+
+```
+views/
+├── 用户管理
+│   ├── user/                    # 用户管理(6个子目录)
+│   ├── level/                   # 等级管理
+│   ├── member/                  # 会员管理
+│   └── blacklist/               # 黑名单
+│
+├── 直播相关
+│   ├── room/                    # 房间管理(3个子目录)
+│   ├── gift/                    # 礼物管理
+│   ├── giftreward/              # 礼物打赏
+│   ├── mount/                   # 坐骑管理
+│   ├── mountpurchase/           # 坐骑购买
+│   └── headwear/                # 头饰管理
+│
+├── 财务管理
+│   ├── financial/               # 财务中心(17个子目录)
+│   ├── withdraw/                # 提现管理(3个子目录)
+│   ├── exchange/                # 兑换管理
+│   └── goldDiamondConfig/       # 金币钻石配置
+│
+├── 内容管理
+│   ├── dynamic/                 # 动态管理
+│   ├── comment/                 # 评论管理
+│   ├── content/                 # 文章管理
+│   ├── banner/                  # 轮播图
+│   ├── systemMessage/           # 系统消息
+│   ├── chatphrase/              # 聊天常用语
+│   └── sensitiveWord/           # 敏感词
+│
+├── 社交功能
+│   ├── family/                  # 家族管理(3个子目录)
+│   ├── fanGroup/                # 粉丝团
+│   ├── fans/                    # 粉丝管理
+│   ├── follow/                  # 关注管理
+│   ├── session/                 # 会话管理
+│   ├── couple/                  # 夫妻相
+│   ├── charm/                   # 魅力管理
+│   └── noble/                   # 贵族管理
+│
+├── 运营活动
+│   ├── lottery/                 # 抽奖管理
+│   ├── noviceTask/              # 新手任务
+│   ├── activity/                # 平台活动
+│   ├── distribution/            # 分销管理
+│   ├── invite/                  # 邀请管理
+│   └── marketing/               # 营销活动(8个子目录)
+│
+├── 帮助反馈
+│   ├── help/                    # 帮助中心(4个子目录)
+│   ├── reportFeedback/          # 举报反馈
+│   └── appeal/                  # 申诉管理
+│
+├── 代理管理
+│   └── agent/                   # 代理管理(3个子目录)
+│
+├── 系统设置
+│   ├── systemSetting/           # 系统设置(5个子目录)
+│   ├── maintain/                # 维护管理(7个子目录)
+│   ├── config/                  # 配置管理
+│   ├── clientVersion/           # 客户端版本
+│   ├── sms/                     # 短信配置
+│   ├── appSetting/              # 应用设置
+│   ├── chatPayConfig/           # 聊天付费配置
+│   ├── auth/                    # 认证管理
+│   └── certification/           # 认证审核
+│
+├── 页面设计
+│   └── design/                  # 页面设计(5个子目录)
+│
+├── 商品订单
+│   ├── store/                   # 商品管理
+│   ├── order/                   # 订单管理
+│   └── orderManage/             # 订单列表
+│
+└── 其他
+    ├── dashboard/               # 仪表盘
+    ├── login/                   # 登录
+    ├── error-page/              # 错误页面
+    ├── error-log/               # 错误日志
+    ├── redirect/                # 重定向
+    ├── mobile/                  # 移动端
+    └── detail/                  # 详情页
+```
+
+---
+
+## 七、优化建议
+
+### 7.1 建议删除的重复界面
+| 路径 | 原因 |
+|------|------|
+| `views/sensitive/` | 与 sensitiveWord 重复 |
+| `views/report/` | 与 reportFeedback 重复 |
+| `views/task/` | 与 noviceTask 重复 |
+| `views/newtask/` | 空壳，功能不明 |
+
+### 7.2 建议合并的界面
+| 原界面 | 合并为 |
+|--------|--------|
+| `dynamic/comment` + `comment/dynamic` | 统一评论管理 |
+| `maintain/logistics` + `systemSetting/logistics` | 统一物流管理 |
+| `help/report` + `reportFeedback` | 统一举报管理 |
+
+### 7.3 建议完善的空壳界面
+| 路径 | 建议 |
+|------|------|
+| `chatpay/index.vue` | 完善聊天付费功能 |
+| `coinexchange/index.vue` | 完善金币兑换功能 |
+| `giftnum/index.vue` | 完善礼物数量统计 |
+| `interact/index.vue` | 完善互动功能 |
+| `verifycode/index.vue` | 完善验证码管理 |
+
+### 7.4 命名规范化建议
+| 当前命名 | 建议命名 |
+|----------|----------|
+| `newtask` | `socialDynamic` |
+| `giftnum` | `giftQuantity` |
+| `chatpay` | `chatPayment` |
+| `coinexchange` | `coinExchange` |
+| `mountpurchase` | `mountPurchase` |
+
+---
+
+## 八、总结
+
+### 8.1 界面分布
+- 用户管理: 15个页面 (8%)
+- 直播相关: 10个页面 (5%)
+- 财务管理: 22个页面 (12%)
+- 内容管理: 15个页面 (8%)
+- 社交功能: 15个页面 (8%)
+- 装饰道具: 5个页面 (3%)
+- 运营活动: 12个页面 (6%)
+- 帮助反馈: 7个页面 (4%)
+- 代理管理: 4个页面 (2%)
+- 系统设置: 35个页面 (19%)
+- 页面设计: 5个页面 (3%)
+- 商品订单: 10个页面 (5%)
+- 其他: 30个页面 (16%)
+
+### 8.2 优化后预期
+- 删除重复界面后: 约 175 个页面
+- 合并相似功能后: 约 165 个页面
+- 完善空壳界面后: 功能完整率提升至 85%+
+
+---
+
+*报告生成完毕*
--- a/Zhibo/admin/UI界面设计报告.md
+++ b/Zhibo/admin/UI界面设计报告.md
@ -0,0 +1,599 @@
+# 管理端 UI 界面设计报告
+
+> 📝 更新时间：2025-12-26
+
+## 一、设计规范总览
+
+### 1.1 技术框架
+| 项目 | 技术选型 |
+|------|----------|
+| UI框架 | Element UI 2.15.6 |
+| CSS预处理 | Sass/SCSS |
+| 图标 | Element Icons + 自定义SVG |
+| 图表 | ECharts 4.2.1 |
+| 布局 | Flex弹性布局 |
+
+### 1.2 设计主题色
+```scss
+// 主色调
+--prev-color-primary: #1890ff;          // 主题蓝
+--prev-color-Auxiliary-color: #19be6b;  // 辅助绿（成功）
+--prev-color-warning-color: #ff7d00;    // 警告橙
+--prev-color-prompt-color: #f56464;     // 提示红（危险）
+
+// 文字颜色
+--prev-color-text-primary: #606266;     // 主要文字
+--prev-color-text-regular: #303133;     // 常规文字
+--prev-color-text-secondary: #909399;   // 次要文字
+--prev-color-text-placeholder: #c0c4cc; // 占位文字
+
+// 背景色
+--prev-bg-main-color: #f0f2f5;          // 主背景
+--prev-bg-white: #ffffff;               // 白色背景
+--prev-bg-menuBar: #282c34;             // 菜单栏背景
+
+// 边框色
+--prev-border-color-base: #dcdfe6;      // 基础边框
+--prev-border-color-light: #e4e7ed;     // 浅色边框
+```
+
+---
+
+## 二、布局设计规范
+
+### 2.1 整体布局结构
+```
+┌─────────────────────────────────────────────────────┐
+│                    顶部导航栏 (50px)                  │
+├──────────┬──────────────────────────────────────────┤
+│          │                                          │
+│  侧边栏   │              主内容区域                   │
+│  (206px) │         (padding: 14px)                  │
+│          │                                          │
+│          │  ┌────────────────────────────────────┐  │
+│          │  │         搜索筛选区域                 │  │
+│          │  │      (el-card + el-form)           │  │
+│          │  └────────────────────────────────────┘  │
+│          │                                          │
+│          │  ┌────────────────────────────────────┐  │
+│          │  │         数据表格区域                 │  │
+│          │  │         (el-table)                 │  │
+│          │  └────────────────────────────────────┘  │
+│          │                                          │
+│          │  ┌────────────────────────────────────┐  │
+│          │  │         分页组件                    │  │
+│          │  │      (el-pagination)               │  │
+│          │  └────────────────────────────────────┘  │
+│          │                                          │
+└──────────┴──────────────────────────────────────────┘
+```
+
+### 2.2 布局模式
+项目支持4种布局模式：
+- `defaults` - 默认布局（左侧菜单）
+- `classic` - 经典布局
+- `transverse` - 横向布局（顶部菜单）
+- `columns` - 分栏布局
+
+### 2.3 响应式断点
+```scss
+// 侧边栏宽度
+.layout-aside-width-default { width: 206px; }  // 展开状态
+.layout-aside-width64 { width: 64px; }         // 收起状态
+.layout-aside-width1 { width: 0px; }           // 隐藏状态
+
+// 移动端适配
+@media (max-width: 1000px) {
+  // 自动切换为 defaults 布局
+  // 侧边栏自动收起
+}
+```
+
+---
+
+## 三、组件设计规范
+
+### 3.1 卡片组件 (el-card)
+```vue
+<el-card shadow="never" class="ivu-mt" :body-style="{ padding: 0 }">
+  <div class="padding-add">
+    <!-- 内容区域 padding: 20px 20px 0 -->
+  </div>
+</el-card>
+```
+
+**样式规范：**
+- 无边框：`border: none`
+- 无阴影：`shadow="never"`
+- 圆角：`border-radius: 4px`
+- 内边距：`padding: 20px 20px 0`
+
+### 3.2 表单组件 (el-form)
+```vue
+<el-form inline size="small" :model="searchForm" label-width="75px">
+  <el-form-item label="关键词：">
+    <el-input v-model="searchForm.keywords" 
+              placeholder="请输入" 
+              clearable 
+              class="selWidth" />
+  </el-form-item>
+  <el-form-item>
+    <el-button type="primary" @click="handleSearch">搜索</el-button>
+    <el-button @click="handleReset">重置</el-button>
+  </el-form-item>
+</el-form>
+```
+
+**样式规范：**
+- 尺寸：`size="small"`
+- 输入框高度：`32px`
+- 输入框宽度：`.selWidth { width: 150px~200px }`
+- 标签宽度：`75px~100px`
+- 字体大小：`12px`
+
+### 3.3 表格组件 (el-table)
+```vue
+<el-table :data="tableData" v-loading="loading" border size="mini">
+  <el-table-column prop="id" label="ID" width="80" align="center" />
+  <el-table-column prop="name" label="名称" min-width="120" />
+  <el-table-column label="状态" width="100" align="center">
+    <template slot-scope="scope">
+      <el-tag :type="scope.row.status ? 'success' : 'danger'">
+        {{ scope.row.status ? '启用' : '禁用' }}
+      </el-tag>
+    </template>
+  </el-table-column>
+  <el-table-column label="操作" width="150" align="center" fixed="right">
+    <template slot-scope="scope">
+      <el-button type="primary" size="mini">编辑</el-button>
+      <el-button type="danger" size="mini">删除</el-button>
+    </template>
+  </el-table-column>
+</el-table>
+```
+
+**样式规范：**
+- 尺寸：`size="mini"`
+- 边框：`border`
+- 表头背景：`#f2f6ff` (主题色浅色)
+- 表头高度：`48px`
+- 行高：`padding: 6px 0`
+- 字体大小：`12px`
+- 边框颜色：`#f5f5f5`
+
+### 3.4 分页组件 (el-pagination)
+```vue
+<el-pagination
+  @size-change="handleSizeChange"
+  @current-change="handleCurrentChange"
+  :current-page="searchForm.page"
+  :page-sizes="[10, 20, 50, 100]"
+  :page-size="searchForm.limit"
+  layout="total, sizes, prev, pager, next, jumper"
+  :total="total"
+  background
+/>
+```
+
+**样式规范：**
+- 位置：右对齐 `.acea-row.row-right`
+- 上边距：`margin-top: 22px`
+- 激活页码：圆角 `2px`，主题色背景
+
+### 3.5 弹窗组件 (el-dialog)
+```vue
+<el-dialog 
+  :title="dialogTitle" 
+  :visible.sync="dialogVisible" 
+  width="540px"
+  :close-on-click-modal="false"
+>
+  <el-form :model="form" label-width="100px">
+    <!-- 表单内容 -->
+  </el-form>
+  <div slot="footer" class="dialog-footer">
+    <el-button type="primary" @click="handleSubmit">保存</el-button>
+    <el-button @click="dialogVisible = false">返回</el-button>
+  </div>
+</el-dialog>
+```
+
+**样式规范：**
+- 宽度：`500px~700px`（常用540px）
+- 圆角：`6px`
+- 标题：`14px`，`font-weight: 500`
+- 头部边框：`border-bottom: 1px solid #eee`
+- 内容区最大高度：`670px`
+- 内边距：`padding: 30px 24px 0 24px`
+
+### 3.6 标签组件 (el-tag)
+```vue
+<!-- 状态标签 -->
+<el-tag type="success">启用</el-tag>
+<el-tag type="danger">禁用</el-tag>
+<el-tag type="warning">待处理</el-tag>
+<el-tag type="info">已完成</el-tag>
+
+<!-- 自定义样式标签 -->
+<el-tag class="notStartTag tag-background">未开始</el-tag>  <!-- 红色边框 -->
+<el-tag class="doingTag tag-background">进行中</el-tag>     <!-- 橙色边框 -->
+<el-tag class="endTag tag-background">已结束</el-tag>       <!-- 灰色边框 -->
+```
+
+---
+
+## 四、页面模板规范
+
+### 4.1 标准列表页模板
+```vue
+<template>
+  <div class="divBox">
+    <!-- 搜索区域 -->
+    <el-card shadow="never" class="ivu-mt">
+      <div class="padding-add">
+        <el-form inline size="small" :model="searchForm" class="mb20">
+          <!-- 搜索表单项 -->
+        </el-form>
+        
+        <!-- 操作按钮 -->
+        <div class="mb20">
+          <el-button type="primary" size="small" @click="handleAdd">+ 添加</el-button>
+        </div>
+        
+        <!-- 数据表格 -->
+        <el-table :data="tableData" v-loading="loading" border>
+          <!-- 表格列 -->
+        </el-table>
+        
+        <!-- 分页 -->
+        <div class="acea-row row-right page mt20">
+          <el-pagination ... />
+        </div>
+      </div>
+    </el-card>
+    
+    <!-- 弹窗 -->
+    <el-dialog ...>
+      <!-- 弹窗内容 -->
+    </el-dialog>
+  </div>
+</template>
+```
+
+### 4.2 Dashboard页面模板
+```vue
+<template>
+  <div>
+    <!-- 数据概览卡片 -->
+    <base-info />
+    
+    <!-- 快捷入口网格 -->
+    <grid-menu class="mb14" />
+    
+    <!-- 数据图表 -->
+    <user-overview />
+    <visit-chart />
+    <user-chart class="mb20" />
+  </div>
+</template>
+```
+
+### 4.3 详情页模板
+```vue
+<template>
+  <div class="divBox">
+    <el-card shadow="never">
+      <div class="padding-add">
+        <!-- 页面头部 -->
+        <el-page-header @back="goBack" content="详情页标题" />
+        
+        <!-- 详情内容 -->
+        <el-descriptions :column="2" border class="mt20">
+          <el-descriptions-item label="字段名">值</el-descriptions-item>
+        </el-descriptions>
+      </div>
+    </el-card>
+  </div>
+</template>
+```
+
+---
+
+## 五、间距规范
+
+### 5.1 外边距 (margin)
+```scss
+.mt5  { margin-top: 5px; }
+.mt10 { margin-top: 10px; }
+.mt14 { margin-top: 14px; }    // 卡片间距
+.mt20 { margin-top: 20px; }    // 常用间距
+.mt30 { margin-top: 30px; }
+
+.mb5  { margin-bottom: 5px; }
+.mb10 { margin-bottom: 10px; }
+.mb14 { margin-bottom: 14px; }
+.mb15 { margin-bottom: 15px; }
+.mb20 { margin-bottom: 20px; } // 表单/按钮下间距
+.mb30 { margin-bottom: 30px; }
+
+.ml10 { margin-left: 10px; }
+.ml20 { margin-left: 20px; }
+.mr10 { margin-right: 10px; }
+.mr14 { margin-right: 14px; }
+.mr20 { margin-right: 20px; }
+```
+
+### 5.2 内边距 (padding)
+```scss
+.padding-add { padding: 20px 20px 0; }  // 卡片内容区
+.p20 { padding: 20px; }
+.p30 { padding: 30px; }
+.px20 { padding: 0 20px; }
+.px35 { padding: 0 35px; }
+```
+
+---
+
+## 六、Flex布局工具类
+
+```scss
+// 基础flex
+.acea-row { display: flex; flex-wrap: wrap; }
+
+// 垂直对齐
+.acea-row.row-middle { align-items: center; }
+.acea-row.row-top { align-items: flex-start; }
+.acea-row.row-bottom { align-items: flex-end; }
+
+// 水平对齐
+.acea-row.row-center { justify-content: center; }
+.acea-row.row-left { justify-content: flex-start; }
+.acea-row.row-right { justify-content: flex-end; }
+.acea-row.row-between { justify-content: space-between; }
+.acea-row.row-around { justify-content: space-around; }
+
+// 垂直居中
+.acea-row.row-center-wrapper { 
+  align-items: center; 
+  justify-content: center; 
+}
+
+// 两端对齐居中
+.acea-row.row-between-wrapper { 
+  align-items: center; 
+  justify-content: space-between; 
+}
+```
+
+---
+
+## 七、字体规范
+
+### 7.1 字体族
+```scss
+font-family: Helvetica Neue, Helvetica, PingFang SC, 
+             Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+```
+
+### 7.2 字号规范
+| 用途 | 字号 | 类名 |
+|------|------|------|
+| 页面标题 | 18px | `.f-s-18` |
+| 卡片标题 | 14px | `.font14` |
+| 正文内容 | 12px | `.font12` |
+| 表格内容 | 12px | - |
+| 表单标签 | 12px | - |
+| 辅助说明 | 12px | `.desc` |
+
+### 7.3 字重规范
+```scss
+.f-w-500 { font-weight: 500; }  // 标题
+font-weight: 400;                // 正文（默认）
+```
+
+---
+
+## 八、按钮规范
+
+### 8.1 按钮类型
+```vue
+<!-- 主要按钮 -->
+<el-button type="primary" size="small">主要操作</el-button>
+
+<!-- 成功按钮 -->
+<el-button type="success" size="small">成功操作</el-button>
+
+<!-- 警告按钮 -->
+<el-button type="warning" size="small">警告操作</el-button>
+
+<!-- 危险按钮 -->
+<el-button type="danger" size="small">危险操作</el-button>
+
+<!-- 默认按钮 -->
+<el-button size="small">默认操作</el-button>
+
+<!-- 文字按钮 -->
+<el-button type="text" size="small">文字按钮</el-button>
+```
+
+### 8.2 按钮尺寸
+- 表格内操作：`size="mini"`
+- 搜索/表单：`size="small"`
+- 页面主操作：默认尺寸
+
+---
+
+## 九、图标规范
+
+### 9.1 Element Icons
+```vue
+<i class="el-icon-search"></i>      <!-- 搜索 -->
+<i class="el-icon-plus"></i>        <!-- 添加 -->
+<i class="el-icon-edit"></i>        <!-- 编辑 -->
+<i class="el-icon-delete"></i>      <!-- 删除 -->
+<i class="el-icon-refresh"></i>     <!-- 刷新 -->
+<i class="el-icon-arrow-down"></i>  <!-- 展开 -->
+<i class="el-icon-arrow-up"></i>    <!-- 收起 -->
+```
+
+### 9.2 自定义SVG图标
+```vue
+<svg-icon icon-class="icon-name" />
+```
+
+---
+
+## 十、现有问题与优化建议
+
+### 10.1 设计一致性问题
+
+| 问题 | 现状 | 建议 |
+|------|------|------|
+| 按钮样式不统一 | 部分用 `type="text"`，部分用 `size="mini"` | 统一为表格内 `mini`，表单 `small` |
+| 弹窗宽度不一致 | 500px/540px/600px/700px 混用 | 统一为 540px（小）/ 700px（大） |
+| 搜索框宽度不一致 | 150px/180px/200px 混用 | 统一为 180px |
+| 间距类名混乱 | `mt20`/`mt-20`/`margin-top: 20px` 混用 | 统一使用工具类 |
+
+### 10.2 缺失的公共组件
+
+建议抽取以下公共组件：
+
+```
+components/
+├── SearchForm/          # 通用搜索表单 ✅ 已创建
+│   └── index.vue
+├── DataTable/           # 通用数据表格
+│   └── index.vue
+├── PageHeader/          # 页面头部（已有）
+│   └── index.vue
+├── StatusTag/           # 状态标签 ✅ 已创建
+│   └── index.vue
+├── ActionButtons/       # 操作按钮组
+│   └── index.vue
+├── ConfirmDialog/       # 确认弹窗
+│   └── index.vue
+└── DataPagination/      # 分页组件 ✅ 已创建
+    └── index.vue
+```
+
+### 10.3 新增公共组件 (2025-12-26)
+
+本次优化新增了 3 个公共组件：
+
+#### SearchForm 组件
+```vue
+<!-- 使用示例 -->
+<search-form :form="searchForm" @search="handleSearch" @reset="handleReset">
+  <el-form-item label="关键词">
+    <el-input v-model="searchForm.keyword" />
+  </el-form-item>
+</search-form>
+```
+
+#### StatusTag 组件
+```vue
+<!-- 使用示例 -->
+<status-tag :status="row.status" type="enable" />  <!-- 启用/禁用 -->
+<status-tag :status="row.status" type="process" /> <!-- 待处理/已处理 -->
+<status-tag :status="row.status" type="audit" />   <!-- 审核状态 -->
+```
+
+#### DataPagination 组件
+```vue
+<!-- 使用示例 -->
+<data-pagination 
+  :page.sync="searchForm.page" 
+  :limit.sync="searchForm.limit" 
+  :total="total"
+  @size-change="getList"
+  @current-change="getList"
+/>
+```
+
+组件路径：`src/components/common/`
+
+### 10.3 样式优化建议
+
+1. **统一CSS变量命名**
+```scss
+// 建议统一前缀
+--admin-color-primary
+--admin-color-success
+--admin-color-warning
+--admin-color-danger
+```
+
+2. **抽取公共样式**
+```scss
+// 建议创建 common.scss
+.page-container { ... }
+.search-card { ... }
+.data-table { ... }
+.dialog-form { ... }
+```
+
+3. **移除冗余样式**
+- 删除未使用的 iView 相关样式
+- 合并重复的间距类定义
+
+---
+
+## 十一、设计规范检查清单
+
+### 页面开发检查项
+- [ ] 使用 `el-card` 包裹内容区域
+- [ ] 搜索表单使用 `inline` + `size="small"`
+- [ ] 表格使用 `border` + `size="mini"`
+- [ ] 分页使用 `background` 样式
+- [ ] 弹窗宽度为 540px 或 700px
+- [ ] 按钮间距使用 `mr10` 或 `mr14`
+- [ ] 卡片间距使用 `mt14`
+- [ ] 表单下间距使用 `mb20`
+
+### 样式检查项
+- [ ] 主题色使用 CSS 变量
+- [ ] 字体大小符合规范
+- [ ] 间距使用工具类
+- [ ] 响应式适配正常
+
+---
+
+## 十二、总结
+
+本管理端UI设计基于 Element UI，整体风格简洁专业。主要特点：
+
+1. **色彩体系**：以蓝色为主色调，配合绿/橙/红辅助色
+2. **布局结构**：左侧菜单 + 顶部导航 + 主内容区
+3. **组件规范**：统一使用 Element UI 组件
+4. **间距系统**：基于 5px 倍数的间距体系
+
+**待改进项**：
+- 统一组件尺寸和间距
+- ~~抽取更多公共组件~~ ✅ 已完成部分
+- 完善响应式适配
+- 清理冗余样式代码
+
+---
+
+## 十三、优化记录 (2025-12-26)
+
+### 13.1 新增公共组件
+| 组件 | 路径 | 功能 |
+|------|------|------|
+| SearchForm | `components/common/SearchForm.vue` | 通用搜索表单 |
+| StatusTag | `components/common/StatusTag.vue` | 状态标签（多种预设） |
+| DataPagination | `components/common/DataPagination.vue` | 分页组件 |
+
+### 13.2 优化的界面
+| 界面 | 优化内容 |
+|------|----------|
+| withdraw/index.vue | Tab切换：待审核/已审核 |
+| appeal/index.vue | 完整申诉管理功能 |
+| certification/index.vue | 认证审核+统计卡片 |
+| fans/index.vue | 粉丝管理功能 |
+| comment/index.vue | Tab切换：动态/直播/商品评论 |
+| newtask/index.vue | 社会动态管理 |
+
+### 13.3 兼容性修复
+- 将 ES2020 可选链语法 `?.` 改为兼容写法
+- 修复 jsconfig.json 类型定义报错
--- a/Zhibo/admin/src/api/appeal.js
+++ b/Zhibo/admin/src/api/appeal.js
@ -0,0 +1,39 @@
+import request from '@/utils/request'
+
+/**
+ * 申诉管理 API
+ */
+
+// 申诉列表
+export function appealListApi(params) {
+  return request({
+    url: '/admin/appeal/list',
+    method: 'get',
+    params
+  })
+}
+
+// 申诉详情
+export function appealDetailApi(id) {
+  return request({
+    url: `/admin/appeal/detail/${id}`,
+    method: 'get'
+  })
+}
+
+// 处理申诉
+export function appealProcessApi(id, data) {
+  return request({
+    url: `/admin/appeal/process/${id}`,
+    method: 'post',
+    data
+  })
+}
+
+// 删除申诉
+export function appealDeleteApi(id) {
+  return request({
+    url: `/admin/appeal/delete/${id}`,
+    method: 'post'
+  })
+}
--- a/Zhibo/admin/src/api/certification.js
+++ b/Zhibo/admin/src/api/certification.js
@ -0,0 +1,39 @@
+import request from '@/utils/request'
+
+/**
+ * 认证管理 API
+ */
+
+// 认证列表
+export function certificationListApi(params) {
+  return request({
+    url: '/admin/certification/list',
+    method: 'get',
+    params
+  })
+}
+
+// 认证详情
+export function certificationDetailApi(id) {
+  return request({
+    url: `/admin/certification/detail/${id}`,
+    method: 'get'
+  })
+}
+
+// 审核认证
+export function certificationAuditApi(id, data) {
+  return request({
+    url: `/admin/certification/audit/${id}`,
+    method: 'post',
+    data
+  })
+}
+
+// 删除认证
+export function certificationDeleteApi(id) {
+  return request({
+    url: `/admin/certification/delete/${id}`,
+    method: 'post'
+  })
+}
--- a/Zhibo/admin/src/api/fans.js
+++ b/Zhibo/admin/src/api/fans.js
@ -0,0 +1,39 @@
+import request from '@/utils/request'
+
+/**
+ * 粉丝管理 API
+ */
+
+// 粉丝列表
+export function fansListApi(params) {
+  return request({
+    url: '/admin/fans/list',
+    method: 'get',
+    params
+  })
+}
+
+// 粉丝详情
+export function fansDetailApi(id) {
+  return request({
+    url: `/admin/fans/detail/${id}`,
+    method: 'get'
+  })
+}
+
+// 移除粉丝关系
+export function fansRemoveApi(id) {
+  return request({
+    url: `/admin/fans/remove/${id}`,
+    method: 'post'
+  })
+}
+
+// 粉丝统计
+export function fansStatsApi(params) {
+  return request({
+    url: '/admin/fans/stats',
+    method: 'get',
+    params
+  })
+}
--- a/Zhibo/admin/src/api/socialDynamic.js
+++ b/Zhibo/admin/src/api/socialDynamic.js
@ -0,0 +1,66 @@
+import request from '@/utils/request'
+
+/**
+ * 社会动态管理 API
+ */
+
+// 动态列表
+export function socialDynamicListApi(params) {
+  return request({
+    url: '/admin/social/dynamic/list',
+    method: 'get',
+    params
+  })
+}
+
+// 动态详情
+export function socialDynamicDetailApi(id) {
+  return request({
+    url: `/admin/social/dynamic/detail/${id}`,
+    method: 'get'
+  })
+}
+
+// 添加动态
+export function socialDynamicAddApi(data) {
+  return request({
+    url: '/admin/social/dynamic/add',
+    method: 'post',
+    data
+  })
+}
+
+// 更新动态
+export function socialDynamicUpdateApi(data) {
+  return request({
+    url: '/admin/social/dynamic/update',
+    method: 'post',
+    data
+  })
+}
+
+// 删除动态
+export function socialDynamicDeleteApi(id) {
+  return request({
+    url: `/admin/social/dynamic/delete/${id}`,
+    method: 'post'
+  })
+}
+
+// 审核动态
+export function socialDynamicAuditApi(id, data) {
+  return request({
+    url: `/admin/social/dynamic/audit/${id}`,
+    method: 'post',
+    data
+  })
+}
+
+// 切换状态
+export function socialDynamicStatusApi(id, data) {
+  return request({
+    url: `/admin/social/dynamic/status/${id}`,
+    method: 'post',
+    data
+  })
+}
--- a/Zhibo/admin/src/components/common/DataPagination.vue
+++ b/Zhibo/admin/src/components/common/DataPagination.vue
@ -0,0 +1,56 @@
+<template>
+  <div class="acea-row row-right page mt20">
+    <el-pagination
+      background
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="page"
+      :page-sizes="pageSizes"
+      :page-size="limit"
+      :layout="layout"
+      :total="total"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'DataPagination',
+  props: {
+    page: {
+      type: Number,
+      default: 1
+    },
+    limit: {
+      type: Number,
+      default: 10
+    },
+    total: {
+      type: Number,
+      default: 0
+    },
+    pageSizes: {
+      type: Array,
+      default: () => [10, 20, 50, 100]
+    },
+    layout: {
+      type: String,
+      default: 'total, sizes, prev, pager, next, jumper'
+    }
+  },
+  methods: {
+    handleSizeChange(val) {
+      this.$emit('update:limit', val);
+      this.$emit('size-change', val);
+    },
+    handleCurrentChange(val) {
+      this.$emit('update:page', val);
+      this.$emit('current-change', val);
+    }
+  }
+};
+</script>
+
+<style scoped>
+.mt20 { margin-top: 20px; }
+</style>
--- a/Zhibo/admin/src/components/common/SearchForm.vue
+++ b/Zhibo/admin/src/components/common/SearchForm.vue
@ -0,0 +1,35 @@
+<template>
+  <el-form :inline="true" :model="form" size="small" class="search-form">
+    <slot></slot>
+    <el-form-item>
+      <el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button>
+      <el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+export default {
+  name: 'SearchForm',
+  props: {
+    form: {
+      type: Object,
+      required: true
+    }
+  },
+  methods: {
+    handleSearch() {
+      this.$emit('search');
+    },
+    handleReset() {
+      this.$emit('reset');
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+.search-form {
+  margin-bottom: 20px;
+}
+</style>
--- a/Zhibo/admin/src/components/common/StatusTag.vue
+++ b/Zhibo/admin/src/components/common/StatusTag.vue
@ -0,0 +1,61 @@
+<template>
+  <el-tag :type="tagType" :size="size">{{ label }}</el-tag>
+</template>
+
+<script>
+export default {
+  name: 'StatusTag',
+  props: {
+    status: {
+      type: [Number, String, Boolean],
+      required: true
+    },
+    size: {
+      type: String,
+      default: 'small'
+    },
+    // 预设类型: enable(启用/禁用), process(待处理/已处理), audit(待审核/已通过/已拒绝)
+    type: {
+      type: String,
+      default: 'enable'
+    },
+    // 自定义映射
+    customMap: {
+      type: Object,
+      default: null
+    }
+  },
+  computed: {
+    statusMap() {
+      if (this.customMap) return this.customMap;
+      
+      const maps = {
+        enable: {
+          1: { label: '启用', type: 'success' },
+          0: { label: '禁用', type: 'danger' },
+          true: { label: '启用', type: 'success' },
+          false: { label: '禁用', type: 'danger' }
+        },
+        process: {
+          1: { label: '已处理', type: 'success' },
+          0: { label: '待处理', type: 'warning' }
+        },
+        audit: {
+          0: { label: '待审核', type: 'warning' },
+          1: { label: '已通过', type: 'success' },
+          2: { label: '已拒绝', type: 'danger' }
+        }
+      };
+      return maps[this.type] || maps.enable;
+    },
+    tagType() {
+      const item = this.statusMap[this.status];
+      return item ? item.type : 'info';
+    },
+    label() {
+      const item = this.statusMap[this.status];
+      return item ? item.label : String(this.status);
+    }
+  }
+};
+</script>
--- a/Zhibo/admin/src/components/common/index.js
+++ b/Zhibo/admin/src/components/common/index.js
@ -0,0 +1,21 @@
+/**
+ * 公共组件统一导出
+ */
+import SearchForm from './SearchForm.vue';
+import StatusTag from './StatusTag.vue';
+import DataPagination from './DataPagination.vue';
+
+export {
+  SearchForm,
+  StatusTag,
+  DataPagination
+};
+
+// 全局注册
+export default {
+  install(Vue) {
+    Vue.component('SearchForm', SearchForm);
+    Vue.component('StatusTag', StatusTag);
+    Vue.component('DataPagination', DataPagination);
+  }
+};
--- a/Zhibo/admin/src/router/modules/appeal.js
+++ b/Zhibo/admin/src/router/modules/appeal.js
@ -0,0 +1,26 @@
+import Layout from '@/layout';
+
+/**
+ * 申诉管理路由
+ */
+const appealRouter = {
+  path: '/appeal',
+  component: Layout,
+  redirect: '/appeal/index',
+  name: 'Appeal',
+  alwaysShow: false,
+  meta: { title: '申诉管理', icon: 'el-icon-warning' },
+  children: [
+    {
+      path: 'index',
+      component: () => import('@/views/appeal/index'),
+      name: 'AppealManage',
+      meta: { 
+        title: '申诉管理', 
+        icon: ''
+      }
+    }
+  ]
+};
+
+export default appealRouter;