mirror of
https://github.com/Megghy/vtsuru.live.git
synced 2025-12-06 18:36:55 +08:00
feat: Enhance HistoryView with Guard List and Stats
- Added guard member model and statistics interface. - Implemented loading functionality for guard list and statistics. - Introduced a data table to display current guard members with pagination. - Enhanced error handling and loading states for guard data. - Updated UI components to include refresh button and statistics display. feat: Update PointManage and PointGoodsView for Improved User Experience - Added management flag to PointGoodsItem for better handling in PointManage. - Enhanced PointGoodsView with improved tooltip logic for purchase status. - Implemented detailed purchase history alerts and restrictions based on user actions. - Improved visual feedback for purchased and non-purchasable items. docs: Add comprehensive API integration documentation - Documented API modules, data models, and request types. - Included details on live platform integration and data storage mechanisms. docs: Establish development workflow guidelines - Outlined project configuration, environment setup, and code style practices. - Provided deployment process using Docker. docs: Create detailed documentation for the live request system - Described the functionality and data flow of the song request system. - Included main files and features related to the song request functionality. docs: Define project structure and UI components - Documented the overall project structure and key directories. - Listed main UI components and their usage within the project. chore: Analyze and document improvements in AnalyzeView - Detailed enhancements made to the AnalyzeView for better user experience. - Included visual comparisons and technical highlights of the optimizations.
This commit is contained in:
36
.kiro/steering/api-integration.md
Normal file
36
.kiro/steering/api-integration.md
Normal file
@@ -0,0 +1,36 @@
|
||||
---
|
||||
inclusion: manual
|
||||
---
|
||||
# API集成
|
||||
|
||||
该项目使用多个API接口与后端服务和直播平台进行交互。
|
||||
|
||||
## 主要API模块
|
||||
|
||||
- [src/api/api-models.ts](mdc:src/api/api-models.ts): 定义了系统中使用的数据模型
|
||||
- [src/api/query.ts](mdc:src/api/query.ts): 提供了API请求的基础函数
|
||||
- [src/api/account.ts](mdc:src/api/account.ts): 账户管理相关API
|
||||
|
||||
## 数据模型
|
||||
|
||||
- `SongRequestInfo`: 点歌请求信息
|
||||
- `DanmakuUserInfo`: 弹幕用户信息
|
||||
- `EventModel`: 事件数据模型,用于处理弹幕、SC等事件
|
||||
- `Setting_LiveRequest`: 点歌系统设置
|
||||
|
||||
## API请求类型
|
||||
|
||||
- `QueryGetAPI`: GET请求
|
||||
- `QueryPostAPI`: POST请求
|
||||
- `QueryPostAPIWithParams`: 带参数的POST请求
|
||||
|
||||
## 直播平台集成
|
||||
|
||||
系统集成了直播平台(如B站)的API,通过`useDanmakuClient()`获取直播间的弹幕、SC等数据。主要事件类型:
|
||||
|
||||
- `danmaku`: 弹幕事件
|
||||
- `sc`: SuperChat事件
|
||||
|
||||
## 数据存储
|
||||
|
||||
系统使用`useStorage`进行本地数据存储,`useAccount`获取账户信息。远程数据通过API请求获取和更新。
|
||||
35
.kiro/steering/development-workflow.md
Normal file
35
.kiro/steering/development-workflow.md
Normal file
@@ -0,0 +1,35 @@
|
||||
---
|
||||
inclusion: always
|
||||
---
|
||||
# 开发工作流
|
||||
|
||||
## 项目配置
|
||||
|
||||
- TypeScript: 项目使用TypeScript进行类型检查
|
||||
- Vite: 使用Vite作为构建工具
|
||||
- ESLint: 代码质量检查
|
||||
- Prettier: 代码格式化
|
||||
|
||||
## 主要配置文件
|
||||
|
||||
- [package.json](mdc:package.json): 项目依赖和脚本
|
||||
- [tsconfig.json](mdc:tsconfig.json): TypeScript配置
|
||||
- [vite.config.mts](mdc:vite.config.mts): Vite构建配置
|
||||
- [.prettierrc.json](mdc:.prettierrc.json): Prettier格式化配置
|
||||
- [eslint.config.mjs](mdc:eslint.config.mjs): ESLint配置
|
||||
|
||||
## 开发环境
|
||||
|
||||
项目运行在Windows环境中,使用PowerShell作为默认shell。
|
||||
|
||||
## 代码风格
|
||||
|
||||
- 使用中文作为用户界面和日志语言
|
||||
- 注释应尽量简短,必要时使用中文
|
||||
- 遵循Vue 3组合式API的最佳实践
|
||||
|
||||
## 部署流程
|
||||
|
||||
项目包含Docker配置,可以使用Docker进行部署:
|
||||
|
||||
- [Dockerfile](mdc:Dockerfile): Docker构建配置
|
||||
28
.kiro/steering/live-request-system.md
Normal file
28
.kiro/steering/live-request-system.md
Normal file
@@ -0,0 +1,28 @@
|
||||
---
|
||||
inclusion: manual
|
||||
---
|
||||
# 点歌系统
|
||||
|
||||
点歌系统是主要功能之一,允许观众在直播过程中通过弹幕、SuperChat或网页界面请求歌曲。
|
||||
|
||||
## 主要文件
|
||||
|
||||
- [src/views/open_live/LiveRequest.vue](mdc:src/views/open_live/LiveRequest.vue): 点歌系统的主要界面组件
|
||||
- [src/views/obs/LiveRequestOBS.vue](mdc:src/views/obs/LiveRequestOBS.vue): 用于OBS的点歌系统显示组件
|
||||
|
||||
## 主要功能
|
||||
|
||||
- 支持多种点歌方式:弹幕、SuperChat、网页、手动添加
|
||||
- 歌曲队列管理:等待、演唱中、已完成、已取消等状态管理
|
||||
- 权限控制:可配置只允许舰长、提督、总督或粉丝牌用户点歌
|
||||
- 冷却时间:可设置不同用户类型的点歌冷却时间
|
||||
- OBS集成:提供适用于OBS的显示组件,可展示当前点歌队列
|
||||
- 黑名单:可将特定用户加入黑名单
|
||||
|
||||
## 数据流
|
||||
|
||||
1. 接收来自直播平台的弹幕或SuperChat
|
||||
2. 通过前缀识别点歌请求(如"点播")
|
||||
3. 根据规则验证请求是否有效
|
||||
4. 将有效请求添加到点歌队列
|
||||
5. 主播可以管理队列:开始演唱、标记完成、取消请求等
|
||||
3
.kiro/steering/project-struction.md
Normal file
3
.kiro/steering/project-struction.md
Normal file
@@ -0,0 +1,3 @@
|
||||
---
|
||||
inclusion: always
|
||||
---
|
||||
29
.kiro/steering/project-structure.md
Normal file
29
.kiro/steering/project-structure.md
Normal file
@@ -0,0 +1,29 @@
|
||||
---
|
||||
inclusion: manual
|
||||
---
|
||||
# 项目结构
|
||||
|
||||
该项目是一个基于Vue的直播辅助工具,主要用于管理直播相关功能,如点歌系统、弹幕互动等。
|
||||
|
||||
## 主要目录结构
|
||||
|
||||
- `src/`: 源代码目录
|
||||
- `api/`: API调用和模型定义
|
||||
- `assets/`: 静态资源文件
|
||||
- `client/`: 客户端相关组件和服务
|
||||
- `components/`: Vue组件
|
||||
- `composables/`: Vue组合式API函数
|
||||
- `data/`: 数据相关模块,包括聊天和弹幕客户端
|
||||
- `router/`: 路由配置
|
||||
- `store/`: 状态管理
|
||||
- `views/`: 页面视图组件
|
||||
- `open_live/`: 直播相关视图,包括点歌系统
|
||||
- `obs/`: OBS相关视图组件
|
||||
- `public/`: 公共静态资源
|
||||
- `plugins/`: 插件目录
|
||||
|
||||
## 主要功能模块
|
||||
|
||||
- 点歌系统:允许观众通过弹幕或SuperChat点歌
|
||||
- 直播互动:弹幕互动和自动化操作
|
||||
- OBS集成:为OBS提供overlays和组件
|
||||
50
.kiro/steering/ui-components.md
Normal file
50
.kiro/steering/ui-components.md
Normal file
@@ -0,0 +1,50 @@
|
||||
---
|
||||
inclusion: fileMatch
|
||||
fileMatchPattern: ['*.vue']
|
||||
---
|
||||
# UI组件
|
||||
|
||||
项目使用Vue 3和Naive UI作为主要UI框架,采用组件化设计。
|
||||
|
||||
## 主要UI框架
|
||||
|
||||
- Vue 3: 使用`<script setup>`语法和组合式API
|
||||
- Naive UI: 提供各种预设UI组件
|
||||
- VueUse: 提供实用的组合式函数,如`useStorage`
|
||||
|
||||
## 常用组件
|
||||
|
||||
### Naive UI组件
|
||||
|
||||
项目广泛使用Naive UI组件:
|
||||
|
||||
- `NCard`: 卡片容器
|
||||
- `NSpace`: 间距布局
|
||||
- `NButton`: 按钮
|
||||
- `NInput`: 输入框
|
||||
- `NTabs`: 标签页
|
||||
- `NDataTable`: 数据表格
|
||||
- `NModal`: 模态框
|
||||
- `NAlert`: 警告提示
|
||||
- `NTag`: 标签
|
||||
- `NIcon`: 图标容器
|
||||
|
||||
### 自定义组件
|
||||
|
||||
- [SongPlayer.vue](mdc:src/components/SongPlayer.vue): 歌曲播放器组件
|
||||
- [LiveRequestOBS.vue](mdc:src/views/obs/LiveRequestOBS.vue): OBS点歌显示组件
|
||||
|
||||
## 状态管理
|
||||
|
||||
项目使用组合式API和本地存储管理状态:
|
||||
|
||||
- `ref`/`computed`: 响应式状态
|
||||
- `useStorage`: 持久化存储
|
||||
- `useAccount`: 账户状态管理
|
||||
|
||||
## UI设计模式
|
||||
|
||||
- 使用`NFlex`和`NCard`进行布局
|
||||
- 通过`NTabs`组织不同功能区域
|
||||
- 使用状态颜色区分不同状态(如等待中、处理中、已完成)
|
||||
- 响应式设计适应不同屏幕尺寸
|
||||
Reference in New Issue
Block a user