mirror of
https://github.com/hicccc77/WeFlow.git
synced 2026-03-25 15:25:50 +00:00
Compare commits
77 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
2a6f833718 | ||
|
|
c8835f4d4c | ||
|
|
fff1a1c177 | ||
|
|
8fee96d0e1 | ||
|
|
fdb3d63006 | ||
|
|
071d239892 | ||
|
|
94eb9abe9d | ||
|
|
1031c4013e | ||
|
|
2b5bb34392 | ||
|
|
e28ef9b783 | ||
|
|
e3c17010c1 | ||
|
|
2389aaf314 | ||
|
|
4f1dd7a5fb | ||
|
|
4b203a93b6 | ||
|
|
f219b1a580 | ||
|
|
004ee5bbf0 | ||
|
|
5640db9cbd | ||
|
|
52b26533a2 | ||
|
|
d334a214a4 | ||
|
|
1aab8dfc4e | ||
|
|
e56ee1ff4a | ||
|
|
0393e7aff7 | ||
|
|
c988e4accf | ||
|
|
63ac715792 | ||
|
|
fe0e2e6592 | ||
|
|
ca1a386146 | ||
|
|
7c9d0a39c3 | ||
|
|
a5777027b1 | ||
|
|
c3e911e6fa | ||
|
|
4d03110df2 | ||
|
|
8cb640f565 | ||
|
|
494bd4f539 | ||
|
|
38169691cd | ||
|
|
bd995bc736 | ||
|
|
6e05e74d5e | ||
|
|
d3a1db4efe | ||
|
|
a19f2a57c3 | ||
|
|
666a53f6ba | ||
|
|
b156a08f0d | ||
|
|
9c76aa2189 | ||
|
|
a54c95b6ac | ||
|
|
9cb0ada1b7 | ||
|
|
54378a132f | ||
|
|
4d1632a9b9 | ||
|
|
1eab835458 | ||
|
|
fcbc7fead8 | ||
|
|
ec783e4ccc | ||
|
|
b6f97b102c | ||
|
|
e4ce9a3bd7 | ||
|
|
64d5e721af | ||
|
|
d7419669d6 | ||
|
|
ff2f6799c8 | ||
|
|
2d573896f9 | ||
|
|
ab15190c44 | ||
|
|
551995df68 | ||
|
|
8483babd10 | ||
|
|
79648cd9d5 | ||
|
|
04d690dcf1 | ||
|
|
0b308803bf | ||
|
|
419d5aace3 | ||
|
|
84005f2d43 | ||
|
|
a166079084 | ||
|
|
a70d8fe6c8 | ||
|
|
34cd337146 | ||
|
|
9283594dd0 | ||
|
|
638246e74d | ||
|
|
f506407f67 | ||
|
|
216f201327 | ||
|
|
a557f2ada3 | ||
|
|
e15e4cc3c8 | ||
|
|
2555c46b6d | ||
|
|
fdfd59fbdf | ||
|
|
0e1c3f9364 | ||
|
|
f9bb18d97f | ||
|
|
b7339b6a35 | ||
|
|
26abc30695 | ||
|
|
1f0f824b01 |
4
.github/workflows/release.yml
vendored
4
.github/workflows/release.yml
vendored
@@ -54,8 +54,8 @@ jobs:
|
|||||||
## 更新日志
|
## 更新日志
|
||||||
修复了一些已知问题
|
修复了一些已知问题
|
||||||
|
|
||||||
## 加入我们的群
|
## 查看更多日志/获取最新动态
|
||||||
[点击加入 Telegram 群](https://t.me/+hn3QzNc4DbA0MzNl)
|
[点击加入 Telegram 频道](https://t.me/weflow_cc)
|
||||||
EOF
|
EOF
|
||||||
|
|
||||||
gh release edit "$GITHUB_REF_NAME" --notes-file release_notes.md
|
gh release edit "$GITHUB_REF_NAME" --notes-file release_notes.md
|
||||||
|
|||||||
5
.gitignore
vendored
5
.gitignore
vendored
@@ -57,4 +57,7 @@ Thumbs.db
|
|||||||
|
|
||||||
wcdb/
|
wcdb/
|
||||||
*info
|
*info
|
||||||
*.md
|
概述.md
|
||||||
|
chatlab-format.md
|
||||||
|
*.bak
|
||||||
|
AGENTS.md
|
||||||
29
README.md
29
README.md
@@ -20,8 +20,8 @@ WeFlow 是一个**完全本地**的微信**实时**聊天记录查看、分析
|
|||||||
<a href="https://github.com/hicccc77/WeFlow/issues">
|
<a href="https://github.com/hicccc77/WeFlow/issues">
|
||||||
<img src="https://img.shields.io/github/issues/hicccc77/WeFlow?style=flat-square" alt="Issues">
|
<img src="https://img.shields.io/github/issues/hicccc77/WeFlow?style=flat-square" alt="Issues">
|
||||||
</a>
|
</a>
|
||||||
<a href="https://t.me/+hn3QzNc4DbA0MzNl">
|
<a href="https://t.me/weflow_cc">
|
||||||
<img src="https://img.shields.io/badge/Telegram%20交流群-点击加入-0088cc?style=flat-square&logo=telegram&logoColor=0088cc&labelColor=white" alt="Telegram">
|
<img src="https://img.shields.io/badge/Telegram%20频道-0088cc?style=flat-square&logo=telegram&logoColor=0088cc&labelColor=white" alt="Telegram">
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
@@ -32,21 +32,28 @@ WeFlow 是一个**完全本地**的微信**实时**聊天记录查看、分析
|
|||||||
> [!NOTE]
|
> [!NOTE]
|
||||||
> 仅支持微信 **4.0 及以上**版本,确保你的微信版本符合要求
|
> 仅支持微信 **4.0 及以上**版本,确保你的微信版本符合要求
|
||||||
|
|
||||||
|
|
||||||
# 加入微信交流群
|
|
||||||
|
|
||||||
> 🎉 扫码加入微信群,与其他 WeFlow 用户一起交流问题和使用心得。
|
|
||||||
|
|
||||||
<p align="center">
|
|
||||||
<img src="mdassets/us.png" alt="WeFlow 微信交流群二维码" width="220" style="margin-right: 16px;"
|
|
||||||
</p>
|
|
||||||
|
|
||||||
## 主要功能
|
## 主要功能
|
||||||
|
|
||||||
- 本地实时查看聊天记录
|
- 本地实时查看聊天记录
|
||||||
- 统计分析与群聊画像
|
- 统计分析与群聊画像
|
||||||
- 年度报告与可视化概览
|
- 年度报告与可视化概览
|
||||||
- 导出聊天记录为 HTML 等格式
|
- 导出聊天记录为 HTML 等格式
|
||||||
|
- HTTP API 接口(供开发者集成)
|
||||||
|
|
||||||
|
|
||||||
|
## HTTP API
|
||||||
|
|
||||||
|
> [!WARNING]
|
||||||
|
> 此功能目前处于早期阶段,接口可能会有变动,请等待后续更新完善。
|
||||||
|
|
||||||
|
WeFlow 提供本地 HTTP API 服务,支持通过接口查询消息数据,可用于与其他工具集成或二次开发。
|
||||||
|
|
||||||
|
- **启用方式**:设置 → API 服务 → 启动服务
|
||||||
|
- **默认端口**:5031
|
||||||
|
- **访问地址**:`http://127.0.0.1:5031`
|
||||||
|
- **支持格式**:原始 JSON 或 [ChatLab](https://chatlab.fun/) 标准格式
|
||||||
|
|
||||||
|
📖 完整接口文档:[点击查看](docs/HTTP-API.md)
|
||||||
|
|
||||||
|
|
||||||
## 快速开始
|
## 快速开始
|
||||||
|
|||||||
312
docs/HTTP-API.md
Normal file
312
docs/HTTP-API.md
Normal file
@@ -0,0 +1,312 @@
|
|||||||
|
# WeFlow HTTP API 接口文档
|
||||||
|
|
||||||
|
WeFlow 提供 HTTP API 服务,支持通过 HTTP 接口查询消息数据,支持 [ChatLab](https://github.com/nichuanfang/chatlab-format) 标准化格式输出。
|
||||||
|
|
||||||
|
## 启用 API 服务
|
||||||
|
|
||||||
|
在设置页面 → API 服务 → 点击「启动服务」按钮。
|
||||||
|
|
||||||
|
默认端口:`5031`
|
||||||
|
|
||||||
|
## 基础地址
|
||||||
|
|
||||||
|
```
|
||||||
|
http://127.0.0.1:5031
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 接口列表
|
||||||
|
|
||||||
|
### 1. 健康检查
|
||||||
|
|
||||||
|
检查 API 服务是否正常运行。
|
||||||
|
|
||||||
|
**请求**
|
||||||
|
```
|
||||||
|
GET /health
|
||||||
|
```
|
||||||
|
|
||||||
|
**响应**
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"status": "ok"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 2. 获取消息列表
|
||||||
|
|
||||||
|
获取指定会话的消息,支持 ChatLab 格式输出。
|
||||||
|
|
||||||
|
**请求**
|
||||||
|
```
|
||||||
|
GET /api/v1/messages
|
||||||
|
```
|
||||||
|
|
||||||
|
**参数**
|
||||||
|
|
||||||
|
| 参数名 | 类型 | 必填 | 说明 |
|
||||||
|
|--------|------|------|------|
|
||||||
|
| `talker` | string | ✅ | 会话 ID(wxid 或群 ID) |
|
||||||
|
| `limit` | number | ❌ | 返回数量限制,默认 100 |
|
||||||
|
| `offset` | number | ❌ | 偏移量,用于分页,默认 0 |
|
||||||
|
| `start` | string | ❌ | 开始时间,格式 YYYYMMDD |
|
||||||
|
| `end` | string | ❌ | 结束时间,格式 YYYYMMDD |
|
||||||
|
| `chatlab` | string | ❌ | 设为 `1` 则输出 ChatLab 格式 |
|
||||||
|
| `format` | string | ❌ | 输出格式:`json`(默认)或 `chatlab` |
|
||||||
|
|
||||||
|
**示例请求**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 获取消息(原始格式)
|
||||||
|
GET http://127.0.0.1:5031/api/v1/messages?talker=wxid_xxx&limit=50
|
||||||
|
|
||||||
|
# 获取消息(ChatLab 格式)
|
||||||
|
GET http://127.0.0.1:5031/api/v1/messages?talker=wxid_xxx&chatlab=1
|
||||||
|
|
||||||
|
# 带时间范围查询
|
||||||
|
GET http://127.0.0.1:5031/api/v1/messages?talker=wxid_xxx&start=20260101&end=20260205&limit=100
|
||||||
|
```
|
||||||
|
|
||||||
|
**响应(原始格式)**
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"success": true,
|
||||||
|
"talker": "wxid_xxx",
|
||||||
|
"count": 50,
|
||||||
|
"hasMore": true,
|
||||||
|
"messages": [
|
||||||
|
{
|
||||||
|
"localId": 123,
|
||||||
|
"talker": "wxid_xxx",
|
||||||
|
"type": 1,
|
||||||
|
"content": "消息内容",
|
||||||
|
"createTime": 1738713600000,
|
||||||
|
"isSelf": false,
|
||||||
|
"sender": "wxid_sender"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**响应(ChatLab 格式)**
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"chatlab": {
|
||||||
|
"version": "0.0.2",
|
||||||
|
"exportedAt": 1738713600000,
|
||||||
|
"generator": "WeFlow",
|
||||||
|
"description": "Exported from WeFlow"
|
||||||
|
},
|
||||||
|
"meta": {
|
||||||
|
"name": "会话名称",
|
||||||
|
"platform": "wechat",
|
||||||
|
"type": "private",
|
||||||
|
"ownerId": "wxid_me"
|
||||||
|
},
|
||||||
|
"members": [
|
||||||
|
{
|
||||||
|
"platformId": "wxid_xxx",
|
||||||
|
"accountName": "用户名",
|
||||||
|
"groupNickname": "群昵称"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"messages": [
|
||||||
|
{
|
||||||
|
"sender": "wxid_xxx",
|
||||||
|
"accountName": "用户名",
|
||||||
|
"timestamp": 1738713600000,
|
||||||
|
"type": 0,
|
||||||
|
"content": "消息内容"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 3. 获取会话列表
|
||||||
|
|
||||||
|
获取所有会话列表。
|
||||||
|
|
||||||
|
**请求**
|
||||||
|
```
|
||||||
|
GET /api/v1/sessions
|
||||||
|
```
|
||||||
|
|
||||||
|
**参数**
|
||||||
|
|
||||||
|
| 参数名 | 类型 | 必填 | 说明 |
|
||||||
|
|--------|------|------|------|
|
||||||
|
| `keyword` | string | ❌ | 搜索关键词,匹配会话名或 ID |
|
||||||
|
| `limit` | number | ❌ | 返回数量限制,默认 100 |
|
||||||
|
|
||||||
|
**示例请求**
|
||||||
|
```bash
|
||||||
|
GET http://127.0.0.1:5031/api/v1/sessions
|
||||||
|
|
||||||
|
GET http://127.0.0.1:5031/api/v1/sessions?keyword=工作群&limit=20
|
||||||
|
```
|
||||||
|
|
||||||
|
**响应**
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"success": true,
|
||||||
|
"count": 50,
|
||||||
|
"total": 100,
|
||||||
|
"sessions": [
|
||||||
|
{
|
||||||
|
"username": "wxid_xxx",
|
||||||
|
"displayName": "用户名",
|
||||||
|
"lastMessage": "最后一条消息",
|
||||||
|
"lastTime": 1738713600000,
|
||||||
|
"unreadCount": 0
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 4. 获取联系人列表
|
||||||
|
|
||||||
|
获取所有联系人信息。
|
||||||
|
|
||||||
|
**请求**
|
||||||
|
```
|
||||||
|
GET /api/v1/contacts
|
||||||
|
```
|
||||||
|
|
||||||
|
**参数**
|
||||||
|
|
||||||
|
| 参数名 | 类型 | 必填 | 说明 |
|
||||||
|
|--------|------|------|------|
|
||||||
|
| `keyword` | string | ❌ | 搜索关键词 |
|
||||||
|
| `limit` | number | ❌ | 返回数量限制,默认 100 |
|
||||||
|
|
||||||
|
**示例请求**
|
||||||
|
```bash
|
||||||
|
GET http://127.0.0.1:5031/api/v1/contacts
|
||||||
|
|
||||||
|
GET http://127.0.0.1:5031/api/v1/contacts?keyword=张三
|
||||||
|
```
|
||||||
|
|
||||||
|
**响应**
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"success": true,
|
||||||
|
"count": 50,
|
||||||
|
"contacts": [
|
||||||
|
{
|
||||||
|
"userName": "wxid_xxx",
|
||||||
|
"alias": "微信号",
|
||||||
|
"nickName": "昵称",
|
||||||
|
"remark": "备注名"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## ChatLab 格式说明
|
||||||
|
|
||||||
|
ChatLab 是一种标准化的聊天记录交换格式,版本 0.0.2。
|
||||||
|
|
||||||
|
### 消息类型映射
|
||||||
|
|
||||||
|
| ChatLab Type | 值 | 说明 |
|
||||||
|
|--------------|-----|------|
|
||||||
|
| TEXT | 0 | 文本消息 |
|
||||||
|
| IMAGE | 1 | 图片 |
|
||||||
|
| VOICE | 2 | 语音 |
|
||||||
|
| VIDEO | 3 | 视频 |
|
||||||
|
| FILE | 4 | 文件 |
|
||||||
|
| EMOJI | 5 | 表情 |
|
||||||
|
| LINK | 7 | 链接 |
|
||||||
|
| LOCATION | 8 | 位置 |
|
||||||
|
| RED_PACKET | 20 | 红包 |
|
||||||
|
| TRANSFER | 21 | 转账 |
|
||||||
|
| CALL | 23 | 通话 |
|
||||||
|
| SYSTEM | 80 | 系统消息 |
|
||||||
|
| RECALL | 81 | 撤回消息 |
|
||||||
|
| OTHER | 99 | 其他 |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 使用示例
|
||||||
|
|
||||||
|
### PowerShell
|
||||||
|
|
||||||
|
```powershell
|
||||||
|
# 健康检查
|
||||||
|
Invoke-RestMethod http://127.0.0.1:5031/health
|
||||||
|
|
||||||
|
# 获取会话列表
|
||||||
|
Invoke-RestMethod http://127.0.0.1:5031/api/v1/sessions
|
||||||
|
|
||||||
|
# 获取消息
|
||||||
|
Invoke-RestMethod "http://127.0.0.1:5031/api/v1/messages?talker=wxid_xxx&limit=10"
|
||||||
|
|
||||||
|
# 获取 ChatLab 格式
|
||||||
|
Invoke-RestMethod "http://127.0.0.1:5031/api/v1/messages?talker=wxid_xxx&chatlab=1" | ConvertTo-Json -Depth 10
|
||||||
|
```
|
||||||
|
|
||||||
|
### cURL
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 健康检查
|
||||||
|
curl http://127.0.0.1:5031/health
|
||||||
|
|
||||||
|
# 获取会话列表
|
||||||
|
curl http://127.0.0.1:5031/api/v1/sessions
|
||||||
|
|
||||||
|
# 获取消息(ChatLab 格式)
|
||||||
|
curl "http://127.0.0.1:5031/api/v1/messages?talker=wxid_xxx&chatlab=1"
|
||||||
|
```
|
||||||
|
|
||||||
|
### Python
|
||||||
|
|
||||||
|
```python
|
||||||
|
import requests
|
||||||
|
|
||||||
|
BASE_URL = "http://127.0.0.1:5031"
|
||||||
|
|
||||||
|
# 获取会话列表
|
||||||
|
sessions = requests.get(f"{BASE_URL}/api/v1/sessions").json()
|
||||||
|
print(sessions)
|
||||||
|
|
||||||
|
# 获取消息
|
||||||
|
messages = requests.get(f"{BASE_URL}/api/v1/messages", params={
|
||||||
|
"talker": "wxid_xxx",
|
||||||
|
"limit": 100,
|
||||||
|
"chatlab": 1
|
||||||
|
}).json()
|
||||||
|
print(messages)
|
||||||
|
```
|
||||||
|
|
||||||
|
### JavaScript / Node.js
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
const BASE_URL = "http://127.0.0.1:5031";
|
||||||
|
|
||||||
|
// 获取会话列表
|
||||||
|
const sessions = await fetch(`${BASE_URL}/api/v1/sessions`).then(r => r.json());
|
||||||
|
console.log(sessions);
|
||||||
|
|
||||||
|
// 获取消息(ChatLab 格式)
|
||||||
|
const messages = await fetch(`${BASE_URL}/api/v1/messages?talker=wxid_xxx&chatlab=1`)
|
||||||
|
.then(r => r.json());
|
||||||
|
console.log(messages);
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 注意事项
|
||||||
|
|
||||||
|
1. API 仅监听本地地址 `127.0.0.1`,不对外网开放
|
||||||
|
2. 需要先连接数据库才能查询数据
|
||||||
|
3. 时间参数格式为 `YYYYMMDD`(如 20260205)
|
||||||
|
4. 支持 CORS,可从浏览器前端直接调用
|
||||||
@@ -21,7 +21,9 @@ import { videoService } from './services/videoService'
|
|||||||
import { snsService } from './services/snsService'
|
import { snsService } from './services/snsService'
|
||||||
import { contactExportService } from './services/contactExportService'
|
import { contactExportService } from './services/contactExportService'
|
||||||
import { windowsHelloService } from './services/windowsHelloService'
|
import { windowsHelloService } from './services/windowsHelloService'
|
||||||
|
import { llamaService } from './services/llamaService'
|
||||||
import { registerNotificationHandlers, showNotification } from './windows/notificationWindow'
|
import { registerNotificationHandlers, showNotification } from './windows/notificationWindow'
|
||||||
|
import { httpService } from './services/httpService'
|
||||||
|
|
||||||
|
|
||||||
// 配置自动更新
|
// 配置自动更新
|
||||||
@@ -800,10 +802,72 @@ function registerIpcHandlers() {
|
|||||||
return await chatService.getContact(username)
|
return await chatService.getContact(username)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// Llama AI
|
||||||
|
ipcMain.handle('llama:init', async () => {
|
||||||
|
return await llamaService.init()
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:loadModel', async (_, modelPath: string) => {
|
||||||
|
return llamaService.loadModel(modelPath)
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:createSession', async (_, systemPrompt?: string) => {
|
||||||
|
return llamaService.createSession(systemPrompt)
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:chat', async (event, message: string, options?: { thinking?: boolean }) => {
|
||||||
|
// We use a callback to stream back to the renderer
|
||||||
|
const webContents = event.sender
|
||||||
|
try {
|
||||||
|
if (!webContents) return { success: false, error: 'No sender' }
|
||||||
|
|
||||||
|
const response = await llamaService.chat(message, options, (token) => {
|
||||||
|
if (!webContents.isDestroyed()) {
|
||||||
|
webContents.send('llama:token', token)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return { success: true, response }
|
||||||
|
} catch (e) {
|
||||||
|
return { success: false, error: String(e) }
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:downloadModel', async (event, url: string, savePath: string) => {
|
||||||
|
const webContents = event.sender
|
||||||
|
try {
|
||||||
|
await llamaService.downloadModel(url, savePath, (payload) => {
|
||||||
|
if (!webContents.isDestroyed()) {
|
||||||
|
webContents.send('llama:downloadProgress', payload)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return { success: true }
|
||||||
|
} catch (e) {
|
||||||
|
return { success: false, error: String(e) }
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:getModelsPath', async () => {
|
||||||
|
return llamaService.getModelsPath()
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:checkFileExists', async (_, filePath: string) => {
|
||||||
|
const { existsSync } = await import('fs')
|
||||||
|
return existsSync(filePath)
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('llama:getModelStatus', async (_, modelPath: string) => {
|
||||||
|
return llamaService.getModelStatus(modelPath)
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
ipcMain.handle('chat:getContactAvatar', async (_, username: string) => {
|
ipcMain.handle('chat:getContactAvatar', async (_, username: string) => {
|
||||||
return await chatService.getContactAvatar(username)
|
return await chatService.getContactAvatar(username)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('chat:resolveTransferDisplayNames', async (_, chatroomId: string, payerUsername: string, receiverUsername: string) => {
|
||||||
|
return await chatService.resolveTransferDisplayNames(chatroomId, payerUsername, receiverUsername)
|
||||||
|
})
|
||||||
|
|
||||||
ipcMain.handle('chat:getContacts', async () => {
|
ipcMain.handle('chat:getContacts', async () => {
|
||||||
return await chatService.getContacts()
|
return await chatService.getContacts()
|
||||||
})
|
})
|
||||||
@@ -836,6 +900,9 @@ function registerIpcHandlers() {
|
|||||||
ipcMain.handle('chat:getVoiceData', async (_, sessionId: string, msgId: string, createTime?: number, serverId?: string | number) => {
|
ipcMain.handle('chat:getVoiceData', async (_, sessionId: string, msgId: string, createTime?: number, serverId?: string | number) => {
|
||||||
return chatService.getVoiceData(sessionId, msgId, createTime, serverId)
|
return chatService.getVoiceData(sessionId, msgId, createTime, serverId)
|
||||||
})
|
})
|
||||||
|
ipcMain.handle('chat:getAllVoiceMessages', async (_, sessionId: string) => {
|
||||||
|
return chatService.getAllVoiceMessages(sessionId)
|
||||||
|
})
|
||||||
ipcMain.handle('chat:resolveVoiceCache', async (_, sessionId: string, msgId: string) => {
|
ipcMain.handle('chat:resolveVoiceCache', async (_, sessionId: string, msgId: string) => {
|
||||||
return chatService.resolveVoiceCache(sessionId, msgId)
|
return chatService.resolveVoiceCache(sessionId, msgId)
|
||||||
})
|
})
|
||||||
@@ -892,6 +959,10 @@ function registerIpcHandlers() {
|
|||||||
})
|
})
|
||||||
|
|
||||||
// 导出相关
|
// 导出相关
|
||||||
|
ipcMain.handle('export:getExportStats', async (_, sessionIds: string[], options: any) => {
|
||||||
|
return exportService.getExportStats(sessionIds, options)
|
||||||
|
})
|
||||||
|
|
||||||
ipcMain.handle('export:exportSessions', async (event, sessionIds: string[], outputDir: string, options: ExportOptions) => {
|
ipcMain.handle('export:exportSessions', async (event, sessionIds: string[], outputDir: string, options: ExportOptions) => {
|
||||||
const onProgress = (progress: ExportProgress) => {
|
const onProgress = (progress: ExportProgress) => {
|
||||||
if (!event.sender.isDestroyed()) {
|
if (!event.sender.isDestroyed()) {
|
||||||
@@ -914,8 +985,8 @@ function registerIpcHandlers() {
|
|||||||
return analyticsService.getOverallStatistics(force)
|
return analyticsService.getOverallStatistics(force)
|
||||||
})
|
})
|
||||||
|
|
||||||
ipcMain.handle('analytics:getContactRankings', async (_, limit?: number) => {
|
ipcMain.handle('analytics:getContactRankings', async (_, limit?: number, beginTimestamp?: number, endTimestamp?: number) => {
|
||||||
return analyticsService.getContactRankings(limit)
|
return analyticsService.getContactRankings(limit, beginTimestamp, endTimestamp)
|
||||||
})
|
})
|
||||||
|
|
||||||
ipcMain.handle('analytics:getTimeDistribution', async () => {
|
ipcMain.handle('analytics:getTimeDistribution', async () => {
|
||||||
@@ -1223,6 +1294,23 @@ function registerIpcHandlers() {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// HTTP API 服务
|
||||||
|
ipcMain.handle('http:start', async (_, port?: number) => {
|
||||||
|
return httpService.start(port || 5031)
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('http:stop', async () => {
|
||||||
|
await httpService.stop()
|
||||||
|
return { success: true }
|
||||||
|
})
|
||||||
|
|
||||||
|
ipcMain.handle('http:status', async () => {
|
||||||
|
return {
|
||||||
|
running: httpService.isRunning(),
|
||||||
|
port: httpService.getPort()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 主窗口引用
|
// 主窗口引用
|
||||||
|
|||||||
@@ -131,6 +131,8 @@ contextBridge.exposeInMainWorld('electronAPI', {
|
|||||||
ipcRenderer.invoke('chat:getNewMessages', sessionId, minTime, limit),
|
ipcRenderer.invoke('chat:getNewMessages', sessionId, minTime, limit),
|
||||||
getContact: (username: string) => ipcRenderer.invoke('chat:getContact', username),
|
getContact: (username: string) => ipcRenderer.invoke('chat:getContact', username),
|
||||||
getContactAvatar: (username: string) => ipcRenderer.invoke('chat:getContactAvatar', username),
|
getContactAvatar: (username: string) => ipcRenderer.invoke('chat:getContactAvatar', username),
|
||||||
|
resolveTransferDisplayNames: (chatroomId: string, payerUsername: string, receiverUsername: string) =>
|
||||||
|
ipcRenderer.invoke('chat:resolveTransferDisplayNames', chatroomId, payerUsername, receiverUsername),
|
||||||
getMyAvatarUrl: () => ipcRenderer.invoke('chat:getMyAvatarUrl'),
|
getMyAvatarUrl: () => ipcRenderer.invoke('chat:getMyAvatarUrl'),
|
||||||
downloadEmoji: (cdnUrl: string, md5?: string) => ipcRenderer.invoke('chat:downloadEmoji', cdnUrl, md5),
|
downloadEmoji: (cdnUrl: string, md5?: string) => ipcRenderer.invoke('chat:downloadEmoji', cdnUrl, md5),
|
||||||
getCachedMessages: (sessionId: string) => ipcRenderer.invoke('chat:getCachedMessages', sessionId),
|
getCachedMessages: (sessionId: string) => ipcRenderer.invoke('chat:getCachedMessages', sessionId),
|
||||||
@@ -139,6 +141,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
|
|||||||
getImageData: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:getImageData', sessionId, msgId),
|
getImageData: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:getImageData', sessionId, msgId),
|
||||||
getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) =>
|
getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) =>
|
||||||
ipcRenderer.invoke('chat:getVoiceData', sessionId, msgId, createTime, serverId),
|
ipcRenderer.invoke('chat:getVoiceData', sessionId, msgId, createTime, serverId),
|
||||||
|
getAllVoiceMessages: (sessionId: string) => ipcRenderer.invoke('chat:getAllVoiceMessages', sessionId),
|
||||||
resolveVoiceCache: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:resolveVoiceCache', sessionId, msgId),
|
resolveVoiceCache: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:resolveVoiceCache', sessionId, msgId),
|
||||||
getVoiceTranscript: (sessionId: string, msgId: string, createTime?: number) => ipcRenderer.invoke('chat:getVoiceTranscript', sessionId, msgId, createTime),
|
getVoiceTranscript: (sessionId: string, msgId: string, createTime?: number) => ipcRenderer.invoke('chat:getVoiceTranscript', sessionId, msgId, createTime),
|
||||||
onVoiceTranscriptPartial: (callback: (payload: { msgId: string; text: string }) => void) => {
|
onVoiceTranscriptPartial: (callback: (payload: { msgId: string; text: string }) => void) => {
|
||||||
@@ -186,7 +189,8 @@ contextBridge.exposeInMainWorld('electronAPI', {
|
|||||||
// 数据分析
|
// 数据分析
|
||||||
analytics: {
|
analytics: {
|
||||||
getOverallStatistics: (force?: boolean) => ipcRenderer.invoke('analytics:getOverallStatistics', force),
|
getOverallStatistics: (force?: boolean) => ipcRenderer.invoke('analytics:getOverallStatistics', force),
|
||||||
getContactRankings: (limit?: number) => ipcRenderer.invoke('analytics:getContactRankings', limit),
|
getContactRankings: (limit?: number, beginTimestamp?: number, endTimestamp?: number) =>
|
||||||
|
ipcRenderer.invoke('analytics:getContactRankings', limit, beginTimestamp, endTimestamp),
|
||||||
getTimeDistribution: () => ipcRenderer.invoke('analytics:getTimeDistribution'),
|
getTimeDistribution: () => ipcRenderer.invoke('analytics:getTimeDistribution'),
|
||||||
getExcludedUsernames: () => ipcRenderer.invoke('analytics:getExcludedUsernames'),
|
getExcludedUsernames: () => ipcRenderer.invoke('analytics:getExcludedUsernames'),
|
||||||
setExcludedUsernames: (usernames: string[]) => ipcRenderer.invoke('analytics:setExcludedUsernames', usernames),
|
setExcludedUsernames: (usernames: string[]) => ipcRenderer.invoke('analytics:setExcludedUsernames', usernames),
|
||||||
@@ -236,6 +240,8 @@ contextBridge.exposeInMainWorld('electronAPI', {
|
|||||||
|
|
||||||
// 导出
|
// 导出
|
||||||
export: {
|
export: {
|
||||||
|
getExportStats: (sessionIds: string[], options: any) =>
|
||||||
|
ipcRenderer.invoke('export:getExportStats', sessionIds, options),
|
||||||
exportSessions: (sessionIds: string[], outputDir: string, options: any) =>
|
exportSessions: (sessionIds: string[], outputDir: string, options: any) =>
|
||||||
ipcRenderer.invoke('export:exportSessions', sessionIds, outputDir, options),
|
ipcRenderer.invoke('export:exportSessions', sessionIds, outputDir, options),
|
||||||
exportSession: (sessionId: string, outputPath: string, options: any) =>
|
exportSession: (sessionId: string, outputPath: string, options: any) =>
|
||||||
@@ -265,5 +271,33 @@ contextBridge.exposeInMainWorld('electronAPI', {
|
|||||||
ipcRenderer.invoke('sns:getTimeline', limit, offset, usernames, keyword, startTime, endTime),
|
ipcRenderer.invoke('sns:getTimeline', limit, offset, usernames, keyword, startTime, endTime),
|
||||||
debugResource: (url: string) => ipcRenderer.invoke('sns:debugResource', url),
|
debugResource: (url: string) => ipcRenderer.invoke('sns:debugResource', url),
|
||||||
proxyImage: (url: string) => ipcRenderer.invoke('sns:proxyImage', url)
|
proxyImage: (url: string) => ipcRenderer.invoke('sns:proxyImage', url)
|
||||||
|
},
|
||||||
|
|
||||||
|
// Llama AI
|
||||||
|
llama: {
|
||||||
|
loadModel: (modelPath: string) => ipcRenderer.invoke('llama:loadModel', modelPath),
|
||||||
|
createSession: (systemPrompt?: string) => ipcRenderer.invoke('llama:createSession', systemPrompt),
|
||||||
|
chat: (message: string, options?: any) => ipcRenderer.invoke('llama:chat', message, options),
|
||||||
|
downloadModel: (url: string, savePath: string) => ipcRenderer.invoke('llama:downloadModel', url, savePath),
|
||||||
|
getModelsPath: () => ipcRenderer.invoke('llama:getModelsPath'),
|
||||||
|
checkFileExists: (filePath: string) => ipcRenderer.invoke('llama:checkFileExists', filePath),
|
||||||
|
getModelStatus: (modelPath: string) => ipcRenderer.invoke('llama:getModelStatus', modelPath),
|
||||||
|
onToken: (callback: (token: string) => void) => {
|
||||||
|
const listener = (_: any, token: string) => callback(token)
|
||||||
|
ipcRenderer.on('llama:token', listener)
|
||||||
|
return () => ipcRenderer.removeListener('llama:token', listener)
|
||||||
|
},
|
||||||
|
onDownloadProgress: (callback: (payload: { downloaded: number; total: number; speed: number }) => void) => {
|
||||||
|
const listener = (_: any, payload: { downloaded: number; total: number; speed: number }) => callback(payload)
|
||||||
|
ipcRenderer.on('llama:downloadProgress', listener)
|
||||||
|
return () => ipcRenderer.removeListener('llama:downloadProgress', listener)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// HTTP API 服务
|
||||||
|
http: {
|
||||||
|
start: (port?: number) => ipcRenderer.invoke('http:start', port),
|
||||||
|
stop: () => ipcRenderer.invoke('http:stop'),
|
||||||
|
status: () => ipcRenderer.invoke('http:status')
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -31,6 +31,7 @@ export interface ContactRanking {
|
|||||||
username: string
|
username: string
|
||||||
displayName: string
|
displayName: string
|
||||||
avatarUrl?: string
|
avatarUrl?: string
|
||||||
|
wechatId?: string
|
||||||
messageCount: number
|
messageCount: number
|
||||||
sentCount: number
|
sentCount: number
|
||||||
receivedCount: number
|
receivedCount: number
|
||||||
@@ -576,7 +577,11 @@ class AnalyticsService {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async getContactRankings(limit: number = 20): Promise<{ success: boolean; data?: ContactRanking[]; error?: string }> {
|
async getContactRankings(
|
||||||
|
limit: number = 20,
|
||||||
|
beginTimestamp: number = 0,
|
||||||
|
endTimestamp: number = 0
|
||||||
|
): Promise<{ success: boolean; data?: ContactRanking[]; error?: string }> {
|
||||||
try {
|
try {
|
||||||
const conn = await this.ensureConnected()
|
const conn = await this.ensureConnected()
|
||||||
if (!conn.success || !conn.cleanedWxid) return { success: false, error: conn.error }
|
if (!conn.success || !conn.cleanedWxid) return { success: false, error: conn.error }
|
||||||
@@ -586,7 +591,7 @@ class AnalyticsService {
|
|||||||
return { success: false, error: '未找到消息会话' }
|
return { success: false, error: '未找到消息会话' }
|
||||||
}
|
}
|
||||||
|
|
||||||
const result = await this.getAggregateWithFallback(sessionInfo.usernames, 0, 0)
|
const result = await this.getAggregateWithFallback(sessionInfo.usernames, beginTimestamp, endTimestamp)
|
||||||
if (!result.success || !result.data) {
|
if (!result.success || !result.data) {
|
||||||
return { success: false, error: result.error || '聚合统计失败' }
|
return { success: false, error: result.error || '聚合统计失败' }
|
||||||
}
|
}
|
||||||
@@ -594,9 +599,10 @@ class AnalyticsService {
|
|||||||
const d = result.data
|
const d = result.data
|
||||||
const sessions = this.normalizeAggregateSessions(d.sessions, d.idMap)
|
const sessions = this.normalizeAggregateSessions(d.sessions, d.idMap)
|
||||||
const usernames = Object.keys(sessions)
|
const usernames = Object.keys(sessions)
|
||||||
const [displayNames, avatarUrls] = await Promise.all([
|
const [displayNames, avatarUrls, aliasMap] = await Promise.all([
|
||||||
wcdbService.getDisplayNames(usernames),
|
wcdbService.getDisplayNames(usernames),
|
||||||
wcdbService.getAvatarUrls(usernames)
|
wcdbService.getAvatarUrls(usernames),
|
||||||
|
this.getAliasMap(usernames)
|
||||||
])
|
])
|
||||||
|
|
||||||
const rankings: ContactRanking[] = usernames
|
const rankings: ContactRanking[] = usernames
|
||||||
@@ -608,10 +614,13 @@ class AnalyticsService {
|
|||||||
const avatarUrl = avatarUrls.success && avatarUrls.map
|
const avatarUrl = avatarUrls.success && avatarUrls.map
|
||||||
? avatarUrls.map[username]
|
? avatarUrls.map[username]
|
||||||
: undefined
|
: undefined
|
||||||
|
const alias = aliasMap[username] || ''
|
||||||
|
const wechatId = alias || (!username.startsWith('wxid_') ? username : '')
|
||||||
return {
|
return {
|
||||||
username,
|
username,
|
||||||
displayName,
|
displayName,
|
||||||
avatarUrl,
|
avatarUrl,
|
||||||
|
wechatId,
|
||||||
messageCount: stat.total,
|
messageCount: stat.total,
|
||||||
sentCount: stat.sent,
|
sentCount: stat.sent,
|
||||||
receivedCount: stat.received,
|
receivedCount: stat.received,
|
||||||
|
|||||||
@@ -193,11 +193,15 @@ class AnnualReportService {
|
|||||||
if (!raw) return ''
|
if (!raw) return ''
|
||||||
if (typeof raw === 'string') {
|
if (typeof raw === 'string') {
|
||||||
if (raw.length === 0) return ''
|
if (raw.length === 0) return ''
|
||||||
if (this.looksLikeHex(raw)) {
|
// 只有当字符串足够长(超过16字符)且看起来像 hex 时才尝试解码
|
||||||
|
// 短字符串(如 "123456" 等纯数字)容易被误判为 hex
|
||||||
|
if (raw.length > 16 && this.looksLikeHex(raw)) {
|
||||||
const bytes = Buffer.from(raw, 'hex')
|
const bytes = Buffer.from(raw, 'hex')
|
||||||
if (bytes.length > 0) return this.decodeBinaryContent(bytes)
|
if (bytes.length > 0) return this.decodeBinaryContent(bytes)
|
||||||
}
|
}
|
||||||
if (this.looksLikeBase64(raw)) {
|
// 只有当字符串足够长(超过16字符)且看起来像 base64 时才尝试解码
|
||||||
|
// 短字符串(如 "test", "home" 等)容易被误判为 base64
|
||||||
|
if (raw.length > 16 && this.looksLikeBase64(raw)) {
|
||||||
try {
|
try {
|
||||||
const bytes = Buffer.from(raw, 'base64')
|
const bytes = Buffer.from(raw, 'base64')
|
||||||
return this.decodeBinaryContent(bytes)
|
return this.decodeBinaryContent(bytes)
|
||||||
|
|||||||
@@ -117,10 +117,13 @@ class ChatService {
|
|||||||
private voiceWavCache = new Map<string, Buffer>()
|
private voiceWavCache = new Map<string, Buffer>()
|
||||||
private voiceTranscriptCache = new Map<string, string>()
|
private voiceTranscriptCache = new Map<string, string>()
|
||||||
private voiceTranscriptPending = new Map<string, Promise<{ success: boolean; transcript?: string; error?: string }>>()
|
private voiceTranscriptPending = new Map<string, Promise<{ success: boolean; transcript?: string; error?: string }>>()
|
||||||
|
private transcriptCacheLoaded = false
|
||||||
|
private transcriptCacheDirty = false
|
||||||
|
private transcriptFlushTimer: ReturnType<typeof setTimeout> | null = null
|
||||||
private mediaDbsCache: string[] | null = null
|
private mediaDbsCache: string[] | null = null
|
||||||
private mediaDbsCacheTime = 0
|
private mediaDbsCacheTime = 0
|
||||||
private readonly mediaDbsCacheTtl = 300000 // 5分钟
|
private readonly mediaDbsCacheTtl = 300000 // 5分钟
|
||||||
private readonly voiceCacheMaxEntries = 50
|
private readonly voiceWavCacheMaxEntries = 50
|
||||||
// 缓存 media.db 的表结构信息
|
// 缓存 media.db 的表结构信息
|
||||||
private mediaDbSchemaCache = new Map<string, {
|
private mediaDbSchemaCache = new Map<string, {
|
||||||
voiceTable: string
|
voiceTable: string
|
||||||
@@ -1120,6 +1123,9 @@ class ChatService {
|
|||||||
// 名片消息
|
// 名片消息
|
||||||
let cardUsername: string | undefined
|
let cardUsername: string | undefined
|
||||||
let cardNickname: string | undefined
|
let cardNickname: string | undefined
|
||||||
|
// 转账消息
|
||||||
|
let transferPayerUsername: string | undefined
|
||||||
|
let transferReceiverUsername: string | undefined
|
||||||
// 聊天记录
|
// 聊天记录
|
||||||
let chatRecordTitle: string | undefined
|
let chatRecordTitle: string | undefined
|
||||||
let chatRecordList: Array<{
|
let chatRecordList: Array<{
|
||||||
@@ -1151,8 +1157,8 @@ class ChatService {
|
|||||||
const cardInfo = this.parseCardInfo(content)
|
const cardInfo = this.parseCardInfo(content)
|
||||||
cardUsername = cardInfo.username
|
cardUsername = cardInfo.username
|
||||||
cardNickname = cardInfo.nickname
|
cardNickname = cardInfo.nickname
|
||||||
} else if (localType === 49 && content) {
|
} else if ((localType === 49 || localType === 8589934592049) && content) {
|
||||||
// Type 49 消息(链接、文件、小程序、转账等)
|
// Type 49 消息(链接、文件、小程序、转账等),8589934592049 也是转账类型
|
||||||
const type49Info = this.parseType49Message(content)
|
const type49Info = this.parseType49Message(content)
|
||||||
xmlType = type49Info.xmlType
|
xmlType = type49Info.xmlType
|
||||||
linkTitle = type49Info.linkTitle
|
linkTitle = type49Info.linkTitle
|
||||||
@@ -1163,6 +1169,8 @@ class ChatService {
|
|||||||
fileExt = type49Info.fileExt
|
fileExt = type49Info.fileExt
|
||||||
chatRecordTitle = type49Info.chatRecordTitle
|
chatRecordTitle = type49Info.chatRecordTitle
|
||||||
chatRecordList = type49Info.chatRecordList
|
chatRecordList = type49Info.chatRecordList
|
||||||
|
transferPayerUsername = type49Info.transferPayerUsername
|
||||||
|
transferReceiverUsername = type49Info.transferReceiverUsername
|
||||||
} else if (localType === 244813135921 || (content && content.includes('<type>57</type>'))) {
|
} else if (localType === 244813135921 || (content && content.includes('<type>57</type>'))) {
|
||||||
const quoteInfo = this.parseQuoteMessage(content)
|
const quoteInfo = this.parseQuoteMessage(content)
|
||||||
quotedContent = quoteInfo.content
|
quotedContent = quoteInfo.content
|
||||||
@@ -1199,6 +1207,8 @@ class ChatService {
|
|||||||
xmlType,
|
xmlType,
|
||||||
cardUsername,
|
cardUsername,
|
||||||
cardNickname,
|
cardNickname,
|
||||||
|
transferPayerUsername,
|
||||||
|
transferReceiverUsername,
|
||||||
chatRecordTitle,
|
chatRecordTitle,
|
||||||
chatRecordList
|
chatRecordList
|
||||||
})
|
})
|
||||||
@@ -1268,6 +1278,15 @@ class ChatService {
|
|||||||
case 8589934592049:
|
case 8589934592049:
|
||||||
return '[转账]'
|
return '[转账]'
|
||||||
default:
|
default:
|
||||||
|
// 检查是否是 type=87 的群公告消息
|
||||||
|
if (xmlType === '87') {
|
||||||
|
const textAnnouncement = this.extractXmlValue(content, 'textannouncement')
|
||||||
|
if (textAnnouncement) {
|
||||||
|
return `[群公告] ${textAnnouncement}`
|
||||||
|
}
|
||||||
|
return '[群公告]'
|
||||||
|
}
|
||||||
|
|
||||||
// 检查是否是 type=57 的引用消息
|
// 检查是否是 type=57 的引用消息
|
||||||
if (xmlType === '57') {
|
if (xmlType === '57') {
|
||||||
const title = this.extractXmlValue(content, 'title')
|
const title = this.extractXmlValue(content, 'title')
|
||||||
@@ -1291,6 +1310,15 @@ class ChatService {
|
|||||||
const title = this.extractXmlValue(content, 'title')
|
const title = this.extractXmlValue(content, 'title')
|
||||||
const type = this.extractXmlValue(content, 'type')
|
const type = this.extractXmlValue(content, 'type')
|
||||||
|
|
||||||
|
// 群公告消息(type 87)特殊处理
|
||||||
|
if (type === '87') {
|
||||||
|
const textAnnouncement = this.extractXmlValue(content, 'textannouncement')
|
||||||
|
if (textAnnouncement) {
|
||||||
|
return `[群公告] ${textAnnouncement}`
|
||||||
|
}
|
||||||
|
return '[群公告]'
|
||||||
|
}
|
||||||
|
|
||||||
if (title) {
|
if (title) {
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case '5':
|
case '5':
|
||||||
@@ -1324,6 +1352,8 @@ class ChatService {
|
|||||||
return '[小程序]'
|
return '[小程序]'
|
||||||
case '2000':
|
case '2000':
|
||||||
return '[转账]'
|
return '[转账]'
|
||||||
|
case '87':
|
||||||
|
return '[群公告]'
|
||||||
default:
|
default:
|
||||||
return '[消息]'
|
return '[消息]'
|
||||||
}
|
}
|
||||||
@@ -1643,6 +1673,8 @@ class ChatService {
|
|||||||
fileName?: string
|
fileName?: string
|
||||||
fileSize?: number
|
fileSize?: number
|
||||||
fileExt?: string
|
fileExt?: string
|
||||||
|
transferPayerUsername?: string
|
||||||
|
transferReceiverUsername?: string
|
||||||
chatRecordTitle?: string
|
chatRecordTitle?: string
|
||||||
chatRecordList?: Array<{
|
chatRecordList?: Array<{
|
||||||
datatype: number
|
datatype: number
|
||||||
@@ -1766,6 +1798,16 @@ class ChatService {
|
|||||||
} else if (feedesc) {
|
} else if (feedesc) {
|
||||||
result.linkTitle = feedesc
|
result.linkTitle = feedesc
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 提取转账双方 wxid
|
||||||
|
const payerUsername = this.extractXmlValue(content, 'payer_username')
|
||||||
|
const receiverUsername = this.extractXmlValue(content, 'receiver_username')
|
||||||
|
if (payerUsername) {
|
||||||
|
result.transferPayerUsername = payerUsername
|
||||||
|
}
|
||||||
|
if (receiverUsername) {
|
||||||
|
result.transferReceiverUsername = receiverUsername
|
||||||
|
}
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -2148,19 +2190,32 @@ class ChatService {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* 清理拍一拍消息
|
* 清理拍一拍消息
|
||||||
* 格式示例: 我拍了拍 "梨绒" ງ໐໐໓ ຖiງht620000wxid_...
|
* 格式示例:
|
||||||
|
* 纯文本: 我拍了拍 "梨绒" ງ໐໐໓ ຖiງht620000wxid_...
|
||||||
|
* XML: <msg><appmsg...><title>"有幸"拍了拍"浩天空"相信未来!</title>...</msg>
|
||||||
*/
|
*/
|
||||||
private cleanPatMessage(content: string): string {
|
private cleanPatMessage(content: string): string {
|
||||||
if (!content) return '[拍一拍]'
|
if (!content) return '[拍一拍]'
|
||||||
|
|
||||||
// 1. 尝试匹配标准的 "A拍了拍B" 格式
|
// 1. 优先从 XML <title> 标签提取内容
|
||||||
// 这里的正则比较宽泛,为了兼容不同的语言环境
|
const titleMatch = /<title>([\s\S]*?)<\/title>/i.exec(content)
|
||||||
|
if (titleMatch) {
|
||||||
|
const title = titleMatch[1]
|
||||||
|
.replace(/<!\[CDATA\[/g, '')
|
||||||
|
.replace(/\]\]>/g, '')
|
||||||
|
.trim()
|
||||||
|
if (title) {
|
||||||
|
return `[拍一拍] ${title}`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 2. 尝试匹配标准的 "A拍了拍B" 格式
|
||||||
const match = /^(.+?拍了拍.+?)(?:[\r\n]|$|ງ|wxid_)/.exec(content)
|
const match = /^(.+?拍了拍.+?)(?:[\r\n]|$|ງ|wxid_)/.exec(content)
|
||||||
if (match) {
|
if (match) {
|
||||||
return `[拍一拍] ${match[1].trim()}`
|
return `[拍一拍] ${match[1].trim()}`
|
||||||
}
|
}
|
||||||
|
|
||||||
// 2. 如果匹配失败,尝试清理掉疑似的 garbage (wxid, 乱码)
|
// 3. 如果匹配失败,尝试清理掉疑似的 garbage (wxid, 乱码)
|
||||||
let cleaned = content.replace(/wxid_[a-zA-Z0-9_-]+/g, '') // 移除 wxid
|
let cleaned = content.replace(/wxid_[a-zA-Z0-9_-]+/g, '') // 移除 wxid
|
||||||
cleaned = cleaned.replace(/[ງ໐໓ຖiht]+/g, ' ') // 移除已知的乱码字符
|
cleaned = cleaned.replace(/[ງ໐໓ຖiht]+/g, ' ') // 移除已知的乱码字符
|
||||||
cleaned = cleaned.replace(/\d{6,}/g, '') // 移除长数字
|
cleaned = cleaned.replace(/\d{6,}/g, '') // 移除长数字
|
||||||
@@ -2207,7 +2262,9 @@ class ChatService {
|
|||||||
if (raw.length === 0) return ''
|
if (raw.length === 0) return ''
|
||||||
|
|
||||||
// 检查是否是 hex 编码
|
// 检查是否是 hex 编码
|
||||||
if (this.looksLikeHex(raw)) {
|
// 只有当字符串足够长(超过16字符)且看起来像 hex 时才尝试解码
|
||||||
|
// 短字符串(如 "123456" 等纯数字)容易被误判为 hex
|
||||||
|
if (raw.length > 16 && this.looksLikeHex(raw)) {
|
||||||
const bytes = Buffer.from(raw, 'hex')
|
const bytes = Buffer.from(raw, 'hex')
|
||||||
if (bytes.length > 0) {
|
if (bytes.length > 0) {
|
||||||
const result = this.decodeBinaryContent(bytes, raw)
|
const result = this.decodeBinaryContent(bytes, raw)
|
||||||
@@ -2217,7 +2274,9 @@ class ChatService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 检查是否是 base64 编码
|
// 检查是否是 base64 编码
|
||||||
if (this.looksLikeBase64(raw)) {
|
// 只有当字符串足够长(超过16字符)且看起来像 base64 时才尝试解码
|
||||||
|
// 短字符串(如 "test", "home" 等)容易被误判为 base64
|
||||||
|
if (raw.length > 16 && this.looksLikeBase64(raw)) {
|
||||||
try {
|
try {
|
||||||
const bytes = Buffer.from(raw, 'base64')
|
const bytes = Buffer.from(raw, 'base64')
|
||||||
return this.decodeBinaryContent(bytes, raw)
|
return this.decodeBinaryContent(bytes, raw)
|
||||||
@@ -2364,6 +2423,75 @@ class ChatService {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 解析转账消息中的付款方和收款方显示名称
|
||||||
|
* 优先使用群昵称,群昵称为空时回退到微信昵称/备注
|
||||||
|
*/
|
||||||
|
async resolveTransferDisplayNames(
|
||||||
|
chatroomId: string,
|
||||||
|
payerUsername: string,
|
||||||
|
receiverUsername: string
|
||||||
|
): Promise<{ payerName: string; receiverName: string }> {
|
||||||
|
try {
|
||||||
|
const connectResult = await this.ensureConnected()
|
||||||
|
if (!connectResult.success) {
|
||||||
|
return { payerName: payerUsername, receiverName: receiverUsername }
|
||||||
|
}
|
||||||
|
|
||||||
|
// 如果是群聊,尝试获取群昵称
|
||||||
|
let groupNicknames: Record<string, string> = {}
|
||||||
|
if (chatroomId.endsWith('@chatroom')) {
|
||||||
|
const nickResult = await wcdbService.getGroupNicknames(chatroomId)
|
||||||
|
if (nickResult.success && nickResult.nicknames) {
|
||||||
|
groupNicknames = nickResult.nicknames
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取当前用户 wxid,用于识别"自己"
|
||||||
|
const myWxid = this.configService.get('myWxid')
|
||||||
|
const cleanedMyWxid = myWxid ? this.cleanAccountDirName(myWxid) : ''
|
||||||
|
|
||||||
|
// 解析付款方名称:自己 > 群昵称 > 备注 > 昵称 > alias > wxid
|
||||||
|
const resolveName = async (username: string): Promise<string> => {
|
||||||
|
// 特判:如果是当前用户自己(contact 表通常不包含自己)
|
||||||
|
if (myWxid && (username === myWxid || username === cleanedMyWxid)) {
|
||||||
|
// 先查群昵称中是否有自己
|
||||||
|
const myGroupNick = groupNicknames[username]
|
||||||
|
if (myGroupNick) return myGroupNick
|
||||||
|
// 尝试从缓存获取自己的昵称
|
||||||
|
const cached = this.avatarCache.get(username) || this.avatarCache.get(myWxid)
|
||||||
|
if (cached?.displayName) return cached.displayName
|
||||||
|
return '我'
|
||||||
|
}
|
||||||
|
|
||||||
|
// 先查群昵称
|
||||||
|
const groupNick = groupNicknames[username]
|
||||||
|
if (groupNick) return groupNick
|
||||||
|
|
||||||
|
// 再查联系人信息
|
||||||
|
const contact = await this.getContact(username)
|
||||||
|
if (contact) {
|
||||||
|
return contact.remark || contact.nickName || contact.alias || username
|
||||||
|
}
|
||||||
|
|
||||||
|
// 兜底:查缓存
|
||||||
|
const cached = this.avatarCache.get(username)
|
||||||
|
if (cached?.displayName) return cached.displayName
|
||||||
|
|
||||||
|
return username
|
||||||
|
}
|
||||||
|
|
||||||
|
const [payerName, receiverName] = await Promise.all([
|
||||||
|
resolveName(payerUsername),
|
||||||
|
resolveName(receiverUsername)
|
||||||
|
])
|
||||||
|
|
||||||
|
return { payerName, receiverName }
|
||||||
|
} catch {
|
||||||
|
return { payerName: payerUsername, receiverName: receiverUsername }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取当前用户的头像 URL
|
* 获取当前用户的头像 URL
|
||||||
*/
|
*/
|
||||||
@@ -3386,6 +3514,8 @@ class ChatService {
|
|||||||
): Promise<{ success: boolean; transcript?: string; error?: string }> {
|
): Promise<{ success: boolean; transcript?: string; error?: string }> {
|
||||||
const startTime = Date.now()
|
const startTime = Date.now()
|
||||||
|
|
||||||
|
// 确保磁盘缓存已加载
|
||||||
|
this.loadTranscriptCacheIfNeeded()
|
||||||
|
|
||||||
try {
|
try {
|
||||||
let msgCreateTime = createTime
|
let msgCreateTime = createTime
|
||||||
@@ -3513,17 +3643,136 @@ class ChatService {
|
|||||||
|
|
||||||
private cacheVoiceWav(cacheKey: string, wavData: Buffer): void {
|
private cacheVoiceWav(cacheKey: string, wavData: Buffer): void {
|
||||||
this.voiceWavCache.set(cacheKey, wavData)
|
this.voiceWavCache.set(cacheKey, wavData)
|
||||||
if (this.voiceWavCache.size > this.voiceCacheMaxEntries) {
|
if (this.voiceWavCache.size > this.voiceWavCacheMaxEntries) {
|
||||||
const oldestKey = this.voiceWavCache.keys().next().value
|
const oldestKey = this.voiceWavCache.keys().next().value
|
||||||
if (oldestKey) this.voiceWavCache.delete(oldestKey)
|
if (oldestKey) this.voiceWavCache.delete(oldestKey)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 获取持久化转写缓存文件路径 */
|
||||||
|
private getTranscriptCachePath(): string {
|
||||||
|
const cachePath = this.configService.get('cachePath')
|
||||||
|
const base = cachePath || join(app.getPath('documents'), 'WeFlow')
|
||||||
|
return join(base, 'Voices', 'transcripts.json')
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 首次访问时从磁盘加载转写缓存 */
|
||||||
|
private loadTranscriptCacheIfNeeded(): void {
|
||||||
|
if (this.transcriptCacheLoaded) return
|
||||||
|
this.transcriptCacheLoaded = true
|
||||||
|
try {
|
||||||
|
const filePath = this.getTranscriptCachePath()
|
||||||
|
if (existsSync(filePath)) {
|
||||||
|
const raw = readFileSync(filePath, 'utf-8')
|
||||||
|
const data = JSON.parse(raw) as Record<string, string>
|
||||||
|
for (const [k, v] of Object.entries(data)) {
|
||||||
|
if (typeof v === 'string') this.voiceTranscriptCache.set(k, v)
|
||||||
|
}
|
||||||
|
console.log(`[Transcribe] 从磁盘加载了 ${this.voiceTranscriptCache.size} 条转写缓存`)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[Transcribe] 加载转写缓存失败:', e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 将转写缓存持久化到磁盘(防抖 3 秒) */
|
||||||
|
private scheduleTranscriptFlush(): void {
|
||||||
|
if (this.transcriptFlushTimer) return
|
||||||
|
this.transcriptFlushTimer = setTimeout(() => {
|
||||||
|
this.transcriptFlushTimer = null
|
||||||
|
this.flushTranscriptCache()
|
||||||
|
}, 3000)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 立即写入转写缓存到磁盘 */
|
||||||
|
flushTranscriptCache(): void {
|
||||||
|
if (!this.transcriptCacheDirty) return
|
||||||
|
try {
|
||||||
|
const filePath = this.getTranscriptCachePath()
|
||||||
|
const dir = dirname(filePath)
|
||||||
|
if (!existsSync(dir)) mkdirSync(dir, { recursive: true })
|
||||||
|
const obj: Record<string, string> = {}
|
||||||
|
for (const [k, v] of this.voiceTranscriptCache) obj[k] = v
|
||||||
|
writeFileSync(filePath, JSON.stringify(obj), 'utf-8')
|
||||||
|
this.transcriptCacheDirty = false
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[Transcribe] 写入转写缓存失败:', e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
private cacheVoiceTranscript(cacheKey: string, transcript: string): void {
|
private cacheVoiceTranscript(cacheKey: string, transcript: string): void {
|
||||||
this.voiceTranscriptCache.set(cacheKey, transcript)
|
this.voiceTranscriptCache.set(cacheKey, transcript)
|
||||||
if (this.voiceTranscriptCache.size > this.voiceCacheMaxEntries) {
|
this.transcriptCacheDirty = true
|
||||||
const oldestKey = this.voiceTranscriptCache.keys().next().value
|
this.scheduleTranscriptFlush()
|
||||||
if (oldestKey) this.voiceTranscriptCache.delete(oldestKey)
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 检查某个语音消息是否已有缓存的转写结果
|
||||||
|
*/
|
||||||
|
hasTranscriptCache(sessionId: string, msgId: string, createTime?: number): boolean {
|
||||||
|
this.loadTranscriptCacheIfNeeded()
|
||||||
|
const cacheKey = this.getVoiceCacheKey(sessionId, msgId, createTime)
|
||||||
|
return this.voiceTranscriptCache.has(cacheKey)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取某会话的所有语音消息(localType=34),用于批量转写
|
||||||
|
*/
|
||||||
|
async getAllVoiceMessages(sessionId: string): Promise<{ success: boolean; messages?: Message[]; error?: string }> {
|
||||||
|
try {
|
||||||
|
const connectResult = await this.ensureConnected()
|
||||||
|
if (!connectResult.success) {
|
||||||
|
return { success: false, error: connectResult.error || '数据库未连接' }
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取会话表信息
|
||||||
|
let tables = this.sessionTablesCache.get(sessionId)
|
||||||
|
if (!tables) {
|
||||||
|
const tableStats = await wcdbService.getMessageTableStats(sessionId)
|
||||||
|
if (!tableStats.success || !tableStats.tables || tableStats.tables.length === 0) {
|
||||||
|
return { success: false, error: '未找到会话消息表' }
|
||||||
|
}
|
||||||
|
tables = tableStats.tables
|
||||||
|
.map(t => ({ tableName: t.table_name || t.name, dbPath: t.db_path }))
|
||||||
|
.filter(t => t.tableName && t.dbPath) as Array<{ tableName: string; dbPath: string }>
|
||||||
|
if (tables.length > 0) {
|
||||||
|
this.sessionTablesCache.set(sessionId, tables)
|
||||||
|
setTimeout(() => { this.sessionTablesCache.delete(sessionId) }, this.sessionTablesCacheTtl)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let allVoiceMessages: Message[] = []
|
||||||
|
|
||||||
|
for (const { tableName, dbPath } of tables) {
|
||||||
|
try {
|
||||||
|
const sql = `SELECT * FROM ${tableName} WHERE local_type = 34 ORDER BY create_time DESC`
|
||||||
|
const result = await wcdbService.execQuery('message', dbPath, sql)
|
||||||
|
if (result.success && result.rows && result.rows.length > 0) {
|
||||||
|
const mapped = this.mapRowsToMessages(result.rows as Record<string, any>[])
|
||||||
|
allVoiceMessages.push(...mapped)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error(`[ChatService] 查询语音消息失败 (${dbPath}):`, e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 按 createTime 降序排序
|
||||||
|
allVoiceMessages.sort((a, b) => b.createTime - a.createTime)
|
||||||
|
|
||||||
|
// 去重
|
||||||
|
const seen = new Set<string>()
|
||||||
|
allVoiceMessages = allVoiceMessages.filter(msg => {
|
||||||
|
const key = `${msg.serverId}-${msg.localId}-${msg.createTime}-${msg.sortSeq}`
|
||||||
|
if (seen.has(key)) return false
|
||||||
|
seen.add(key)
|
||||||
|
return true
|
||||||
|
})
|
||||||
|
|
||||||
|
console.log(`[ChatService] 共找到 ${allVoiceMessages.length} 条语音消息(去重后)`)
|
||||||
|
return { success: true, messages: allVoiceMessages }
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[ChatService] 获取所有语音消息失败:', e)
|
||||||
|
return { success: false, error: String(e) }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -6,6 +6,9 @@ export interface DualReportMessage {
|
|||||||
isSentByMe: boolean
|
isSentByMe: boolean
|
||||||
createTime: number
|
createTime: number
|
||||||
createTimeStr: string
|
createTimeStr: string
|
||||||
|
localType?: number
|
||||||
|
emojiMd5?: string
|
||||||
|
emojiCdnUrl?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DualReportFirstChat {
|
export interface DualReportFirstChat {
|
||||||
@@ -14,6 +17,9 @@ export interface DualReportFirstChat {
|
|||||||
content: string
|
content: string
|
||||||
isSentByMe: boolean
|
isSentByMe: boolean
|
||||||
senderUsername?: string
|
senderUsername?: string
|
||||||
|
localType?: number
|
||||||
|
emojiMd5?: string
|
||||||
|
emojiCdnUrl?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DualReportStats {
|
export interface DualReportStats {
|
||||||
@@ -26,13 +32,17 @@ export interface DualReportStats {
|
|||||||
friendTopEmojiMd5?: string
|
friendTopEmojiMd5?: string
|
||||||
myTopEmojiUrl?: string
|
myTopEmojiUrl?: string
|
||||||
friendTopEmojiUrl?: string
|
friendTopEmojiUrl?: string
|
||||||
|
myTopEmojiCount?: number
|
||||||
|
friendTopEmojiCount?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DualReportData {
|
export interface DualReportData {
|
||||||
year: number
|
year: number
|
||||||
selfName: string
|
selfName: string
|
||||||
|
selfAvatarUrl?: string
|
||||||
friendUsername: string
|
friendUsername: string
|
||||||
friendName: string
|
friendName: string
|
||||||
|
friendAvatarUrl?: string
|
||||||
firstChat: DualReportFirstChat | null
|
firstChat: DualReportFirstChat | null
|
||||||
firstChatMessages?: DualReportMessage[]
|
firstChatMessages?: DualReportMessage[]
|
||||||
yearFirstChat?: {
|
yearFirstChat?: {
|
||||||
@@ -42,9 +52,17 @@ export interface DualReportData {
|
|||||||
isSentByMe: boolean
|
isSentByMe: boolean
|
||||||
friendName: string
|
friendName: string
|
||||||
firstThreeMessages: DualReportMessage[]
|
firstThreeMessages: DualReportMessage[]
|
||||||
|
localType?: number
|
||||||
|
emojiMd5?: string
|
||||||
|
emojiCdnUrl?: string
|
||||||
} | null
|
} | null
|
||||||
stats: DualReportStats
|
stats: DualReportStats
|
||||||
topPhrases: Array<{ phrase: string; count: number }>
|
topPhrases: Array<{ phrase: string; count: number }>
|
||||||
|
heatmap?: number[][]
|
||||||
|
initiative?: { initiated: number; received: number }
|
||||||
|
response?: { avg: number; fastest: number; count: number }
|
||||||
|
monthly?: Record<string, number>
|
||||||
|
streak?: { days: number; startDate: string; endDate: string }
|
||||||
}
|
}
|
||||||
|
|
||||||
class DualReportService {
|
class DualReportService {
|
||||||
@@ -75,7 +93,7 @@ class DualReportService {
|
|||||||
}
|
}
|
||||||
const suffixMatch = trimmed.match(/^(.+)_([a-zA-Z0-9]{4})$/)
|
const suffixMatch = trimmed.match(/^(.+)_([a-zA-Z0-9]{4})$/)
|
||||||
const cleaned = suffixMatch ? suffixMatch[1] : trimmed
|
const cleaned = suffixMatch ? suffixMatch[1] : trimmed
|
||||||
|
|
||||||
return cleaned
|
return cleaned
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -106,11 +124,15 @@ class DualReportService {
|
|||||||
if (!raw) return ''
|
if (!raw) return ''
|
||||||
if (typeof raw === 'string') {
|
if (typeof raw === 'string') {
|
||||||
if (raw.length === 0) return ''
|
if (raw.length === 0) return ''
|
||||||
if (this.looksLikeHex(raw)) {
|
// 只有当字符串足够长(超过16字符)且看起来像 hex 时才尝试解码
|
||||||
|
// 短字符串(如 "123456" 等纯数字)容易被误判为 hex
|
||||||
|
if (raw.length > 16 && this.looksLikeHex(raw)) {
|
||||||
const bytes = Buffer.from(raw, 'hex')
|
const bytes = Buffer.from(raw, 'hex')
|
||||||
if (bytes.length > 0) return this.decodeBinaryContent(bytes)
|
if (bytes.length > 0) return this.decodeBinaryContent(bytes)
|
||||||
}
|
}
|
||||||
if (this.looksLikeBase64(raw)) {
|
// 只有当字符串足够长(超过16字符)且看起来像 base64 时才尝试解码
|
||||||
|
// 短字符串(如 "test", "home" 等)容易被误判为 base64
|
||||||
|
if (raw.length > 16 && this.looksLikeBase64(raw)) {
|
||||||
try {
|
try {
|
||||||
const bytes = Buffer.from(raw, 'base64')
|
const bytes = Buffer.from(raw, 'base64')
|
||||||
return this.decodeBinaryContent(bytes)
|
return this.decodeBinaryContent(bytes)
|
||||||
@@ -164,26 +186,258 @@ class DualReportService {
|
|||||||
return `${month}/${day} ${hour}:${minute}`
|
return `${month}/${day} ${hour}:${minute}`
|
||||||
}
|
}
|
||||||
|
|
||||||
private extractEmojiUrl(content: string): string | undefined {
|
private getRecordField(record: Record<string, any> | undefined | null, keys: string[]): any {
|
||||||
if (!content) return undefined
|
if (!record) return undefined
|
||||||
const attrMatch = /cdnurl\s*=\s*['"]([^'"]+)['"]/i.exec(content)
|
for (const key of keys) {
|
||||||
if (attrMatch) {
|
if (Object.prototype.hasOwnProperty.call(record, key) && record[key] !== undefined && record[key] !== null) {
|
||||||
let url = attrMatch[1].replace(/&/g, '&')
|
return record[key]
|
||||||
try {
|
}
|
||||||
if (url.includes('%')) {
|
|
||||||
url = decodeURIComponent(url)
|
|
||||||
}
|
|
||||||
} catch { }
|
|
||||||
return url
|
|
||||||
}
|
}
|
||||||
const tagMatch = /cdnurl[^>]*>([^<]+)/i.exec(content)
|
return undefined
|
||||||
return tagMatch?.[1]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private extractEmojiMd5(content: string): string | undefined {
|
private coerceNumber(raw: any): number {
|
||||||
|
if (raw === undefined || raw === null || raw === '') return NaN
|
||||||
|
if (typeof raw === 'number') return raw
|
||||||
|
if (typeof raw === 'bigint') return Number(raw)
|
||||||
|
if (Buffer.isBuffer(raw)) return parseInt(raw.toString('utf-8'), 10)
|
||||||
|
if (raw instanceof Uint8Array) return parseInt(Buffer.from(raw).toString('utf-8'), 10)
|
||||||
|
const parsed = parseInt(String(raw), 10)
|
||||||
|
return Number.isFinite(parsed) ? parsed : NaN
|
||||||
|
}
|
||||||
|
|
||||||
|
private coerceString(raw: any): string {
|
||||||
|
if (raw === undefined || raw === null) return ''
|
||||||
|
if (typeof raw === 'string') return raw
|
||||||
|
if (Buffer.isBuffer(raw)) return this.decodeBinaryContent(raw)
|
||||||
|
if (raw instanceof Uint8Array) return this.decodeBinaryContent(Buffer.from(raw))
|
||||||
|
return String(raw)
|
||||||
|
}
|
||||||
|
|
||||||
|
private coerceBoolean(raw: any): boolean | undefined {
|
||||||
|
if (raw === undefined || raw === null || raw === '') return undefined
|
||||||
|
if (typeof raw === 'boolean') return raw
|
||||||
|
if (typeof raw === 'number') return raw !== 0
|
||||||
|
|
||||||
|
const normalized = String(raw).trim().toLowerCase()
|
||||||
|
if (!normalized) return undefined
|
||||||
|
|
||||||
|
if (['1', 'true', 'yes', 'me', 'self', 'mine', 'sent', 'out', 'outgoing'].includes(normalized)) return true
|
||||||
|
if (['0', 'false', 'no', 'friend', 'peer', 'other', 'recv', 'received', 'in', 'incoming'].includes(normalized)) return false
|
||||||
|
return undefined
|
||||||
|
}
|
||||||
|
|
||||||
|
private normalizeEmojiMd5(raw: string): string | undefined {
|
||||||
|
if (!raw) return undefined
|
||||||
|
const trimmed = raw.trim()
|
||||||
|
if (!trimmed) return undefined
|
||||||
|
const match = /([a-fA-F0-9]{16,64})/.exec(trimmed)
|
||||||
|
return match ? match[1].toLowerCase() : undefined
|
||||||
|
}
|
||||||
|
|
||||||
|
private normalizeEmojiUrl(raw: string): string | undefined {
|
||||||
|
if (!raw) return undefined
|
||||||
|
let url = raw.trim().replace(/&/g, '&')
|
||||||
|
if (!url) return undefined
|
||||||
|
try {
|
||||||
|
if (url.includes('%')) {
|
||||||
|
url = decodeURIComponent(url)
|
||||||
|
}
|
||||||
|
} catch { }
|
||||||
|
return url || undefined
|
||||||
|
}
|
||||||
|
|
||||||
|
private extractEmojiUrl(content: string | undefined): string | undefined {
|
||||||
if (!content) return undefined
|
if (!content) return undefined
|
||||||
const match = /md5="([^"]+)"/i.exec(content) || /<md5>([^<]+)<\/md5>/i.exec(content)
|
const direct = this.normalizeEmojiUrl(content)
|
||||||
return match?.[1]
|
if (direct && /^https?:\/\//i.test(direct)) return direct
|
||||||
|
|
||||||
|
const attrMatch = /(?:cdnurl|thumburl)\s*=\s*['"]([^'"]+)['"]/i.exec(content)
|
||||||
|
|| /(?:cdnurl|thumburl)\s*=\s*([^'"\s>]+)/i.exec(content)
|
||||||
|
if (attrMatch) return this.normalizeEmojiUrl(attrMatch[1])
|
||||||
|
|
||||||
|
const tagMatch = /<(?:cdnurl|thumburl)>([^<]+)<\/(?:cdnurl|thumburl)>/i.exec(content)
|
||||||
|
|| /(?:cdnurl|thumburl)[^>]*>([^<]+)/i.exec(content)
|
||||||
|
return this.normalizeEmojiUrl(tagMatch?.[1] || '')
|
||||||
|
}
|
||||||
|
|
||||||
|
private extractEmojiMd5(content: string | undefined): string | undefined {
|
||||||
|
if (!content) return undefined
|
||||||
|
const direct = this.normalizeEmojiMd5(content)
|
||||||
|
if (direct && direct.length >= 24) return direct
|
||||||
|
|
||||||
|
const match = /md5\s*=\s*['"]([a-fA-F0-9]{16,64})['"]/i.exec(content)
|
||||||
|
|| /md5\s*=\s*([a-fA-F0-9]{16,64})/i.exec(content)
|
||||||
|
|| /<md5>([a-fA-F0-9]{16,64})<\/md5>/i.exec(content)
|
||||||
|
return this.normalizeEmojiMd5(match?.[1] || '')
|
||||||
|
}
|
||||||
|
|
||||||
|
private resolveEmojiOwner(item: any, content: string): boolean | undefined {
|
||||||
|
const sentFlag = this.coerceBoolean(this.getRecordField(item, [
|
||||||
|
'isMe',
|
||||||
|
'is_me',
|
||||||
|
'isSent',
|
||||||
|
'is_sent',
|
||||||
|
'isSend',
|
||||||
|
'is_send',
|
||||||
|
'fromMe',
|
||||||
|
'from_me'
|
||||||
|
]))
|
||||||
|
if (sentFlag !== undefined) return sentFlag
|
||||||
|
|
||||||
|
const sideRaw = this.coerceString(this.getRecordField(item, ['side', 'sender', 'from', 'owner', 'role', 'direction'])).trim().toLowerCase()
|
||||||
|
if (sideRaw) {
|
||||||
|
if (['me', 'self', 'mine', 'out', 'outgoing', 'sent'].includes(sideRaw)) return true
|
||||||
|
if (['friend', 'peer', 'other', 'in', 'incoming', 'received', 'recv'].includes(sideRaw)) return false
|
||||||
|
}
|
||||||
|
|
||||||
|
const prefixMatch = /^\s*([01])\s*:\s*/.exec(content)
|
||||||
|
if (prefixMatch) return prefixMatch[1] === '1'
|
||||||
|
return undefined
|
||||||
|
}
|
||||||
|
|
||||||
|
private stripEmojiOwnerPrefix(content: string): string {
|
||||||
|
if (!content) return ''
|
||||||
|
return content.replace(/^\s*[01]\s*:\s*/, '')
|
||||||
|
}
|
||||||
|
|
||||||
|
private parseEmojiCandidate(item: any): { isMe?: boolean; md5?: string; url?: string; count: number } {
|
||||||
|
const rawContent = this.coerceString(this.getRecordField(item, [
|
||||||
|
'content',
|
||||||
|
'xml',
|
||||||
|
'message_content',
|
||||||
|
'messageContent',
|
||||||
|
'msg',
|
||||||
|
'payload',
|
||||||
|
'raw'
|
||||||
|
]))
|
||||||
|
const content = this.stripEmojiOwnerPrefix(rawContent)
|
||||||
|
|
||||||
|
const countRaw = this.getRecordField(item, ['count', 'cnt', 'times', 'total', 'num'])
|
||||||
|
const parsedCount = this.coerceNumber(countRaw)
|
||||||
|
const count = Number.isFinite(parsedCount) && parsedCount > 0 ? parsedCount : 0
|
||||||
|
|
||||||
|
const directMd5 = this.normalizeEmojiMd5(this.coerceString(this.getRecordField(item, [
|
||||||
|
'md5',
|
||||||
|
'emojiMd5',
|
||||||
|
'emoji_md5',
|
||||||
|
'emd5'
|
||||||
|
])))
|
||||||
|
const md5 = directMd5 || this.extractEmojiMd5(content)
|
||||||
|
|
||||||
|
const directUrl = this.normalizeEmojiUrl(this.coerceString(this.getRecordField(item, [
|
||||||
|
'cdnUrl',
|
||||||
|
'cdnurl',
|
||||||
|
'emojiUrl',
|
||||||
|
'emoji_url',
|
||||||
|
'url',
|
||||||
|
'thumbUrl',
|
||||||
|
'thumburl'
|
||||||
|
])))
|
||||||
|
const url = directUrl || this.extractEmojiUrl(content)
|
||||||
|
|
||||||
|
return {
|
||||||
|
isMe: this.resolveEmojiOwner(item, rawContent),
|
||||||
|
md5,
|
||||||
|
url,
|
||||||
|
count
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private getRowInt(row: Record<string, any>, keys: string[], fallback = 0): number {
|
||||||
|
const raw = this.getRecordField(row, keys)
|
||||||
|
const parsed = this.coerceNumber(raw)
|
||||||
|
return Number.isFinite(parsed) ? parsed : fallback
|
||||||
|
}
|
||||||
|
|
||||||
|
private decodeRowMessageContent(row: Record<string, any>): string {
|
||||||
|
const messageContent = this.getRecordField(row, [
|
||||||
|
'message_content',
|
||||||
|
'messageContent',
|
||||||
|
'content',
|
||||||
|
'msg_content',
|
||||||
|
'msgContent',
|
||||||
|
'WCDB_CT_message_content',
|
||||||
|
'WCDB_CT_messageContent'
|
||||||
|
])
|
||||||
|
const compressContent = this.getRecordField(row, [
|
||||||
|
'compress_content',
|
||||||
|
'compressContent',
|
||||||
|
'compressed_content',
|
||||||
|
'WCDB_CT_compress_content',
|
||||||
|
'WCDB_CT_compressContent'
|
||||||
|
])
|
||||||
|
return this.decodeMessageContent(messageContent, compressContent)
|
||||||
|
}
|
||||||
|
|
||||||
|
private async scanEmojiTopFallback(
|
||||||
|
sessionId: string,
|
||||||
|
beginTimestamp: number,
|
||||||
|
endTimestamp: number,
|
||||||
|
rawWxid: string,
|
||||||
|
cleanedWxid: string
|
||||||
|
): Promise<{ my?: { md5: string; url?: string; count: number }; friend?: { md5: string; url?: string; count: number } }> {
|
||||||
|
const cursorResult = await wcdbService.openMessageCursor(sessionId, 500, true, beginTimestamp, endTimestamp)
|
||||||
|
if (!cursorResult.success || !cursorResult.cursor) return {}
|
||||||
|
|
||||||
|
const tallyMap = new Map<string, { isMe: boolean; md5: string; url?: string; count: number }>()
|
||||||
|
try {
|
||||||
|
let hasMore = true
|
||||||
|
while (hasMore) {
|
||||||
|
const batch = await wcdbService.fetchMessageBatch(cursorResult.cursor)
|
||||||
|
if (!batch.success || !Array.isArray(batch.rows)) break
|
||||||
|
|
||||||
|
for (const row of batch.rows) {
|
||||||
|
const localType = this.getRowInt(row, ['local_type', 'localType', 'type', 'msg_type', 'msgType', 'WCDB_CT_local_type'], 0)
|
||||||
|
if (localType !== 47) continue
|
||||||
|
|
||||||
|
const rawContent = this.decodeRowMessageContent(row)
|
||||||
|
const content = this.stripEmojiOwnerPrefix(rawContent)
|
||||||
|
const directMd5 = this.normalizeEmojiMd5(this.coerceString(this.getRecordField(row, ['emoji_md5', 'emojiMd5', 'md5'])))
|
||||||
|
const md5 = directMd5 || this.extractEmojiMd5(content)
|
||||||
|
if (!md5) continue
|
||||||
|
|
||||||
|
const directUrl = this.normalizeEmojiUrl(this.coerceString(this.getRecordField(row, [
|
||||||
|
'emoji_cdn_url',
|
||||||
|
'emojiCdnUrl',
|
||||||
|
'cdnurl',
|
||||||
|
'cdn_url',
|
||||||
|
'emoji_url',
|
||||||
|
'emojiUrl',
|
||||||
|
'url',
|
||||||
|
'thumburl',
|
||||||
|
'thumb_url'
|
||||||
|
])))
|
||||||
|
const url = directUrl || this.extractEmojiUrl(content)
|
||||||
|
const isMe = this.resolveIsSent(row, rawWxid, cleanedWxid)
|
||||||
|
const mapKey = `${isMe ? '1' : '0'}:${md5}`
|
||||||
|
const existing = tallyMap.get(mapKey)
|
||||||
|
if (existing) {
|
||||||
|
existing.count += 1
|
||||||
|
if (!existing.url && url) existing.url = url
|
||||||
|
} else {
|
||||||
|
tallyMap.set(mapKey, { isMe, md5, url, count: 1 })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
hasMore = batch.hasMore === true
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
await wcdbService.closeMessageCursor(cursorResult.cursor)
|
||||||
|
}
|
||||||
|
|
||||||
|
let myTop: { md5: string; url?: string; count: number } | undefined
|
||||||
|
let friendTop: { md5: string; url?: string; count: number } | undefined
|
||||||
|
for (const entry of tallyMap.values()) {
|
||||||
|
if (entry.isMe) {
|
||||||
|
if (!myTop || entry.count > myTop.count) {
|
||||||
|
myTop = { md5: entry.md5, url: entry.url, count: entry.count }
|
||||||
|
}
|
||||||
|
} else if (!friendTop || entry.count > friendTop.count) {
|
||||||
|
friendTop = { md5: entry.md5, url: entry.url, count: entry.count }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return { my: myTop, friend: friendTop }
|
||||||
}
|
}
|
||||||
|
|
||||||
private async getDisplayName(username: string, fallback: string): Promise<string> {
|
private async getDisplayName(username: string, fallback: string): Promise<string> {
|
||||||
@@ -267,189 +521,222 @@ class DualReportService {
|
|||||||
if (myName === rawWxid && cleanedWxid && cleanedWxid !== rawWxid) {
|
if (myName === rawWxid && cleanedWxid && cleanedWxid !== rawWxid) {
|
||||||
myName = await this.getDisplayName(cleanedWxid, rawWxid)
|
myName = await this.getDisplayName(cleanedWxid, rawWxid)
|
||||||
}
|
}
|
||||||
|
const avatarCandidates = Array.from(new Set([
|
||||||
|
friendUsername,
|
||||||
|
rawWxid,
|
||||||
|
cleanedWxid
|
||||||
|
].filter(Boolean) as string[]))
|
||||||
|
let selfAvatarUrl: string | undefined
|
||||||
|
let friendAvatarUrl: string | undefined
|
||||||
|
const avatarResult = await wcdbService.getAvatarUrls(avatarCandidates)
|
||||||
|
if (avatarResult.success && avatarResult.map) {
|
||||||
|
selfAvatarUrl = avatarResult.map[rawWxid] || avatarResult.map[cleanedWxid]
|
||||||
|
friendAvatarUrl = avatarResult.map[friendUsername]
|
||||||
|
}
|
||||||
|
|
||||||
this.reportProgress('获取首条聊天记录...', 15, onProgress)
|
this.reportProgress('获取首条聊天记录...', 15, onProgress)
|
||||||
const firstRows = await this.getFirstMessages(friendUsername, 3, 0, 0)
|
const firstRows = await this.getFirstMessages(friendUsername, 10, 0, 0)
|
||||||
let firstChat: DualReportFirstChat | null = null
|
let firstChat: DualReportFirstChat | null = null
|
||||||
if (firstRows.length > 0) {
|
if (firstRows.length > 0) {
|
||||||
const row = firstRows[0]
|
const row = firstRows[0]
|
||||||
const createTime = parseInt(row.create_time || '0', 10) * 1000
|
const createTime = parseInt(row.create_time || '0', 10) * 1000
|
||||||
const content = this.decodeMessageContent(row.message_content, row.compress_content)
|
const rawContent = this.decodeMessageContent(row.message_content, row.compress_content)
|
||||||
|
const localType = this.getRowInt(row, ['local_type', 'localType', 'type', 'msg_type', 'msgType'], 0)
|
||||||
|
let emojiMd5: string | undefined
|
||||||
|
let emojiCdnUrl: string | undefined
|
||||||
|
if (localType === 47) {
|
||||||
|
const stripped = this.stripEmojiOwnerPrefix(rawContent)
|
||||||
|
emojiMd5 = this.normalizeEmojiMd5(this.coerceString(this.getRecordField(row, ['emoji_md5', 'emojiMd5', 'md5']))) || this.extractEmojiMd5(stripped)
|
||||||
|
emojiCdnUrl = this.normalizeEmojiUrl(this.coerceString(this.getRecordField(row, ['emoji_cdn_url', 'emojiCdnUrl', 'cdnurl']))) || this.extractEmojiUrl(stripped)
|
||||||
|
}
|
||||||
|
|
||||||
firstChat = {
|
firstChat = {
|
||||||
createTime,
|
createTime,
|
||||||
createTimeStr: this.formatDateTime(createTime),
|
createTimeStr: this.formatDateTime(createTime),
|
||||||
content: String(content || ''),
|
content: String(rawContent || ''),
|
||||||
isSentByMe: this.resolveIsSent(row, rawWxid, cleanedWxid),
|
isSentByMe: this.resolveIsSent(row, rawWxid, cleanedWxid),
|
||||||
senderUsername: row.sender_username || row.sender
|
senderUsername: row.sender_username || row.sender,
|
||||||
|
localType,
|
||||||
|
emojiMd5,
|
||||||
|
emojiCdnUrl
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const firstChatMessages: DualReportMessage[] = firstRows.map((row) => {
|
const firstChatMessages: DualReportMessage[] = firstRows.map((row) => {
|
||||||
const msgTime = parseInt(row.create_time || '0', 10) * 1000
|
const msgTime = parseInt(row.create_time || '0', 10) * 1000
|
||||||
const msgContent = this.decodeMessageContent(row.message_content, row.compress_content)
|
const rawContent = this.decodeMessageContent(row.message_content, row.compress_content)
|
||||||
|
const localType = this.getRowInt(row, ['local_type', 'localType', 'type', 'msg_type', 'msgType'], 0)
|
||||||
|
let emojiMd5: string | undefined
|
||||||
|
let emojiCdnUrl: string | undefined
|
||||||
|
if (localType === 47) {
|
||||||
|
const stripped = this.stripEmojiOwnerPrefix(rawContent)
|
||||||
|
emojiMd5 = this.normalizeEmojiMd5(this.coerceString(this.getRecordField(row, ['emoji_md5', 'emojiMd5', 'md5']))) || this.extractEmojiMd5(stripped)
|
||||||
|
emojiCdnUrl = this.normalizeEmojiUrl(this.coerceString(this.getRecordField(row, ['emoji_cdn_url', 'emojiCdnUrl', 'cdnurl']))) || this.extractEmojiUrl(stripped)
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
content: String(msgContent || ''),
|
content: String(rawContent || ''),
|
||||||
isSentByMe: this.resolveIsSent(row, rawWxid, cleanedWxid),
|
isSentByMe: this.resolveIsSent(row, rawWxid, cleanedWxid),
|
||||||
createTime: msgTime,
|
createTime: msgTime,
|
||||||
createTimeStr: this.formatDateTime(msgTime)
|
createTimeStr: this.formatDateTime(msgTime),
|
||||||
|
localType,
|
||||||
|
emojiMd5,
|
||||||
|
emojiCdnUrl
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
let yearFirstChat: DualReportData['yearFirstChat'] = null
|
let yearFirstChat: DualReportData['yearFirstChat'] = null
|
||||||
if (!isAllTime) {
|
if (!isAllTime) {
|
||||||
this.reportProgress('获取今年首次聊天...', 20, onProgress)
|
this.reportProgress('获取今年首次聊天...', 20, onProgress)
|
||||||
const firstYearRows = await this.getFirstMessages(friendUsername, 3, startTime, endTime)
|
const firstYearRows = await this.getFirstMessages(friendUsername, 10, startTime, endTime)
|
||||||
if (firstYearRows.length > 0) {
|
if (firstYearRows.length > 0) {
|
||||||
const firstRow = firstYearRows[0]
|
const firstRow = firstYearRows[0]
|
||||||
const createTime = parseInt(firstRow.create_time || '0', 10) * 1000
|
const createTime = parseInt(firstRow.create_time || '0', 10) * 1000
|
||||||
const firstThreeMessages: DualReportMessage[] = firstYearRows.map((row) => {
|
const firstThreeMessages: DualReportMessage[] = firstYearRows.map((row) => {
|
||||||
const msgTime = parseInt(row.create_time || '0', 10) * 1000
|
const msgTime = parseInt(row.create_time || '0', 10) * 1000
|
||||||
const msgContent = this.decodeMessageContent(row.message_content, row.compress_content)
|
const rawContent = this.decodeMessageContent(row.message_content, row.compress_content)
|
||||||
|
const localType = this.getRowInt(row, ['local_type', 'localType', 'type', 'msg_type', 'msgType'], 0)
|
||||||
|
let emojiMd5: string | undefined
|
||||||
|
let emojiCdnUrl: string | undefined
|
||||||
|
if (localType === 47) {
|
||||||
|
const stripped = this.stripEmojiOwnerPrefix(rawContent)
|
||||||
|
emojiMd5 = this.normalizeEmojiMd5(this.coerceString(this.getRecordField(row, ['emoji_md5', 'emojiMd5', 'md5']))) || this.extractEmojiMd5(stripped)
|
||||||
|
emojiCdnUrl = this.normalizeEmojiUrl(this.coerceString(this.getRecordField(row, ['emoji_cdn_url', 'emojiCdnUrl', 'cdnurl']))) || this.extractEmojiUrl(stripped)
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
content: String(msgContent || ''),
|
content: String(rawContent || ''),
|
||||||
isSentByMe: this.resolveIsSent(row, rawWxid, cleanedWxid),
|
isSentByMe: this.resolveIsSent(row, rawWxid, cleanedWxid),
|
||||||
createTime: msgTime,
|
createTime: msgTime,
|
||||||
createTimeStr: this.formatDateTime(msgTime)
|
createTimeStr: this.formatDateTime(msgTime),
|
||||||
|
localType,
|
||||||
|
emojiMd5,
|
||||||
|
emojiCdnUrl
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
const firstRowYear = firstYearRows[0]
|
||||||
|
const rawContentYear = this.decodeMessageContent(firstRowYear.message_content, firstRowYear.compress_content)
|
||||||
|
const localTypeYear = this.getRowInt(firstRowYear, ['local_type', 'localType', 'type', 'msg_type', 'msgType'], 0)
|
||||||
|
let emojiMd5Year: string | undefined
|
||||||
|
let emojiCdnUrlYear: string | undefined
|
||||||
|
if (localTypeYear === 47) {
|
||||||
|
const stripped = this.stripEmojiOwnerPrefix(rawContentYear)
|
||||||
|
emojiMd5Year = this.normalizeEmojiMd5(this.coerceString(this.getRecordField(firstRowYear, ['emoji_md5', 'emojiMd5', 'md5']))) || this.extractEmojiMd5(stripped)
|
||||||
|
emojiCdnUrlYear = this.normalizeEmojiUrl(this.coerceString(this.getRecordField(firstRowYear, ['emoji_cdn_url', 'emojiCdnUrl', 'cdnurl']))) || this.extractEmojiUrl(stripped)
|
||||||
|
}
|
||||||
|
|
||||||
yearFirstChat = {
|
yearFirstChat = {
|
||||||
createTime,
|
createTime,
|
||||||
createTimeStr: this.formatDateTime(createTime),
|
createTimeStr: this.formatDateTime(createTime),
|
||||||
content: String(this.decodeMessageContent(firstRow.message_content, firstRow.compress_content) || ''),
|
content: String(rawContentYear || ''),
|
||||||
isSentByMe: this.resolveIsSent(firstRow, rawWxid, cleanedWxid),
|
isSentByMe: this.resolveIsSent(firstRowYear, rawWxid, cleanedWxid),
|
||||||
friendName,
|
friendName,
|
||||||
firstThreeMessages
|
firstThreeMessages,
|
||||||
|
localType: localTypeYear,
|
||||||
|
emojiMd5: emojiMd5Year,
|
||||||
|
emojiCdnUrl: emojiCdnUrlYear
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.reportProgress('统计聊天数据...', 30, onProgress)
|
this.reportProgress('统计聊天数据...', 30, onProgress)
|
||||||
|
|
||||||
|
const statsResult = await wcdbService.getDualReportStats(friendUsername, startTime, endTime)
|
||||||
|
if (!statsResult.success || !statsResult.data) {
|
||||||
|
return { success: false, error: statsResult.error || '获取双人报告统计失败' }
|
||||||
|
}
|
||||||
|
|
||||||
|
const cppData = statsResult.data
|
||||||
|
const counts = cppData.counts || {}
|
||||||
|
|
||||||
const stats: DualReportStats = {
|
const stats: DualReportStats = {
|
||||||
totalMessages: 0,
|
totalMessages: counts.total || 0,
|
||||||
totalWords: 0,
|
totalWords: counts.words || 0,
|
||||||
imageCount: 0,
|
imageCount: counts.image || 0,
|
||||||
voiceCount: 0,
|
voiceCount: counts.voice || 0,
|
||||||
emojiCount: 0
|
emojiCount: counts.emoji || 0
|
||||||
}
|
|
||||||
const wordCountMap = new Map<string, number>()
|
|
||||||
const myEmojiCounts = new Map<string, number>()
|
|
||||||
const friendEmojiCounts = new Map<string, number>()
|
|
||||||
const myEmojiUrlMap = new Map<string, string>()
|
|
||||||
const friendEmojiUrlMap = new Map<string, string>()
|
|
||||||
|
|
||||||
const messageCountResult = await wcdbService.getMessageCount(friendUsername)
|
|
||||||
const totalForProgress = messageCountResult.success && messageCountResult.count
|
|
||||||
? messageCountResult.count
|
|
||||||
: 0
|
|
||||||
let processed = 0
|
|
||||||
let lastProgressAt = 0
|
|
||||||
|
|
||||||
const cursorResult = await wcdbService.openMessageCursor(friendUsername, 1000, true, startTime, endTime)
|
|
||||||
if (!cursorResult.success || !cursorResult.cursor) {
|
|
||||||
return { success: false, error: cursorResult.error || '打开消息游标失败' }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
// Process Emojis to find top for me and friend
|
||||||
let hasMore = true
|
let myTopEmojiMd5: string | undefined
|
||||||
while (hasMore) {
|
let myTopEmojiUrl: string | undefined
|
||||||
const batch = await wcdbService.fetchMessageBatch(cursorResult.cursor)
|
let myTopCount = -1
|
||||||
if (!batch.success || !batch.rows) break
|
|
||||||
for (const row of batch.rows) {
|
|
||||||
const localType = parseInt(row.local_type || row.type || '1', 10)
|
|
||||||
const isSent = this.resolveIsSent(row, rawWxid, cleanedWxid)
|
|
||||||
stats.totalMessages += 1
|
|
||||||
|
|
||||||
if (localType === 3) stats.imageCount += 1
|
let friendTopEmojiMd5: string | undefined
|
||||||
if (localType === 34) stats.voiceCount += 1
|
let friendTopEmojiUrl: string | undefined
|
||||||
if (localType === 47) {
|
let friendTopCount = -1
|
||||||
stats.emojiCount += 1
|
|
||||||
const content = this.decodeMessageContent(row.message_content, row.compress_content)
|
|
||||||
const md5 = this.extractEmojiMd5(content)
|
|
||||||
const url = this.extractEmojiUrl(content)
|
|
||||||
if (md5) {
|
|
||||||
const targetMap = isSent ? myEmojiCounts : friendEmojiCounts
|
|
||||||
targetMap.set(md5, (targetMap.get(md5) || 0) + 1)
|
|
||||||
if (url) {
|
|
||||||
const urlMap = isSent ? myEmojiUrlMap : friendEmojiUrlMap
|
|
||||||
if (!urlMap.has(md5)) urlMap.set(md5, url)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (localType === 1 || localType === 244813135921) {
|
if (cppData.emojis && Array.isArray(cppData.emojis)) {
|
||||||
const content = this.decodeMessageContent(row.message_content, row.compress_content)
|
for (const item of cppData.emojis) {
|
||||||
const text = String(content || '').trim()
|
const candidate = this.parseEmojiCandidate(item)
|
||||||
if (text.length > 0) {
|
if (!candidate.md5 || candidate.isMe === undefined || candidate.count <= 0) continue
|
||||||
stats.totalWords += text.replace(/\s+/g, '').length
|
|
||||||
const normalized = text.replace(/\s+/g, ' ').trim()
|
|
||||||
if (normalized.length >= 2 &&
|
|
||||||
normalized.length <= 50 &&
|
|
||||||
!normalized.includes('http') &&
|
|
||||||
!normalized.includes('<') &&
|
|
||||||
!normalized.startsWith('[') &&
|
|
||||||
!normalized.startsWith('<?xml')) {
|
|
||||||
wordCountMap.set(normalized, (wordCountMap.get(normalized) || 0) + 1)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (totalForProgress > 0) {
|
if (candidate.isMe) {
|
||||||
processed++
|
if (candidate.count > myTopCount) {
|
||||||
|
myTopCount = candidate.count
|
||||||
|
myTopEmojiMd5 = candidate.md5
|
||||||
|
myTopEmojiUrl = candidate.url
|
||||||
}
|
}
|
||||||
}
|
} else if (candidate.count > friendTopCount) {
|
||||||
hasMore = batch.hasMore === true
|
friendTopCount = candidate.count
|
||||||
|
friendTopEmojiMd5 = candidate.md5
|
||||||
const now = Date.now()
|
friendTopEmojiUrl = candidate.url
|
||||||
if (now - lastProgressAt > 200) {
|
|
||||||
if (totalForProgress > 0) {
|
|
||||||
const ratio = Math.min(1, processed / totalForProgress)
|
|
||||||
const progress = 30 + Math.floor(ratio * 50)
|
|
||||||
this.reportProgress('统计聊天数据...', progress, onProgress)
|
|
||||||
}
|
|
||||||
lastProgressAt = now
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} finally {
|
|
||||||
await wcdbService.closeMessageCursor(cursorResult.cursor)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const pickTop = (map: Map<string, number>): string | undefined => {
|
const needsEmojiFallback = stats.emojiCount > 0 && (!myTopEmojiMd5 || !friendTopEmojiMd5)
|
||||||
let topKey: string | undefined
|
if (needsEmojiFallback) {
|
||||||
let topCount = -1
|
const fallback = await this.scanEmojiTopFallback(friendUsername, startTime, endTime, rawWxid, cleanedWxid)
|
||||||
for (const [key, count] of map.entries()) {
|
|
||||||
if (count > topCount) {
|
if (!myTopEmojiMd5 && fallback.my?.md5) {
|
||||||
topCount = count
|
myTopEmojiMd5 = fallback.my.md5
|
||||||
topKey = key
|
myTopEmojiUrl = myTopEmojiUrl || fallback.my.url
|
||||||
}
|
myTopCount = fallback.my.count
|
||||||
|
}
|
||||||
|
if (!friendTopEmojiMd5 && fallback.friend?.md5) {
|
||||||
|
friendTopEmojiMd5 = fallback.friend.md5
|
||||||
|
friendTopEmojiUrl = friendTopEmojiUrl || fallback.friend.url
|
||||||
|
friendTopCount = fallback.friend.count
|
||||||
}
|
}
|
||||||
return topKey
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const myTopEmojiMd5 = pickTop(myEmojiCounts)
|
const [myEmojiUrlResult, friendEmojiUrlResult] = await Promise.all([
|
||||||
const friendTopEmojiMd5 = pickTop(friendEmojiCounts)
|
myTopEmojiMd5 && !myTopEmojiUrl ? wcdbService.getEmoticonCdnUrl(dbPath, myTopEmojiMd5) : Promise.resolve(null),
|
||||||
|
friendTopEmojiMd5 && !friendTopEmojiUrl ? wcdbService.getEmoticonCdnUrl(dbPath, friendTopEmojiMd5) : Promise.resolve(null)
|
||||||
|
])
|
||||||
|
if (myEmojiUrlResult?.success && myEmojiUrlResult.url) myTopEmojiUrl = myEmojiUrlResult.url
|
||||||
|
if (friendEmojiUrlResult?.success && friendEmojiUrlResult.url) friendTopEmojiUrl = friendEmojiUrlResult.url
|
||||||
|
|
||||||
stats.myTopEmojiMd5 = myTopEmojiMd5
|
stats.myTopEmojiMd5 = myTopEmojiMd5
|
||||||
|
stats.myTopEmojiUrl = myTopEmojiUrl
|
||||||
stats.friendTopEmojiMd5 = friendTopEmojiMd5
|
stats.friendTopEmojiMd5 = friendTopEmojiMd5
|
||||||
stats.myTopEmojiUrl = myTopEmojiMd5 ? myEmojiUrlMap.get(myTopEmojiMd5) : undefined
|
stats.friendTopEmojiUrl = friendTopEmojiUrl
|
||||||
stats.friendTopEmojiUrl = friendTopEmojiMd5 ? friendEmojiUrlMap.get(friendTopEmojiMd5) : undefined
|
if (myTopCount >= 0) stats.myTopEmojiCount = myTopCount
|
||||||
|
if (friendTopCount >= 0) stats.friendTopEmojiCount = friendTopCount
|
||||||
|
|
||||||
this.reportProgress('生成常用语词云...', 85, onProgress)
|
const topPhrases = (cppData.phrases || []).map((p: any) => ({
|
||||||
const topPhrases = Array.from(wordCountMap.entries())
|
phrase: p.phrase,
|
||||||
.filter(([_, count]) => count >= 2)
|
count: p.count
|
||||||
.sort((a, b) => b[1] - a[1])
|
}))
|
||||||
.slice(0, 50)
|
|
||||||
.map(([phrase, count]) => ({ phrase, count }))
|
|
||||||
|
|
||||||
const reportData: DualReportData = {
|
const reportData: DualReportData = {
|
||||||
year: reportYear,
|
year: reportYear,
|
||||||
selfName: myName,
|
selfName: myName,
|
||||||
|
selfAvatarUrl,
|
||||||
friendUsername,
|
friendUsername,
|
||||||
friendName,
|
friendName,
|
||||||
|
friendAvatarUrl,
|
||||||
firstChat,
|
firstChat,
|
||||||
firstChatMessages,
|
firstChatMessages,
|
||||||
yearFirstChat,
|
yearFirstChat,
|
||||||
stats,
|
stats,
|
||||||
topPhrases
|
topPhrases,
|
||||||
}
|
heatmap: cppData.heatmap,
|
||||||
|
initiative: cppData.initiative,
|
||||||
|
response: cppData.response,
|
||||||
|
monthly: cppData.monthly,
|
||||||
|
streak: cppData.streak
|
||||||
|
} as any
|
||||||
|
|
||||||
this.reportProgress('双人报告生成完成', 100, onProgress)
|
this.reportProgress('双人报告生成完成', 100, onProgress)
|
||||||
return { success: true, data: reportData }
|
return { success: true, data: reportData }
|
||||||
|
|||||||
@@ -25,83 +25,87 @@ body {
|
|||||||
|
|
||||||
.page {
|
.page {
|
||||||
max-width: 1080px;
|
max-width: 1080px;
|
||||||
margin: 32px auto 60px;
|
margin: 0 auto;
|
||||||
padding: 0 20px;
|
padding: 8px 20px;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
background: var(--card);
|
background: var(--card);
|
||||||
border-radius: var(--radius);
|
border-radius: 12px;
|
||||||
box-shadow: var(--shadow);
|
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
|
||||||
padding: 24px;
|
padding: 12px 20px;
|
||||||
margin-bottom: 24px;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
font-size: 24px;
|
font-size: 16px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
margin: 0 0 8px;
|
margin: 0;
|
||||||
|
display: inline;
|
||||||
}
|
}
|
||||||
|
|
||||||
.meta {
|
.meta {
|
||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
font-size: 14px;
|
font-size: 13px;
|
||||||
display: flex;
|
display: inline;
|
||||||
flex-wrap: wrap;
|
margin-left: 12px;
|
||||||
gap: 12px;
|
}
|
||||||
|
|
||||||
|
.meta span {
|
||||||
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.controls {
|
.controls {
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
|
||||||
gap: 16px;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.control {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
align-items: center;
|
||||||
gap: 6px;
|
gap: 8px;
|
||||||
|
margin-top: 8px;
|
||||||
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control label {
|
.controls input,
|
||||||
font-size: 13px;
|
.controls button {
|
||||||
color: var(--muted);
|
border-radius: 8px;
|
||||||
}
|
|
||||||
|
|
||||||
.control input,
|
|
||||||
.control select,
|
|
||||||
.control button {
|
|
||||||
border-radius: 12px;
|
|
||||||
border: 1px solid var(--border);
|
border: 1px solid var(--border);
|
||||||
padding: 10px 12px;
|
padding: 6px 10px;
|
||||||
font-size: 14px;
|
font-size: 13px;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control button {
|
.controls input[type="search"] {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.controls input[type="datetime-local"] {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.controls button {
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: transform 0.1s ease;
|
padding: 6px 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control button:active {
|
.controls button:active {
|
||||||
transform: scale(0.98);
|
transform: scale(0.98);
|
||||||
}
|
}
|
||||||
|
|
||||||
.stats {
|
.stats {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
display: flex;
|
margin-left: auto;
|
||||||
align-items: flex-end;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-list {
|
.message-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 18px;
|
gap: 12px;
|
||||||
|
padding: 4px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.message {
|
.message {
|
||||||
@@ -248,50 +252,11 @@ body {
|
|||||||
cursor: zoom-out;
|
cursor: zoom-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
body[data-theme="cloud-dancer"] {
|
|
||||||
--accent: #6b8cff;
|
|
||||||
--sent: #e0e7ff;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #d8e0f7;
|
|
||||||
--bg: #f6f7fb;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="corundum-blue"] {
|
|
||||||
--accent: #2563eb;
|
|
||||||
--sent: #dbeafe;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #c7d2fe;
|
|
||||||
--bg: #eef2ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="kiwi-green"] {
|
|
||||||
--accent: #16a34a;
|
|
||||||
--sent: #dcfce7;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #bbf7d0;
|
|
||||||
--bg: #f0fdf4;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="spicy-red"] {
|
|
||||||
--accent: #e11d48;
|
|
||||||
--sent: #ffe4e6;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #fecdd3;
|
|
||||||
--bg: #fff1f2;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="teal-water"] {
|
|
||||||
--accent: #0f766e;
|
|
||||||
--sent: #ccfbf1;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #99f6e4;
|
|
||||||
--bg: #f0fdfa;
|
|
||||||
}
|
|
||||||
|
|
||||||
.highlight {
|
.highlight {
|
||||||
outline: 2px solid var(--accent);
|
outline: 2px solid var(--accent);
|
||||||
outline-offset: 4px;
|
outline-offset: 4px;
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
|
transition: outline-color 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.empty {
|
.empty {
|
||||||
@@ -299,3 +264,30 @@ body[data-theme="teal-water"] {
|
|||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
padding: 40px;
|
padding: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Scroll Container */
|
||||||
|
.scroll-container {
|
||||||
|
flex: 1;
|
||||||
|
min-height: 0;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
background: var(--bg);
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-container::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-container::-webkit-scrollbar-thumb {
|
||||||
|
background: #c1c1c1;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.load-sentinel {
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
|||||||
@@ -25,83 +25,87 @@ body {
|
|||||||
|
|
||||||
.page {
|
.page {
|
||||||
max-width: 1080px;
|
max-width: 1080px;
|
||||||
margin: 32px auto 60px;
|
margin: 0 auto;
|
||||||
padding: 0 20px;
|
padding: 8px 20px;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
background: var(--card);
|
background: var(--card);
|
||||||
border-radius: var(--radius);
|
border-radius: 12px;
|
||||||
box-shadow: var(--shadow);
|
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
|
||||||
padding: 24px;
|
padding: 12px 20px;
|
||||||
margin-bottom: 24px;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
font-size: 24px;
|
font-size: 16px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
margin: 0 0 8px;
|
margin: 0;
|
||||||
|
display: inline;
|
||||||
}
|
}
|
||||||
|
|
||||||
.meta {
|
.meta {
|
||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
font-size: 14px;
|
font-size: 13px;
|
||||||
display: flex;
|
display: inline;
|
||||||
flex-wrap: wrap;
|
margin-left: 12px;
|
||||||
gap: 12px;
|
}
|
||||||
|
|
||||||
|
.meta span {
|
||||||
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.controls {
|
.controls {
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
|
||||||
gap: 16px;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.control {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
align-items: center;
|
||||||
gap: 6px;
|
gap: 8px;
|
||||||
|
margin-top: 8px;
|
||||||
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control label {
|
.controls input,
|
||||||
font-size: 13px;
|
.controls button {
|
||||||
color: var(--muted);
|
border-radius: 8px;
|
||||||
}
|
|
||||||
|
|
||||||
.control input,
|
|
||||||
.control select,
|
|
||||||
.control button {
|
|
||||||
border-radius: 12px;
|
|
||||||
border: 1px solid var(--border);
|
border: 1px solid var(--border);
|
||||||
padding: 10px 12px;
|
padding: 6px 10px;
|
||||||
font-size: 14px;
|
font-size: 13px;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control button {
|
.controls input[type="search"] {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.controls input[type="datetime-local"] {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.controls button {
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: transform 0.1s ease;
|
padding: 6px 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.control button:active {
|
.controls button:active {
|
||||||
transform: scale(0.98);
|
transform: scale(0.98);
|
||||||
}
|
}
|
||||||
|
|
||||||
.stats {
|
.stats {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
display: flex;
|
margin-left: auto;
|
||||||
align-items: flex-end;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-list {
|
.message-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 18px;
|
gap: 12px;
|
||||||
|
padding: 4px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.message {
|
.message {
|
||||||
@@ -248,50 +252,11 @@ body {
|
|||||||
cursor: zoom-out;
|
cursor: zoom-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
body[data-theme="cloud-dancer"] {
|
|
||||||
--accent: #6b8cff;
|
|
||||||
--sent: #e0e7ff;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #d8e0f7;
|
|
||||||
--bg: #f6f7fb;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="corundum-blue"] {
|
|
||||||
--accent: #2563eb;
|
|
||||||
--sent: #dbeafe;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #c7d2fe;
|
|
||||||
--bg: #eef2ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="kiwi-green"] {
|
|
||||||
--accent: #16a34a;
|
|
||||||
--sent: #dcfce7;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #bbf7d0;
|
|
||||||
--bg: #f0fdf4;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="spicy-red"] {
|
|
||||||
--accent: #e11d48;
|
|
||||||
--sent: #ffe4e6;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #fecdd3;
|
|
||||||
--bg: #fff1f2;
|
|
||||||
}
|
|
||||||
|
|
||||||
body[data-theme="teal-water"] {
|
|
||||||
--accent: #0f766e;
|
|
||||||
--sent: #ccfbf1;
|
|
||||||
--received: #ffffff;
|
|
||||||
--border: #99f6e4;
|
|
||||||
--bg: #f0fdfa;
|
|
||||||
}
|
|
||||||
|
|
||||||
.highlight {
|
.highlight {
|
||||||
outline: 2px solid var(--accent);
|
outline: 2px solid var(--accent);
|
||||||
outline-offset: 4px;
|
outline-offset: 4px;
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
|
transition: outline-color 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.empty {
|
.empty {
|
||||||
@@ -299,4 +264,32 @@ body[data-theme="teal-water"] {
|
|||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
padding: 40px;
|
padding: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Scroll Container */
|
||||||
|
.scroll-container {
|
||||||
|
flex: 1;
|
||||||
|
min-height: 0;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
background: var(--bg);
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-container::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-container::-webkit-scrollbar-thumb {
|
||||||
|
background: #c1c1c1;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.load-sentinel {
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -105,19 +105,166 @@ class GroupAnalyticsService {
|
|||||||
/**
|
/**
|
||||||
* 从 DLL 获取群成员的群昵称
|
* 从 DLL 获取群成员的群昵称
|
||||||
*/
|
*/
|
||||||
private async getGroupNicknamesForRoom(chatroomId: string): Promise<Map<string, string>> {
|
private async getGroupNicknamesForRoom(chatroomId: string, candidates: string[] = []): Promise<Map<string, string>> {
|
||||||
try {
|
try {
|
||||||
const result = await wcdbService.getGroupNicknames(chatroomId)
|
const escapedChatroomId = chatroomId.replace(/'/g, "''")
|
||||||
if (result.success && result.nicknames) {
|
const sql = `SELECT ext_buffer FROM chat_room WHERE username='${escapedChatroomId}' LIMIT 1`
|
||||||
return new Map(Object.entries(result.nicknames))
|
const result = await wcdbService.execQuery('contact', null, sql)
|
||||||
|
if (!result.success || !result.rows || result.rows.length === 0) {
|
||||||
|
return new Map<string, string>()
|
||||||
}
|
}
|
||||||
return new Map<string, string>()
|
|
||||||
|
const extBuffer = this.decodeExtBuffer((result.rows[0] as any).ext_buffer)
|
||||||
|
if (!extBuffer) return new Map<string, string>()
|
||||||
|
return this.parseGroupNicknamesFromExtBuffer(extBuffer, candidates)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error('getGroupNicknamesForRoom error:', e)
|
console.error('getGroupNicknamesForRoom error:', e)
|
||||||
return new Map<string, string>()
|
return new Map<string, string>()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private looksLikeHex(s: string): boolean {
|
||||||
|
if (s.length % 2 !== 0) return false
|
||||||
|
return /^[0-9a-fA-F]+$/.test(s)
|
||||||
|
}
|
||||||
|
|
||||||
|
private looksLikeBase64(s: string): boolean {
|
||||||
|
if (s.length % 4 !== 0) return false
|
||||||
|
return /^[A-Za-z0-9+/=]+$/.test(s)
|
||||||
|
}
|
||||||
|
|
||||||
|
private decodeExtBuffer(value: unknown): Buffer | null {
|
||||||
|
if (!value) return null
|
||||||
|
if (Buffer.isBuffer(value)) return value
|
||||||
|
if (value instanceof Uint8Array) return Buffer.from(value)
|
||||||
|
|
||||||
|
if (typeof value === 'string') {
|
||||||
|
const raw = value.trim()
|
||||||
|
if (!raw) return null
|
||||||
|
|
||||||
|
if (this.looksLikeHex(raw)) {
|
||||||
|
try { return Buffer.from(raw, 'hex') } catch { }
|
||||||
|
}
|
||||||
|
if (this.looksLikeBase64(raw)) {
|
||||||
|
try { return Buffer.from(raw, 'base64') } catch { }
|
||||||
|
}
|
||||||
|
|
||||||
|
try { return Buffer.from(raw, 'hex') } catch { }
|
||||||
|
try { return Buffer.from(raw, 'base64') } catch { }
|
||||||
|
try { return Buffer.from(raw, 'utf8') } catch { }
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
private readVarint(buffer: Buffer, offset: number, limit: number = buffer.length): { value: number; next: number } | null {
|
||||||
|
let value = 0
|
||||||
|
let shift = 0
|
||||||
|
let pos = offset
|
||||||
|
while (pos < limit && shift <= 53) {
|
||||||
|
const byte = buffer[pos]
|
||||||
|
value += (byte & 0x7f) * Math.pow(2, shift)
|
||||||
|
pos += 1
|
||||||
|
if ((byte & 0x80) === 0) return { value, next: pos }
|
||||||
|
shift += 7
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
private isLikelyMemberId(value: string): boolean {
|
||||||
|
const id = String(value || '').trim()
|
||||||
|
if (!id) return false
|
||||||
|
if (id.includes('@chatroom')) return false
|
||||||
|
if (id.length < 4 || id.length > 80) return false
|
||||||
|
return /^[A-Za-z][A-Za-z0-9_.@-]*$/.test(id)
|
||||||
|
}
|
||||||
|
|
||||||
|
private isLikelyNickname(value: string): boolean {
|
||||||
|
const cleaned = this.normalizeGroupNickname(value)
|
||||||
|
if (!cleaned) return false
|
||||||
|
if (/^wxid_[a-z0-9_]+$/i.test(cleaned)) return false
|
||||||
|
if (cleaned.includes('@chatroom')) return false
|
||||||
|
if (!/[\u4E00-\u9FFF\u3400-\u4DBF\w]/.test(cleaned)) return false
|
||||||
|
if (cleaned.length === 1) {
|
||||||
|
const code = cleaned.charCodeAt(0)
|
||||||
|
const isCjk = code >= 0x3400 && code <= 0x9fff
|
||||||
|
if (!isCjk) return false
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
private parseGroupNicknamesFromExtBuffer(buffer: Buffer, candidates: string[] = []): Map<string, string> {
|
||||||
|
const nicknameMap = new Map<string, string>()
|
||||||
|
if (!buffer || buffer.length === 0) return nicknameMap
|
||||||
|
|
||||||
|
try {
|
||||||
|
const candidateSet = new Set(this.buildIdCandidates(candidates).map((id) => id.toLowerCase()))
|
||||||
|
|
||||||
|
for (let i = 0; i < buffer.length - 2; i += 1) {
|
||||||
|
if (buffer[i] !== 0x0a) continue
|
||||||
|
|
||||||
|
const idLenInfo = this.readVarint(buffer, i + 1)
|
||||||
|
if (!idLenInfo) continue
|
||||||
|
const idLen = idLenInfo.value
|
||||||
|
if (!Number.isFinite(idLen) || idLen <= 0 || idLen > 96) continue
|
||||||
|
|
||||||
|
const idStart = idLenInfo.next
|
||||||
|
const idEnd = idStart + idLen
|
||||||
|
if (idEnd > buffer.length) continue
|
||||||
|
|
||||||
|
const memberId = buffer.toString('utf8', idStart, idEnd).trim()
|
||||||
|
if (!this.isLikelyMemberId(memberId)) continue
|
||||||
|
|
||||||
|
const memberIdLower = memberId.toLowerCase()
|
||||||
|
if (candidateSet.size > 0 && !candidateSet.has(memberIdLower)) {
|
||||||
|
i = idEnd - 1
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const cursor = idEnd
|
||||||
|
if (cursor >= buffer.length || buffer[cursor] !== 0x12) {
|
||||||
|
i = idEnd - 1
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const nickLenInfo = this.readVarint(buffer, cursor + 1)
|
||||||
|
if (!nickLenInfo) {
|
||||||
|
i = idEnd - 1
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const nickLen = nickLenInfo.value
|
||||||
|
if (!Number.isFinite(nickLen) || nickLen <= 0 || nickLen > 128) {
|
||||||
|
i = idEnd - 1
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const nickStart = nickLenInfo.next
|
||||||
|
const nickEnd = nickStart + nickLen
|
||||||
|
if (nickEnd > buffer.length) {
|
||||||
|
i = idEnd - 1
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const rawNick = buffer.toString('utf8', nickStart, nickEnd)
|
||||||
|
const nickname = this.normalizeGroupNickname(rawNick.replace(/[\x00-\x1F\x7F]/g, '').trim())
|
||||||
|
if (!this.isLikelyNickname(nickname)) {
|
||||||
|
i = nickEnd - 1
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!nicknameMap.has(memberId)) nicknameMap.set(memberId, nickname)
|
||||||
|
if (!nicknameMap.has(memberIdLower)) nicknameMap.set(memberIdLower, nickname)
|
||||||
|
i = nickEnd - 1
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Failed to parse chat_room.ext_buffer:', e)
|
||||||
|
}
|
||||||
|
|
||||||
|
return nicknameMap
|
||||||
|
}
|
||||||
|
|
||||||
private escapeCsvValue(value: string): string {
|
private escapeCsvValue(value: string): string {
|
||||||
if (value == null) return ''
|
if (value == null) return ''
|
||||||
const str = String(value)
|
const str = String(value)
|
||||||
@@ -127,14 +274,54 @@ class GroupAnalyticsService {
|
|||||||
return str
|
return str
|
||||||
}
|
}
|
||||||
|
|
||||||
private normalizeGroupNickname(value: string, wxid: string, fallback: string): string {
|
private normalizeGroupNickname(value: string): string {
|
||||||
const trimmed = (value || '').trim()
|
const trimmed = (value || '').trim()
|
||||||
if (!trimmed) return fallback
|
if (!trimmed) return ''
|
||||||
if (/^["'@]+$/.test(trimmed)) return fallback
|
if (/^["'@]+$/.test(trimmed)) return ''
|
||||||
if (trimmed.toLowerCase() === (wxid || '').toLowerCase()) return fallback
|
|
||||||
return trimmed
|
return trimmed
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private buildIdCandidates(values: Array<string | undefined | null>): string[] {
|
||||||
|
const set = new Set<string>()
|
||||||
|
for (const rawValue of values) {
|
||||||
|
const raw = String(rawValue || '').trim()
|
||||||
|
if (!raw) continue
|
||||||
|
set.add(raw)
|
||||||
|
const cleaned = this.cleanAccountDirName(raw)
|
||||||
|
if (cleaned && cleaned !== raw) {
|
||||||
|
set.add(cleaned)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return Array.from(set)
|
||||||
|
}
|
||||||
|
|
||||||
|
private resolveGroupNicknameByCandidates(groupNicknames: Map<string, string>, candidates: string[]): string {
|
||||||
|
const idCandidates = this.buildIdCandidates(candidates)
|
||||||
|
if (idCandidates.length === 0) return ''
|
||||||
|
|
||||||
|
for (const id of idCandidates) {
|
||||||
|
const exact = this.normalizeGroupNickname(groupNicknames.get(id) || '')
|
||||||
|
if (exact) return exact
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const id of idCandidates) {
|
||||||
|
const lower = id.toLowerCase()
|
||||||
|
let found = ''
|
||||||
|
let matched = 0
|
||||||
|
for (const [key, value] of groupNicknames.entries()) {
|
||||||
|
if (String(key || '').toLowerCase() !== lower) continue
|
||||||
|
const normalized = this.normalizeGroupNickname(value || '')
|
||||||
|
if (!normalized) continue
|
||||||
|
found = normalized
|
||||||
|
matched += 1
|
||||||
|
if (matched > 1) return ''
|
||||||
|
}
|
||||||
|
if (matched === 1 && found) return found
|
||||||
|
}
|
||||||
|
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
private sanitizeWorksheetName(name: string): string {
|
private sanitizeWorksheetName(name: string): string {
|
||||||
const cleaned = (name || '').replace(/[*?:\\/\\[\\]]/g, '_').trim()
|
const cleaned = (name || '').replace(/[*?:\\/\\[\\]]/g, '_').trim()
|
||||||
const limited = cleaned.slice(0, 31)
|
const limited = cleaned.slice(0, 31)
|
||||||
@@ -219,15 +406,24 @@ class GroupAnalyticsService {
|
|||||||
return { success: false, error: result.error || '获取群成员失败' }
|
return { success: false, error: result.error || '获取群成员失败' }
|
||||||
}
|
}
|
||||||
|
|
||||||
const members = result.members as { username: string; avatarUrl?: string }[]
|
const members = result.members as Array<{
|
||||||
|
username: string
|
||||||
|
avatarUrl?: string
|
||||||
|
originalName?: string
|
||||||
|
}>
|
||||||
const usernames = members.map((m) => m.username).filter(Boolean)
|
const usernames = members.map((m) => m.username).filter(Boolean)
|
||||||
|
|
||||||
const [displayNames, groupNicknames] = await Promise.all([
|
const displayNamesPromise = wcdbService.getDisplayNames(usernames)
|
||||||
wcdbService.getDisplayNames(usernames),
|
|
||||||
this.getGroupNicknamesForRoom(chatroomId)
|
|
||||||
])
|
|
||||||
|
|
||||||
const contactMap = new Map<string, { remark?: string; nickName?: string; alias?: string }>()
|
const contactMap = new Map<string, {
|
||||||
|
remark?: string
|
||||||
|
nickName?: string
|
||||||
|
alias?: string
|
||||||
|
username?: string
|
||||||
|
userName?: string
|
||||||
|
encryptUsername?: string
|
||||||
|
encryptUserName?: string
|
||||||
|
}>()
|
||||||
const concurrency = 6
|
const concurrency = 6
|
||||||
await this.parallelLimit(usernames, concurrency, async (username) => {
|
await this.parallelLimit(usernames, concurrency, async (username) => {
|
||||||
const contactResult = await wcdbService.getContact(username)
|
const contactResult = await wcdbService.getContact(username)
|
||||||
@@ -236,13 +432,29 @@ class GroupAnalyticsService {
|
|||||||
contactMap.set(username, {
|
contactMap.set(username, {
|
||||||
remark: contact.remark || '',
|
remark: contact.remark || '',
|
||||||
nickName: contact.nickName || contact.nick_name || '',
|
nickName: contact.nickName || contact.nick_name || '',
|
||||||
alias: contact.alias || ''
|
alias: contact.alias || '',
|
||||||
|
username: contact.username || '',
|
||||||
|
userName: contact.userName || contact.user_name || '',
|
||||||
|
encryptUsername: contact.encryptUsername || contact.encrypt_username || '',
|
||||||
|
encryptUserName: contact.encryptUserName || ''
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
contactMap.set(username, { remark: '', nickName: '', alias: '' })
|
contactMap.set(username, { remark: '', nickName: '', alias: '' })
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const displayNames = await displayNamesPromise
|
||||||
|
const nicknameCandidates = this.buildIdCandidates([
|
||||||
|
...members.map((m) => m.username),
|
||||||
|
...members.map((m) => m.originalName),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.username),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.userName),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.encryptUsername),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.encryptUserName),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.alias)
|
||||||
|
])
|
||||||
|
const groupNicknames = await this.getGroupNicknamesForRoom(chatroomId, nicknameCandidates)
|
||||||
|
|
||||||
const myWxid = this.cleanAccountDirName(this.configService.get('myWxid') || '')
|
const myWxid = this.cleanAccountDirName(this.configService.get('myWxid') || '')
|
||||||
const data: GroupMember[] = members.map((m) => {
|
const data: GroupMember[] = members.map((m) => {
|
||||||
const wxid = m.username || ''
|
const wxid = m.username || ''
|
||||||
@@ -251,13 +463,20 @@ class GroupAnalyticsService {
|
|||||||
const nickname = contact?.nickName || ''
|
const nickname = contact?.nickName || ''
|
||||||
const remark = contact?.remark || ''
|
const remark = contact?.remark || ''
|
||||||
const alias = contact?.alias || ''
|
const alias = contact?.alias || ''
|
||||||
const rawGroupNickname = groupNicknames.get(wxid.toLowerCase()) || ''
|
|
||||||
const normalizedWxid = this.cleanAccountDirName(wxid)
|
const normalizedWxid = this.cleanAccountDirName(wxid)
|
||||||
const groupNickname = this.normalizeGroupNickname(
|
const lookupCandidates = this.buildIdCandidates([
|
||||||
rawGroupNickname,
|
wxid,
|
||||||
normalizedWxid === myWxid ? myWxid : wxid,
|
m.originalName,
|
||||||
''
|
contact?.username,
|
||||||
)
|
contact?.userName,
|
||||||
|
contact?.encryptUsername,
|
||||||
|
contact?.encryptUserName,
|
||||||
|
alias
|
||||||
|
])
|
||||||
|
if (normalizedWxid === myWxid) {
|
||||||
|
lookupCandidates.push(myWxid)
|
||||||
|
}
|
||||||
|
const groupNickname = this.resolveGroupNicknameByCandidates(groupNicknames, lookupCandidates)
|
||||||
|
|
||||||
return {
|
return {
|
||||||
username: wxid,
|
username: wxid,
|
||||||
@@ -418,18 +637,27 @@ class GroupAnalyticsService {
|
|||||||
return { success: false, error: membersResult.error || '获取群成员失败' }
|
return { success: false, error: membersResult.error || '获取群成员失败' }
|
||||||
}
|
}
|
||||||
|
|
||||||
const members = membersResult.members as { username: string; avatarUrl?: string }[]
|
const members = membersResult.members as Array<{
|
||||||
|
username: string
|
||||||
|
avatarUrl?: string
|
||||||
|
originalName?: string
|
||||||
|
}>
|
||||||
if (members.length === 0) {
|
if (members.length === 0) {
|
||||||
return { success: false, error: '群成员为空' }
|
return { success: false, error: '群成员为空' }
|
||||||
}
|
}
|
||||||
|
|
||||||
const usernames = members.map((m) => m.username).filter(Boolean)
|
const usernames = members.map((m) => m.username).filter(Boolean)
|
||||||
const [displayNames, groupNicknames] = await Promise.all([
|
const displayNamesPromise = wcdbService.getDisplayNames(usernames)
|
||||||
wcdbService.getDisplayNames(usernames),
|
|
||||||
this.getGroupNicknamesForRoom(chatroomId)
|
|
||||||
])
|
|
||||||
|
|
||||||
const contactMap = new Map<string, { remark?: string; nickName?: string; alias?: string }>()
|
const contactMap = new Map<string, {
|
||||||
|
remark?: string
|
||||||
|
nickName?: string
|
||||||
|
alias?: string
|
||||||
|
username?: string
|
||||||
|
userName?: string
|
||||||
|
encryptUsername?: string
|
||||||
|
encryptUserName?: string
|
||||||
|
}>()
|
||||||
const concurrency = 6
|
const concurrency = 6
|
||||||
await this.parallelLimit(usernames, concurrency, async (username) => {
|
await this.parallelLimit(usernames, concurrency, async (username) => {
|
||||||
const result = await wcdbService.getContact(username)
|
const result = await wcdbService.getContact(username)
|
||||||
@@ -438,7 +666,11 @@ class GroupAnalyticsService {
|
|||||||
contactMap.set(username, {
|
contactMap.set(username, {
|
||||||
remark: contact.remark || '',
|
remark: contact.remark || '',
|
||||||
nickName: contact.nickName || contact.nick_name || '',
|
nickName: contact.nickName || contact.nick_name || '',
|
||||||
alias: contact.alias || ''
|
alias: contact.alias || '',
|
||||||
|
username: contact.username || '',
|
||||||
|
userName: contact.userName || contact.user_name || '',
|
||||||
|
encryptUsername: contact.encryptUsername || contact.encrypt_username || '',
|
||||||
|
encryptUserName: contact.encryptUserName || ''
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
contactMap.set(username, { remark: '', nickName: '', alias: '' })
|
contactMap.set(username, { remark: '', nickName: '', alias: '' })
|
||||||
@@ -453,6 +685,18 @@ class GroupAnalyticsService {
|
|||||||
const rows: string[][] = [infoTitleRow, infoRow, metaRow, header]
|
const rows: string[][] = [infoTitleRow, infoRow, metaRow, header]
|
||||||
const myWxid = this.cleanAccountDirName(this.configService.get('myWxid') || '')
|
const myWxid = this.cleanAccountDirName(this.configService.get('myWxid') || '')
|
||||||
|
|
||||||
|
const displayNames = await displayNamesPromise
|
||||||
|
const nicknameCandidates = this.buildIdCandidates([
|
||||||
|
...members.map((m) => m.username),
|
||||||
|
...members.map((m) => m.originalName),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.username),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.userName),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.encryptUsername),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.encryptUserName),
|
||||||
|
...Array.from(contactMap.values()).map((c) => c?.alias)
|
||||||
|
])
|
||||||
|
const groupNicknames = await this.getGroupNicknamesForRoom(chatroomId, nicknameCandidates)
|
||||||
|
|
||||||
for (const member of members) {
|
for (const member of members) {
|
||||||
const wxid = member.username
|
const wxid = member.username
|
||||||
const normalizedWxid = this.cleanAccountDirName(wxid || '')
|
const normalizedWxid = this.cleanAccountDirName(wxid || '')
|
||||||
@@ -460,13 +704,20 @@ class GroupAnalyticsService {
|
|||||||
const fallbackName = displayNames.success && displayNames.map ? (displayNames.map[wxid] || '') : ''
|
const fallbackName = displayNames.success && displayNames.map ? (displayNames.map[wxid] || '') : ''
|
||||||
const nickName = contact?.nickName || fallbackName || ''
|
const nickName = contact?.nickName || fallbackName || ''
|
||||||
const remark = contact?.remark || ''
|
const remark = contact?.remark || ''
|
||||||
const rawGroupNickname = groupNicknames.get(wxid.toLowerCase()) || ''
|
|
||||||
const alias = contact?.alias || ''
|
const alias = contact?.alias || ''
|
||||||
const groupNickname = this.normalizeGroupNickname(
|
const lookupCandidates = this.buildIdCandidates([
|
||||||
rawGroupNickname,
|
wxid,
|
||||||
normalizedWxid === myWxid ? myWxid : wxid,
|
member.originalName,
|
||||||
''
|
contact?.username,
|
||||||
)
|
contact?.userName,
|
||||||
|
contact?.encryptUsername,
|
||||||
|
contact?.encryptUserName,
|
||||||
|
alias
|
||||||
|
])
|
||||||
|
if (normalizedWxid === myWxid) {
|
||||||
|
lookupCandidates.push(myWxid)
|
||||||
|
}
|
||||||
|
const groupNickname = this.resolveGroupNicknameByCandidates(groupNicknames, lookupCandidates)
|
||||||
|
|
||||||
rows.push([nickName, remark, groupNickname, wxid, alias])
|
rows.push([nickName, remark, groupNickname, wxid, alias])
|
||||||
}
|
}
|
||||||
|
|||||||
745
electron/services/httpService.ts
Normal file
745
electron/services/httpService.ts
Normal file
@@ -0,0 +1,745 @@
|
|||||||
|
/**
|
||||||
|
* HTTP API 服务
|
||||||
|
* 提供 ChatLab 标准化格式的消息查询 API
|
||||||
|
*/
|
||||||
|
import * as http from 'http'
|
||||||
|
import { URL } from 'url'
|
||||||
|
import { chatService, Message } from './chatService'
|
||||||
|
import { wcdbService } from './wcdbService'
|
||||||
|
import { ConfigService } from './config'
|
||||||
|
|
||||||
|
// ChatLab 格式定义
|
||||||
|
interface ChatLabHeader {
|
||||||
|
version: string
|
||||||
|
exportedAt: number
|
||||||
|
generator: string
|
||||||
|
description?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChatLabMeta {
|
||||||
|
name: string
|
||||||
|
platform: string
|
||||||
|
type: 'group' | 'private'
|
||||||
|
groupId?: string
|
||||||
|
groupAvatar?: string
|
||||||
|
ownerId?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChatLabMember {
|
||||||
|
platformId: string
|
||||||
|
accountName: string
|
||||||
|
groupNickname?: string
|
||||||
|
aliases?: string[]
|
||||||
|
avatar?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChatLabMessage {
|
||||||
|
sender: string
|
||||||
|
accountName: string
|
||||||
|
groupNickname?: string
|
||||||
|
timestamp: number
|
||||||
|
type: number
|
||||||
|
content: string | null
|
||||||
|
platformMessageId?: string
|
||||||
|
replyToMessageId?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ChatLabData {
|
||||||
|
chatlab: ChatLabHeader
|
||||||
|
meta: ChatLabMeta
|
||||||
|
members: ChatLabMember[]
|
||||||
|
messages: ChatLabMessage[]
|
||||||
|
}
|
||||||
|
|
||||||
|
// ChatLab 消息类型映射
|
||||||
|
const ChatLabType = {
|
||||||
|
TEXT: 0,
|
||||||
|
IMAGE: 1,
|
||||||
|
VOICE: 2,
|
||||||
|
VIDEO: 3,
|
||||||
|
FILE: 4,
|
||||||
|
EMOJI: 5,
|
||||||
|
LINK: 7,
|
||||||
|
LOCATION: 8,
|
||||||
|
RED_PACKET: 20,
|
||||||
|
TRANSFER: 21,
|
||||||
|
POKE: 22,
|
||||||
|
CALL: 23,
|
||||||
|
SHARE: 24,
|
||||||
|
REPLY: 25,
|
||||||
|
FORWARD: 26,
|
||||||
|
CONTACT: 27,
|
||||||
|
SYSTEM: 80,
|
||||||
|
RECALL: 81,
|
||||||
|
OTHER: 99
|
||||||
|
} as const
|
||||||
|
|
||||||
|
class HttpService {
|
||||||
|
private server: http.Server | null = null
|
||||||
|
private configService: ConfigService
|
||||||
|
private port: number = 5031
|
||||||
|
private running: boolean = false
|
||||||
|
private connections: Set<import('net').Socket> = new Set()
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this.configService = ConfigService.getInstance()
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 启动 HTTP 服务
|
||||||
|
*/
|
||||||
|
async start(port: number = 5031): Promise<{ success: boolean; port?: number; error?: string }> {
|
||||||
|
if (this.running && this.server) {
|
||||||
|
return { success: true, port: this.port }
|
||||||
|
}
|
||||||
|
|
||||||
|
this.port = port
|
||||||
|
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
this.server = http.createServer((req, res) => this.handleRequest(req, res))
|
||||||
|
|
||||||
|
// 跟踪所有连接,以便关闭时能强制断开
|
||||||
|
this.server.on('connection', (socket) => {
|
||||||
|
this.connections.add(socket)
|
||||||
|
socket.on('close', () => {
|
||||||
|
this.connections.delete(socket)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
this.server.on('error', (err: NodeJS.ErrnoException) => {
|
||||||
|
if (err.code === 'EADDRINUSE') {
|
||||||
|
console.error(`[HttpService] Port ${this.port} is already in use`)
|
||||||
|
resolve({ success: false, error: `Port ${this.port} is already in use` })
|
||||||
|
} else {
|
||||||
|
console.error('[HttpService] Server error:', err)
|
||||||
|
resolve({ success: false, error: err.message })
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
this.server.listen(this.port, '127.0.0.1', () => {
|
||||||
|
this.running = true
|
||||||
|
console.log(`[HttpService] HTTP API server started on http://127.0.0.1:${this.port}`)
|
||||||
|
resolve({ success: true, port: this.port })
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 停止 HTTP 服务
|
||||||
|
*/
|
||||||
|
async stop(): Promise<void> {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
if (this.server) {
|
||||||
|
// 强制关闭所有活动连接
|
||||||
|
for (const socket of this.connections) {
|
||||||
|
socket.destroy()
|
||||||
|
}
|
||||||
|
this.connections.clear()
|
||||||
|
|
||||||
|
this.server.close(() => {
|
||||||
|
this.running = false
|
||||||
|
this.server = null
|
||||||
|
console.log('[HttpService] HTTP API server stopped')
|
||||||
|
resolve()
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.running = false
|
||||||
|
resolve()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 检查服务是否运行
|
||||||
|
*/
|
||||||
|
isRunning(): boolean {
|
||||||
|
return this.running
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取当前端口
|
||||||
|
*/
|
||||||
|
getPort(): number {
|
||||||
|
return this.port
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 处理 HTTP 请求
|
||||||
|
*/
|
||||||
|
private async handleRequest(req: http.IncomingMessage, res: http.ServerResponse): Promise<void> {
|
||||||
|
// 设置 CORS 头
|
||||||
|
res.setHeader('Access-Control-Allow-Origin', '*')
|
||||||
|
res.setHeader('Access-Control-Allow-Methods', 'GET, OPTIONS')
|
||||||
|
res.setHeader('Access-Control-Allow-Headers', 'Content-Type')
|
||||||
|
|
||||||
|
if (req.method === 'OPTIONS') {
|
||||||
|
res.writeHead(204)
|
||||||
|
res.end()
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const url = new URL(req.url || '/', `http://127.0.0.1:${this.port}`)
|
||||||
|
const pathname = url.pathname
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 路由处理
|
||||||
|
if (pathname === '/health' || pathname === '/api/v1/health') {
|
||||||
|
this.sendJson(res, { status: 'ok' })
|
||||||
|
} else if (pathname === '/api/v1/messages') {
|
||||||
|
await this.handleMessages(url, res)
|
||||||
|
} else if (pathname === '/api/v1/sessions') {
|
||||||
|
await this.handleSessions(url, res)
|
||||||
|
} else if (pathname === '/api/v1/contacts') {
|
||||||
|
await this.handleContacts(url, res)
|
||||||
|
} else {
|
||||||
|
this.sendError(res, 404, 'Not Found')
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('[HttpService] Request error:', error)
|
||||||
|
this.sendError(res, 500, String(error))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 批量获取消息(循环游标直到满足 limit)
|
||||||
|
* 绕过 chatService 的单 batch 限制,直接操作 wcdbService 游标
|
||||||
|
*/
|
||||||
|
private async fetchMessagesBatch(
|
||||||
|
talker: string,
|
||||||
|
offset: number,
|
||||||
|
limit: number,
|
||||||
|
startTime: number,
|
||||||
|
endTime: number,
|
||||||
|
ascending: boolean
|
||||||
|
): Promise<{ success: boolean; messages?: Message[]; hasMore?: boolean; error?: string }> {
|
||||||
|
try {
|
||||||
|
// 使用固定 batch 大小(与 limit 相同或最大 500)来减少循环次数
|
||||||
|
const batchSize = Math.min(limit, 500)
|
||||||
|
const beginTimestamp = startTime > 10000000000 ? Math.floor(startTime / 1000) : startTime
|
||||||
|
const endTimestamp = endTime > 10000000000 ? Math.floor(endTime / 1000) : endTime
|
||||||
|
|
||||||
|
const cursorResult = await wcdbService.openMessageCursor(talker, batchSize, ascending, beginTimestamp, endTimestamp)
|
||||||
|
if (!cursorResult.success || !cursorResult.cursor) {
|
||||||
|
return { success: false, error: cursorResult.error || '打开消息游标失败' }
|
||||||
|
}
|
||||||
|
|
||||||
|
const cursor = cursorResult.cursor
|
||||||
|
try {
|
||||||
|
const allRows: Record<string, any>[] = []
|
||||||
|
let hasMore = true
|
||||||
|
let skipped = 0
|
||||||
|
|
||||||
|
// 循环获取消息,处理 offset 跳过 + limit 累积
|
||||||
|
while (allRows.length < limit && hasMore) {
|
||||||
|
const batch = await wcdbService.fetchMessageBatch(cursor)
|
||||||
|
if (!batch.success || !batch.rows || batch.rows.length === 0) {
|
||||||
|
hasMore = false
|
||||||
|
break
|
||||||
|
}
|
||||||
|
|
||||||
|
let rows = batch.rows
|
||||||
|
hasMore = batch.hasMore === true
|
||||||
|
|
||||||
|
// 处理 offset: 跳过前 N 条
|
||||||
|
if (skipped < offset) {
|
||||||
|
const remaining = offset - skipped
|
||||||
|
if (remaining >= rows.length) {
|
||||||
|
skipped += rows.length
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
rows = rows.slice(remaining)
|
||||||
|
skipped = offset
|
||||||
|
}
|
||||||
|
|
||||||
|
allRows.push(...rows)
|
||||||
|
}
|
||||||
|
|
||||||
|
const trimmedRows = allRows.slice(0, limit)
|
||||||
|
const finalHasMore = hasMore || allRows.length > limit
|
||||||
|
const messages = this.mapRowsToMessagesSimple(trimmedRows)
|
||||||
|
return { success: true, messages, hasMore: finalHasMore }
|
||||||
|
} finally {
|
||||||
|
await wcdbService.closeMessageCursor(cursor)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[HttpService] fetchMessagesBatch error:', e)
|
||||||
|
return { success: false, error: String(e) }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 简单的行数据到 Message 映射(用于 API 输出)
|
||||||
|
*/
|
||||||
|
private mapRowsToMessagesSimple(rows: Record<string, any>[]): Message[] {
|
||||||
|
const myWxid = this.configService.get('myWxid') || ''
|
||||||
|
const messages: Message[] = []
|
||||||
|
|
||||||
|
for (const row of rows) {
|
||||||
|
const content = this.getField(row, ['message_content', 'messageContent', 'content', 'msg_content', 'WCDB_CT_message_content']) || ''
|
||||||
|
const localType = parseInt(this.getField(row, ['local_type', 'localType', 'type', 'msg_type', 'WCDB_CT_local_type']) || '1', 10)
|
||||||
|
const isSendRaw = this.getField(row, ['computed_is_send', 'computedIsSend', 'is_send', 'isSend', 'WCDB_CT_is_send'])
|
||||||
|
const senderUsername = this.getField(row, ['sender_username', 'senderUsername', 'sender', 'WCDB_CT_sender_username']) || ''
|
||||||
|
const createTime = parseInt(this.getField(row, ['create_time', 'createTime', 'msg_create_time', 'WCDB_CT_create_time']) || '0', 10)
|
||||||
|
const localId = parseInt(this.getField(row, ['local_id', 'localId', 'WCDB_CT_local_id', 'rowid']) || '0', 10)
|
||||||
|
const serverId = this.getField(row, ['server_id', 'serverId', 'WCDB_CT_server_id']) || ''
|
||||||
|
|
||||||
|
let isSend: number
|
||||||
|
if (isSendRaw !== null && isSendRaw !== undefined) {
|
||||||
|
isSend = parseInt(isSendRaw, 10)
|
||||||
|
} else if (senderUsername && myWxid) {
|
||||||
|
isSend = senderUsername.toLowerCase() === myWxid.toLowerCase() ? 1 : 0
|
||||||
|
} else {
|
||||||
|
isSend = 0
|
||||||
|
}
|
||||||
|
|
||||||
|
// 解析消息内容中的特殊字段
|
||||||
|
let parsedContent = content
|
||||||
|
let xmlType: string | undefined
|
||||||
|
let linkTitle: string | undefined
|
||||||
|
let fileName: string | undefined
|
||||||
|
let emojiCdnUrl: string | undefined
|
||||||
|
let emojiMd5: string | undefined
|
||||||
|
let imageMd5: string | undefined
|
||||||
|
let videoMd5: string | undefined
|
||||||
|
let cardNickname: string | undefined
|
||||||
|
|
||||||
|
if (localType === 49 && content) {
|
||||||
|
// 提取 type 子标签
|
||||||
|
const typeMatch = /<type>(\d+)<\/type>/i.exec(content)
|
||||||
|
if (typeMatch) xmlType = typeMatch[1]
|
||||||
|
// 提取 title
|
||||||
|
const titleMatch = /<title>([^<]*)<\/title>/i.exec(content)
|
||||||
|
if (titleMatch) linkTitle = titleMatch[1]
|
||||||
|
// 提取文件名
|
||||||
|
const fnMatch = /<title>([^<]*)<\/title>/i.exec(content)
|
||||||
|
if (fnMatch) fileName = fnMatch[1]
|
||||||
|
}
|
||||||
|
|
||||||
|
if (localType === 47 && content) {
|
||||||
|
const cdnMatch = /cdnurl\s*=\s*"([^"]+)"/i.exec(content)
|
||||||
|
if (cdnMatch) emojiCdnUrl = cdnMatch[1]
|
||||||
|
const md5Match = /md5\s*=\s*"([^"]+)"/i.exec(content)
|
||||||
|
if (md5Match) emojiMd5 = md5Match[1]
|
||||||
|
}
|
||||||
|
|
||||||
|
messages.push({
|
||||||
|
localId,
|
||||||
|
talker: '',
|
||||||
|
localType,
|
||||||
|
createTime,
|
||||||
|
sortSeq: createTime,
|
||||||
|
content: parsedContent,
|
||||||
|
isSend,
|
||||||
|
senderUsername,
|
||||||
|
serverId: serverId ? parseInt(serverId, 10) || 0 : 0,
|
||||||
|
rawContent: content,
|
||||||
|
parsedContent: content,
|
||||||
|
emojiCdnUrl,
|
||||||
|
emojiMd5,
|
||||||
|
imageMd5,
|
||||||
|
videoMd5,
|
||||||
|
xmlType,
|
||||||
|
linkTitle,
|
||||||
|
fileName,
|
||||||
|
cardNickname
|
||||||
|
} as Message)
|
||||||
|
}
|
||||||
|
|
||||||
|
return messages
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 从行数据中获取字段值(兼容多种字段名)
|
||||||
|
*/
|
||||||
|
private getField(row: Record<string, any>, keys: string[]): string | null {
|
||||||
|
for (const key of keys) {
|
||||||
|
if (row[key] !== undefined && row[key] !== null) {
|
||||||
|
return String(row[key])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 处理消息查询
|
||||||
|
* GET /api/v1/messages?talker=xxx&limit=100&start=20260101&chatlab=1
|
||||||
|
*/
|
||||||
|
private async handleMessages(url: URL, res: http.ServerResponse): Promise<void> {
|
||||||
|
const talker = url.searchParams.get('talker')
|
||||||
|
const limit = Math.min(parseInt(url.searchParams.get('limit') || '100', 10), 10000)
|
||||||
|
const offset = parseInt(url.searchParams.get('offset') || '0', 10)
|
||||||
|
const startParam = url.searchParams.get('start')
|
||||||
|
const endParam = url.searchParams.get('end')
|
||||||
|
const chatlab = url.searchParams.get('chatlab') === '1'
|
||||||
|
const formatParam = url.searchParams.get('format')
|
||||||
|
const format = formatParam || (chatlab ? 'chatlab' : 'json')
|
||||||
|
|
||||||
|
if (!talker) {
|
||||||
|
this.sendError(res, 400, 'Missing required parameter: talker')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 解析时间参数 (支持 YYYYMMDD 格式)
|
||||||
|
const startTime = this.parseTimeParam(startParam)
|
||||||
|
const endTime = this.parseTimeParam(endParam, true)
|
||||||
|
|
||||||
|
// 使用批量获取方法,绕过 chatService 的单 batch 限制
|
||||||
|
const result = await this.fetchMessagesBatch(talker, offset, limit, startTime, endTime, true)
|
||||||
|
if (!result.success || !result.messages) {
|
||||||
|
this.sendError(res, 500, result.error || 'Failed to get messages')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (format === 'chatlab') {
|
||||||
|
// 获取会话显示名
|
||||||
|
const displayNames = await this.getDisplayNames([talker])
|
||||||
|
const talkerName = displayNames[talker] || talker
|
||||||
|
|
||||||
|
const chatLabData = await this.convertToChatLab(result.messages, talker, talkerName)
|
||||||
|
this.sendJson(res, chatLabData)
|
||||||
|
} else {
|
||||||
|
// 返回原始消息格式
|
||||||
|
this.sendJson(res, {
|
||||||
|
success: true,
|
||||||
|
talker,
|
||||||
|
count: result.messages.length,
|
||||||
|
hasMore: result.hasMore,
|
||||||
|
messages: result.messages
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 处理会话列表查询
|
||||||
|
* GET /api/v1/sessions?keyword=xxx&limit=100
|
||||||
|
*/
|
||||||
|
private async handleSessions(url: URL, res: http.ServerResponse): Promise<void> {
|
||||||
|
const keyword = url.searchParams.get('keyword') || ''
|
||||||
|
const limit = parseInt(url.searchParams.get('limit') || '100', 10)
|
||||||
|
|
||||||
|
try {
|
||||||
|
const sessions = await chatService.getSessions()
|
||||||
|
if (!sessions.success || !sessions.sessions) {
|
||||||
|
this.sendError(res, 500, sessions.error || 'Failed to get sessions')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
let filteredSessions = sessions.sessions
|
||||||
|
if (keyword) {
|
||||||
|
const lowerKeyword = keyword.toLowerCase()
|
||||||
|
filteredSessions = sessions.sessions.filter(s =>
|
||||||
|
s.username.toLowerCase().includes(lowerKeyword) ||
|
||||||
|
(s.displayName && s.displayName.toLowerCase().includes(lowerKeyword))
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 应用 limit
|
||||||
|
const limitedSessions = filteredSessions.slice(0, limit)
|
||||||
|
|
||||||
|
this.sendJson(res, {
|
||||||
|
success: true,
|
||||||
|
count: limitedSessions.length,
|
||||||
|
sessions: limitedSessions.map(s => ({
|
||||||
|
username: s.username,
|
||||||
|
displayName: s.displayName,
|
||||||
|
type: s.type,
|
||||||
|
lastTimestamp: s.lastTimestamp,
|
||||||
|
unreadCount: s.unreadCount
|
||||||
|
}))
|
||||||
|
})
|
||||||
|
} catch (error) {
|
||||||
|
this.sendError(res, 500, String(error))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 处理联系人查询
|
||||||
|
* GET /api/v1/contacts?keyword=xxx&limit=100
|
||||||
|
*/
|
||||||
|
private async handleContacts(url: URL, res: http.ServerResponse): Promise<void> {
|
||||||
|
const keyword = url.searchParams.get('keyword') || ''
|
||||||
|
const limit = parseInt(url.searchParams.get('limit') || '100', 10)
|
||||||
|
|
||||||
|
try {
|
||||||
|
const contacts = await chatService.getContacts()
|
||||||
|
if (!contacts.success || !contacts.contacts) {
|
||||||
|
this.sendError(res, 500, contacts.error || 'Failed to get contacts')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
let filteredContacts = contacts.contacts
|
||||||
|
if (keyword) {
|
||||||
|
const lowerKeyword = keyword.toLowerCase()
|
||||||
|
filteredContacts = contacts.contacts.filter(c =>
|
||||||
|
c.username.toLowerCase().includes(lowerKeyword) ||
|
||||||
|
(c.nickname && c.nickname.toLowerCase().includes(lowerKeyword)) ||
|
||||||
|
(c.remark && c.remark.toLowerCase().includes(lowerKeyword)) ||
|
||||||
|
(c.displayName && c.displayName.toLowerCase().includes(lowerKeyword))
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const limited = filteredContacts.slice(0, limit)
|
||||||
|
|
||||||
|
this.sendJson(res, {
|
||||||
|
success: true,
|
||||||
|
count: limited.length,
|
||||||
|
contacts: limited
|
||||||
|
})
|
||||||
|
} catch (error) {
|
||||||
|
this.sendError(res, 500, String(error))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 解析时间参数
|
||||||
|
* 支持 YYYYMMDD 格式,返回秒级时间戳
|
||||||
|
*/
|
||||||
|
private parseTimeParam(param: string | null, isEnd: boolean = false): number {
|
||||||
|
if (!param) return 0
|
||||||
|
|
||||||
|
// 纯数字且长度为8,视为 YYYYMMDD
|
||||||
|
if (/^\d{8}$/.test(param)) {
|
||||||
|
const year = parseInt(param.slice(0, 4), 10)
|
||||||
|
const month = parseInt(param.slice(4, 6), 10) - 1
|
||||||
|
const day = parseInt(param.slice(6, 8), 10)
|
||||||
|
const date = new Date(year, month, day)
|
||||||
|
if (isEnd) {
|
||||||
|
// 结束时间设为当天 23:59:59
|
||||||
|
date.setHours(23, 59, 59, 999)
|
||||||
|
}
|
||||||
|
return Math.floor(date.getTime() / 1000)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 纯数字,视为时间戳
|
||||||
|
if (/^\d+$/.test(param)) {
|
||||||
|
const ts = parseInt(param, 10)
|
||||||
|
// 如果是毫秒级时间戳,转为秒级
|
||||||
|
return ts > 10000000000 ? Math.floor(ts / 1000) : ts
|
||||||
|
}
|
||||||
|
|
||||||
|
return 0
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取显示名称
|
||||||
|
*/
|
||||||
|
private async getDisplayNames(usernames: string[]): Promise<Record<string, string>> {
|
||||||
|
try {
|
||||||
|
const result = await wcdbService.getDisplayNames(usernames)
|
||||||
|
if (result.success && result.map) {
|
||||||
|
return result.map
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[HttpService] Failed to get display names:', e)
|
||||||
|
}
|
||||||
|
// 返回空对象,调用方会使用 username 作为备用
|
||||||
|
return {}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 转换为 ChatLab 格式
|
||||||
|
*/
|
||||||
|
private async convertToChatLab(messages: Message[], talkerId: string, talkerName: string): Promise<ChatLabData> {
|
||||||
|
const isGroup = talkerId.endsWith('@chatroom')
|
||||||
|
const myWxid = this.configService.get('myWxid') || ''
|
||||||
|
|
||||||
|
// 收集所有发送者
|
||||||
|
const senderSet = new Set<string>()
|
||||||
|
for (const msg of messages) {
|
||||||
|
if (msg.senderUsername) {
|
||||||
|
senderSet.add(msg.senderUsername)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取发送者显示名
|
||||||
|
const senderNames = await this.getDisplayNames(Array.from(senderSet))
|
||||||
|
|
||||||
|
// 获取群昵称(如果是群聊)
|
||||||
|
let groupNicknamesMap = new Map<string, string>()
|
||||||
|
if (isGroup) {
|
||||||
|
try {
|
||||||
|
const result = await wcdbService.getGroupNicknames(talkerId)
|
||||||
|
if (result.success && result.nicknames) {
|
||||||
|
groupNicknamesMap = new Map(Object.entries(result.nicknames))
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[HttpService] Failed to get group nicknames:', e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 构建成员列表
|
||||||
|
const memberMap = new Map<string, ChatLabMember>()
|
||||||
|
for (const msg of messages) {
|
||||||
|
const sender = msg.senderUsername || ''
|
||||||
|
if (sender && !memberMap.has(sender)) {
|
||||||
|
const displayName = senderNames[sender] || sender
|
||||||
|
const isSelf = sender === myWxid || sender.toLowerCase() === myWxid.toLowerCase()
|
||||||
|
// 获取群昵称(尝试多种方式)
|
||||||
|
const groupNickname = isGroup
|
||||||
|
? (groupNicknamesMap.get(sender) || groupNicknamesMap.get(sender.toLowerCase()) || '')
|
||||||
|
: ''
|
||||||
|
memberMap.set(sender, {
|
||||||
|
platformId: sender,
|
||||||
|
accountName: isSelf ? '我' : displayName,
|
||||||
|
groupNickname: groupNickname || undefined
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 转换消息
|
||||||
|
const chatLabMessages: ChatLabMessage[] = messages.map(msg => {
|
||||||
|
const sender = msg.senderUsername || ''
|
||||||
|
const isSelf = msg.isSend === 1 || sender === myWxid
|
||||||
|
const accountName = isSelf ? '我' : (senderNames[sender] || sender)
|
||||||
|
// 获取该发送者的群昵称
|
||||||
|
const groupNickname = isGroup
|
||||||
|
? (groupNicknamesMap.get(sender) || groupNicknamesMap.get(sender.toLowerCase()) || '')
|
||||||
|
: ''
|
||||||
|
|
||||||
|
return {
|
||||||
|
sender,
|
||||||
|
accountName,
|
||||||
|
groupNickname: groupNickname || undefined,
|
||||||
|
timestamp: msg.createTime,
|
||||||
|
type: this.mapMessageType(msg.localType, msg),
|
||||||
|
content: this.getMessageContent(msg),
|
||||||
|
platformMessageId: msg.serverId ? String(msg.serverId) : undefined
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
return {
|
||||||
|
chatlab: {
|
||||||
|
version: '0.0.2',
|
||||||
|
exportedAt: Math.floor(Date.now() / 1000),
|
||||||
|
generator: 'WeFlow'
|
||||||
|
},
|
||||||
|
meta: {
|
||||||
|
name: talkerName,
|
||||||
|
platform: 'wechat',
|
||||||
|
type: isGroup ? 'group' : 'private',
|
||||||
|
groupId: isGroup ? talkerId : undefined,
|
||||||
|
ownerId: myWxid || undefined
|
||||||
|
},
|
||||||
|
members: Array.from(memberMap.values()),
|
||||||
|
messages: chatLabMessages
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 映射 WeChat 消息类型到 ChatLab 类型
|
||||||
|
*/
|
||||||
|
private mapMessageType(localType: number, msg: Message): number {
|
||||||
|
switch (localType) {
|
||||||
|
case 1: // 文本
|
||||||
|
return ChatLabType.TEXT
|
||||||
|
case 3: // 图片
|
||||||
|
return ChatLabType.IMAGE
|
||||||
|
case 34: // 语音
|
||||||
|
return ChatLabType.VOICE
|
||||||
|
case 43: // 视频
|
||||||
|
return ChatLabType.VIDEO
|
||||||
|
case 47: // 动画表情
|
||||||
|
return ChatLabType.EMOJI
|
||||||
|
case 48: // 位置
|
||||||
|
return ChatLabType.LOCATION
|
||||||
|
case 42: // 名片
|
||||||
|
return ChatLabType.CONTACT
|
||||||
|
case 50: // 语音/视频通话
|
||||||
|
return ChatLabType.CALL
|
||||||
|
case 10000: // 系统消息
|
||||||
|
return ChatLabType.SYSTEM
|
||||||
|
case 49: // 复合消息
|
||||||
|
return this.mapType49(msg)
|
||||||
|
case 244813135921: // 引用消息
|
||||||
|
return ChatLabType.REPLY
|
||||||
|
case 266287972401: // 拍一拍
|
||||||
|
return ChatLabType.POKE
|
||||||
|
case 8594229559345: // 红包
|
||||||
|
return ChatLabType.RED_PACKET
|
||||||
|
case 8589934592049: // 转账
|
||||||
|
return ChatLabType.TRANSFER
|
||||||
|
default:
|
||||||
|
return ChatLabType.OTHER
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 映射 Type 49 子类型
|
||||||
|
*/
|
||||||
|
private mapType49(msg: Message): number {
|
||||||
|
const xmlType = msg.xmlType
|
||||||
|
|
||||||
|
switch (xmlType) {
|
||||||
|
case '5': // 链接
|
||||||
|
case '49':
|
||||||
|
return ChatLabType.LINK
|
||||||
|
case '6': // 文件
|
||||||
|
return ChatLabType.FILE
|
||||||
|
case '19': // 聊天记录
|
||||||
|
return ChatLabType.FORWARD
|
||||||
|
case '33': // 小程序
|
||||||
|
case '36':
|
||||||
|
return ChatLabType.SHARE
|
||||||
|
case '57': // 引用消息
|
||||||
|
return ChatLabType.REPLY
|
||||||
|
case '2000': // 转账
|
||||||
|
return ChatLabType.TRANSFER
|
||||||
|
case '2001': // 红包
|
||||||
|
return ChatLabType.RED_PACKET
|
||||||
|
default:
|
||||||
|
return ChatLabType.OTHER
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取消息内容
|
||||||
|
*/
|
||||||
|
private getMessageContent(msg: Message): string | null {
|
||||||
|
// 优先使用已解析的内容
|
||||||
|
if (msg.parsedContent) {
|
||||||
|
return msg.parsedContent
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据类型返回占位符
|
||||||
|
switch (msg.localType) {
|
||||||
|
case 1:
|
||||||
|
return msg.rawContent || null
|
||||||
|
case 3:
|
||||||
|
return msg.imageMd5 || '[图片]'
|
||||||
|
case 34:
|
||||||
|
return '[语音]'
|
||||||
|
case 43:
|
||||||
|
return msg.videoMd5 || '[视频]'
|
||||||
|
case 47:
|
||||||
|
return msg.emojiCdnUrl || msg.emojiMd5 || '[表情]'
|
||||||
|
case 42:
|
||||||
|
return msg.cardNickname || '[名片]'
|
||||||
|
case 48:
|
||||||
|
return '[位置]'
|
||||||
|
case 49:
|
||||||
|
return msg.linkTitle || msg.fileName || '[消息]'
|
||||||
|
default:
|
||||||
|
return msg.rawContent || null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 发送 JSON 响应
|
||||||
|
*/
|
||||||
|
private sendJson(res: http.ServerResponse, data: any): void {
|
||||||
|
res.setHeader('Content-Type', 'application/json; charset=utf-8')
|
||||||
|
res.writeHead(200)
|
||||||
|
res.end(JSON.stringify(data, null, 2))
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 发送错误响应
|
||||||
|
*/
|
||||||
|
private sendError(res: http.ServerResponse, code: number, message: string): void {
|
||||||
|
res.setHeader('Content-Type', 'application/json; charset=utf-8')
|
||||||
|
res.writeHead(code)
|
||||||
|
res.end(JSON.stringify({ error: message }))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const httpService = new HttpService()
|
||||||
@@ -11,7 +11,16 @@ import { wcdbService } from './wcdbService'
|
|||||||
// 获取 ffmpeg-static 的路径
|
// 获取 ffmpeg-static 的路径
|
||||||
function getStaticFfmpegPath(): string | null {
|
function getStaticFfmpegPath(): string | null {
|
||||||
try {
|
try {
|
||||||
// 方法1: 直接 require ffmpeg-static
|
// 优先处理打包后的路径
|
||||||
|
if (app.isPackaged) {
|
||||||
|
const resourcesPath = process.resourcesPath
|
||||||
|
const packedPath = join(resourcesPath, 'app.asar.unpacked', 'node_modules', 'ffmpeg-static', 'ffmpeg.exe')
|
||||||
|
if (existsSync(packedPath)) {
|
||||||
|
return packedPath
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 方法1: 直接 require ffmpeg-static(开发环境)
|
||||||
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
||||||
const ffmpegStatic = require('ffmpeg-static')
|
const ffmpegStatic = require('ffmpeg-static')
|
||||||
|
|
||||||
@@ -19,21 +28,12 @@ function getStaticFfmpegPath(): string | null {
|
|||||||
return ffmpegStatic
|
return ffmpegStatic
|
||||||
}
|
}
|
||||||
|
|
||||||
// 方法2: 手动构建路径(开发环境)
|
// 方法2: 手动构建路径(开发环境备用)
|
||||||
const devPath = join(process.cwd(), 'node_modules', 'ffmpeg-static', 'ffmpeg.exe')
|
const devPath = join(process.cwd(), 'node_modules', 'ffmpeg-static', 'ffmpeg.exe')
|
||||||
if (existsSync(devPath)) {
|
if (existsSync(devPath)) {
|
||||||
return devPath
|
return devPath
|
||||||
}
|
}
|
||||||
|
|
||||||
// 方法3: 打包后的路径
|
|
||||||
if (app.isPackaged) {
|
|
||||||
const resourcesPath = process.resourcesPath
|
|
||||||
const packedPath = join(resourcesPath, 'app.asar.unpacked', 'node_modules', 'ffmpeg-static', 'ffmpeg.exe')
|
|
||||||
if (existsSync(packedPath)) {
|
|
||||||
return packedPath
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return null
|
return null
|
||||||
} catch {
|
} catch {
|
||||||
return null
|
return null
|
||||||
|
|||||||
371
electron/services/llamaService.ts
Normal file
371
electron/services/llamaService.ts
Normal file
@@ -0,0 +1,371 @@
|
|||||||
|
import fs from "fs";
|
||||||
|
import { app, BrowserWindow } from "electron";
|
||||||
|
import path from "path";
|
||||||
|
import { ConfigService } from './config';
|
||||||
|
|
||||||
|
// Define interfaces locally to avoid static import of types that might not be available or cause issues
|
||||||
|
type LlamaModel = any;
|
||||||
|
type LlamaContext = any;
|
||||||
|
type LlamaChatSession = any;
|
||||||
|
|
||||||
|
export class LlamaService {
|
||||||
|
private _model: LlamaModel | null = null;
|
||||||
|
private _context: LlamaContext | null = null;
|
||||||
|
private _sequence: any = null;
|
||||||
|
private _session: LlamaChatSession | null = null;
|
||||||
|
private _llama: any = null;
|
||||||
|
private _nodeLlamaCpp: any = null;
|
||||||
|
private configService = new ConfigService();
|
||||||
|
private _initialized = false;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
// 延迟初始化,只在需要时初始化
|
||||||
|
}
|
||||||
|
|
||||||
|
public async init() {
|
||||||
|
if (this._initialized) return;
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Dynamic import to handle ESM module in CJS context
|
||||||
|
this._nodeLlamaCpp = await import("node-llama-cpp");
|
||||||
|
this._llama = await this._nodeLlamaCpp.getLlama();
|
||||||
|
this._initialized = true;
|
||||||
|
console.log("[LlamaService] Llama initialized");
|
||||||
|
} catch (error) {
|
||||||
|
console.error("[LlamaService] Failed to initialize Llama:", error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public async loadModel(modelPath: string) {
|
||||||
|
if (!this._llama) await this.init();
|
||||||
|
|
||||||
|
try {
|
||||||
|
console.log("[LlamaService] Loading model from:", modelPath);
|
||||||
|
if (!this._llama) {
|
||||||
|
throw new Error("Llama not initialized");
|
||||||
|
}
|
||||||
|
this._model = await this._llama.loadModel({
|
||||||
|
modelPath: modelPath,
|
||||||
|
gpuLayers: 'max', // Offload all layers to GPU if possible
|
||||||
|
useMlock: false // Disable mlock to avoid "VirtualLock" errors (common on Windows)
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!this._model) throw new Error("Failed to load model");
|
||||||
|
|
||||||
|
this._context = await this._model.createContext({
|
||||||
|
contextSize: 8192, // Balanced context size for better performance
|
||||||
|
batchSize: 2048 // Increase batch size for better prompt processing speed
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!this._context) throw new Error("Failed to create context");
|
||||||
|
|
||||||
|
this._sequence = this._context.getSequence();
|
||||||
|
|
||||||
|
const { LlamaChatSession } = this._nodeLlamaCpp;
|
||||||
|
this._session = new LlamaChatSession({
|
||||||
|
contextSequence: this._sequence
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log("[LlamaService] Model loaded successfully");
|
||||||
|
return true;
|
||||||
|
} catch (error) {
|
||||||
|
console.error("[LlamaService] Failed to load model:", error);
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public async createSession(systemPrompt?: string) {
|
||||||
|
if (!this._context) throw new Error("Model not loaded");
|
||||||
|
if (!this._nodeLlamaCpp) await this.init();
|
||||||
|
|
||||||
|
const { LlamaChatSession } = this._nodeLlamaCpp;
|
||||||
|
|
||||||
|
if (!this._sequence) {
|
||||||
|
this._sequence = this._context.getSequence();
|
||||||
|
}
|
||||||
|
|
||||||
|
this._session = new LlamaChatSession({
|
||||||
|
contextSequence: this._sequence,
|
||||||
|
systemPrompt: systemPrompt
|
||||||
|
});
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
public async chat(message: string, options: { thinking?: boolean } = {}, onToken: (token: string) => void) {
|
||||||
|
if (!this._session) throw new Error("Session not initialized");
|
||||||
|
|
||||||
|
const thinking = options.thinking ?? false;
|
||||||
|
|
||||||
|
// Sampling parameters based on mode
|
||||||
|
const samplingParams = thinking ? {
|
||||||
|
temperature: 0.6,
|
||||||
|
topP: 0.95,
|
||||||
|
topK: 20,
|
||||||
|
repeatPenalty: 1.5 // PresencePenalty=1.5
|
||||||
|
} : {
|
||||||
|
temperature: 0.7,
|
||||||
|
topP: 0.8,
|
||||||
|
topK: 20,
|
||||||
|
repeatPenalty: 1.5
|
||||||
|
};
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await this._session.prompt(message, {
|
||||||
|
...samplingParams,
|
||||||
|
onTextChunk: (chunk: string) => {
|
||||||
|
onToken(chunk);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return response;
|
||||||
|
} catch (error) {
|
||||||
|
console.error("[LlamaService] Chat error:", error);
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public async getModelStatus(modelPath: string) {
|
||||||
|
try {
|
||||||
|
const exists = fs.existsSync(modelPath);
|
||||||
|
if (!exists) {
|
||||||
|
return { exists: false, path: modelPath };
|
||||||
|
}
|
||||||
|
const stats = fs.statSync(modelPath);
|
||||||
|
return {
|
||||||
|
exists: true,
|
||||||
|
path: modelPath,
|
||||||
|
size: stats.size
|
||||||
|
};
|
||||||
|
} catch (error) {
|
||||||
|
return { exists: false, error: String(error) };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private resolveModelDir(): string {
|
||||||
|
const configured = this.configService.get('whisperModelDir') as string | undefined;
|
||||||
|
if (configured) return configured;
|
||||||
|
return path.join(app.getPath('documents'), 'WeFlow', 'models');
|
||||||
|
}
|
||||||
|
|
||||||
|
public async downloadModel(url: string, savePath: string, onProgress: (payload: { downloaded: number; total: number; speed: number }) => void): Promise<void> {
|
||||||
|
// Ensure directory exists
|
||||||
|
const dir = path.dirname(savePath);
|
||||||
|
if (!fs.existsSync(dir)) {
|
||||||
|
fs.mkdirSync(dir, { recursive: true });
|
||||||
|
}
|
||||||
|
|
||||||
|
console.info(`[LlamaService] Multi-threaded download check for: ${savePath}`);
|
||||||
|
|
||||||
|
if (fs.existsSync(savePath)) {
|
||||||
|
fs.unlinkSync(savePath);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 1. Get total size and check range support
|
||||||
|
let probeResult;
|
||||||
|
try {
|
||||||
|
probeResult = await this.probeUrl(url);
|
||||||
|
} catch (err) {
|
||||||
|
console.warn("[LlamaService] Probe failed, falling back to single-thread.", err);
|
||||||
|
return this.downloadSingleThread(url, savePath, onProgress);
|
||||||
|
}
|
||||||
|
|
||||||
|
const { totalSize, acceptRanges, finalUrl } = probeResult;
|
||||||
|
console.log(`[LlamaService] Total size: ${totalSize}, Accept-Ranges: ${acceptRanges}`);
|
||||||
|
|
||||||
|
if (totalSize <= 0 || !acceptRanges) {
|
||||||
|
console.warn("[LlamaService] Ranges not supported or size unknown, falling back to single-thread.");
|
||||||
|
return this.downloadSingleThread(finalUrl, savePath, onProgress);
|
||||||
|
}
|
||||||
|
|
||||||
|
const threadCount = 4;
|
||||||
|
const chunkSize = Math.ceil(totalSize / threadCount);
|
||||||
|
const fd = fs.openSync(savePath, 'w');
|
||||||
|
|
||||||
|
let downloadedLength = 0;
|
||||||
|
let lastDownloadedLength = 0;
|
||||||
|
let lastTime = Date.now();
|
||||||
|
let speed = 0;
|
||||||
|
|
||||||
|
const speedInterval = setInterval(() => {
|
||||||
|
const now = Date.now();
|
||||||
|
const duration = (now - lastTime) / 1000;
|
||||||
|
if (duration > 0) {
|
||||||
|
speed = (downloadedLength - lastDownloadedLength) / duration;
|
||||||
|
lastDownloadedLength = downloadedLength;
|
||||||
|
lastTime = now;
|
||||||
|
onProgress({ downloaded: downloadedLength, total: totalSize, speed });
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const promises = [];
|
||||||
|
for (let i = 0; i < threadCount; i++) {
|
||||||
|
const start = i * chunkSize;
|
||||||
|
const end = i === threadCount - 1 ? totalSize - 1 : (i + 1) * chunkSize - 1;
|
||||||
|
|
||||||
|
promises.push(this.downloadChunk(finalUrl, fd, start, end, (bytes) => {
|
||||||
|
downloadedLength += bytes;
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
await Promise.all(promises);
|
||||||
|
console.log("[LlamaService] Multi-threaded download complete");
|
||||||
|
|
||||||
|
// Final progress update
|
||||||
|
onProgress({ downloaded: totalSize, total: totalSize, speed: 0 });
|
||||||
|
} catch (err) {
|
||||||
|
console.error("[LlamaService] Multi-threaded download failed:", err);
|
||||||
|
throw err;
|
||||||
|
} finally {
|
||||||
|
clearInterval(speedInterval);
|
||||||
|
fs.closeSync(fd);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async probeUrl(url: string): Promise<{ totalSize: number, acceptRanges: boolean, finalUrl: string }> {
|
||||||
|
const protocol = url.startsWith('https') ? require('https') : require('http');
|
||||||
|
const options = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: {
|
||||||
|
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
|
||||||
|
'Referer': 'https://www.modelscope.cn/',
|
||||||
|
'Range': 'bytes=0-0'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const req = protocol.get(url, options, (res: any) => {
|
||||||
|
if ([301, 302, 307, 308].includes(res.statusCode)) {
|
||||||
|
const location = res.headers.location;
|
||||||
|
const nextUrl = new URL(location, url).href;
|
||||||
|
this.probeUrl(nextUrl).then(resolve).catch(reject);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (res.statusCode !== 206 && res.statusCode !== 200) {
|
||||||
|
reject(new Error(`Probe failed: HTTP ${res.statusCode}`));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const contentRange = res.headers['content-range'];
|
||||||
|
let totalSize = 0;
|
||||||
|
if (contentRange) {
|
||||||
|
const parts = contentRange.split('/');
|
||||||
|
totalSize = parseInt(parts[parts.length - 1], 10);
|
||||||
|
} else {
|
||||||
|
totalSize = parseInt(res.headers['content-length'] || '0', 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
const acceptRanges = res.headers['accept-ranges'] === 'bytes' || !!contentRange;
|
||||||
|
resolve({ totalSize, acceptRanges, finalUrl: url });
|
||||||
|
res.destroy();
|
||||||
|
});
|
||||||
|
req.on('error', reject);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private async downloadChunk(url: string, fd: number, start: number, end: number, onData: (bytes: number) => void): Promise<void> {
|
||||||
|
const protocol = url.startsWith('https') ? require('https') : require('http');
|
||||||
|
const options = {
|
||||||
|
headers: {
|
||||||
|
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
|
||||||
|
'Referer': 'https://www.modelscope.cn/',
|
||||||
|
'Range': `bytes=${start}-${end}`
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const req = protocol.get(url, options, (res: any) => {
|
||||||
|
if (res.statusCode !== 206) {
|
||||||
|
reject(new Error(`Chunk download failed: HTTP ${res.statusCode}`));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let currentOffset = start;
|
||||||
|
res.on('data', (chunk: Buffer) => {
|
||||||
|
try {
|
||||||
|
fs.writeSync(fd, chunk, 0, chunk.length, currentOffset);
|
||||||
|
currentOffset += chunk.length;
|
||||||
|
onData(chunk.length);
|
||||||
|
} catch (err) {
|
||||||
|
reject(err);
|
||||||
|
res.destroy();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
res.on('end', () => resolve());
|
||||||
|
res.on('error', reject);
|
||||||
|
});
|
||||||
|
req.on('error', reject);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private async downloadSingleThread(url: string, savePath: string, onProgress: (payload: { downloaded: number; total: number; speed: number }) => void): Promise<void> {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const protocol = url.startsWith('https') ? require('https') : require('http');
|
||||||
|
const options = {
|
||||||
|
headers: {
|
||||||
|
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
|
||||||
|
'Referer': 'https://www.modelscope.cn/'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const request = protocol.get(url, options, (response: any) => {
|
||||||
|
if ([301, 302, 307, 308].includes(response.statusCode)) {
|
||||||
|
const location = response.headers.location;
|
||||||
|
const nextUrl = new URL(location, url).href;
|
||||||
|
this.downloadSingleThread(nextUrl, savePath, onProgress).then(resolve).catch(reject);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (response.statusCode !== 200) {
|
||||||
|
reject(new Error(`Fallback download failed: HTTP ${response.statusCode}`));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const totalLength = parseInt(response.headers['content-length'] || '0', 10);
|
||||||
|
let downloadedLength = 0;
|
||||||
|
let lastDownloadedLength = 0;
|
||||||
|
let lastTime = Date.now();
|
||||||
|
let speed = 0;
|
||||||
|
|
||||||
|
const fileStream = fs.createWriteStream(savePath);
|
||||||
|
response.pipe(fileStream);
|
||||||
|
|
||||||
|
const speedInterval = setInterval(() => {
|
||||||
|
const now = Date.now();
|
||||||
|
const duration = (now - lastTime) / 1000;
|
||||||
|
if (duration > 0) {
|
||||||
|
speed = (downloadedLength - lastDownloadedLength) / duration;
|
||||||
|
lastDownloadedLength = downloadedLength;
|
||||||
|
lastTime = now;
|
||||||
|
onProgress({ downloaded: downloadedLength, total: totalLength, speed });
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
|
response.on('data', (chunk: any) => {
|
||||||
|
downloadedLength += chunk.length;
|
||||||
|
});
|
||||||
|
|
||||||
|
fileStream.on('finish', () => {
|
||||||
|
clearInterval(speedInterval);
|
||||||
|
fileStream.close();
|
||||||
|
resolve();
|
||||||
|
});
|
||||||
|
|
||||||
|
fileStream.on('error', (err: any) => {
|
||||||
|
clearInterval(speedInterval);
|
||||||
|
fs.unlink(savePath, () => { });
|
||||||
|
reject(err);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
request.on('error', reject);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public getModelsPath() {
|
||||||
|
return this.resolveModelDir();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const llamaService = new LlamaService();
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { app } from 'electron'
|
import { app } from 'electron'
|
||||||
import { existsSync, mkdirSync, statSync, unlinkSync, createWriteStream } from 'fs'
|
import { existsSync, mkdirSync, statSync, unlinkSync, createWriteStream, openSync, writeSync, closeSync } from 'fs'
|
||||||
import { join } from 'path'
|
import { join } from 'path'
|
||||||
import * as https from 'https'
|
import * as https from 'https'
|
||||||
import * as http from 'http'
|
import * as http from 'http'
|
||||||
@@ -24,6 +24,7 @@ type DownloadProgress = {
|
|||||||
downloadedBytes: number
|
downloadedBytes: number
|
||||||
totalBytes?: number
|
totalBytes?: number
|
||||||
percent?: number
|
percent?: number
|
||||||
|
speed?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
const SENSEVOICE_MODEL: ModelInfo = {
|
const SENSEVOICE_MODEL: ModelInfo = {
|
||||||
@@ -123,44 +124,44 @@ export class VoiceTranscribeService {
|
|||||||
percent: 0
|
percent: 0
|
||||||
})
|
})
|
||||||
|
|
||||||
// 下载模型文件 (40%)
|
// 下载模型文件 (80% 权重)
|
||||||
console.info('[VoiceTranscribe] 开始下载模型文件...')
|
console.info('[VoiceTranscribe] 开始下载模型文件...')
|
||||||
await this.downloadToFile(
|
await this.downloadToFile(
|
||||||
MODEL_DOWNLOAD_URLS.model,
|
MODEL_DOWNLOAD_URLS.model,
|
||||||
modelPath,
|
modelPath,
|
||||||
'model',
|
'model',
|
||||||
(downloaded, total) => {
|
(downloaded, total, speed) => {
|
||||||
const percent = total ? (downloaded / total) * 40 : undefined
|
const percent = total ? (downloaded / total) * 80 : 0
|
||||||
onProgress?.({
|
onProgress?.({
|
||||||
modelName: SENSEVOICE_MODEL.name,
|
modelName: SENSEVOICE_MODEL.name,
|
||||||
downloadedBytes: downloaded,
|
downloadedBytes: downloaded,
|
||||||
totalBytes: SENSEVOICE_MODEL.sizeBytes,
|
totalBytes: SENSEVOICE_MODEL.sizeBytes,
|
||||||
percent
|
percent,
|
||||||
|
speed
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
// 下载 tokens 文件 (30%)
|
// 下载 tokens 文件 (20% 权重)
|
||||||
console.info('[VoiceTranscribe] 开始下载 tokens 文件...')
|
console.info('[VoiceTranscribe] 开始下载 tokens 文件...')
|
||||||
await this.downloadToFile(
|
await this.downloadToFile(
|
||||||
MODEL_DOWNLOAD_URLS.tokens,
|
MODEL_DOWNLOAD_URLS.tokens,
|
||||||
tokensPath,
|
tokensPath,
|
||||||
'tokens',
|
'tokens',
|
||||||
(downloaded, total) => {
|
(downloaded, total, speed) => {
|
||||||
const modelSize = existsSync(modelPath) ? statSync(modelPath).size : 0
|
const modelSize = existsSync(modelPath) ? statSync(modelPath).size : 0
|
||||||
const percent = total ? 40 + (downloaded / total) * 30 : 40
|
const percent = total ? 80 + (downloaded / total) * 20 : 80
|
||||||
onProgress?.({
|
onProgress?.({
|
||||||
modelName: SENSEVOICE_MODEL.name,
|
modelName: SENSEVOICE_MODEL.name,
|
||||||
downloadedBytes: modelSize + downloaded,
|
downloadedBytes: modelSize + downloaded,
|
||||||
totalBytes: SENSEVOICE_MODEL.sizeBytes,
|
totalBytes: SENSEVOICE_MODEL.sizeBytes,
|
||||||
percent
|
percent,
|
||||||
|
speed
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
console.info('[VoiceTranscribe] 模型下载完成')
|
console.info('[VoiceTranscribe] 模型下载完成')
|
||||||
|
|
||||||
console.info('[VoiceTranscribe] 所有文件下载完成')
|
|
||||||
return { success: true, modelPath, tokensPath }
|
return { success: true, modelPath, tokensPath }
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
const modelPath = this.resolveModelPath(SENSEVOICE_MODEL.files.model)
|
const modelPath = this.resolveModelPath(SENSEVOICE_MODEL.files.model)
|
||||||
@@ -180,7 +181,7 @@ export class VoiceTranscribeService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 转写 WAV 音频数据 (后台 Worker Threads 版本)
|
* 转写 WAV 音频数据
|
||||||
*/
|
*/
|
||||||
async transcribeWavBuffer(
|
async transcribeWavBuffer(
|
||||||
wavData: Buffer,
|
wavData: Buffer,
|
||||||
@@ -197,18 +198,15 @@ export class VoiceTranscribeService {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// 获取配置的语言列表,如果没有传入则从配置读取
|
|
||||||
let supportedLanguages = languages
|
let supportedLanguages = languages
|
||||||
if (!supportedLanguages || supportedLanguages.length === 0) {
|
if (!supportedLanguages || supportedLanguages.length === 0) {
|
||||||
supportedLanguages = this.configService.get('transcribeLanguages')
|
supportedLanguages = this.configService.get('transcribeLanguages')
|
||||||
// 如果配置中也没有或为空,使用默认值
|
|
||||||
if (!supportedLanguages || supportedLanguages.length === 0) {
|
if (!supportedLanguages || supportedLanguages.length === 0) {
|
||||||
supportedLanguages = ['zh', 'yue']
|
supportedLanguages = ['zh', 'yue']
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const { Worker } = require('worker_threads')
|
const { Worker } = require('worker_threads')
|
||||||
// main.js 和 transcribeWorker.js 同在 dist-electron 目录下
|
|
||||||
const workerPath = join(__dirname, 'transcribeWorker.js')
|
const workerPath = join(__dirname, 'transcribeWorker.js')
|
||||||
|
|
||||||
const worker = new Worker(workerPath, {
|
const worker = new Worker(workerPath, {
|
||||||
@@ -224,12 +222,10 @@ export class VoiceTranscribeService {
|
|||||||
let finalTranscript = ''
|
let finalTranscript = ''
|
||||||
|
|
||||||
worker.on('message', (msg: any) => {
|
worker.on('message', (msg: any) => {
|
||||||
|
|
||||||
if (msg.type === 'partial') {
|
if (msg.type === 'partial') {
|
||||||
onPartial?.(msg.text)
|
onPartial?.(msg.text)
|
||||||
} else if (msg.type === 'final') {
|
} else if (msg.type === 'final') {
|
||||||
finalTranscript = msg.text
|
finalTranscript = msg.text
|
||||||
|
|
||||||
resolve({ success: true, transcript: finalTranscript })
|
resolve({ success: true, transcript: finalTranscript })
|
||||||
worker.terminate()
|
worker.terminate()
|
||||||
} else if (msg.type === 'error') {
|
} else if (msg.type === 'error') {
|
||||||
@@ -239,15 +235,9 @@ export class VoiceTranscribeService {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
worker.on('error', (err: Error) => {
|
worker.on('error', (err: Error) => resolve({ success: false, error: String(err) }))
|
||||||
resolve({ success: false, error: String(err) })
|
|
||||||
})
|
|
||||||
|
|
||||||
worker.on('exit', (code: number) => {
|
worker.on('exit', (code: number) => {
|
||||||
if (code !== 0) {
|
if (code !== 0) resolve({ success: false, error: `Worker exited with code ${code}` })
|
||||||
console.error(`[VoiceTranscribe] Worker stopped with exit code ${code}`)
|
|
||||||
resolve({ success: false, error: `Worker exited with code ${code}` })
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@@ -257,121 +247,230 @@ export class VoiceTranscribeService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 下载文件
|
* 下载文件 (支持多线程)
|
||||||
*/
|
*/
|
||||||
private downloadToFile(
|
private async downloadToFile(
|
||||||
url: string,
|
url: string,
|
||||||
targetPath: string,
|
targetPath: string,
|
||||||
fileName: string,
|
fileName: string,
|
||||||
onProgress?: (downloaded: number, total?: number) => void,
|
onProgress?: (downloaded: number, total?: number, speed?: number) => void
|
||||||
remainingRedirects = 5
|
|
||||||
): Promise<void> {
|
): Promise<void> {
|
||||||
return new Promise((resolve, reject) => {
|
if (existsSync(targetPath)) {
|
||||||
const protocol = url.startsWith('https') ? https : http
|
unlinkSync(targetPath)
|
||||||
console.info(`[VoiceTranscribe] 下载 ${fileName}:`, url)
|
}
|
||||||
|
|
||||||
const options = {
|
console.info(`[VoiceTranscribe] 准备下载 ${fileName}: ${url}`)
|
||||||
headers: {
|
|
||||||
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36'
|
// 1. 探测支持情况
|
||||||
},
|
let probeResult
|
||||||
timeout: 30000 // 30秒连接超时
|
try {
|
||||||
|
probeResult = await this.probeUrl(url)
|
||||||
|
} catch (err) {
|
||||||
|
console.warn(`[VoiceTranscribe] ${fileName} 探测失败,使用单线程`, err)
|
||||||
|
return this.downloadSingleThread(url, targetPath, fileName, onProgress)
|
||||||
|
}
|
||||||
|
|
||||||
|
const { totalSize, acceptRanges, finalUrl } = probeResult
|
||||||
|
|
||||||
|
// 如果文件太小 (< 2MB) 或者不支持 Range,使用单线程
|
||||||
|
if (totalSize < 2 * 1024 * 1024 || !acceptRanges) {
|
||||||
|
return this.downloadSingleThread(finalUrl, targetPath, fileName, onProgress)
|
||||||
|
}
|
||||||
|
|
||||||
|
console.info(`[VoiceTranscribe] ${fileName} 开始多线程下载 (4 线程), 大小: ${(totalSize / 1024 / 1024).toFixed(2)} MB`)
|
||||||
|
|
||||||
|
const threadCount = 4
|
||||||
|
const chunkSize = Math.ceil(totalSize / threadCount)
|
||||||
|
const fd = openSync(targetPath, 'w')
|
||||||
|
|
||||||
|
let downloadedTotal = 0
|
||||||
|
let lastDownloaded = 0
|
||||||
|
let lastTime = Date.now()
|
||||||
|
let speed = 0
|
||||||
|
|
||||||
|
const speedInterval = setInterval(() => {
|
||||||
|
const now = Date.now()
|
||||||
|
const duration = (now - lastTime) / 1000
|
||||||
|
if (duration > 0) {
|
||||||
|
speed = (downloadedTotal - lastDownloaded) / duration
|
||||||
|
lastDownloaded = downloadedTotal
|
||||||
|
lastTime = now
|
||||||
|
onProgress?.(downloadedTotal, totalSize, speed)
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
|
|
||||||
|
try {
|
||||||
|
const promises = []
|
||||||
|
for (let i = 0; i < threadCount; i++) {
|
||||||
|
const start = i * chunkSize
|
||||||
|
const end = i === threadCount - 1 ? totalSize - 1 : (i + 1) * chunkSize - 1
|
||||||
|
|
||||||
|
promises.push(this.downloadChunk(finalUrl, fd, start, end, (bytes) => {
|
||||||
|
downloadedTotal += bytes
|
||||||
|
}))
|
||||||
}
|
}
|
||||||
|
|
||||||
const request = protocol.get(url, options, (response) => {
|
await Promise.all(promises)
|
||||||
console.info(`[VoiceTranscribe] ${fileName} 响应状态:`, response.statusCode)
|
// Final progress update
|
||||||
|
onProgress?.(totalSize, totalSize, 0)
|
||||||
|
console.info(`[VoiceTranscribe] ${fileName} 多线程下载完成`)
|
||||||
|
} catch (err) {
|
||||||
|
console.error(`[VoiceTranscribe] ${fileName} 多线程下载失败:`, err)
|
||||||
|
throw err
|
||||||
|
} finally {
|
||||||
|
clearInterval(speedInterval)
|
||||||
|
closeSync(fd)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 处理重定向
|
private async probeUrl(url: string, remainingRedirects = 5): Promise<{ totalSize: number, acceptRanges: boolean, finalUrl: string }> {
|
||||||
if ([301, 302, 303, 307, 308].includes(response.statusCode || 0) && response.headers.location) {
|
return new Promise((resolve, reject) => {
|
||||||
if (remainingRedirects <= 0) {
|
const protocol = url.startsWith('https') ? https : http
|
||||||
reject(new Error('重定向次数过多'))
|
const options = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: {
|
||||||
|
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
|
||||||
|
'Referer': 'https://modelscope.cn/',
|
||||||
|
'Range': 'bytes=0-0'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const req = protocol.get(url, options, (res) => {
|
||||||
|
if ([301, 302, 303, 307, 308].includes(res.statusCode || 0)) {
|
||||||
|
const location = res.headers.location
|
||||||
|
if (location && remainingRedirects > 0) {
|
||||||
|
const nextUrl = new URL(location, url).href
|
||||||
|
this.probeUrl(nextUrl, remainingRedirects - 1).then(resolve).catch(reject)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
console.info(`[VoiceTranscribe] 重定向到:`, response.headers.location)
|
}
|
||||||
this.downloadToFile(response.headers.location, targetPath, fileName, onProgress, remainingRedirects - 1)
|
|
||||||
.then(resolve)
|
if (res.statusCode !== 206 && res.statusCode !== 200) {
|
||||||
.catch(reject)
|
reject(new Error(`Probe failed: HTTP ${res.statusCode}`))
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const contentRange = res.headers['content-range']
|
||||||
|
let totalSize = 0
|
||||||
|
if (contentRange) {
|
||||||
|
const parts = contentRange.split('/')
|
||||||
|
totalSize = parseInt(parts[parts.length - 1], 10)
|
||||||
|
} else {
|
||||||
|
totalSize = parseInt(res.headers['content-length'] || '0', 10)
|
||||||
|
}
|
||||||
|
|
||||||
|
const acceptRanges = res.headers['accept-ranges'] === 'bytes' || !!contentRange
|
||||||
|
resolve({ totalSize, acceptRanges, finalUrl: url })
|
||||||
|
res.destroy()
|
||||||
|
})
|
||||||
|
req.on('error', reject)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
private async downloadChunk(url: string, fd: number, start: number, end: number, onData: (bytes: number) => void): Promise<void> {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const protocol = url.startsWith('https') ? https : http
|
||||||
|
const options = {
|
||||||
|
headers: {
|
||||||
|
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
|
||||||
|
'Referer': 'https://modelscope.cn/',
|
||||||
|
'Range': `bytes=${start}-${end}`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const req = protocol.get(url, options, (res) => {
|
||||||
|
if (res.statusCode !== 206) {
|
||||||
|
reject(new Error(`Chunk download failed: HTTP ${res.statusCode}`))
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
let currentOffset = start
|
||||||
|
res.on('data', (chunk: Buffer) => {
|
||||||
|
try {
|
||||||
|
writeSync(fd, chunk, 0, chunk.length, currentOffset)
|
||||||
|
currentOffset += chunk.length
|
||||||
|
onData(chunk.length)
|
||||||
|
} catch (err) {
|
||||||
|
reject(err)
|
||||||
|
res.destroy()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
res.on('end', () => resolve())
|
||||||
|
res.on('error', reject)
|
||||||
|
})
|
||||||
|
req.on('error', reject)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
private async downloadSingleThread(url: string, targetPath: string, fileName: string, onProgress?: (downloaded: number, total?: number, speed?: number) => void, remainingRedirects = 5): Promise<void> {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const protocol = url.startsWith('https') ? https : http
|
||||||
|
const options = {
|
||||||
|
headers: {
|
||||||
|
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
|
||||||
|
'Referer': 'https://modelscope.cn/'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const request = protocol.get(url, options, (response) => {
|
||||||
|
if ([301, 302, 303, 307, 308].includes(response.statusCode || 0)) {
|
||||||
|
const location = response.headers.location
|
||||||
|
if (location && remainingRedirects > 0) {
|
||||||
|
const nextUrl = new URL(location, url).href
|
||||||
|
this.downloadSingleThread(nextUrl, targetPath, fileName, onProgress, remainingRedirects - 1).then(resolve).catch(reject)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (response.statusCode !== 200) {
|
if (response.statusCode !== 200) {
|
||||||
reject(new Error(`下载失败: HTTP ${response.statusCode}`))
|
reject(new Error(`Fallback download failed: HTTP ${response.statusCode}`))
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
const totalBytes = Number(response.headers['content-length'] || 0) || undefined
|
const totalBytes = Number(response.headers['content-length'] || 0) || undefined
|
||||||
let downloadedBytes = 0
|
let downloadedBytes = 0
|
||||||
|
let lastDownloaded = 0
|
||||||
|
let lastTime = Date.now()
|
||||||
|
let speed = 0
|
||||||
|
|
||||||
console.info(`[VoiceTranscribe] ${fileName} 文件大小:`, totalBytes ? `${(totalBytes / 1024 / 1024).toFixed(2)} MB` : '未知')
|
const speedInterval = setInterval(() => {
|
||||||
|
const now = Date.now()
|
||||||
|
const duration = (now - lastTime) / 1000
|
||||||
|
if (duration > 0) {
|
||||||
|
speed = (downloadedBytes - lastDownloaded) / duration
|
||||||
|
lastDownloaded = downloadedBytes
|
||||||
|
lastTime = now
|
||||||
|
onProgress?.(downloadedBytes, totalBytes, speed)
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
|
|
||||||
const writer = createWriteStream(targetPath)
|
const writer = createWriteStream(targetPath)
|
||||||
|
|
||||||
// 设置数据接收超时(60秒没有数据则超时)
|
|
||||||
let lastDataTime = Date.now()
|
|
||||||
const dataTimeout = setInterval(() => {
|
|
||||||
if (Date.now() - lastDataTime > 60000) {
|
|
||||||
clearInterval(dataTimeout)
|
|
||||||
response.destroy()
|
|
||||||
writer.close()
|
|
||||||
reject(new Error('下载超时:60秒内未收到数据'))
|
|
||||||
}
|
|
||||||
}, 5000)
|
|
||||||
|
|
||||||
response.on('data', (chunk) => {
|
response.on('data', (chunk) => {
|
||||||
lastDataTime = Date.now()
|
|
||||||
downloadedBytes += chunk.length
|
downloadedBytes += chunk.length
|
||||||
onProgress?.(downloadedBytes, totalBytes)
|
|
||||||
})
|
|
||||||
|
|
||||||
response.on('error', (error) => {
|
|
||||||
clearInterval(dataTimeout)
|
|
||||||
try { writer.close() } catch { }
|
|
||||||
console.error(`[VoiceTranscribe] ${fileName} 响应错误:`, error)
|
|
||||||
reject(error)
|
|
||||||
})
|
|
||||||
|
|
||||||
writer.on('error', (error) => {
|
|
||||||
clearInterval(dataTimeout)
|
|
||||||
try { writer.close() } catch { }
|
|
||||||
console.error(`[VoiceTranscribe] ${fileName} 写入错误:`, error)
|
|
||||||
reject(error)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
writer.on('finish', () => {
|
writer.on('finish', () => {
|
||||||
clearInterval(dataTimeout)
|
clearInterval(speedInterval)
|
||||||
writer.close()
|
writer.close()
|
||||||
console.info(`[VoiceTranscribe] ${fileName} 下载完成:`, targetPath)
|
|
||||||
resolve()
|
resolve()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
writer.on('error', (err) => {
|
||||||
|
clearInterval(speedInterval)
|
||||||
|
reject(err)
|
||||||
|
})
|
||||||
response.pipe(writer)
|
response.pipe(writer)
|
||||||
})
|
})
|
||||||
|
request.on('error', reject)
|
||||||
request.on('timeout', () => {
|
|
||||||
request.destroy()
|
|
||||||
console.error(`[VoiceTranscribe] ${fileName} 连接超时`)
|
|
||||||
reject(new Error('连接超时'))
|
|
||||||
})
|
|
||||||
|
|
||||||
request.on('error', (error) => {
|
|
||||||
console.error(`[VoiceTranscribe] ${fileName} 请求错误:`, error)
|
|
||||||
reject(error)
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* 清理资源
|
|
||||||
*/
|
|
||||||
dispose() {
|
dispose() {
|
||||||
if (this.recognizer) {
|
if (this.recognizer) {
|
||||||
try {
|
this.recognizer = null
|
||||||
// sherpa-onnx 的 recognizer 可能需要手动释放
|
|
||||||
this.recognizer = null
|
|
||||||
} catch (error) {
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const voiceTranscribeService = new VoiceTranscribeService()
|
export const voiceTranscribeService = new VoiceTranscribeService()
|
||||||
|
|
||||||
|
|||||||
@@ -44,6 +44,7 @@ export class WcdbCore {
|
|||||||
private wcdbGetAvailableYears: any = null
|
private wcdbGetAvailableYears: any = null
|
||||||
private wcdbGetAnnualReportStats: any = null
|
private wcdbGetAnnualReportStats: any = null
|
||||||
private wcdbGetAnnualReportExtras: any = null
|
private wcdbGetAnnualReportExtras: any = null
|
||||||
|
private wcdbGetDualReportStats: any = null
|
||||||
private wcdbGetGroupStats: any = null
|
private wcdbGetGroupStats: any = null
|
||||||
private wcdbOpenMessageCursor: any = null
|
private wcdbOpenMessageCursor: any = null
|
||||||
private wcdbOpenMessageCursorLite: any = null
|
private wcdbOpenMessageCursorLite: any = null
|
||||||
@@ -456,6 +457,13 @@ export class WcdbCore {
|
|||||||
this.wcdbGetAnnualReportExtras = null
|
this.wcdbGetAnnualReportExtras = null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// wcdb_status wcdb_get_dual_report_stats(wcdb_handle handle, const char* session_id, int32_t begin_timestamp, int32_t end_timestamp, char** out_json)
|
||||||
|
try {
|
||||||
|
this.wcdbGetDualReportStats = this.lib.func('int32 wcdb_get_dual_report_stats(int64 handle, const char* sessionId, int32 begin, int32 end, _Out_ void** outJson)')
|
||||||
|
} catch {
|
||||||
|
this.wcdbGetDualReportStats = null
|
||||||
|
}
|
||||||
|
|
||||||
// wcdb_status wcdb_get_logs(char** out_json)
|
// wcdb_status wcdb_get_logs(char** out_json)
|
||||||
try {
|
try {
|
||||||
this.wcdbGetLogs = this.lib.func('int32 wcdb_get_logs(_Out_ void** outJson)')
|
this.wcdbGetLogs = this.lib.func('int32 wcdb_get_logs(_Out_ void** outJson)')
|
||||||
@@ -1710,4 +1718,26 @@ export class WcdbCore {
|
|||||||
return { success: false, error: String(e) }
|
return { success: false, error: String(e) }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
async getDualReportStats(sessionId: string, beginTimestamp: number = 0, endTimestamp: number = 0): Promise<{ success: boolean; data?: any; error?: string }> {
|
||||||
|
if (!this.ensureReady()) {
|
||||||
|
return { success: false, error: 'WCDB 未连接' }
|
||||||
|
}
|
||||||
|
if (!this.wcdbGetDualReportStats) {
|
||||||
|
return { success: false, error: '未支持双人报告统计' }
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const { begin, end } = this.normalizeRange(beginTimestamp, endTimestamp)
|
||||||
|
const outPtr = [null as any]
|
||||||
|
const result = this.wcdbGetDualReportStats(this.handle, sessionId, begin, end, outPtr)
|
||||||
|
if (result !== 0 || !outPtr[0]) {
|
||||||
|
return { success: false, error: `获取双人报告统计失败: ${result}` }
|
||||||
|
}
|
||||||
|
const jsonStr = this.decodeJsonPtr(outPtr[0])
|
||||||
|
if (!jsonStr) return { success: false, error: '解析双人报告统计失败' }
|
||||||
|
const data = JSON.parse(jsonStr)
|
||||||
|
return { success: true, data }
|
||||||
|
} catch (e) {
|
||||||
|
return { success: false, error: String(e) }
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@@ -315,6 +315,13 @@ export class WcdbService {
|
|||||||
return this.callWorker('getAnnualReportExtras', { sessionIds, beginTimestamp, endTimestamp, peakDayBegin, peakDayEnd })
|
return this.callWorker('getAnnualReportExtras', { sessionIds, beginTimestamp, endTimestamp, peakDayBegin, peakDayEnd })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取双人报告统计数据
|
||||||
|
*/
|
||||||
|
async getDualReportStats(sessionId: string, beginTimestamp: number, endTimestamp: number): Promise<{ success: boolean; data?: any; error?: string }> {
|
||||||
|
return this.callWorker('getDualReportStats', { sessionId, beginTimestamp, endTimestamp })
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取群聊统计
|
* 获取群聊统计
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -96,6 +96,9 @@ if (parentPort) {
|
|||||||
case 'getAnnualReportExtras':
|
case 'getAnnualReportExtras':
|
||||||
result = await core.getAnnualReportExtras(payload.sessionIds, payload.beginTimestamp, payload.endTimestamp, payload.peakDayBegin, payload.peakDayEnd)
|
result = await core.getAnnualReportExtras(payload.sessionIds, payload.beginTimestamp, payload.endTimestamp, payload.peakDayBegin, payload.peakDayEnd)
|
||||||
break
|
break
|
||||||
|
case 'getDualReportStats':
|
||||||
|
result = await core.getDualReportStats(payload.sessionId, payload.beginTimestamp, payload.endTimestamp)
|
||||||
|
break
|
||||||
case 'getGroupStats':
|
case 'getGroupStats':
|
||||||
result = await core.getGroupStats(payload.chatroomId, payload.beginTimestamp, payload.endTimestamp)
|
result = await core.getGroupStats(payload.chatroomId, payload.beginTimestamp, payload.endTimestamp)
|
||||||
break
|
break
|
||||||
|
|||||||
BIN
mdassets/us.png
BIN
mdassets/us.png
Binary file not shown.
|
Before Width: | Height: | Size: 185 KiB |
3373
package-lock.json
generated
3373
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "weflow",
|
"name": "weflow",
|
||||||
"version": "1.5.0",
|
"version": "1.5.4",
|
||||||
"description": "WeFlow",
|
"description": "WeFlow",
|
||||||
"main": "dist-electron/main.js",
|
"main": "dist-electron/main.js",
|
||||||
"author": "cc",
|
"author": "cc",
|
||||||
@@ -32,10 +32,13 @@
|
|||||||
"jszip": "^3.10.1",
|
"jszip": "^3.10.1",
|
||||||
"koffi": "^2.9.0",
|
"koffi": "^2.9.0",
|
||||||
"lucide-react": "^0.562.0",
|
"lucide-react": "^0.562.0",
|
||||||
|
"node-llama-cpp": "^3.15.1",
|
||||||
"react": "^19.2.3",
|
"react": "^19.2.3",
|
||||||
"react-dom": "^19.2.3",
|
"react-dom": "^19.2.3",
|
||||||
|
"react-markdown": "^10.1.0",
|
||||||
"react-router-dom": "^7.1.1",
|
"react-router-dom": "^7.1.1",
|
||||||
"react-virtuoso": "^4.18.1",
|
"react-virtuoso": "^4.18.1",
|
||||||
|
"remark-gfm": "^4.0.1",
|
||||||
"sherpa-onnx-node": "^1.10.38",
|
"sherpa-onnx-node": "^1.10.38",
|
||||||
"silk-wasm": "^3.7.1",
|
"silk-wasm": "^3.7.1",
|
||||||
"wechat-emojis": "^1.0.2",
|
"wechat-emojis": "^1.0.2",
|
||||||
@@ -112,7 +115,8 @@
|
|||||||
],
|
],
|
||||||
"asarUnpack": [
|
"asarUnpack": [
|
||||||
"node_modules/silk-wasm/**/*",
|
"node_modules/silk-wasm/**/*",
|
||||||
"node_modules/sherpa-onnx-node/**/*"
|
"node_modules/sherpa-onnx-node/**/*",
|
||||||
|
"node_modules/ffmpeg-static/**/*"
|
||||||
],
|
],
|
||||||
"extraFiles": [
|
"extraFiles": [
|
||||||
{
|
{
|
||||||
|
|||||||
Binary file not shown.
11
src/App.scss
11
src/App.scss
@@ -6,6 +6,17 @@
|
|||||||
animation: appFadeIn 0.35s ease-out;
|
animation: appFadeIn 0.35s ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.window-drag-region {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 150px; // 预留系统最小化/最大化/关闭按钮区域
|
||||||
|
height: 40px;
|
||||||
|
-webkit-app-region: drag;
|
||||||
|
pointer-events: auto;
|
||||||
|
z-index: 2000;
|
||||||
|
}
|
||||||
|
|
||||||
.main-layout {
|
.main-layout {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -22,6 +22,7 @@ import SnsPage from './pages/SnsPage'
|
|||||||
import ContactsPage from './pages/ContactsPage'
|
import ContactsPage from './pages/ContactsPage'
|
||||||
import ChatHistoryPage from './pages/ChatHistoryPage'
|
import ChatHistoryPage from './pages/ChatHistoryPage'
|
||||||
import NotificationWindow from './pages/NotificationWindow'
|
import NotificationWindow from './pages/NotificationWindow'
|
||||||
|
import AIChatPage from './pages/AIChatPage'
|
||||||
|
|
||||||
import { useAppStore } from './stores/appStore'
|
import { useAppStore } from './stores/appStore'
|
||||||
import { themes, useThemeStore, type ThemeId } from './stores/themeStore'
|
import { themes, useThemeStore, type ThemeId } from './stores/themeStore'
|
||||||
@@ -33,6 +34,7 @@ import UpdateDialog from './components/UpdateDialog'
|
|||||||
import UpdateProgressCapsule from './components/UpdateProgressCapsule'
|
import UpdateProgressCapsule from './components/UpdateProgressCapsule'
|
||||||
import LockScreen from './components/LockScreen'
|
import LockScreen from './components/LockScreen'
|
||||||
import { GlobalSessionMonitor } from './components/GlobalSessionMonitor'
|
import { GlobalSessionMonitor } from './components/GlobalSessionMonitor'
|
||||||
|
import { BatchTranscribeGlobal } from './components/BatchTranscribeGlobal'
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
@@ -344,6 +346,7 @@ function App() {
|
|||||||
// 主窗口 - 完整布局
|
// 主窗口 - 完整布局
|
||||||
return (
|
return (
|
||||||
<div className="app-container">
|
<div className="app-container">
|
||||||
|
<div className="window-drag-region" aria-hidden="true" />
|
||||||
{isLocked && (
|
{isLocked && (
|
||||||
<LockScreen
|
<LockScreen
|
||||||
onUnlock={() => setLocked(false)}
|
onUnlock={() => setLocked(false)}
|
||||||
@@ -359,6 +362,9 @@ function App() {
|
|||||||
{/* 全局会话监听与通知 */}
|
{/* 全局会话监听与通知 */}
|
||||||
<GlobalSessionMonitor />
|
<GlobalSessionMonitor />
|
||||||
|
|
||||||
|
{/* 全局批量转写进度浮窗 */}
|
||||||
|
<BatchTranscribeGlobal />
|
||||||
|
|
||||||
{/* 用户协议弹窗 */}
|
{/* 用户协议弹窗 */}
|
||||||
{showAgreement && !agreementLoading && (
|
{showAgreement && !agreementLoading && (
|
||||||
<div className="agreement-overlay">
|
<div className="agreement-overlay">
|
||||||
@@ -429,6 +435,7 @@ function App() {
|
|||||||
<Route path="/" element={<HomePage />} />
|
<Route path="/" element={<HomePage />} />
|
||||||
<Route path="/home" element={<HomePage />} />
|
<Route path="/home" element={<HomePage />} />
|
||||||
<Route path="/chat" element={<ChatPage />} />
|
<Route path="/chat" element={<ChatPage />} />
|
||||||
|
<Route path="/ai-chat" element={<AIChatPage />} />
|
||||||
<Route path="/analytics" element={<AnalyticsWelcomePage />} />
|
<Route path="/analytics" element={<AnalyticsWelcomePage />} />
|
||||||
<Route path="/analytics/view" element={<AnalyticsPage />} />
|
<Route path="/analytics/view" element={<AnalyticsPage />} />
|
||||||
<Route path="/group-analytics" element={<GroupAnalyticsPage />} />
|
<Route path="/group-analytics" element={<GroupAnalyticsPage />} />
|
||||||
|
|||||||
147
src/components/BatchTranscribeGlobal.tsx
Normal file
147
src/components/BatchTranscribeGlobal.tsx
Normal file
@@ -0,0 +1,147 @@
|
|||||||
|
import React, { useEffect, useState } from 'react'
|
||||||
|
import { createPortal } from 'react-dom'
|
||||||
|
import { Loader2, X, CheckCircle, XCircle, AlertCircle, Clock } from 'lucide-react'
|
||||||
|
import { useBatchTranscribeStore } from '../stores/batchTranscribeStore'
|
||||||
|
import '../styles/batchTranscribe.scss'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 全局批量转写进度浮窗 + 结果弹窗
|
||||||
|
* 挂载在 App 层,切换页面时不会消失
|
||||||
|
*/
|
||||||
|
export const BatchTranscribeGlobal: React.FC = () => {
|
||||||
|
const {
|
||||||
|
isBatchTranscribing,
|
||||||
|
progress,
|
||||||
|
showToast,
|
||||||
|
showResult,
|
||||||
|
result,
|
||||||
|
sessionName,
|
||||||
|
startTime,
|
||||||
|
setShowToast,
|
||||||
|
setShowResult
|
||||||
|
} = useBatchTranscribeStore()
|
||||||
|
|
||||||
|
const [eta, setEta] = useState<string>('')
|
||||||
|
|
||||||
|
// 计算剩余时间
|
||||||
|
useEffect(() => {
|
||||||
|
if (!isBatchTranscribing || !startTime || progress.current === 0) {
|
||||||
|
setEta('')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const timer = setInterval(() => {
|
||||||
|
const now = Date.now()
|
||||||
|
const elapsed = now - startTime
|
||||||
|
const rate = progress.current / elapsed // ms per item
|
||||||
|
const remainingItems = progress.total - progress.current
|
||||||
|
|
||||||
|
if (remainingItems <= 0) {
|
||||||
|
setEta('')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const remainingTimeMs = remainingItems / rate
|
||||||
|
const remainingSeconds = Math.ceil(remainingTimeMs / 1000)
|
||||||
|
|
||||||
|
if (remainingSeconds < 60) {
|
||||||
|
setEta(`${remainingSeconds}秒`)
|
||||||
|
} else {
|
||||||
|
const minutes = Math.floor(remainingSeconds / 60)
|
||||||
|
const seconds = remainingSeconds % 60
|
||||||
|
setEta(`${minutes}分${seconds}秒`)
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
|
|
||||||
|
return () => clearInterval(timer)
|
||||||
|
}, [isBatchTranscribing, startTime, progress.current, progress.total])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{/* 批量转写进度浮窗(非阻塞) */}
|
||||||
|
{showToast && isBatchTranscribing && createPortal(
|
||||||
|
<div className="batch-progress-toast">
|
||||||
|
<div className="batch-progress-toast-header">
|
||||||
|
<div className="batch-progress-toast-title">
|
||||||
|
<Loader2 size={14} className="spin" />
|
||||||
|
<span>批量转写中{sessionName ? `(${sessionName})` : ''}</span>
|
||||||
|
</div>
|
||||||
|
<button className="batch-progress-toast-close" onClick={() => setShowToast(false)} title="最小化">
|
||||||
|
<X size={14} />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div className="batch-progress-toast-body">
|
||||||
|
<div className="progress-info-row">
|
||||||
|
<div className="progress-text">
|
||||||
|
<span>{progress.current} / {progress.total}</span>
|
||||||
|
<span className="progress-percent">
|
||||||
|
{progress.total > 0
|
||||||
|
? Math.round((progress.current / progress.total) * 100)
|
||||||
|
: 0}%
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{eta && (
|
||||||
|
<div className="progress-eta">
|
||||||
|
<Clock size={12} />
|
||||||
|
<span>剩余 {eta}</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="progress-bar">
|
||||||
|
<div
|
||||||
|
className="progress-fill"
|
||||||
|
style={{
|
||||||
|
width: `${progress.total > 0
|
||||||
|
? (progress.current / progress.total) * 100
|
||||||
|
: 0}%`
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>,
|
||||||
|
document.body
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* 批量转写结果对话框 */}
|
||||||
|
{showResult && createPortal(
|
||||||
|
<div className="batch-modal-overlay" onClick={() => setShowResult(false)}>
|
||||||
|
<div className="batch-modal-content batch-result-modal" onClick={(e) => e.stopPropagation()}>
|
||||||
|
<div className="batch-modal-header">
|
||||||
|
<CheckCircle size={20} />
|
||||||
|
<h3>转写完成</h3>
|
||||||
|
</div>
|
||||||
|
<div className="batch-modal-body">
|
||||||
|
<div className="result-summary">
|
||||||
|
<div className="result-item success">
|
||||||
|
<CheckCircle size={18} />
|
||||||
|
<span className="label">成功:</span>
|
||||||
|
<span className="value">{result.success} 条</span>
|
||||||
|
</div>
|
||||||
|
{result.fail > 0 && (
|
||||||
|
<div className="result-item fail">
|
||||||
|
<XCircle size={18} />
|
||||||
|
<span className="label">失败:</span>
|
||||||
|
<span className="value">{result.fail} 条</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
{result.fail > 0 && (
|
||||||
|
<div className="result-tip">
|
||||||
|
<AlertCircle size={16} />
|
||||||
|
<span>部分语音转写失败,可能是语音文件损坏或网络问题</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="batch-modal-footer">
|
||||||
|
<button className="btn-primary" onClick={() => setShowResult(false)}>
|
||||||
|
确定
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>,
|
||||||
|
document.body
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -81,6 +81,11 @@ export function GlobalSessionMonitor() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const checkForNewMessages = async (oldSessions: ChatSession[], newSessions: ChatSession[]) => {
|
const checkForNewMessages = async (oldSessions: ChatSession[], newSessions: ChatSession[]) => {
|
||||||
|
if (!oldSessions || oldSessions.length === 0) {
|
||||||
|
console.log('[NotificationFilter] Skipping check on initial load (empty baseline)')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
const oldMap = new Map(oldSessions.map(s => [s.username, s]))
|
const oldMap = new Map(oldSessions.map(s => [s.username, s]))
|
||||||
|
|
||||||
for (const newSession of newSessions) {
|
for (const newSession of newSessions) {
|
||||||
@@ -140,6 +145,14 @@ export function GlobalSessionMonitor() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 新增:如果未读数量没有增加,说明可能是自己在其他设备回复(或者已读),不弹通知
|
||||||
|
const oldUnread = oldSession ? oldSession.unreadCount : 0
|
||||||
|
const newUnread = newSession.unreadCount
|
||||||
|
if (newUnread <= oldUnread) {
|
||||||
|
// 仅仅是状态同步(如自己在手机上发消息 or 已读),跳过通知
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
let title = newSession.displayName || newSession.username
|
let title = newSession.displayName || newSession.username
|
||||||
let avatarUrl = newSession.avatarUrl
|
let avatarUrl = newSession.avatarUrl
|
||||||
let content = newSession.summary || '[新消息]'
|
let content = newSession.summary || '[新消息]'
|
||||||
|
|||||||
36
src/components/MessageBubble.tsx
Normal file
36
src/components/MessageBubble.tsx
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import { Bot, User } from 'lucide-react'
|
||||||
|
|
||||||
|
interface ChatMessage {
|
||||||
|
id: string;
|
||||||
|
role: 'user' | 'ai';
|
||||||
|
content: string;
|
||||||
|
timestamp: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface MessageBubbleProps {
|
||||||
|
message: ChatMessage;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 优化后的消息气泡组件
|
||||||
|
* 使用 React.memo 避免不必要的重新渲染
|
||||||
|
*/
|
||||||
|
export const MessageBubble = React.memo<MessageBubbleProps>(({ message }) => {
|
||||||
|
return (
|
||||||
|
<div className={`message-row ${message.role}`}>
|
||||||
|
<div className="avatar">
|
||||||
|
{message.role === 'ai' ? <Bot size={24} /> : <User size={24} />}
|
||||||
|
</div>
|
||||||
|
<div className="bubble">
|
||||||
|
<div className="content">{message.content}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}, (prevProps, nextProps) => {
|
||||||
|
// 自定义比较函数:只有内容或ID变化时才重新渲染
|
||||||
|
return prevProps.message.content === nextProps.message.content &&
|
||||||
|
prevProps.message.id === nextProps.message.id
|
||||||
|
})
|
||||||
|
|
||||||
|
MessageBubble.displayName = 'MessageBubble'
|
||||||
142
src/components/ReportComponents.scss
Normal file
142
src/components/ReportComponents.scss
Normal file
@@ -0,0 +1,142 @@
|
|||||||
|
// Shared styles for Report components (Heatmap, WordCloud)
|
||||||
|
|
||||||
|
// --- Heatmap ---
|
||||||
|
.heatmap-wrapper {
|
||||||
|
margin-top: 24px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.heatmap-header {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 28px 1fr;
|
||||||
|
gap: 3px;
|
||||||
|
margin-bottom: 6px;
|
||||||
|
color: var(--ar-text-sub); // Assumes --ar-text-sub is defined in parent context or globally
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time-labels {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(24, 1fr);
|
||||||
|
gap: 3px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.heatmap {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 28px 1fr;
|
||||||
|
gap: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.heatmap-week-col {
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: repeat(7, 1fr);
|
||||||
|
gap: 3px;
|
||||||
|
font-size: 10px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
}
|
||||||
|
|
||||||
|
.week-label {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.heatmap-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(24, 1fr);
|
||||||
|
gap: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-cell {
|
||||||
|
aspect-ratio: 1;
|
||||||
|
border-radius: 2px;
|
||||||
|
min-height: 10px;
|
||||||
|
transition: transform 0.15s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: scale(1.3);
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// --- Word Cloud ---
|
||||||
|
.word-cloud-wrapper {
|
||||||
|
margin: 24px auto 0;
|
||||||
|
padding: 0;
|
||||||
|
max-width: 520px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
--cloud-scale: clamp(0.72, 80vw / 520, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.word-cloud-inner {
|
||||||
|
position: relative;
|
||||||
|
width: 520px;
|
||||||
|
height: 520px;
|
||||||
|
margin: 0;
|
||||||
|
border-radius: 50%;
|
||||||
|
transform: scale(var(--cloud-scale));
|
||||||
|
transform-origin: center;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
inset: -6%;
|
||||||
|
background:
|
||||||
|
radial-gradient(circle at 35% 45%, color-mix(in srgb, var(--primary, #07C160) 12%, transparent), transparent 55%),
|
||||||
|
radial-gradient(circle at 65% 50%, color-mix(in srgb, var(--accent, #F2AA00) 10%, transparent), transparent 58%),
|
||||||
|
radial-gradient(circle at 50% 65%, var(--bg-tertiary, rgba(0, 0, 0, 0.04)), transparent 60%);
|
||||||
|
filter: blur(18px);
|
||||||
|
border-radius: 50%;
|
||||||
|
pointer-events: none;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.word-tag {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0;
|
||||||
|
background: transparent;
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
line-height: 1.2;
|
||||||
|
white-space: nowrap;
|
||||||
|
transition: transform 0.2s ease, color 0.2s ease;
|
||||||
|
cursor: default;
|
||||||
|
color: var(--ar-text-main);
|
||||||
|
font-weight: 600;
|
||||||
|
opacity: 0;
|
||||||
|
animation: wordPopIn 0.55s ease forwards;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
transform: translate(-50%, -50%) scale(0.8);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: translate(-50%, -50%) scale(1.08);
|
||||||
|
color: var(--ar-primary);
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wordPopIn {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate(-50%, -50%) scale(0.6);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: var(--final-opacity, 1);
|
||||||
|
transform: translate(-50%, -50%) scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.word-cloud-note {
|
||||||
|
margin-top: 24px;
|
||||||
|
font-size: 14px !important;
|
||||||
|
color: var(--ar-text-sub) !important;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
51
src/components/ReportHeatmap.tsx
Normal file
51
src/components/ReportHeatmap.tsx
Normal file
@@ -0,0 +1,51 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import './ReportComponents.scss'
|
||||||
|
|
||||||
|
interface ReportHeatmapProps {
|
||||||
|
data: number[][]
|
||||||
|
}
|
||||||
|
|
||||||
|
const ReportHeatmap: React.FC<ReportHeatmapProps> = ({ data }) => {
|
||||||
|
if (!data || data.length === 0) return null
|
||||||
|
|
||||||
|
const maxHeat = Math.max(...data.flat())
|
||||||
|
const weekLabels = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="heatmap-wrapper">
|
||||||
|
<div className="heatmap-header">
|
||||||
|
<div></div>
|
||||||
|
<div className="time-labels">
|
||||||
|
{[0, 6, 12, 18].map(h => (
|
||||||
|
<span key={h} style={{ gridColumn: h + 1 }}>{h}</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="heatmap">
|
||||||
|
<div className="heatmap-week-col">
|
||||||
|
{weekLabels.map(w => <div key={w} className="week-label">{w}</div>)}
|
||||||
|
</div>
|
||||||
|
<div className="heatmap-grid">
|
||||||
|
{data.map((row, wi) =>
|
||||||
|
row.map((val, hi) => {
|
||||||
|
const alpha = maxHeat > 0 ? (val / maxHeat * 0.85 + 0.1).toFixed(2) : '0.1'
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
key={`${wi}-${hi}`}
|
||||||
|
className="h-cell"
|
||||||
|
style={{
|
||||||
|
backgroundColor: 'var(--primary)',
|
||||||
|
opacity: alpha
|
||||||
|
}}
|
||||||
|
title={`${weekLabels[wi]} ${hi}:00 - ${val}条`}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ReportHeatmap
|
||||||
113
src/components/ReportWordCloud.tsx
Normal file
113
src/components/ReportWordCloud.tsx
Normal file
@@ -0,0 +1,113 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import './ReportComponents.scss'
|
||||||
|
|
||||||
|
interface ReportWordCloudProps {
|
||||||
|
words: { phrase: string; count: number }[]
|
||||||
|
}
|
||||||
|
|
||||||
|
const ReportWordCloud: React.FC<ReportWordCloudProps> = ({ words }) => {
|
||||||
|
if (!words || words.length === 0) return null
|
||||||
|
|
||||||
|
const maxCount = words.length > 0 ? words[0].count : 1
|
||||||
|
const topWords = words.slice(0, 32)
|
||||||
|
const baseSize = 520
|
||||||
|
|
||||||
|
// 使用确定性随机数生成器
|
||||||
|
const seededRandom = (seed: number) => {
|
||||||
|
const x = Math.sin(seed) * 10000
|
||||||
|
return x - Math.floor(x)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 计算词云位置
|
||||||
|
const placedItems: { x: number; y: number; w: number; h: number }[] = []
|
||||||
|
|
||||||
|
const canPlace = (x: number, y: number, w: number, h: number): boolean => {
|
||||||
|
const halfW = w / 2
|
||||||
|
const halfH = h / 2
|
||||||
|
const dx = x - 50
|
||||||
|
const dy = y - 50
|
||||||
|
const dist = Math.sqrt(dx * dx + dy * dy)
|
||||||
|
const maxR = 49 - Math.max(halfW, halfH)
|
||||||
|
if (dist > maxR) return false
|
||||||
|
|
||||||
|
const pad = 1.8
|
||||||
|
for (const p of placedItems) {
|
||||||
|
if ((x - halfW - pad) < (p.x + p.w / 2) &&
|
||||||
|
(x + halfW + pad) > (p.x - p.w / 2) &&
|
||||||
|
(y - halfH - pad) < (p.y + p.h / 2) &&
|
||||||
|
(y + halfH + pad) > (p.y - p.h / 2)) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
const wordItems = topWords.map((item, i) => {
|
||||||
|
const ratio = item.count / maxCount
|
||||||
|
const fontSize = Math.round(12 + Math.pow(ratio, 0.65) * 20)
|
||||||
|
const opacity = Math.min(1, Math.max(0.35, 0.35 + ratio * 0.65))
|
||||||
|
const delay = (i * 0.04).toFixed(2)
|
||||||
|
|
||||||
|
// 计算词语宽度
|
||||||
|
const charCount = Math.max(1, item.phrase.length)
|
||||||
|
const hasCjk = /[\u4e00-\u9fff]/.test(item.phrase)
|
||||||
|
const hasLatin = /[A-Za-z0-9]/.test(item.phrase)
|
||||||
|
const widthFactor = hasCjk && hasLatin ? 0.85 : hasCjk ? 0.98 : 0.6
|
||||||
|
const widthPx = fontSize * (charCount * widthFactor)
|
||||||
|
const heightPx = fontSize * 1.1
|
||||||
|
const widthPct = (widthPx / baseSize) * 100
|
||||||
|
const heightPct = (heightPx / baseSize) * 100
|
||||||
|
|
||||||
|
// 寻找位置
|
||||||
|
let x = 50, y = 50
|
||||||
|
let placedOk = false
|
||||||
|
const tries = i === 0 ? 1 : 420
|
||||||
|
|
||||||
|
for (let t = 0; t < tries; t++) {
|
||||||
|
if (i === 0) {
|
||||||
|
x = 50
|
||||||
|
y = 50
|
||||||
|
} else {
|
||||||
|
const idx = i + t * 0.28
|
||||||
|
const radius = Math.sqrt(idx) * 7.6 + (seededRandom(i * 1000 + t) * 1.2 - 0.6)
|
||||||
|
const angle = idx * 2.399963 + seededRandom(i * 2000 + t) * 0.35
|
||||||
|
x = 50 + radius * Math.cos(angle)
|
||||||
|
y = 50 + radius * Math.sin(angle)
|
||||||
|
}
|
||||||
|
if (canPlace(x, y, widthPct, heightPct)) {
|
||||||
|
placedOk = true
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!placedOk) return null
|
||||||
|
placedItems.push({ x, y, w: widthPct, h: heightPct })
|
||||||
|
|
||||||
|
return (
|
||||||
|
<span
|
||||||
|
key={i}
|
||||||
|
className="word-tag"
|
||||||
|
style={{
|
||||||
|
'--final-opacity': opacity,
|
||||||
|
left: `${x.toFixed(2)}%`,
|
||||||
|
top: `${y.toFixed(2)}%`,
|
||||||
|
fontSize: `${fontSize}px`,
|
||||||
|
animationDelay: `${delay}s`,
|
||||||
|
} as React.CSSProperties}
|
||||||
|
title={`${item.phrase} (出现 ${item.count} 次)`}
|
||||||
|
>
|
||||||
|
{item.phrase}
|
||||||
|
</span>
|
||||||
|
)
|
||||||
|
}).filter(Boolean)
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="word-cloud-wrapper">
|
||||||
|
<div className="word-cloud-inner">
|
||||||
|
{wordItems}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ReportWordCloud
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
import { useState, useEffect } from 'react'
|
import { useState, useEffect } from 'react'
|
||||||
import { NavLink, useLocation } from 'react-router-dom'
|
import { NavLink, useLocation } from 'react-router-dom'
|
||||||
import { Home, MessageSquare, BarChart3, Users, FileText, Database, Settings, ChevronLeft, ChevronRight, Download, Bot, Aperture, UserCircle, Lock } from 'lucide-react'
|
import { Home, MessageSquare, BarChart3, Users, FileText, Database, Settings, ChevronLeft, ChevronRight, Download, Aperture, UserCircle, Lock } from 'lucide-react'
|
||||||
import { useAppStore } from '../stores/appStore'
|
import { useAppStore } from '../stores/appStore'
|
||||||
import * as configService from '../services/config'
|
import * as configService from '../services/config'
|
||||||
import './Sidebar.scss'
|
import './Sidebar.scss'
|
||||||
|
|||||||
552
src/pages/AIChatPage.scss
Normal file
552
src/pages/AIChatPage.scss
Normal file
@@ -0,0 +1,552 @@
|
|||||||
|
// AI 对话页面 - 简约大气风格
|
||||||
|
.ai-chat-page {
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background: var(--bg-gradient);
|
||||||
|
color: var(--text-primary);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.chat-container {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// ========== 顶部 Header - 已移除 ==========
|
||||||
|
// 模型选择器现已集成到输入框
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// ========== 聊天区域 ==========
|
||||||
|
.chat-main {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
background: var(--bg-secondary);
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
// 空状态
|
||||||
|
.empty-state {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 40px;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: var(--primary-light);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
margin: 0 0 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 消息列表
|
||||||
|
.messages-list {
|
||||||
|
flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 24px 32px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 20px;
|
||||||
|
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&::-webkit-scrollbar-track {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
&::-webkit-scrollbar-thumb {
|
||||||
|
background: var(--border-color);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message-row {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
max-width: 80%;
|
||||||
|
animation: messageIn 0.3s ease-out;
|
||||||
|
|
||||||
|
// 用户消息
|
||||||
|
&.user {
|
||||||
|
align-self: flex-end;
|
||||||
|
flex-direction: row-reverse;
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
background: var(--primary-light);
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble {
|
||||||
|
background: var(--primary-gradient);
|
||||||
|
color: white;
|
||||||
|
border-radius: 18px 18px 4px 18px;
|
||||||
|
box-shadow: 0 2px 10px color-mix(in srgb, var(--primary) 20%, transparent);
|
||||||
|
|
||||||
|
.content {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// AI 消息
|
||||||
|
&.ai {
|
||||||
|
align-self: flex-start;
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
color: var(--text-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble {
|
||||||
|
background: var(--card-bg);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 18px 18px 18px 4px;
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
-webkit-backdrop-filter: blur(10px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
flex-shrink: 0;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble {
|
||||||
|
padding: 12px 16px;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
|
||||||
|
.content,
|
||||||
|
.markdown-content {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: var(--text-primary);
|
||||||
|
word-wrap: break-word;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Markdown 样式
|
||||||
|
.markdown-content {
|
||||||
|
p {
|
||||||
|
margin: 0 0 0.8em;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
|
margin: 1em 0 0.5em;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 1.3;
|
||||||
|
color: var(--text-primary);
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul,
|
||||||
|
ol {
|
||||||
|
margin: 0.5em 0;
|
||||||
|
padding-left: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin: 0.3em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
padding: 2px 6px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-family: 'Consolas', 'Monaco', monospace;
|
||||||
|
font-size: 0.9em;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
padding: 12px;
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow-x: auto;
|
||||||
|
margin: 0.8em 0;
|
||||||
|
|
||||||
|
code {
|
||||||
|
background: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
border-left: 3px solid var(--primary);
|
||||||
|
padding-left: 12px;
|
||||||
|
margin: 0.8em 0;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--primary);
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border: none;
|
||||||
|
border-top: 1px solid var(--border-color);
|
||||||
|
margin: 1em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
width: 100%;
|
||||||
|
margin: 0.8em 0;
|
||||||
|
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
padding: 8px 12px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-spacer {
|
||||||
|
height: 100px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 输入区域
|
||||||
|
.input-area {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 24px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: calc(100% - 64px);
|
||||||
|
max-width: 800px;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
.input-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
gap: 10px;
|
||||||
|
background: var(--card-bg);
|
||||||
|
backdrop-filter: blur(20px);
|
||||||
|
-webkit-backdrop-filter: blur(20px);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 10px 14px;
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
|
||||||
|
&:focus-within {
|
||||||
|
border-color: var(--primary);
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1),
|
||||||
|
0 0 0 3px color-mix(in srgb, var(--primary) 15%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
flex: 1;
|
||||||
|
min-height: 24px;
|
||||||
|
max-height: 120px;
|
||||||
|
padding: 8px 0;
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
resize: none;
|
||||||
|
color: var(--text-primary);
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: inherit;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&::placeholder {
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
// 模型选择器
|
||||||
|
.model-selector {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.model-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 6px;
|
||||||
|
width: auto;
|
||||||
|
height: 36px;
|
||||||
|
padding: 6px 12px;
|
||||||
|
background: transparent;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
white-space: nowrap;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&.spin {
|
||||||
|
animation: spin 1s linear infinite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover:not(:disabled) {
|
||||||
|
background: var(--bg-hover);
|
||||||
|
border-color: var(--text-tertiary);
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.loaded {
|
||||||
|
background: color-mix(in srgb, var(--primary) 15%, transparent);
|
||||||
|
border-color: var(--primary);
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.loading {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.disabled {
|
||||||
|
opacity: 0.5;
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.model-dropdown {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 100%;
|
||||||
|
right: 0;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
background: var(--card-bg);
|
||||||
|
backdrop-filter: blur(20px);
|
||||||
|
-webkit-backdrop-filter: blur(20px);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
|
||||||
|
z-index: 100;
|
||||||
|
overflow: hidden;
|
||||||
|
animation: dropdownIn 0.2s ease-out;
|
||||||
|
min-width: 140px;
|
||||||
|
|
||||||
|
.model-option {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-primary);
|
||||||
|
transition: background 0.15s ease;
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
&:hover:not(.disabled) {
|
||||||
|
background: var(--bg-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background: color-mix(in srgb, var(--primary) 20%, transparent);
|
||||||
|
color: var(--primary);
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
.check {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.check {
|
||||||
|
margin-left: 8px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mode-toggle {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background: transparent;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
&:hover:not(:disabled) {
|
||||||
|
background: var(--bg-hover);
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background: color-mix(in srgb, var(--primary) 15%, transparent);
|
||||||
|
border-color: var(--primary);
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
opacity: 0.4;
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.send-btn {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background: var(--primary-gradient);
|
||||||
|
border: none;
|
||||||
|
border-radius: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: white;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 25%, transparent);
|
||||||
|
|
||||||
|
&:hover:not(:disabled) {
|
||||||
|
transform: scale(1.05);
|
||||||
|
box-shadow: 0 4px 12px color-mix(in srgb, var(--primary) 35%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active:not(:disabled) {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
box-shadow: none;
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes messageIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(8px);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes dropdownIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(-8px);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
from {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
391
src/pages/AIChatPage.tsx
Normal file
391
src/pages/AIChatPage.tsx
Normal file
@@ -0,0 +1,391 @@
|
|||||||
|
import { useState, useEffect, useRef, useCallback } from 'react'
|
||||||
|
import { Send, Bot, User, Cpu, ChevronDown, Loader2 } from 'lucide-react'
|
||||||
|
import { Virtuoso, VirtuosoHandle } from 'react-virtuoso'
|
||||||
|
import { engineService, PRESET_MODELS, ModelInfo } from '../services/EngineService'
|
||||||
|
import { MessageBubble } from '../components/MessageBubble'
|
||||||
|
import './AIChatPage.scss'
|
||||||
|
|
||||||
|
interface ChatMessage {
|
||||||
|
id: string;
|
||||||
|
role: 'user' | 'ai';
|
||||||
|
content: string;
|
||||||
|
timestamp: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 消息数量限制,避免内存过载
|
||||||
|
const MAX_MESSAGES = 200
|
||||||
|
|
||||||
|
export default function AIChatPage() {
|
||||||
|
const [input, setInput] = useState('')
|
||||||
|
const [messages, setMessages] = useState<ChatMessage[]>([])
|
||||||
|
const [isTyping, setIsTyping] = useState(false)
|
||||||
|
const [models, setModels] = useState<ModelInfo[]>([...PRESET_MODELS])
|
||||||
|
const [selectedModel, setSelectedModel] = useState<string | null>(null)
|
||||||
|
const [modelLoaded, setModelLoaded] = useState(false)
|
||||||
|
const [loadingModel, setLoadingModel] = useState(false)
|
||||||
|
const [isThinkingMode, setIsThinkingMode] = useState(true)
|
||||||
|
const [showModelDropdown, setShowModelDropdown] = useState(false)
|
||||||
|
|
||||||
|
const textareaRef = useRef<HTMLTextAreaElement>(null)
|
||||||
|
const virtuosoRef = useRef<VirtuosoHandle>(null)
|
||||||
|
const dropdownRef = useRef<HTMLDivElement>(null)
|
||||||
|
|
||||||
|
// 流式渲染优化:使用 ref 缓存内容,使用 RAF 批量更新
|
||||||
|
const streamingContentRef = useRef('')
|
||||||
|
const streamingMessageIdRef = useRef<string | null>(null)
|
||||||
|
const rafIdRef = useRef<number | null>(null)
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
checkModelsStatus()
|
||||||
|
|
||||||
|
// 初始化Llama服务(延迟初始化,用户进入此页面时启动)
|
||||||
|
const initLlama = async () => {
|
||||||
|
try {
|
||||||
|
await window.electronAPI.llama?.init()
|
||||||
|
console.log('[AIChatPage] Llama service initialized')
|
||||||
|
} catch (e) {
|
||||||
|
console.error('[AIChatPage] Failed to initialize Llama:', e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
initLlama()
|
||||||
|
|
||||||
|
// 清理函数:组件卸载时释放所有资源
|
||||||
|
return () => {
|
||||||
|
// 取消未完成的 RAF
|
||||||
|
if (rafIdRef.current !== null) {
|
||||||
|
cancelAnimationFrame(rafIdRef.current)
|
||||||
|
rafIdRef.current = null
|
||||||
|
}
|
||||||
|
|
||||||
|
// 清理 engine service 的回调引用
|
||||||
|
engineService.clearCallbacks()
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
// 监听页面卸载事件,确保资源释放
|
||||||
|
useEffect(() => {
|
||||||
|
const handleBeforeUnload = () => {
|
||||||
|
// 清理回调和监听器
|
||||||
|
engineService.dispose()
|
||||||
|
}
|
||||||
|
|
||||||
|
window.addEventListener('beforeunload', handleBeforeUnload)
|
||||||
|
return () => window.removeEventListener('beforeunload', handleBeforeUnload)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
// 点击外部关闭下拉框
|
||||||
|
useEffect(() => {
|
||||||
|
const handleClickOutside = (event: MouseEvent) => {
|
||||||
|
if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) {
|
||||||
|
setShowModelDropdown(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('mousedown', handleClickOutside)
|
||||||
|
return () => document.removeEventListener('mousedown', handleClickOutside)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const scrollToBottom = useCallback(() => {
|
||||||
|
// 使用 virtuoso 的 scrollToIndex 方法滚动到底部
|
||||||
|
if (virtuosoRef.current && messages.length > 0) {
|
||||||
|
virtuosoRef.current.scrollToIndex({
|
||||||
|
index: messages.length - 1,
|
||||||
|
behavior: 'smooth'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}, [messages.length])
|
||||||
|
|
||||||
|
const checkModelsStatus = async () => {
|
||||||
|
const updatedModels = await Promise.all(models.map(async (m) => {
|
||||||
|
const exists = await engineService.checkModelExists(m.path)
|
||||||
|
return { ...m, downloaded: exists }
|
||||||
|
}))
|
||||||
|
setModels(updatedModels)
|
||||||
|
|
||||||
|
// Auto-select first available model
|
||||||
|
if (!selectedModel) {
|
||||||
|
const available = updatedModels.find(m => m.downloaded)
|
||||||
|
if (available) {
|
||||||
|
setSelectedModel(available.path)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 自动加载模型
|
||||||
|
const handleLoadModel = async (modelPath?: string) => {
|
||||||
|
const pathToLoad = modelPath || selectedModel
|
||||||
|
if (!pathToLoad) return false
|
||||||
|
|
||||||
|
setLoadingModel(true)
|
||||||
|
try {
|
||||||
|
await engineService.loadModel(pathToLoad)
|
||||||
|
// Initialize session with system prompt
|
||||||
|
await engineService.createSession("You are a helpful AI assistant.")
|
||||||
|
setModelLoaded(true)
|
||||||
|
return true
|
||||||
|
} catch (e) {
|
||||||
|
console.error("Load failed", e)
|
||||||
|
alert("模型加载失败: " + String(e))
|
||||||
|
return false
|
||||||
|
} finally {
|
||||||
|
setLoadingModel(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选择模型(如果有多个)
|
||||||
|
const handleSelectModel = (modelPath: string) => {
|
||||||
|
setSelectedModel(modelPath)
|
||||||
|
setShowModelDropdown(false)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取可用的已下载模型
|
||||||
|
const availableModels = models.filter(m => m.downloaded)
|
||||||
|
const selectedModelInfo = models.find(m => m.path === selectedModel)
|
||||||
|
|
||||||
|
// 优化的流式更新函数:使用 RAF 批量更新
|
||||||
|
const updateStreamingMessage = useCallback(() => {
|
||||||
|
if (!streamingMessageIdRef.current) return
|
||||||
|
|
||||||
|
setMessages(prev => prev.map(msg =>
|
||||||
|
msg.id === streamingMessageIdRef.current
|
||||||
|
? { ...msg, content: streamingContentRef.current }
|
||||||
|
: msg
|
||||||
|
))
|
||||||
|
|
||||||
|
rafIdRef.current = null
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
// Token 回调:使用 RAF 批量更新 UI
|
||||||
|
const handleToken = useCallback((token: string) => {
|
||||||
|
streamingContentRef.current += token
|
||||||
|
|
||||||
|
// 使用 requestAnimationFrame 批量更新,避免频繁渲染
|
||||||
|
if (rafIdRef.current === null) {
|
||||||
|
rafIdRef.current = requestAnimationFrame(updateStreamingMessage)
|
||||||
|
}
|
||||||
|
}, [updateStreamingMessage])
|
||||||
|
|
||||||
|
const handleSend = async () => {
|
||||||
|
if (!input.trim() || isTyping) return
|
||||||
|
|
||||||
|
// 如果模型未加载,先自动加载
|
||||||
|
if (!modelLoaded) {
|
||||||
|
if (!selectedModel) {
|
||||||
|
alert("请先下载模型(设置页面)")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const loaded = await handleLoadModel()
|
||||||
|
if (!loaded) return
|
||||||
|
}
|
||||||
|
|
||||||
|
const userMsg: ChatMessage = {
|
||||||
|
id: Date.now().toString(),
|
||||||
|
role: 'user',
|
||||||
|
content: input,
|
||||||
|
timestamp: Date.now()
|
||||||
|
}
|
||||||
|
|
||||||
|
setMessages(prev => {
|
||||||
|
const newMessages = [...prev, userMsg]
|
||||||
|
// 限制消息数量,避免内存过载
|
||||||
|
return newMessages.length > MAX_MESSAGES
|
||||||
|
? newMessages.slice(-MAX_MESSAGES)
|
||||||
|
: newMessages
|
||||||
|
})
|
||||||
|
setInput('')
|
||||||
|
setIsTyping(true)
|
||||||
|
|
||||||
|
// Reset textarea height
|
||||||
|
if (textareaRef.current) {
|
||||||
|
textareaRef.current.style.height = 'auto'
|
||||||
|
}
|
||||||
|
|
||||||
|
const aiMsgId = (Date.now() + 1).toString()
|
||||||
|
streamingContentRef.current = ''
|
||||||
|
streamingMessageIdRef.current = aiMsgId
|
||||||
|
|
||||||
|
// Optimistic update for AI message start
|
||||||
|
setMessages(prev => {
|
||||||
|
const newMessages = [...prev, {
|
||||||
|
id: aiMsgId,
|
||||||
|
role: 'ai' as const,
|
||||||
|
content: '',
|
||||||
|
timestamp: Date.now()
|
||||||
|
}]
|
||||||
|
return newMessages.length > MAX_MESSAGES
|
||||||
|
? newMessages.slice(-MAX_MESSAGES)
|
||||||
|
: newMessages
|
||||||
|
})
|
||||||
|
|
||||||
|
// Append thinking command based on mode
|
||||||
|
const msgWithSuffix = input + (isThinkingMode ? " /think" : " /no_think")
|
||||||
|
|
||||||
|
try {
|
||||||
|
await engineService.chat(msgWithSuffix, handleToken, { thinking: isThinkingMode })
|
||||||
|
} catch (e) {
|
||||||
|
console.error("Chat failed", e)
|
||||||
|
setMessages(prev => [...prev, {
|
||||||
|
id: Date.now().toString(),
|
||||||
|
role: 'ai',
|
||||||
|
content: "❌ Error: Failed to get response from AI.",
|
||||||
|
timestamp: Date.now()
|
||||||
|
}])
|
||||||
|
} finally {
|
||||||
|
setIsTyping(false)
|
||||||
|
streamingMessageIdRef.current = null
|
||||||
|
|
||||||
|
// 确保最终状态同步
|
||||||
|
if (rafIdRef.current !== null) {
|
||||||
|
cancelAnimationFrame(rafIdRef.current)
|
||||||
|
updateStreamingMessage()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 渲染模型选择按钮(集成在输入框作为下拉项)
|
||||||
|
const renderModelSelector = () => {
|
||||||
|
// 没有可用模型
|
||||||
|
if (availableModels.length === 0) {
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
className="model-btn disabled"
|
||||||
|
title="请先在设置页面下载模型"
|
||||||
|
>
|
||||||
|
<Bot size={16} />
|
||||||
|
<span>无模型</span>
|
||||||
|
</button>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 只有一个模型,直接显示
|
||||||
|
if (availableModels.length === 1) {
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
className={`model-btn ${modelLoaded ? 'loaded' : ''} ${loadingModel ? 'loading' : ''}`}
|
||||||
|
title={modelLoaded ? "模型已就绪" : "发送消息时自动加载"}
|
||||||
|
>
|
||||||
|
{loadingModel ? (
|
||||||
|
<Loader2 size={16} className="spin" />
|
||||||
|
) : (
|
||||||
|
<Bot size={16} />
|
||||||
|
)}
|
||||||
|
<span>{loadingModel ? '加载中' : selectedModelInfo?.name || '模型'}</span>
|
||||||
|
</button>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 多个模型,显示下拉选择
|
||||||
|
return (
|
||||||
|
<div className="model-selector" ref={dropdownRef}>
|
||||||
|
<button
|
||||||
|
className={`model-btn ${modelLoaded ? 'loaded' : ''} ${loadingModel ? 'loading' : ''}`}
|
||||||
|
onClick={() => !loadingModel && setShowModelDropdown(!showModelDropdown)}
|
||||||
|
title="点击选择模型"
|
||||||
|
>
|
||||||
|
{loadingModel ? (
|
||||||
|
<Loader2 size={16} className="spin" />
|
||||||
|
) : (
|
||||||
|
<Bot size={16} />
|
||||||
|
)}
|
||||||
|
<span>{loadingModel ? '加载中' : selectedModelInfo?.name || '选择模型'}</span>
|
||||||
|
<ChevronDown size={13} className={showModelDropdown ? 'rotate' : ''} />
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{showModelDropdown && (
|
||||||
|
<div className="model-dropdown">
|
||||||
|
{availableModels.map(model => (
|
||||||
|
<div
|
||||||
|
key={model.path}
|
||||||
|
className={`model-option ${selectedModel === model.path ? 'active' : ''}`}
|
||||||
|
onClick={() => handleSelectModel(model.path)}
|
||||||
|
>
|
||||||
|
<span>{model.name}</span>
|
||||||
|
{selectedModel === model.path && (
|
||||||
|
<span className="check">✓</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="ai-chat-page">
|
||||||
|
<div className="chat-main">
|
||||||
|
{messages.length === 0 ? (
|
||||||
|
<div className="empty-state">
|
||||||
|
<div className="icon">
|
||||||
|
<Bot size={40} />
|
||||||
|
</div>
|
||||||
|
<h2>AI 为你服务</h2>
|
||||||
|
<p>
|
||||||
|
{availableModels.length === 0
|
||||||
|
? "请先在设置页面下载模型"
|
||||||
|
: "输入消息开始对话,模型将自动加载"
|
||||||
|
}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<Virtuoso
|
||||||
|
ref={virtuosoRef}
|
||||||
|
data={messages}
|
||||||
|
className="messages-list"
|
||||||
|
initialTopMostItemIndex={messages.length - 1}
|
||||||
|
followOutput="smooth"
|
||||||
|
itemContent={(index, message) => (
|
||||||
|
<MessageBubble key={message.id} message={message} />
|
||||||
|
)}
|
||||||
|
components={{
|
||||||
|
Footer: () => <div className="list-spacer" />
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div className="input-area">
|
||||||
|
<div className="input-wrapper">
|
||||||
|
<textarea
|
||||||
|
ref={textareaRef}
|
||||||
|
value={input}
|
||||||
|
onChange={e => {
|
||||||
|
setInput(e.target.value)
|
||||||
|
e.target.style.height = 'auto'
|
||||||
|
e.target.style.height = `${Math.min(e.target.scrollHeight, 120)}px`
|
||||||
|
}}
|
||||||
|
onKeyDown={e => {
|
||||||
|
if (e.key === 'Enter' && !e.shiftKey) {
|
||||||
|
e.preventDefault()
|
||||||
|
handleSend()
|
||||||
|
// Reset height after send
|
||||||
|
if (textareaRef.current) textareaRef.current.style.height = 'auto'
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
placeholder={availableModels.length === 0 ? "请先下载模型..." : "输入消息..."}
|
||||||
|
disabled={availableModels.length === 0 || loadingModel}
|
||||||
|
rows={1}
|
||||||
|
/>
|
||||||
|
<div className="input-actions">
|
||||||
|
{renderModelSelector()}
|
||||||
|
<button
|
||||||
|
className={`mode-toggle ${isThinkingMode ? 'active' : ''}`}
|
||||||
|
onClick={() => setIsThinkingMode(!isThinkingMode)}
|
||||||
|
title={isThinkingMode ? "深度思考模式已开启" : "深度思考模式已关闭"}
|
||||||
|
disabled={availableModels.length === 0}
|
||||||
|
>
|
||||||
|
<Cpu size={18} />
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
className="send-btn"
|
||||||
|
onClick={handleSend}
|
||||||
|
disabled={!input.trim() || availableModels.length === 0 || isTyping || loadingModel}
|
||||||
|
>
|
||||||
|
<Send size={18} />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -43,7 +43,7 @@
|
|||||||
|
|
||||||
// 背景装饰圆点 - 毛玻璃效果
|
// 背景装饰圆点 - 毛玻璃效果
|
||||||
.bg-decoration {
|
.bg-decoration {
|
||||||
position: absolute; // Changed from fixed
|
position: absolute;
|
||||||
inset: 0;
|
inset: 0;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
@@ -53,10 +53,10 @@
|
|||||||
.deco-circle {
|
.deco-circle {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: rgba(0, 0, 0, 0.03);
|
background: color-mix(in srgb, var(--primary) 3%, transparent);
|
||||||
backdrop-filter: blur(40px);
|
backdrop-filter: blur(40px);
|
||||||
-webkit-backdrop-filter: blur(40px);
|
-webkit-backdrop-filter: blur(40px);
|
||||||
border: 1px solid rgba(0, 0, 0, 0.05);
|
border: 1px solid var(--border-color);
|
||||||
|
|
||||||
&.c1 {
|
&.c1 {
|
||||||
width: 280px;
|
width: 280px;
|
||||||
@@ -243,6 +243,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.exporting-snapshot {
|
.exporting-snapshot {
|
||||||
|
|
||||||
.hero-title,
|
.hero-title,
|
||||||
.label-text,
|
.label-text,
|
||||||
.hero-desc,
|
.hero-desc,
|
||||||
@@ -1279,134 +1280,135 @@
|
|||||||
color: var(--ar-text-sub) !important;
|
color: var(--ar-text-sub) !important;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 曾经的好朋友 视觉效果
|
// 曾经的好朋友 视觉效果
|
||||||
.lost-friend-visual {
|
.lost-friend-visual {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 32px;
|
||||||
|
margin: 64px auto 48px;
|
||||||
|
position: relative;
|
||||||
|
max-width: 480px;
|
||||||
|
|
||||||
|
.avatar-group {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
z-index: 2;
|
||||||
|
|
||||||
|
.avatar-label {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
font-weight: 500;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.sender {
|
||||||
|
animation: fadeInRight 1s ease-out backwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.receiver {
|
||||||
|
animation: fadeInLeft 1s ease-out backwards;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fading-line {
|
||||||
|
position: relative;
|
||||||
|
flex: 1;
|
||||||
|
height: 2px;
|
||||||
|
min-width: 120px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 32px;
|
|
||||||
margin: 64px auto 48px;
|
|
||||||
position: relative;
|
|
||||||
max-width: 480px;
|
|
||||||
|
|
||||||
.avatar-group {
|
.line-path {
|
||||||
display: flex;
|
width: 100%;
|
||||||
flex-direction: column;
|
height: 100%;
|
||||||
align-items: center;
|
background: linear-gradient(to right,
|
||||||
gap: 12px;
|
var(--ar-primary) 0%,
|
||||||
z-index: 2;
|
rgba(var(--ar-primary-rgb), 0.4) 50%,
|
||||||
|
rgba(var(--ar-primary-rgb), 0.05) 100%);
|
||||||
.avatar-label {
|
border-radius: 2px;
|
||||||
font-size: 13px;
|
|
||||||
color: var(--ar-text-sub);
|
|
||||||
font-weight: 500;
|
|
||||||
opacity: 0.6;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.sender {
|
|
||||||
animation: fadeInRight 1s ease-out backwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.receiver {
|
|
||||||
animation: fadeInLeft 1s ease-out backwards;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.fading-line {
|
.line-glow {
|
||||||
position: relative;
|
position: absolute;
|
||||||
flex: 1;
|
inset: -4px 0;
|
||||||
height: 2px;
|
background: linear-gradient(to right,
|
||||||
min-width: 120px;
|
rgba(var(--ar-primary-rgb), 0.2) 0%,
|
||||||
display: flex;
|
transparent 100%);
|
||||||
align-items: center;
|
filter: blur(8px);
|
||||||
justify-content: center;
|
pointer-events: none;
|
||||||
|
|
||||||
.line-path {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: linear-gradient(to right,
|
|
||||||
var(--ar-primary) 0%,
|
|
||||||
rgba(var(--ar-primary-rgb), 0.4) 50%,
|
|
||||||
rgba(var(--ar-primary-rgb), 0.05) 100%);
|
|
||||||
border-radius: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-glow {
|
|
||||||
position: absolute;
|
|
||||||
inset: -4px 0;
|
|
||||||
background: linear-gradient(to right,
|
|
||||||
rgba(var(--ar-primary-rgb), 0.2) 0%,
|
|
||||||
transparent 100%);
|
|
||||||
filter: blur(8px);
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flow-particle {
|
|
||||||
position: absolute;
|
|
||||||
width: 40px;
|
|
||||||
height: 2px;
|
|
||||||
background: linear-gradient(to right, transparent, var(--ar-primary), transparent);
|
|
||||||
border-radius: 2px;
|
|
||||||
opacity: 0;
|
|
||||||
animation: flowAcross 4s infinite linear;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.flow-particle {
|
||||||
|
position: absolute;
|
||||||
|
width: 40px;
|
||||||
|
height: 2px;
|
||||||
|
background: linear-gradient(to right, transparent, var(--ar-primary), transparent);
|
||||||
|
border-radius: 2px;
|
||||||
|
opacity: 0;
|
||||||
|
animation: flowAcross 4s infinite linear;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-desc.fading {
|
.hero-desc.fading {
|
||||||
opacity: 0.7;
|
opacity: 0.7;
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
margin-top: 32px;
|
margin-top: 32px;
|
||||||
line-height: 1.8;
|
line-height: 1.8;
|
||||||
letter-spacing: 0.05em;
|
letter-spacing: 0.05em;
|
||||||
animation: fadeIn 1.5s ease-out 0.5s backwards;
|
animation: fadeIn 1.5s ease-out 0.5s backwards;
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes flowAcross {
|
@keyframes flowAcross {
|
||||||
0% {
|
0% {
|
||||||
left: -20%;
|
left: -20%;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
10% {
|
10% {
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
|
|
||||||
50% {
|
50% {
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
}
|
}
|
||||||
|
|
||||||
90% {
|
90% {
|
||||||
opacity: 0.1;
|
opacity: 0.1;
|
||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
left: 120%;
|
left: 120%;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeInRight {
|
@keyframes fadeInRight {
|
||||||
from {
|
from {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateX(-20px);
|
transform: translateX(-20px);
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: translateX(0);
|
transform: translateX(0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeInLeft {
|
@keyframes fadeInLeft {
|
||||||
from {
|
from {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateX(20px);
|
transform: translateX(20px);
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: translateX(0);
|
transform: translateX(0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -109,148 +109,8 @@ const Avatar = ({ url, name, size = 'md' }: { url?: string; name: string; size?:
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 热力图组件
|
import Heatmap from '../components/ReportHeatmap'
|
||||||
const Heatmap = ({ data }: { data: number[][] }) => {
|
import WordCloud from '../components/ReportWordCloud'
|
||||||
const maxHeat = Math.max(...data.flat())
|
|
||||||
const weekLabels = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="heatmap-wrapper">
|
|
||||||
<div className="heatmap-header">
|
|
||||||
<div></div>
|
|
||||||
<div className="time-labels">
|
|
||||||
{[0, 6, 12, 18].map(h => (
|
|
||||||
<span key={h} style={{ gridColumn: h + 1 }}>{h}</span>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="heatmap">
|
|
||||||
<div className="heatmap-week-col">
|
|
||||||
{weekLabels.map(w => <div key={w} className="week-label">{w}</div>)}
|
|
||||||
</div>
|
|
||||||
<div className="heatmap-grid">
|
|
||||||
{data.map((row, wi) =>
|
|
||||||
row.map((val, hi) => {
|
|
||||||
const alpha = maxHeat > 0 ? (val / maxHeat * 0.85 + 0.1).toFixed(2) : '0.1'
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
key={`${wi}-${hi}`}
|
|
||||||
className="h-cell"
|
|
||||||
style={{ background: `rgba(7, 193, 96, ${alpha})` }}
|
|
||||||
title={`${weekLabels[wi]} ${hi}:00 - ${val}条`}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
})
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
// 词云组件
|
|
||||||
const WordCloud = ({ words }: { words: { phrase: string; count: number }[] }) => {
|
|
||||||
const maxCount = words.length > 0 ? words[0].count : 1
|
|
||||||
const topWords = words.slice(0, 32)
|
|
||||||
const baseSize = 520
|
|
||||||
|
|
||||||
// 使用确定性随机数生成器
|
|
||||||
const seededRandom = (seed: number) => {
|
|
||||||
const x = Math.sin(seed) * 10000
|
|
||||||
return x - Math.floor(x)
|
|
||||||
}
|
|
||||||
|
|
||||||
// 计算词云位置
|
|
||||||
const placedItems: { x: number; y: number; w: number; h: number }[] = []
|
|
||||||
|
|
||||||
const canPlace = (x: number, y: number, w: number, h: number): boolean => {
|
|
||||||
const halfW = w / 2
|
|
||||||
const halfH = h / 2
|
|
||||||
const dx = x - 50
|
|
||||||
const dy = y - 50
|
|
||||||
const dist = Math.sqrt(dx * dx + dy * dy)
|
|
||||||
const maxR = 49 - Math.max(halfW, halfH)
|
|
||||||
if (dist > maxR) return false
|
|
||||||
|
|
||||||
const pad = 1.8
|
|
||||||
for (const p of placedItems) {
|
|
||||||
if ((x - halfW - pad) < (p.x + p.w / 2) &&
|
|
||||||
(x + halfW + pad) > (p.x - p.w / 2) &&
|
|
||||||
(y - halfH - pad) < (p.y + p.h / 2) &&
|
|
||||||
(y + halfH + pad) > (p.y - p.h / 2)) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
const wordItems = topWords.map((item, i) => {
|
|
||||||
const ratio = item.count / maxCount
|
|
||||||
const fontSize = Math.round(12 + Math.pow(ratio, 0.65) * 20)
|
|
||||||
const opacity = Math.min(1, Math.max(0.35, 0.35 + ratio * 0.65))
|
|
||||||
const delay = (i * 0.04).toFixed(2)
|
|
||||||
|
|
||||||
// 计算词语宽度
|
|
||||||
const charCount = Math.max(1, item.phrase.length)
|
|
||||||
const hasCjk = /[\u4e00-\u9fff]/.test(item.phrase)
|
|
||||||
const hasLatin = /[A-Za-z0-9]/.test(item.phrase)
|
|
||||||
const widthFactor = hasCjk && hasLatin ? 0.85 : hasCjk ? 0.98 : 0.6
|
|
||||||
const widthPx = fontSize * (charCount * widthFactor)
|
|
||||||
const heightPx = fontSize * 1.1
|
|
||||||
const widthPct = (widthPx / baseSize) * 100
|
|
||||||
const heightPct = (heightPx / baseSize) * 100
|
|
||||||
|
|
||||||
// 寻找位置
|
|
||||||
let x = 50, y = 50
|
|
||||||
let placedOk = false
|
|
||||||
const tries = i === 0 ? 1 : 420
|
|
||||||
|
|
||||||
for (let t = 0; t < tries; t++) {
|
|
||||||
if (i === 0) {
|
|
||||||
x = 50
|
|
||||||
y = 50
|
|
||||||
} else {
|
|
||||||
const idx = i + t * 0.28
|
|
||||||
const radius = Math.sqrt(idx) * 7.6 + (seededRandom(i * 1000 + t) * 1.2 - 0.6)
|
|
||||||
const angle = idx * 2.399963 + seededRandom(i * 2000 + t) * 0.35
|
|
||||||
x = 50 + radius * Math.cos(angle)
|
|
||||||
y = 50 + radius * Math.sin(angle)
|
|
||||||
}
|
|
||||||
if (canPlace(x, y, widthPct, heightPct)) {
|
|
||||||
placedOk = true
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!placedOk) return null
|
|
||||||
placedItems.push({ x, y, w: widthPct, h: heightPct })
|
|
||||||
|
|
||||||
return (
|
|
||||||
<span
|
|
||||||
key={i}
|
|
||||||
className="word-tag"
|
|
||||||
style={{
|
|
||||||
'--final-opacity': opacity,
|
|
||||||
left: `${x.toFixed(2)}%`,
|
|
||||||
top: `${y.toFixed(2)}%`,
|
|
||||||
fontSize: `${fontSize}px`,
|
|
||||||
animationDelay: `${delay}s`,
|
|
||||||
} as React.CSSProperties}
|
|
||||||
title={`${item.phrase} (出现 ${item.count} 次)`}
|
|
||||||
>
|
|
||||||
{item.phrase}
|
|
||||||
</span>
|
|
||||||
)
|
|
||||||
}).filter(Boolean)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="word-cloud-wrapper">
|
|
||||||
<div className="word-cloud-inner">
|
|
||||||
{wordItems}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function AnnualReportWindow() {
|
function AnnualReportWindow() {
|
||||||
const [reportData, setReportData] = useState<AnnualReportData | null>(null)
|
const [reportData, setReportData] = useState<AnnualReportData | null>(null)
|
||||||
|
|||||||
@@ -2016,12 +2016,43 @@
|
|||||||
text-align: right;
|
text-align: right;
|
||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
|
user-select: text;
|
||||||
|
|
||||||
&.highlight {
|
&.highlight {
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.copy-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 22px;
|
||||||
|
height: 22px;
|
||||||
|
padding: 0;
|
||||||
|
border: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: transparent;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
cursor: pointer;
|
||||||
|
flex-shrink: 0;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.15s, color 0.15s, background 0.15s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--bg-secondary);
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover .copy-btn {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-list {
|
.table-list {
|
||||||
@@ -2458,6 +2489,13 @@
|
|||||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.transfer-desc {
|
||||||
|
font-size: 12px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
opacity: 0.9;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
.transfer-memo {
|
.transfer-memo {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
@@ -2510,4 +2548,272 @@
|
|||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.announcement-message {
|
||||||
|
background: rgba(255, 255, 255, 0.15);
|
||||||
|
|
||||||
|
.announcement-label {
|
||||||
|
color: rgba(255, 255, 255, 0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcement-text {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcement-icon {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 群公告消息
|
||||||
|
.announcement-message {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
align-items: flex-start;
|
||||||
|
padding: 12px 14px;
|
||||||
|
background: var(--hover-color);
|
||||||
|
border-radius: 12px;
|
||||||
|
max-width: 320px;
|
||||||
|
|
||||||
|
.announcement-icon {
|
||||||
|
flex-shrink: 0;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #f59e42;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcement-content {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
|
||||||
|
.announcement-label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.announcement-text {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--text-primary);
|
||||||
|
line-height: 1.5;
|
||||||
|
word-break: break-word;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量转写按钮
|
||||||
|
.batch-transcribe-btn {
|
||||||
|
&:hover:not(:disabled) {
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
&.transcribing {
|
||||||
|
color: var(--primary-color);
|
||||||
|
cursor: pointer;
|
||||||
|
opacity: 1 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量转写模态框基础样式(共享样式在 styles/batchTranscribe.scss)
|
||||||
|
|
||||||
|
// 批量转写确认对话框
|
||||||
|
.batch-confirm-modal {
|
||||||
|
width: 480px;
|
||||||
|
max-width: 90vw;
|
||||||
|
|
||||||
|
.batch-modal-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.75rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
svg { color: var(--primary-color); }
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-modal-body {
|
||||||
|
padding: 1.5rem;
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0 0 1rem 0;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-dates-list-wrap {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.batch-dates-actions {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.5rem;
|
||||||
|
padding: 0.5rem 0.75rem;
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
background: var(--bg-secondary);
|
||||||
|
|
||||||
|
.batch-dates-btn {
|
||||||
|
padding: 0.35rem 0.75rem;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--primary-color);
|
||||||
|
background: transparent;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 6px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--bg-hover);
|
||||||
|
border-color: var(--primary-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-dates-list {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
max-height: 160px;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
li {
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
&:last-child { border-bottom: none; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-date-row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.75rem;
|
||||||
|
padding: 0.6rem 0.75rem;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.15s;
|
||||||
|
|
||||||
|
&:hover { background: var(--bg-hover); }
|
||||||
|
|
||||||
|
input[type="checkbox"] {
|
||||||
|
accent-color: var(--primary-color);
|
||||||
|
cursor: pointer;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-date-label {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--text-primary);
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-date-count {
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-info {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0.5rem 0;
|
||||||
|
|
||||||
|
&:not(:last-child) {
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-warning {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 0.5rem;
|
||||||
|
padding: 0.75rem;
|
||||||
|
background: rgba(255, 152, 0, 0.1);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid rgba(255, 152, 0, 0.3);
|
||||||
|
|
||||||
|
svg {
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-top: 2px;
|
||||||
|
color: #ff9800;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-modal-footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 0.75rem;
|
||||||
|
padding: 1rem 1.5rem;
|
||||||
|
border-top: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
button {
|
||||||
|
padding: 0.5rem 1.25rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
&.btn-secondary {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
color: var(--text-primary);
|
||||||
|
&:hover { background: var(--border-color); }
|
||||||
|
}
|
||||||
|
|
||||||
|
&.btn-primary, &.batch-transcribe-start-btn {
|
||||||
|
background: var(--primary-color);
|
||||||
|
color: white;
|
||||||
|
&:hover { opacity: 0.9; }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,9 @@
|
|||||||
import React, { useState, useEffect, useRef, useCallback, useMemo } from 'react'
|
import React, { useState, useEffect, useRef, useCallback, useMemo } from 'react'
|
||||||
import { Search, MessageSquare, AlertCircle, Loader2, RefreshCw, X, ChevronDown, Info, Calendar, Database, Hash, Play, Pause, Image as ImageIcon, Link } from 'lucide-react'
|
import { Search, MessageSquare, AlertCircle, Loader2, RefreshCw, X, ChevronDown, Info, Calendar, Database, Hash, Play, Pause, Image as ImageIcon, Link, Mic, CheckCircle, Copy, Check, Download, BarChart3 } from 'lucide-react'
|
||||||
|
import { useNavigate } from 'react-router-dom'
|
||||||
import { createPortal } from 'react-dom'
|
import { createPortal } from 'react-dom'
|
||||||
import { useChatStore } from '../stores/chatStore'
|
import { useChatStore } from '../stores/chatStore'
|
||||||
|
import { useBatchTranscribeStore } from '../stores/batchTranscribeStore'
|
||||||
import type { ChatSession, Message } from '../types/models'
|
import type { ChatSession, Message } from '../types/models'
|
||||||
import { getEmojiPath } from 'wechat-emojis'
|
import { getEmojiPath } from 'wechat-emojis'
|
||||||
import { VoiceTranscribeDialog } from '../components/VoiceTranscribeDialog'
|
import { VoiceTranscribeDialog } from '../components/VoiceTranscribeDialog'
|
||||||
@@ -116,6 +118,8 @@ const SessionItem = React.memo(function SessionItem({
|
|||||||
|
|
||||||
|
|
||||||
function ChatPage(_props: ChatPageProps) {
|
function ChatPage(_props: ChatPageProps) {
|
||||||
|
const navigate = useNavigate()
|
||||||
|
|
||||||
const {
|
const {
|
||||||
isConnected,
|
isConnected,
|
||||||
isConnecting,
|
isConnecting,
|
||||||
@@ -168,12 +172,21 @@ function ChatPage(_props: ChatPageProps) {
|
|||||||
const [showDetailPanel, setShowDetailPanel] = useState(false)
|
const [showDetailPanel, setShowDetailPanel] = useState(false)
|
||||||
const [sessionDetail, setSessionDetail] = useState<SessionDetail | null>(null)
|
const [sessionDetail, setSessionDetail] = useState<SessionDetail | null>(null)
|
||||||
const [isLoadingDetail, setIsLoadingDetail] = useState(false)
|
const [isLoadingDetail, setIsLoadingDetail] = useState(false)
|
||||||
|
const [copiedField, setCopiedField] = useState<string | null>(null)
|
||||||
const [highlightedMessageKeys, setHighlightedMessageKeys] = useState<string[]>([])
|
const [highlightedMessageKeys, setHighlightedMessageKeys] = useState<string[]>([])
|
||||||
const [isRefreshingSessions, setIsRefreshingSessions] = useState(false)
|
const [isRefreshingSessions, setIsRefreshingSessions] = useState(false)
|
||||||
const [hasInitialMessages, setHasInitialMessages] = useState(false)
|
const [hasInitialMessages, setHasInitialMessages] = useState(false)
|
||||||
const [showVoiceTranscribeDialog, setShowVoiceTranscribeDialog] = useState(false)
|
const [showVoiceTranscribeDialog, setShowVoiceTranscribeDialog] = useState(false)
|
||||||
const [pendingVoiceTranscriptRequest, setPendingVoiceTranscriptRequest] = useState<{ sessionId: string; messageId: string } | null>(null)
|
const [pendingVoiceTranscriptRequest, setPendingVoiceTranscriptRequest] = useState<{ sessionId: string; messageId: string } | null>(null)
|
||||||
|
|
||||||
|
// 批量语音转文字相关状态(进度/结果 由全局 store 管理)
|
||||||
|
const { isBatchTranscribing, progress: batchTranscribeProgress, showToast: showBatchProgress, startTranscribe, updateProgress, finishTranscribe, setShowToast: setShowBatchProgress } = useBatchTranscribeStore()
|
||||||
|
const [showBatchConfirm, setShowBatchConfirm] = useState(false)
|
||||||
|
const [batchVoiceCount, setBatchVoiceCount] = useState(0)
|
||||||
|
const [batchVoiceMessages, setBatchVoiceMessages] = useState<Message[] | null>(null)
|
||||||
|
const [batchVoiceDates, setBatchVoiceDates] = useState<string[]>([])
|
||||||
|
const [batchSelectedDates, setBatchSelectedDates] = useState<Set<string>>(new Set())
|
||||||
|
|
||||||
// 联系人信息加载控制
|
// 联系人信息加载控制
|
||||||
const isEnrichingRef = useRef(false)
|
const isEnrichingRef = useRef(false)
|
||||||
const enrichCancelledRef = useRef(false)
|
const enrichCancelledRef = useRef(false)
|
||||||
@@ -231,6 +244,25 @@ function ChatPage(_props: ChatPageProps) {
|
|||||||
setShowDetailPanel(!showDetailPanel)
|
setShowDetailPanel(!showDetailPanel)
|
||||||
}, [showDetailPanel, currentSessionId, loadSessionDetail])
|
}, [showDetailPanel, currentSessionId, loadSessionDetail])
|
||||||
|
|
||||||
|
// 复制字段值到剪贴板
|
||||||
|
const handleCopyField = useCallback(async (text: string, field: string) => {
|
||||||
|
try {
|
||||||
|
await navigator.clipboard.writeText(text)
|
||||||
|
setCopiedField(field)
|
||||||
|
setTimeout(() => setCopiedField(null), 1500)
|
||||||
|
} catch {
|
||||||
|
// fallback
|
||||||
|
const textarea = document.createElement('textarea')
|
||||||
|
textarea.value = text
|
||||||
|
document.body.appendChild(textarea)
|
||||||
|
textarea.select()
|
||||||
|
document.execCommand('copy')
|
||||||
|
document.body.removeChild(textarea)
|
||||||
|
setCopiedField(field)
|
||||||
|
setTimeout(() => setCopiedField(null), 1500)
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
// 连接数据库
|
// 连接数据库
|
||||||
const connect = useCallback(async () => {
|
const connect = useCallback(async () => {
|
||||||
setConnecting(true)
|
setConnecting(true)
|
||||||
@@ -1183,6 +1215,167 @@ function ChatPage(_props: ChatPageProps) {
|
|||||||
setShowVoiceTranscribeDialog(true)
|
setShowVoiceTranscribeDialog(true)
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
// 批量语音转文字
|
||||||
|
const handleBatchTranscribe = useCallback(async () => {
|
||||||
|
if (!currentSessionId) return
|
||||||
|
const session = sessions.find(s => s.username === currentSessionId)
|
||||||
|
if (!session) {
|
||||||
|
alert('未找到当前会话')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (isBatchTranscribing) return
|
||||||
|
|
||||||
|
const result = await window.electronAPI.chat.getAllVoiceMessages(currentSessionId)
|
||||||
|
if (!result.success || !result.messages) {
|
||||||
|
alert(`获取语音消息失败: ${result.error || '未知错误'}`)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const voiceMessages: Message[] = result.messages
|
||||||
|
if (voiceMessages.length === 0) {
|
||||||
|
alert('当前会话没有语音消息')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const dateSet = new Set<string>()
|
||||||
|
voiceMessages.forEach(m => dateSet.add(new Date(m.createTime * 1000).toISOString().slice(0, 10)))
|
||||||
|
const sortedDates = Array.from(dateSet).sort((a, b) => b.localeCompare(a))
|
||||||
|
|
||||||
|
setBatchVoiceMessages(voiceMessages)
|
||||||
|
setBatchVoiceCount(voiceMessages.length)
|
||||||
|
setBatchVoiceDates(sortedDates)
|
||||||
|
setBatchSelectedDates(new Set(sortedDates))
|
||||||
|
setShowBatchConfirm(true)
|
||||||
|
}, [sessions, currentSessionId, isBatchTranscribing])
|
||||||
|
|
||||||
|
const handleExportCurrentSession = useCallback(() => {
|
||||||
|
if (!currentSessionId) return
|
||||||
|
navigate('/export', {
|
||||||
|
state: {
|
||||||
|
preselectSessionIds: [currentSessionId]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}, [currentSessionId, navigate])
|
||||||
|
|
||||||
|
const handleGroupAnalytics = useCallback(() => {
|
||||||
|
if (!currentSessionId || !isGroupChat(currentSessionId)) return
|
||||||
|
navigate('/group-analytics', {
|
||||||
|
state: {
|
||||||
|
preselectGroupIds: [currentSessionId]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}, [currentSessionId, navigate])
|
||||||
|
|
||||||
|
// 确认批量转写
|
||||||
|
const confirmBatchTranscribe = useCallback(async () => {
|
||||||
|
if (!currentSessionId) return
|
||||||
|
|
||||||
|
const selected = batchSelectedDates
|
||||||
|
if (selected.size === 0) {
|
||||||
|
alert('请至少选择一个日期')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const messages = batchVoiceMessages
|
||||||
|
if (!messages || messages.length === 0) {
|
||||||
|
setShowBatchConfirm(false)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const voiceMessages = messages.filter(m =>
|
||||||
|
selected.has(new Date(m.createTime * 1000).toISOString().slice(0, 10))
|
||||||
|
)
|
||||||
|
if (voiceMessages.length === 0) {
|
||||||
|
alert('所选日期下没有语音消息')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
setShowBatchConfirm(false)
|
||||||
|
setBatchVoiceMessages(null)
|
||||||
|
setBatchVoiceDates([])
|
||||||
|
setBatchSelectedDates(new Set())
|
||||||
|
|
||||||
|
const session = sessions.find(s => s.username === currentSessionId)
|
||||||
|
if (!session) return
|
||||||
|
|
||||||
|
startTranscribe(voiceMessages.length, session.displayName || session.username)
|
||||||
|
|
||||||
|
// 检查模型状态
|
||||||
|
const modelStatus = await window.electronAPI.whisper.getModelStatus()
|
||||||
|
if (!modelStatus?.exists) {
|
||||||
|
alert('SenseVoice 模型未下载,请先在设置中下载模型')
|
||||||
|
finishTranscribe(0, 0)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
let successCount = 0
|
||||||
|
let failCount = 0
|
||||||
|
let completedCount = 0
|
||||||
|
const concurrency = 10
|
||||||
|
|
||||||
|
const transcribeOne = async (msg: Message) => {
|
||||||
|
try {
|
||||||
|
const result = await window.electronAPI.chat.getVoiceTranscript(
|
||||||
|
session.username,
|
||||||
|
String(msg.localId),
|
||||||
|
msg.createTime
|
||||||
|
)
|
||||||
|
return { success: result.success }
|
||||||
|
} catch {
|
||||||
|
return { success: false }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (let i = 0; i < voiceMessages.length; i += concurrency) {
|
||||||
|
const batch = voiceMessages.slice(i, i + concurrency)
|
||||||
|
const results = await Promise.all(batch.map(msg => transcribeOne(msg)))
|
||||||
|
|
||||||
|
results.forEach(result => {
|
||||||
|
if (result.success) successCount++
|
||||||
|
else failCount++
|
||||||
|
completedCount++
|
||||||
|
updateProgress(completedCount, voiceMessages.length)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
finishTranscribe(successCount, failCount)
|
||||||
|
}, [sessions, currentSessionId, batchSelectedDates, batchVoiceMessages, startTranscribe, updateProgress, finishTranscribe])
|
||||||
|
|
||||||
|
// 批量转写:按日期的消息数量
|
||||||
|
const batchCountByDate = useMemo(() => {
|
||||||
|
const map = new Map<string, number>()
|
||||||
|
if (!batchVoiceMessages) return map
|
||||||
|
batchVoiceMessages.forEach(m => {
|
||||||
|
const d = new Date(m.createTime * 1000).toISOString().slice(0, 10)
|
||||||
|
map.set(d, (map.get(d) || 0) + 1)
|
||||||
|
})
|
||||||
|
return map
|
||||||
|
}, [batchVoiceMessages])
|
||||||
|
|
||||||
|
// 批量转写:选中日期对应的语音条数
|
||||||
|
const batchSelectedMessageCount = useMemo(() => {
|
||||||
|
if (!batchVoiceMessages) return 0
|
||||||
|
return batchVoiceMessages.filter(m =>
|
||||||
|
batchSelectedDates.has(new Date(m.createTime * 1000).toISOString().slice(0, 10))
|
||||||
|
).length
|
||||||
|
}, [batchVoiceMessages, batchSelectedDates])
|
||||||
|
|
||||||
|
const toggleBatchDate = useCallback((date: string) => {
|
||||||
|
setBatchSelectedDates(prev => {
|
||||||
|
const next = new Set(prev)
|
||||||
|
if (next.has(date)) next.delete(date)
|
||||||
|
else next.add(date)
|
||||||
|
return next
|
||||||
|
})
|
||||||
|
}, [])
|
||||||
|
const selectAllBatchDates = useCallback(() => setBatchSelectedDates(new Set(batchVoiceDates)), [batchVoiceDates])
|
||||||
|
const clearAllBatchDates = useCallback(() => setBatchSelectedDates(new Set()), [])
|
||||||
|
|
||||||
|
const formatBatchDateLabel = useCallback((dateStr: string) => {
|
||||||
|
const [y, m, d] = dateStr.split('-').map(Number)
|
||||||
|
return `${y}年${m}月${d}日`
|
||||||
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`chat-page ${isResizing ? 'resizing' : ''}`}>
|
<div className={`chat-page ${isResizing ? 'resizing' : ''}`}>
|
||||||
{/* 左侧会话列表 */}
|
{/* 左侧会话列表 */}
|
||||||
@@ -1293,6 +1486,41 @@ function ChatPage(_props: ChatPageProps) {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="header-actions">
|
<div className="header-actions">
|
||||||
|
{isGroupChat(currentSession.username) && (
|
||||||
|
<button
|
||||||
|
className="icon-btn group-analytics-btn"
|
||||||
|
onClick={handleGroupAnalytics}
|
||||||
|
title="群聊分析"
|
||||||
|
>
|
||||||
|
<BarChart3 size={18} />
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
<button
|
||||||
|
className="icon-btn export-session-btn"
|
||||||
|
onClick={handleExportCurrentSession}
|
||||||
|
disabled={!currentSessionId}
|
||||||
|
title="导出当前会话"
|
||||||
|
>
|
||||||
|
<Download size={18} />
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
className={`icon-btn batch-transcribe-btn${isBatchTranscribing ? ' transcribing' : ''}`}
|
||||||
|
onClick={() => {
|
||||||
|
if (isBatchTranscribing) {
|
||||||
|
setShowBatchProgress(true)
|
||||||
|
} else {
|
||||||
|
handleBatchTranscribe()
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
disabled={!currentSessionId}
|
||||||
|
title={isBatchTranscribing ? `批量转写中 (${batchTranscribeProgress.current}/${batchTranscribeProgress.total}),点击查看进度` : '批量语音转文字'}
|
||||||
|
>
|
||||||
|
{isBatchTranscribing ? (
|
||||||
|
<Loader2 size={18} className="spin" />
|
||||||
|
) : (
|
||||||
|
<Mic size={18} />
|
||||||
|
)}
|
||||||
|
</button>
|
||||||
<button
|
<button
|
||||||
className="icon-btn jump-to-time-btn"
|
className="icon-btn jump-to-time-btn"
|
||||||
onClick={() => setShowJumpDialog(true)}
|
onClick={() => setShowJumpDialog(true)}
|
||||||
@@ -1428,23 +1656,35 @@ function ChatPage(_props: ChatPageProps) {
|
|||||||
<Hash size={14} />
|
<Hash size={14} />
|
||||||
<span className="label">微信ID</span>
|
<span className="label">微信ID</span>
|
||||||
<span className="value">{sessionDetail.wxid}</span>
|
<span className="value">{sessionDetail.wxid}</span>
|
||||||
|
<button className="copy-btn" title="复制" onClick={() => handleCopyField(sessionDetail.wxid, 'wxid')}>
|
||||||
|
{copiedField === 'wxid' ? <Check size={12} /> : <Copy size={12} />}
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
{sessionDetail.remark && (
|
{sessionDetail.remark && (
|
||||||
<div className="detail-item">
|
<div className="detail-item">
|
||||||
<span className="label">备注</span>
|
<span className="label">备注</span>
|
||||||
<span className="value">{sessionDetail.remark}</span>
|
<span className="value">{sessionDetail.remark}</span>
|
||||||
|
<button className="copy-btn" title="复制" onClick={() => handleCopyField(sessionDetail.remark!, 'remark')}>
|
||||||
|
{copiedField === 'remark' ? <Check size={12} /> : <Copy size={12} />}
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{sessionDetail.nickName && (
|
{sessionDetail.nickName && (
|
||||||
<div className="detail-item">
|
<div className="detail-item">
|
||||||
<span className="label">昵称</span>
|
<span className="label">昵称</span>
|
||||||
<span className="value">{sessionDetail.nickName}</span>
|
<span className="value">{sessionDetail.nickName}</span>
|
||||||
|
<button className="copy-btn" title="复制" onClick={() => handleCopyField(sessionDetail.nickName!, 'nickName')}>
|
||||||
|
{copiedField === 'nickName' ? <Check size={12} /> : <Copy size={12} />}
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{sessionDetail.alias && (
|
{sessionDetail.alias && (
|
||||||
<div className="detail-item">
|
<div className="detail-item">
|
||||||
<span className="label">微信号</span>
|
<span className="label">微信号</span>
|
||||||
<span className="value">{sessionDetail.alias}</span>
|
<span className="value">{sessionDetail.alias}</span>
|
||||||
|
<button className="copy-btn" title="复制" onClick={() => handleCopyField(sessionDetail.alias!, 'alias')}>
|
||||||
|
{copiedField === 'alias' ? <Check size={12} /> : <Copy size={12} />}
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
@@ -1542,10 +1782,98 @@ function ChatPage(_props: ChatPageProps) {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{/* 批量转写确认对话框 */}
|
||||||
|
{showBatchConfirm && createPortal(
|
||||||
|
<div className="batch-modal-overlay" onClick={() => setShowBatchConfirm(false)}>
|
||||||
|
<div className="batch-modal-content batch-confirm-modal" onClick={(e) => e.stopPropagation()}>
|
||||||
|
<div className="batch-modal-header">
|
||||||
|
<Mic size={20} />
|
||||||
|
<h3>批量语音转文字</h3>
|
||||||
|
</div>
|
||||||
|
<div className="batch-modal-body">
|
||||||
|
<p>选择要转写的日期(仅显示有语音的日期),然后开始转写。</p>
|
||||||
|
{batchVoiceDates.length > 0 && (
|
||||||
|
<div className="batch-dates-list-wrap">
|
||||||
|
<div className="batch-dates-actions">
|
||||||
|
<button type="button" className="batch-dates-btn" onClick={selectAllBatchDates}>全选</button>
|
||||||
|
<button type="button" className="batch-dates-btn" onClick={clearAllBatchDates}>取消全选</button>
|
||||||
|
</div>
|
||||||
|
<ul className="batch-dates-list">
|
||||||
|
{batchVoiceDates.map(dateStr => {
|
||||||
|
const count = batchCountByDate.get(dateStr) ?? 0
|
||||||
|
const checked = batchSelectedDates.has(dateStr)
|
||||||
|
return (
|
||||||
|
<li key={dateStr}>
|
||||||
|
<label className="batch-date-row">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
checked={checked}
|
||||||
|
onChange={() => toggleBatchDate(dateStr)}
|
||||||
|
/>
|
||||||
|
<span className="batch-date-label">{formatBatchDateLabel(dateStr)}</span>
|
||||||
|
<span className="batch-date-count">{count} 条语音</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<div className="batch-info">
|
||||||
|
<div className="info-item">
|
||||||
|
<span className="label">已选:</span>
|
||||||
|
<span className="value">{batchSelectedDates.size} 天有语音,共 {batchSelectedMessageCount} 条语音</span>
|
||||||
|
</div>
|
||||||
|
<div className="info-item">
|
||||||
|
<span className="label">预计耗时:</span>
|
||||||
|
<span className="value">约 {Math.ceil(batchSelectedMessageCount * 2 / 60)} 分钟</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="batch-warning">
|
||||||
|
<AlertCircle size={16} />
|
||||||
|
<span>批量转写可能需要较长时间,转写过程中可以继续使用其他功能。已转写过的语音会自动跳过。</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="batch-modal-footer">
|
||||||
|
<button className="btn-secondary" onClick={() => setShowBatchConfirm(false)}>
|
||||||
|
取消
|
||||||
|
</button>
|
||||||
|
<button className="btn-primary batch-transcribe-start-btn" onClick={confirmBatchTranscribe}>
|
||||||
|
<Mic size={16} />
|
||||||
|
开始转写
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>,
|
||||||
|
document.body
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 全局语音播放管理器:同一时间只能播放一条语音
|
||||||
|
const globalVoiceManager = {
|
||||||
|
currentAudio: null as HTMLAudioElement | null,
|
||||||
|
currentStopCallback: null as (() => void) | null,
|
||||||
|
play(audio: HTMLAudioElement, onStop: () => void) {
|
||||||
|
// 停止当前正在播放的语音
|
||||||
|
if (this.currentAudio && this.currentAudio !== audio) {
|
||||||
|
this.currentAudio.pause()
|
||||||
|
this.currentAudio.currentTime = 0
|
||||||
|
this.currentStopCallback?.()
|
||||||
|
}
|
||||||
|
this.currentAudio = audio
|
||||||
|
this.currentStopCallback = onStop
|
||||||
|
},
|
||||||
|
stop(audio: HTMLAudioElement) {
|
||||||
|
if (this.currentAudio === audio) {
|
||||||
|
this.currentAudio = null
|
||||||
|
this.currentStopCallback = null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
// 前端表情包缓存
|
// 前端表情包缓存
|
||||||
const emojiDataUrlCache = new Map<string, string>()
|
const emojiDataUrlCache = new Map<string, string>()
|
||||||
const imageDataUrlCache = new Map<string, string>()
|
const imageDataUrlCache = new Map<string, string>()
|
||||||
@@ -1601,10 +1929,14 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
const [voiceWaveform, setVoiceWaveform] = useState<number[]>([])
|
const [voiceWaveform, setVoiceWaveform] = useState<number[]>([])
|
||||||
const voiceAutoDecryptTriggered = useRef(false)
|
const voiceAutoDecryptTriggered = useRef(false)
|
||||||
|
|
||||||
|
// 转账消息双方名称
|
||||||
|
const [transferPayerName, setTransferPayerName] = useState<string | undefined>(undefined)
|
||||||
|
const [transferReceiverName, setTransferReceiverName] = useState<string | undefined>(undefined)
|
||||||
|
|
||||||
// 视频相关状态
|
// 视频相关状态
|
||||||
const [videoLoading, setVideoLoading] = useState(false)
|
const [videoLoading, setVideoLoading] = useState(false)
|
||||||
const [videoInfo, setVideoInfo] = useState<{ videoUrl?: string; coverUrl?: string; thumbUrl?: string; exists: boolean } | null>(null)
|
const [videoInfo, setVideoInfo] = useState<{ videoUrl?: string; coverUrl?: string; thumbUrl?: string; exists: boolean } | null>(null)
|
||||||
const videoContainerRef = useRef<HTMLDivElement>(null)
|
const videoContainerRef = useRef<HTMLElement>(null)
|
||||||
const [isVideoVisible, setIsVideoVisible] = useState(false)
|
const [isVideoVisible, setIsVideoVisible] = useState(false)
|
||||||
const [videoMd5, setVideoMd5] = useState<string | null>(null)
|
const [videoMd5, setVideoMd5] = useState<string | null>(null)
|
||||||
|
|
||||||
@@ -1765,6 +2097,26 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
}
|
}
|
||||||
}, [isGroupChat, isSent, message.senderUsername, myAvatarUrl])
|
}, [isGroupChat, isSent, message.senderUsername, myAvatarUrl])
|
||||||
|
|
||||||
|
// 解析转账消息的付款方和收款方显示名称
|
||||||
|
useEffect(() => {
|
||||||
|
const payerWxid = (message as any).transferPayerUsername
|
||||||
|
const receiverWxid = (message as any).transferReceiverUsername
|
||||||
|
if (!payerWxid && !receiverWxid) return
|
||||||
|
// 仅对转账消息类型处理
|
||||||
|
if (message.localType !== 49 && message.localType !== 8589934592049) return
|
||||||
|
|
||||||
|
window.electronAPI.chat.resolveTransferDisplayNames(
|
||||||
|
session.username,
|
||||||
|
payerWxid || '',
|
||||||
|
receiverWxid || ''
|
||||||
|
).then((result: { payerName: string; receiverName: string }) => {
|
||||||
|
if (result) {
|
||||||
|
setTransferPayerName(result.payerName)
|
||||||
|
setTransferReceiverName(result.receiverName)
|
||||||
|
}
|
||||||
|
}).catch(() => { })
|
||||||
|
}, [(message as any).transferPayerUsername, (message as any).transferReceiverUsername, session.username])
|
||||||
|
|
||||||
// 自动下载表情包
|
// 自动下载表情包
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (emojiLocalPath) return
|
if (emojiLocalPath) return
|
||||||
@@ -1985,6 +2337,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
const handleEnded = () => {
|
const handleEnded = () => {
|
||||||
setIsVoicePlaying(false)
|
setIsVoicePlaying(false)
|
||||||
setVoiceCurrentTime(0)
|
setVoiceCurrentTime(0)
|
||||||
|
globalVoiceManager.stop(audio)
|
||||||
}
|
}
|
||||||
const handleTimeUpdate = () => {
|
const handleTimeUpdate = () => {
|
||||||
setVoiceCurrentTime(audio.currentTime)
|
setVoiceCurrentTime(audio.currentTime)
|
||||||
@@ -1999,6 +2352,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
audio.addEventListener('loadedmetadata', handleLoadedMetadata)
|
audio.addEventListener('loadedmetadata', handleLoadedMetadata)
|
||||||
return () => {
|
return () => {
|
||||||
audio.pause()
|
audio.pause()
|
||||||
|
globalVoiceManager.stop(audio)
|
||||||
audio.removeEventListener('play', handlePlay)
|
audio.removeEventListener('play', handlePlay)
|
||||||
audio.removeEventListener('pause', handlePause)
|
audio.removeEventListener('pause', handlePause)
|
||||||
audio.removeEventListener('ended', handleEnded)
|
audio.removeEventListener('ended', handleEnded)
|
||||||
@@ -2157,7 +2511,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
// 视频懒加载
|
// 视频懒加载
|
||||||
const videoAutoLoadTriggered = useRef(false)
|
const videoAutoLoadTriggered = useRef(false)
|
||||||
const [videoClicked, setVideoClicked] = useState(false)
|
const [videoClicked, setVideoClicked] = useState(false)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!isVideo || !videoContainerRef.current) return
|
if (!isVideo || !videoContainerRef.current) return
|
||||||
|
|
||||||
@@ -2183,11 +2537,11 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
|
|
||||||
// 视频加载中状态引用,避免依赖问题
|
// 视频加载中状态引用,避免依赖问题
|
||||||
const videoLoadingRef = useRef(false)
|
const videoLoadingRef = useRef(false)
|
||||||
|
|
||||||
// 加载视频信息(添加重试机制)
|
// 加载视频信息(添加重试机制)
|
||||||
const requestVideoInfo = useCallback(async () => {
|
const requestVideoInfo = useCallback(async () => {
|
||||||
if (!videoMd5 || videoLoadingRef.current) return
|
if (!videoMd5 || videoLoadingRef.current) return
|
||||||
|
|
||||||
videoLoadingRef.current = true
|
videoLoadingRef.current = true
|
||||||
setVideoLoading(true)
|
setVideoLoading(true)
|
||||||
try {
|
try {
|
||||||
@@ -2209,13 +2563,13 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
setVideoLoading(false)
|
setVideoLoading(false)
|
||||||
}
|
}
|
||||||
}, [videoMd5])
|
}, [videoMd5])
|
||||||
|
|
||||||
// 视频进入视野时自动加载
|
// 视频进入视野时自动加载
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!isVideo || !isVideoVisible) return
|
if (!isVideo || !isVideoVisible) return
|
||||||
if (videoInfo?.exists) return // 已成功加载,不需要重试
|
if (videoInfo?.exists) return // 已成功加载,不需要重试
|
||||||
if (videoAutoLoadTriggered.current) return
|
if (videoAutoLoadTriggered.current) return
|
||||||
|
|
||||||
videoAutoLoadTriggered.current = true
|
videoAutoLoadTriggered.current = true
|
||||||
void requestVideoInfo()
|
void requestVideoInfo()
|
||||||
}, [isVideo, isVideoVisible, videoInfo, requestVideoInfo])
|
}, [isVideo, isVideoVisible, videoInfo, requestVideoInfo])
|
||||||
@@ -2359,7 +2713,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
// 未进入可视区域时显示占位符
|
// 未进入可视区域时显示占位符
|
||||||
if (!isVideoVisible) {
|
if (!isVideoVisible) {
|
||||||
return (
|
return (
|
||||||
<div className="video-placeholder" ref={videoContainerRef}>
|
<div className="video-placeholder" ref={videoContainerRef as React.RefObject<HTMLDivElement>}>
|
||||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
||||||
<polygon points="23 7 16 12 23 17 23 7"></polygon>
|
<polygon points="23 7 16 12 23 17 23 7"></polygon>
|
||||||
<rect x="1" y="5" width="15" height="14" rx="2" ry="2"></rect>
|
<rect x="1" y="5" width="15" height="14" rx="2" ry="2"></rect>
|
||||||
@@ -2371,7 +2725,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
// 加载中
|
// 加载中
|
||||||
if (videoLoading) {
|
if (videoLoading) {
|
||||||
return (
|
return (
|
||||||
<div className="video-loading" ref={videoContainerRef}>
|
<div className="video-loading" ref={videoContainerRef as React.RefObject<HTMLDivElement>}>
|
||||||
<Loader2 size={20} className="spin" />
|
<Loader2 size={20} className="spin" />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
@@ -2382,7 +2736,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
className={`video-unavailable ${videoClicked ? 'clicked' : ''}`}
|
className={`video-unavailable ${videoClicked ? 'clicked' : ''}`}
|
||||||
ref={videoContainerRef}
|
ref={videoContainerRef as React.RefObject<HTMLButtonElement>}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setVideoClicked(true)
|
setVideoClicked(true)
|
||||||
setTimeout(() => setVideoClicked(false), 800)
|
setTimeout(() => setVideoClicked(false), 800)
|
||||||
@@ -2404,7 +2758,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
// 默认显示缩略图,点击打开独立播放窗口
|
// 默认显示缩略图,点击打开独立播放窗口
|
||||||
const thumbSrc = videoInfo.thumbUrl || videoInfo.coverUrl
|
const thumbSrc = videoInfo.thumbUrl || videoInfo.coverUrl
|
||||||
return (
|
return (
|
||||||
<div className="video-thumb-wrapper" ref={videoContainerRef} onClick={handlePlayVideo}>
|
<div className="video-thumb-wrapper" ref={videoContainerRef as React.RefObject<HTMLDivElement>} onClick={handlePlayVideo}>
|
||||||
{thumbSrc ? (
|
{thumbSrc ? (
|
||||||
<img src={thumbSrc} alt="视频缩略图" className="video-thumb" />
|
<img src={thumbSrc} alt="视频缩略图" className="video-thumb" />
|
||||||
) : (
|
) : (
|
||||||
@@ -2433,6 +2787,7 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
if (isVoicePlaying) {
|
if (isVoicePlaying) {
|
||||||
audio.pause()
|
audio.pause()
|
||||||
audio.currentTime = 0
|
audio.currentTime = 0
|
||||||
|
globalVoiceManager.stop(audio)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (!voiceDataUrl) {
|
if (!voiceDataUrl) {
|
||||||
@@ -2467,6 +2822,11 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
}
|
}
|
||||||
audio.src = source
|
audio.src = source
|
||||||
try {
|
try {
|
||||||
|
// 停止其他正在播放的语音,确保同一时间只播放一条
|
||||||
|
globalVoiceManager.play(audio, () => {
|
||||||
|
audio.pause()
|
||||||
|
audio.currentTime = 0
|
||||||
|
})
|
||||||
await audio.play()
|
await audio.play()
|
||||||
} catch {
|
} catch {
|
||||||
setVoiceError(true)
|
setVoiceError(true)
|
||||||
@@ -2622,6 +2982,8 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
let desc = ''
|
let desc = ''
|
||||||
let url = ''
|
let url = ''
|
||||||
let appMsgType = ''
|
let appMsgType = ''
|
||||||
|
let textAnnouncement = ''
|
||||||
|
let parsedDoc: Document | null = null
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const content = message.rawContent || message.parsedContent || ''
|
const content = message.rawContent || message.parsedContent || ''
|
||||||
@@ -2629,16 +2991,35 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
const xmlContent = content.substring(content.indexOf('<msg>'))
|
const xmlContent = content.substring(content.indexOf('<msg>'))
|
||||||
|
|
||||||
const parser = new DOMParser()
|
const parser = new DOMParser()
|
||||||
const doc = parser.parseFromString(xmlContent, 'text/xml')
|
parsedDoc = parser.parseFromString(xmlContent, 'text/xml')
|
||||||
|
|
||||||
title = doc.querySelector('title')?.textContent || '链接'
|
title = parsedDoc.querySelector('title')?.textContent || '链接'
|
||||||
desc = doc.querySelector('des')?.textContent || ''
|
desc = parsedDoc.querySelector('des')?.textContent || ''
|
||||||
url = doc.querySelector('url')?.textContent || ''
|
url = parsedDoc.querySelector('url')?.textContent || ''
|
||||||
appMsgType = doc.querySelector('appmsg > type')?.textContent || doc.querySelector('type')?.textContent || ''
|
appMsgType = parsedDoc.querySelector('appmsg > type')?.textContent || parsedDoc.querySelector('type')?.textContent || ''
|
||||||
|
textAnnouncement = parsedDoc.querySelector('textannouncement')?.textContent || ''
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error('解析 AppMsg 失败:', e)
|
console.error('解析 AppMsg 失败:', e)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 群公告消息 (type=87)
|
||||||
|
if (appMsgType === '87') {
|
||||||
|
const announcementText = textAnnouncement || desc || '群公告'
|
||||||
|
return (
|
||||||
|
<div className="announcement-message">
|
||||||
|
<div className="announcement-icon">
|
||||||
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
||||||
|
<path d="M22 17H2a3 3 0 0 0 3-3V9a7 7 0 0 1 14 0v5a3 3 0 0 0 3 3zm-8.27 4a2 2 0 0 1-3.46 0" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div className="announcement-content">
|
||||||
|
<div className="announcement-label">群公告</div>
|
||||||
|
<div className="announcement-text">{announcementText}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
// 聊天记录 (type=19)
|
// 聊天记录 (type=19)
|
||||||
if (appMsgType === '19') {
|
if (appMsgType === '19') {
|
||||||
const recordList = message.chatRecordList || []
|
const recordList = message.chatRecordList || []
|
||||||
@@ -2744,19 +3125,10 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
// 转账消息 (type=2000)
|
// 转账消息 (type=2000)
|
||||||
if (appMsgType === '2000') {
|
if (appMsgType === '2000') {
|
||||||
try {
|
try {
|
||||||
const content = message.rawContent || message.content || message.parsedContent || ''
|
// 使用外层已解析好的 parsedDoc(已去除 wxid 前缀)
|
||||||
|
const feedesc = parsedDoc?.querySelector('feedesc')?.textContent || ''
|
||||||
// 添加调试日志
|
const payMemo = parsedDoc?.querySelector('pay_memo')?.textContent || ''
|
||||||
|
const paysubtype = parsedDoc?.querySelector('paysubtype')?.textContent || '1'
|
||||||
|
|
||||||
const parser = new DOMParser()
|
|
||||||
const doc = parser.parseFromString(content, 'text/xml')
|
|
||||||
|
|
||||||
const feedesc = doc.querySelector('feedesc')?.textContent || ''
|
|
||||||
const payMemo = doc.querySelector('pay_memo')?.textContent || ''
|
|
||||||
const paysubtype = doc.querySelector('paysubtype')?.textContent || '1'
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// paysubtype: 1=待收款, 3=已收款
|
// paysubtype: 1=待收款, 3=已收款
|
||||||
const isReceived = paysubtype === '3'
|
const isReceived = paysubtype === '3'
|
||||||
@@ -2764,16 +3136,29 @@ function MessageBubble({ message, session, showTime, myAvatarUrl, isGroupChat, o
|
|||||||
// 如果 feedesc 为空,使用 title 作为降级
|
// 如果 feedesc 为空,使用 title 作为降级
|
||||||
const displayAmount = feedesc || title || '微信转账'
|
const displayAmount = feedesc || title || '微信转账'
|
||||||
|
|
||||||
|
// 构建转账描述:A 转账给 B
|
||||||
|
const transferDesc = transferPayerName && transferReceiverName
|
||||||
|
? `${transferPayerName} 转账给 ${transferReceiverName}`
|
||||||
|
: undefined
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`transfer-message ${isReceived ? 'received' : ''}`}>
|
<div className={`transfer-message ${isReceived ? 'received' : ''}`}>
|
||||||
<div className="transfer-icon">
|
<div className="transfer-icon">
|
||||||
<svg width="32" height="32" viewBox="0 0 40 40" fill="none">
|
{isReceived ? (
|
||||||
<circle cx="20" cy="20" r="18" stroke="white" strokeWidth="2" />
|
<svg width="32" height="32" viewBox="0 0 40 40" fill="none">
|
||||||
<path d="M12 20h16M20 12l8 8-8 8" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
|
<circle cx="20" cy="20" r="18" stroke="white" strokeWidth="2" />
|
||||||
</svg>
|
<path d="M12 20l6 6 10-12" stroke="white" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" />
|
||||||
|
</svg>
|
||||||
|
) : (
|
||||||
|
<svg width="32" height="32" viewBox="0 0 40 40" fill="none">
|
||||||
|
<circle cx="20" cy="20" r="18" stroke="white" strokeWidth="2" />
|
||||||
|
<path d="M12 20h16M20 12l8 8-8 8" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
|
||||||
|
</svg>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="transfer-info">
|
<div className="transfer-info">
|
||||||
<div className="transfer-amount">{displayAmount}</div>
|
<div className="transfer-amount">{displayAmount}</div>
|
||||||
|
{transferDesc && <div className="transfer-desc">{transferDesc}</div>}
|
||||||
{payMemo && <div className="transfer-memo">{payMemo}</div>}
|
{payMemo && <div className="transfer-memo">{payMemo}</div>}
|
||||||
<div className="transfer-label">{isReceived ? '已收款' : '微信转账'}</div>
|
<div className="transfer-label">{isReceived ? '已收款' : '微信转账'}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -132,26 +132,43 @@
|
|||||||
.info {
|
.info {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 4px;
|
gap: 2px;
|
||||||
|
min-width: 0; // 允许 flex 子项缩小,配合 ellipsis
|
||||||
|
|
||||||
.name {
|
.name {
|
||||||
|
font-size: 15px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sub {
|
.sub {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: var(--text-tertiary);
|
color: var(--text-secondary); // 从 tertiary 改为 secondary 以增强对比度
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.meta {
|
.meta {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: var(--text-tertiary);
|
color: var(--text-secondary); // 改为 secondary
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
.count {
|
.count {
|
||||||
font-weight: 600;
|
font-size: 14px;
|
||||||
color: var(--text-primary);
|
font-weight: 700;
|
||||||
|
color: var(--primary); // 使用主题色更醒目
|
||||||
|
margin-bottom: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hint {
|
||||||
|
opacity: 0.7;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -166,6 +183,11 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@keyframes spin {
|
@keyframes spin {
|
||||||
from { transform: rotate(0deg); }
|
from {
|
||||||
to { transform: rotate(360deg); }
|
transform: rotate(0deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -7,6 +7,7 @@ interface ContactRanking {
|
|||||||
username: string
|
username: string
|
||||||
displayName: string
|
displayName: string
|
||||||
avatarUrl?: string
|
avatarUrl?: string
|
||||||
|
wechatId?: string
|
||||||
messageCount: number
|
messageCount: number
|
||||||
sentCount: number
|
sentCount: number
|
||||||
receivedCount: number
|
receivedCount: number
|
||||||
@@ -15,28 +16,29 @@ interface ContactRanking {
|
|||||||
|
|
||||||
function DualReportPage() {
|
function DualReportPage() {
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
const [year, setYear] = useState<number>(0)
|
const [year] = useState<number>(() => {
|
||||||
|
const params = new URLSearchParams(window.location.hash.split('?')[1] || '')
|
||||||
|
const yearParam = params.get('year')
|
||||||
|
const parsedYear = yearParam ? parseInt(yearParam, 10) : 0
|
||||||
|
return Number.isNaN(parsedYear) ? 0 : parsedYear
|
||||||
|
})
|
||||||
const [rankings, setRankings] = useState<ContactRanking[]>([])
|
const [rankings, setRankings] = useState<ContactRanking[]>([])
|
||||||
const [isLoading, setIsLoading] = useState(true)
|
const [isLoading, setIsLoading] = useState(true)
|
||||||
const [loadError, setLoadError] = useState<string | null>(null)
|
const [loadError, setLoadError] = useState<string | null>(null)
|
||||||
const [keyword, setKeyword] = useState('')
|
const [keyword, setKeyword] = useState('')
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const params = new URLSearchParams(window.location.hash.split('?')[1] || '')
|
void loadRankings(year)
|
||||||
const yearParam = params.get('year')
|
}, [year])
|
||||||
const parsedYear = yearParam ? parseInt(yearParam, 10) : 0
|
|
||||||
setYear(Number.isNaN(parsedYear) ? 0 : parsedYear)
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
useEffect(() => {
|
const loadRankings = async (reportYear: number) => {
|
||||||
loadRankings()
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
const loadRankings = async () => {
|
|
||||||
setIsLoading(true)
|
setIsLoading(true)
|
||||||
setLoadError(null)
|
setLoadError(null)
|
||||||
try {
|
try {
|
||||||
const result = await window.electronAPI.analytics.getContactRankings(200)
|
const isAllTime = reportYear <= 0
|
||||||
|
const beginTimestamp = isAllTime ? 0 : Math.floor(new Date(reportYear, 0, 1).getTime() / 1000)
|
||||||
|
const endTimestamp = isAllTime ? 0 : Math.floor(new Date(reportYear, 11, 31, 23, 59, 59).getTime() / 1000)
|
||||||
|
const result = await window.electronAPI.analytics.getContactRankings(200, beginTimestamp, endTimestamp)
|
||||||
if (result.success && result.data) {
|
if (result.success && result.data) {
|
||||||
setRankings(result.data)
|
setRankings(result.data)
|
||||||
} else {
|
} else {
|
||||||
@@ -55,7 +57,8 @@ function DualReportPage() {
|
|||||||
if (!keyword.trim()) return rankings
|
if (!keyword.trim()) return rankings
|
||||||
const q = keyword.trim().toLowerCase()
|
const q = keyword.trim().toLowerCase()
|
||||||
return rankings.filter((item) => {
|
return rankings.filter((item) => {
|
||||||
return item.displayName.toLowerCase().includes(q) || item.username.toLowerCase().includes(q)
|
const wechatId = (item.wechatId || '').toLowerCase()
|
||||||
|
return item.displayName.toLowerCase().includes(q) || wechatId.includes(q)
|
||||||
})
|
})
|
||||||
}, [rankings, keyword])
|
}, [rankings, keyword])
|
||||||
|
|
||||||
@@ -99,7 +102,7 @@ function DualReportPage() {
|
|||||||
<input
|
<input
|
||||||
value={keyword}
|
value={keyword}
|
||||||
onChange={(e) => setKeyword(e.target.value)}
|
onChange={(e) => setKeyword(e.target.value)}
|
||||||
placeholder="搜索好友(昵称/备注/wxid)"
|
placeholder="搜索好友(昵称/微信号)"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -119,7 +122,7 @@ function DualReportPage() {
|
|||||||
</div>
|
</div>
|
||||||
<div className="info">
|
<div className="info">
|
||||||
<div className="name">{item.displayName}</div>
|
<div className="name">{item.displayName}</div>
|
||||||
<div className="sub">{item.username}</div>
|
<div className="sub">{item.wechatId || '\u672A\u8bbe\u7f6e\u5fae\u4fe1\u53f7'}</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="meta">
|
<div className="meta">
|
||||||
<div className="count">{item.messageCount.toLocaleString()} 条</div>
|
<div className="count">{item.messageCount.toLocaleString()} 条</div>
|
||||||
|
|||||||
@@ -8,6 +8,7 @@
|
|||||||
font-size: clamp(26px, 5vw, 44px);
|
font-size: clamp(26px, 5vw, 44px);
|
||||||
white-space: normal;
|
white-space: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dual-names {
|
.dual-names {
|
||||||
font-size: clamp(24px, 4vw, 40px);
|
font-size: clamp(24px, 4vw, 40px);
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
@@ -30,9 +31,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dual-info-card {
|
.dual-info-card {
|
||||||
background: var(--ar-card-bg);
|
|
||||||
border: 1px solid var(--bg-tertiary, rgba(0, 0, 0, 0.05));
|
|
||||||
border-radius: 14px;
|
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
|
|
||||||
&.full {
|
&.full {
|
||||||
@@ -60,14 +58,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dual-message {
|
.dual-message {
|
||||||
background: var(--ar-card-bg);
|
|
||||||
border-radius: 14px;
|
|
||||||
padding: 14px;
|
padding: 14px;
|
||||||
|
|
||||||
&.received {
|
|
||||||
background: var(--ar-card-bg-hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
.message-meta {
|
.message-meta {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: var(--ar-text-sub);
|
color: var(--ar-text-sub);
|
||||||
@@ -81,25 +73,15 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.first-chat-scene {
|
.first-chat-scene {
|
||||||
background: linear-gradient(180deg, #8f5b85 0%, #e38aa0 50%, #f6d0c8 100%);
|
padding: 18px 16px 16px;
|
||||||
border-radius: 20px;
|
color: var(--ar-text-main);
|
||||||
padding: 28px 24px 24px;
|
|
||||||
color: #fff;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-top: 16px;
|
margin-top: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.first-chat-scene::before {
|
.first-chat-scene::before {
|
||||||
content: "";
|
display: none;
|
||||||
position: absolute;
|
|
||||||
inset: 0;
|
|
||||||
background-image:
|
|
||||||
radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.2), transparent 40%),
|
|
||||||
radial-gradient(circle at 80% 10%, rgba(255, 255, 255, 0.15), transparent 35%),
|
|
||||||
radial-gradient(circle at 50% 80%, rgba(255, 255, 255, 0.12), transparent 45%);
|
|
||||||
opacity: 0.6;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-title {
|
.scene-title {
|
||||||
@@ -107,6 +89,7 @@
|
|||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
|
color: var(--ar-text-main);
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-subtitle {
|
.scene-subtitle {
|
||||||
@@ -114,92 +97,192 @@
|
|||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
opacity: 0.95;
|
opacity: 0.9;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-messages {
|
.scene-messages {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 14px;
|
gap: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-message {
|
.scene-message {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-end;
|
flex-direction: column;
|
||||||
gap: 12px;
|
align-items: center;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
&.sent {
|
&.system {
|
||||||
|
margin: 16px 0;
|
||||||
|
|
||||||
|
.system-msg-content {
|
||||||
|
background: rgba(255, 255, 255, 0.05);
|
||||||
|
padding: 4px 12px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(255, 255, 255, 0.4);
|
||||||
|
text-align: center;
|
||||||
|
max-width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-meta {
|
||||||
|
font-size: 10px;
|
||||||
|
opacity: 0.65;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-body {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.sent .scene-body {
|
||||||
flex-direction: row-reverse;
|
flex-direction: row-reverse;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.received .scene-body {
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: flex-start;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-avatar {
|
.scene-avatar {
|
||||||
width: 40px;
|
width: 42px;
|
||||||
height: 40px;
|
height: 42px;
|
||||||
border-radius: 12px;
|
border-radius: 50%;
|
||||||
background: rgba(255, 255, 255, 0.25);
|
background: var(--ar-card-bg);
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
color: #fff;
|
color: var(--ar-text-sub);
|
||||||
|
border: 1px solid var(--bg-tertiary, rgba(0, 0, 0, 0.08));
|
||||||
|
overflow: hidden;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-content-wrapper {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
max-width: min(78%, 720px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-message.sent .scene-content-wrapper {
|
||||||
|
align-items: flex-end;
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-bubble {
|
.scene-bubble {
|
||||||
background: rgba(255, 255, 255, 0.85);
|
color: var(--ar-text-main);
|
||||||
color: #5a4d5e;
|
|
||||||
padding: 10px 14px;
|
padding: 10px 14px;
|
||||||
border-radius: 14px;
|
width: fit-content;
|
||||||
max-width: 60%;
|
min-width: 40px;
|
||||||
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
|
max-width: 100%;
|
||||||
}
|
background: var(--ar-card-bg);
|
||||||
|
border-radius: 12px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
.scene-message.sent .scene-bubble {
|
&.no-bubble {
|
||||||
background: rgba(255, 224, 168, 0.9);
|
background: transparent;
|
||||||
color: #4a3a2f;
|
padding: 0;
|
||||||
}
|
box-shadow: none;
|
||||||
|
}
|
||||||
.scene-meta {
|
|
||||||
font-size: 11px;
|
|
||||||
opacity: 0.7;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-content {
|
.scene-content {
|
||||||
|
line-height: 1.5;
|
||||||
|
font-size: clamp(14px, 1.8vw, 16px);
|
||||||
|
word-break: break-all;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
line-break: auto;
|
||||||
|
|
||||||
|
.report-emoji-container {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin: 2px 0;
|
||||||
|
|
||||||
|
.report-emoji-img {
|
||||||
|
max-width: 120px;
|
||||||
|
max-height: 120px;
|
||||||
|
border-radius: 4px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-avatar.fallback {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 1.4;
|
}
|
||||||
word-break: break-word;
|
|
||||||
|
.scene-avatar.with-image {
|
||||||
|
background: transparent;
|
||||||
|
color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
.scene-message.sent .scene-avatar {
|
.scene-message.sent .scene-avatar {
|
||||||
background: rgba(255, 224, 168, 0.9);
|
border-color: color-mix(in srgb, var(--primary) 30%, var(--bg-tertiary, rgba(0, 0, 0, 0.08)));
|
||||||
color: #4a3a2f;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.dual-stat-grid {
|
.dual-stat-grid {
|
||||||
display: grid;
|
display: flex;
|
||||||
grid-template-columns: repeat(5, minmax(140px, 1fr));
|
flex-wrap: nowrap;
|
||||||
gap: 14px;
|
gap: clamp(60px, 10vw, 120px);
|
||||||
margin: 20px -28px 24px;
|
margin: 48px 0 32px;
|
||||||
padding: 0 28px;
|
padding: 0;
|
||||||
overflow: visible;
|
justify-content: center;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
&.bottom {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 48px;
|
||||||
|
gap: clamp(40px, 6vw, 80px);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.dual-stat-card {
|
.dual-stat-card {
|
||||||
background: var(--ar-card-bg);
|
display: flex;
|
||||||
border-radius: 14px;
|
flex-direction: column;
|
||||||
padding: 14px 12px;
|
align-items: center;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
min-width: 140px;
|
||||||
|
max-width: 280px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-num {
|
.stat-num {
|
||||||
font-size: clamp(20px, 2.8vw, 30px);
|
font-size: clamp(36px, 6vw, 64px);
|
||||||
|
font-weight: 800;
|
||||||
font-variant-numeric: tabular-nums;
|
font-variant-numeric: tabular-nums;
|
||||||
|
color: var(--ar-primary);
|
||||||
|
line-height: 1;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
font-size: clamp(24px, 4vw, 40px);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-unit {
|
.stat-unit {
|
||||||
font-size: 12px;
|
font-size: 14px;
|
||||||
|
margin-top: 4px;
|
||||||
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dual-stat-card.long .stat-num {
|
.dual-stat-card.long .stat-num {
|
||||||
@@ -215,15 +298,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.emoji-card {
|
.emoji-card {
|
||||||
border: 1px solid var(--bg-tertiary, rgba(0, 0, 0, 0.08));
|
|
||||||
border-radius: 16px;
|
|
||||||
padding: 18px 16px;
|
padding: 18px 16px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
background: var(--ar-card-bg);
|
|
||||||
|
|
||||||
img {
|
img {
|
||||||
width: 64px;
|
width: 64px;
|
||||||
@@ -250,4 +330,580 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 24px 0;
|
padding: 24px 0;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
.initiative-container {
|
||||||
|
padding: 32px 0;
|
||||||
|
width: 100%;
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.initiative-bar-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 32px;
|
||||||
|
width: 100%;
|
||||||
|
padding: 24px 0;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.initiative-side {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
min-width: 80px;
|
||||||
|
z-index: 2;
|
||||||
|
|
||||||
|
.avatar-placeholder {
|
||||||
|
width: 54px;
|
||||||
|
height: 54px;
|
||||||
|
border-radius: 18px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
font-size: 16px;
|
||||||
|
border: 1.5px solid rgba(255, 255, 255, 0.15);
|
||||||
|
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.count {
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 500;
|
||||||
|
opacity: 0.4;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
}
|
||||||
|
|
||||||
|
.percent {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--ar-text-main);
|
||||||
|
font-weight: 800;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.initiative-progress {
|
||||||
|
flex: 1;
|
||||||
|
height: 1px; // 线条样式
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.line-bg {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 1px;
|
||||||
|
background: linear-gradient(90deg,
|
||||||
|
transparent 0%,
|
||||||
|
rgba(255, 255, 255, 0.1) 20%,
|
||||||
|
rgba(255, 255, 255, 0.1) 80%,
|
||||||
|
transparent 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.initiative-indicator {
|
||||||
|
position: absolute;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
transition: left 1.5s cubic-bezier(0.16, 1, 0.3, 1);
|
||||||
|
box-shadow:
|
||||||
|
0 0 10px #fff,
|
||||||
|
0 0 20px rgba(255, 255, 255, 0.5),
|
||||||
|
0 0 30px var(--ar-primary);
|
||||||
|
z-index: 3;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: -4px;
|
||||||
|
left: -4px;
|
||||||
|
right: -4px;
|
||||||
|
bottom: -4px;
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: pulse 2s infinite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.initiative-desc {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
letter-spacing: 1px;
|
||||||
|
opacity: 0.6;
|
||||||
|
background: transparent;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0 auto;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: scale(2);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.response-pulse-container {
|
||||||
|
width: 100%;
|
||||||
|
padding: 80px 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-visual {
|
||||||
|
position: relative;
|
||||||
|
width: 420px;
|
||||||
|
height: 240px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-hub {
|
||||||
|
position: relative;
|
||||||
|
z-index: 5;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 160px;
|
||||||
|
height: 160px;
|
||||||
|
background: radial-gradient(circle at center, rgba(255, 255, 255, 0.12) 0%, transparent 75%);
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0 0 40px rgba(255, 255, 255, 0.1);
|
||||||
|
|
||||||
|
.label {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
opacity: 0.6;
|
||||||
|
margin-bottom: 6px;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
font-size: 54px;
|
||||||
|
font-weight: 950;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 1;
|
||||||
|
text-shadow: 0 0 30px rgba(255, 255, 255, 0.5);
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-left: 4px;
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-node {
|
||||||
|
position: absolute;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
z-index: 4;
|
||||||
|
animation: floatNode 4s ease-in-out infinite;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
left: 0;
|
||||||
|
transform: translateX(-15%);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right {
|
||||||
|
right: 0;
|
||||||
|
transform: translateX(15%);
|
||||||
|
animation-delay: -2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
opacity: 0.5;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 800;
|
||||||
|
color: var(--ar-text-main);
|
||||||
|
opacity: 0.95;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 13px;
|
||||||
|
margin-left: 2px;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-ripple {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
border: 1.5px solid rgba(255, 255, 255, 0.08);
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: ripplePulse 8s linear infinite;
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
|
&.one {
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.two {
|
||||||
|
animation-delay: 2.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.three {
|
||||||
|
animation-delay: 5s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes ripplePulse {
|
||||||
|
0% {
|
||||||
|
width: 140px;
|
||||||
|
height: 140px;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
width: 700px;
|
||||||
|
height: 700px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes floatNode {
|
||||||
|
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: translateY(-16px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.response-note {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
opacity: 0.5;
|
||||||
|
margin-top: 32px;
|
||||||
|
font-style: italic;
|
||||||
|
max-width: none;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.streak-spark-visual.premium {
|
||||||
|
width: 100%;
|
||||||
|
height: 400px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 20px 0;
|
||||||
|
overflow: visible;
|
||||||
|
|
||||||
|
.spark-ambient-glow {
|
||||||
|
position: absolute;
|
||||||
|
top: 40%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
width: 600px;
|
||||||
|
height: 480px;
|
||||||
|
background: radial-gradient(circle at center, rgba(242, 170, 0, 0.04) 0%, transparent 70%);
|
||||||
|
filter: blur(60px);
|
||||||
|
z-index: 1;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.spark-core-wrapper {
|
||||||
|
position: relative;
|
||||||
|
width: 220px;
|
||||||
|
height: 280px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 5;
|
||||||
|
animation: flameSway 6s ease-in-out infinite;
|
||||||
|
transform-origin: bottom center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spark-flame-outer {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: radial-gradient(ellipse at 50% 85%, rgba(242, 170, 0, 0.15) 0%, transparent 75%);
|
||||||
|
border-radius: 50% 50% 20% 20% / 80% 80% 30% 30%;
|
||||||
|
filter: blur(25px);
|
||||||
|
animation: flickerOuter 4s infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spark-flame-inner {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 20%;
|
||||||
|
width: 140px;
|
||||||
|
height: 180px;
|
||||||
|
background: radial-gradient(ellipse at 50% 90%, rgba(255, 215, 0, 0.2) 0%, transparent 80%);
|
||||||
|
border-radius: 50% 50% 30% 30% / 85% 85% 25% 25%;
|
||||||
|
filter: blur(12px);
|
||||||
|
animation: flickerInner 3s infinite alternate-reverse;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spark-core {
|
||||||
|
position: relative;
|
||||||
|
z-index: 10;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
|
||||||
|
.spark-days {
|
||||||
|
font-size: 84px;
|
||||||
|
font-weight: 800;
|
||||||
|
color: rgba(255, 255, 255, 0.9);
|
||||||
|
line-height: 1;
|
||||||
|
letter-spacing: -1px;
|
||||||
|
text-shadow:
|
||||||
|
0 0 15px rgba(255, 255, 255, 0.4),
|
||||||
|
0 8px 30px rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.spark-label {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 800;
|
||||||
|
color: rgba(255, 255, 255, 0.4);
|
||||||
|
letter-spacing: 6px;
|
||||||
|
margin-top: 12px;
|
||||||
|
text-indent: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.streak-bridge.premium {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 500px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0;
|
||||||
|
margin-top: -20px;
|
||||||
|
z-index: 20;
|
||||||
|
|
||||||
|
.bridge-date {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
position: relative;
|
||||||
|
width: 100px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--ar-text-sub);
|
||||||
|
opacity: 0.6;
|
||||||
|
font-weight: 500;
|
||||||
|
letter-spacing: 0.2px;
|
||||||
|
position: absolute;
|
||||||
|
top: 24px;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.date-orb {
|
||||||
|
width: 6px;
|
||||||
|
height: 6px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0 0 12px var(--ar-accent);
|
||||||
|
border: 1px solid rgba(252, 170, 0, 0.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bridge-line {
|
||||||
|
flex: 1;
|
||||||
|
height: 40px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.line-string {
|
||||||
|
width: 100%;
|
||||||
|
height: 1.5px;
|
||||||
|
background: linear-gradient(90deg,
|
||||||
|
rgba(242, 170, 0, 0) 0%,
|
||||||
|
rgba(242, 170, 0, 0.6) 20%,
|
||||||
|
rgba(242, 170, 0, 0.6) 80%,
|
||||||
|
rgba(242, 170, 0, 0) 100%);
|
||||||
|
mask-image: radial-gradient(ellipse at center, black 60%, transparent 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-glow {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 8px;
|
||||||
|
background: radial-gradient(ellipse at center, rgba(242, 170, 0, 0.2) 0%, transparent 80%);
|
||||||
|
filter: blur(4px);
|
||||||
|
animation: sparkFlicker 2s infinite alternate;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.spark-ember {
|
||||||
|
position: absolute;
|
||||||
|
background: #FFD700;
|
||||||
|
border-radius: 50%;
|
||||||
|
filter: blur(0.5px);
|
||||||
|
box-shadow: 0 0 6px #F2AA00;
|
||||||
|
opacity: 0;
|
||||||
|
z-index: 4;
|
||||||
|
|
||||||
|
&.one {
|
||||||
|
width: 3px;
|
||||||
|
height: 3px;
|
||||||
|
left: 46%;
|
||||||
|
animation: emberRise 5s infinite 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.two {
|
||||||
|
width: 2px;
|
||||||
|
height: 2px;
|
||||||
|
left: 53%;
|
||||||
|
animation: emberRise 4s infinite 1.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.three {
|
||||||
|
width: 4px;
|
||||||
|
height: 4px;
|
||||||
|
left: 50%;
|
||||||
|
animation: emberRise 6s infinite 2.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.four {
|
||||||
|
width: 2.5px;
|
||||||
|
height: 2.5px;
|
||||||
|
left: 48%;
|
||||||
|
animation: emberRise 5.5s infinite 3.8s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes flameSway {
|
||||||
|
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: rotate(-1deg) skewX(-1deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: rotate(1.5deg) skewX(1deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes flickerOuter {
|
||||||
|
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
opacity: 0.15;
|
||||||
|
filter: blur(25px);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
opacity: 0.25;
|
||||||
|
filter: blur(30px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes flickerInner {
|
||||||
|
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 0.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: scale(1.08);
|
||||||
|
opacity: 0.3;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes emberRise {
|
||||||
|
0% {
|
||||||
|
transform: translateY(100px) scale(1);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
opacity: 0.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(-260px) scale(0.4);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes sparkFlicker {
|
||||||
|
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 0.9;
|
||||||
|
filter: brightness(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: scale(1.03);
|
||||||
|
opacity: 1;
|
||||||
|
filter: brightness(1.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 960px) {
|
||||||
|
.pulse-visual {
|
||||||
|
transform: scale(0.85);
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-avatar {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-content-wrapper {
|
||||||
|
max-width: min(86%, 500px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.scene-bubble {
|
||||||
|
max-width: 100%;
|
||||||
|
min-width: 56px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,4 +1,6 @@
|
|||||||
import { useEffect, useState, type CSSProperties } from 'react'
|
import { useEffect, useState } from 'react'
|
||||||
|
import ReportHeatmap from '../components/ReportHeatmap'
|
||||||
|
import ReportWordCloud from '../components/ReportWordCloud'
|
||||||
import './AnnualReportWindow.scss'
|
import './AnnualReportWindow.scss'
|
||||||
import './DualReportWindow.scss'
|
import './DualReportWindow.scss'
|
||||||
|
|
||||||
@@ -7,19 +9,27 @@ interface DualReportMessage {
|
|||||||
isSentByMe: boolean
|
isSentByMe: boolean
|
||||||
createTime: number
|
createTime: number
|
||||||
createTimeStr: string
|
createTimeStr: string
|
||||||
|
localType?: number
|
||||||
|
emojiMd5?: string
|
||||||
|
emojiCdnUrl?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DualReportData {
|
interface DualReportData {
|
||||||
year: number
|
year: number
|
||||||
selfName: string
|
selfName: string
|
||||||
|
selfAvatarUrl?: string
|
||||||
friendUsername: string
|
friendUsername: string
|
||||||
friendName: string
|
friendName: string
|
||||||
|
friendAvatarUrl?: string
|
||||||
firstChat: {
|
firstChat: {
|
||||||
createTime: number
|
createTime: number
|
||||||
createTimeStr: string
|
createTimeStr: string
|
||||||
content: string
|
content: string
|
||||||
isSentByMe: boolean
|
isSentByMe: boolean
|
||||||
senderUsername?: string
|
senderUsername?: string
|
||||||
|
localType?: number
|
||||||
|
emojiMd5?: string
|
||||||
|
emojiCdnUrl?: string
|
||||||
} | null
|
} | null
|
||||||
firstChatMessages?: DualReportMessage[]
|
firstChatMessages?: DualReportMessage[]
|
||||||
yearFirstChat?: {
|
yearFirstChat?: {
|
||||||
@@ -29,6 +39,9 @@ interface DualReportData {
|
|||||||
isSentByMe: boolean
|
isSentByMe: boolean
|
||||||
friendName: string
|
friendName: string
|
||||||
firstThreeMessages: DualReportMessage[]
|
firstThreeMessages: DualReportMessage[]
|
||||||
|
localType?: number
|
||||||
|
emojiMd5?: string
|
||||||
|
emojiCdnUrl?: string
|
||||||
} | null
|
} | null
|
||||||
stats: {
|
stats: {
|
||||||
totalMessages: number
|
totalMessages: number
|
||||||
@@ -40,111 +53,15 @@ interface DualReportData {
|
|||||||
friendTopEmojiMd5?: string
|
friendTopEmojiMd5?: string
|
||||||
myTopEmojiUrl?: string
|
myTopEmojiUrl?: string
|
||||||
friendTopEmojiUrl?: string
|
friendTopEmojiUrl?: string
|
||||||
|
myTopEmojiCount?: number
|
||||||
|
friendTopEmojiCount?: number
|
||||||
}
|
}
|
||||||
topPhrases: Array<{ phrase: string; count: number }>
|
topPhrases: Array<{ phrase: string; count: number }>
|
||||||
}
|
heatmap?: number[][]
|
||||||
|
initiative?: { initiated: number; received: number }
|
||||||
const WordCloud = ({ words }: { words: { phrase: string; count: number }[] }) => {
|
response?: { avg: number; fastest: number; slowest: number; count: number }
|
||||||
if (!words || words.length === 0) {
|
monthly?: Record<string, number>
|
||||||
return <div className="word-cloud-empty">暂无高频语句</div>
|
streak?: { days: number; startDate: string; endDate: string }
|
||||||
}
|
|
||||||
const sortedWords = [...words].sort((a, b) => b.count - a.count)
|
|
||||||
const maxCount = sortedWords.length > 0 ? sortedWords[0].count : 1
|
|
||||||
const topWords = sortedWords.slice(0, 32)
|
|
||||||
const baseSize = 520
|
|
||||||
|
|
||||||
const seededRandom = (seed: number) => {
|
|
||||||
const x = Math.sin(seed) * 10000
|
|
||||||
return x - Math.floor(x)
|
|
||||||
}
|
|
||||||
|
|
||||||
const placedItems: { x: number; y: number; w: number; h: number }[] = []
|
|
||||||
|
|
||||||
const canPlace = (x: number, y: number, w: number, h: number): boolean => {
|
|
||||||
const halfW = w / 2
|
|
||||||
const halfH = h / 2
|
|
||||||
const dx = x - 50
|
|
||||||
const dy = y - 50
|
|
||||||
const dist = Math.sqrt(dx * dx + dy * dy)
|
|
||||||
const maxR = 49 - Math.max(halfW, halfH)
|
|
||||||
if (dist > maxR) return false
|
|
||||||
|
|
||||||
const pad = 1.8
|
|
||||||
for (const p of placedItems) {
|
|
||||||
if ((x - halfW - pad) < (p.x + p.w / 2) &&
|
|
||||||
(x + halfW + pad) > (p.x - p.w / 2) &&
|
|
||||||
(y - halfH - pad) < (p.y + p.h / 2) &&
|
|
||||||
(y + halfH + pad) > (p.y - p.h / 2)) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
const wordItems = topWords.map((item, i) => {
|
|
||||||
const ratio = item.count / maxCount
|
|
||||||
const fontSize = Math.round(12 + Math.pow(ratio, 0.65) * 20)
|
|
||||||
const opacity = Math.min(1, Math.max(0.35, 0.35 + ratio * 0.65))
|
|
||||||
const delay = (i * 0.04).toFixed(2)
|
|
||||||
|
|
||||||
const charCount = Math.max(1, item.phrase.length)
|
|
||||||
const hasCjk = /[\u4e00-\u9fff]/.test(item.phrase)
|
|
||||||
const hasLatin = /[A-Za-z0-9]/.test(item.phrase)
|
|
||||||
const widthFactor = hasCjk && hasLatin ? 0.85 : hasCjk ? 0.98 : 0.6
|
|
||||||
const widthPx = fontSize * (charCount * widthFactor)
|
|
||||||
const heightPx = fontSize * 1.1
|
|
||||||
const widthPct = (widthPx / baseSize) * 100
|
|
||||||
const heightPct = (heightPx / baseSize) * 100
|
|
||||||
|
|
||||||
let x = 50, y = 50
|
|
||||||
let placedOk = false
|
|
||||||
const tries = i === 0 ? 1 : 420
|
|
||||||
|
|
||||||
for (let t = 0; t < tries; t++) {
|
|
||||||
if (i === 0) {
|
|
||||||
x = 50
|
|
||||||
y = 50
|
|
||||||
} else {
|
|
||||||
const idx = i + t * 0.28
|
|
||||||
const radius = Math.sqrt(idx) * 7.6 + (seededRandom(i * 1000 + t) * 1.2 - 0.6)
|
|
||||||
const angle = idx * 2.399963 + seededRandom(i * 2000 + t) * 0.35
|
|
||||||
x = 50 + radius * Math.cos(angle)
|
|
||||||
y = 50 + radius * Math.sin(angle)
|
|
||||||
}
|
|
||||||
if (canPlace(x, y, widthPct, heightPct)) {
|
|
||||||
placedOk = true
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!placedOk) return null
|
|
||||||
placedItems.push({ x, y, w: widthPct, h: heightPct })
|
|
||||||
|
|
||||||
return (
|
|
||||||
<span
|
|
||||||
key={i}
|
|
||||||
className="word-tag"
|
|
||||||
style={{
|
|
||||||
'--final-opacity': opacity,
|
|
||||||
left: `${x.toFixed(2)}%`,
|
|
||||||
top: `${y.toFixed(2)}%`,
|
|
||||||
fontSize: `${fontSize}px`,
|
|
||||||
animationDelay: `${delay}s`,
|
|
||||||
} as CSSProperties}
|
|
||||||
title={`${item.phrase} (出现 ${item.count} 次)`}
|
|
||||||
>
|
|
||||||
{item.phrase}
|
|
||||||
</span>
|
|
||||||
)
|
|
||||||
}).filter(Boolean)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="word-cloud-wrapper">
|
|
||||||
<div className="word-cloud-inner">
|
|
||||||
{wordItems}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function DualReportWindow() {
|
function DualReportWindow() {
|
||||||
@@ -203,6 +120,8 @@ function DualReportWindow() {
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const loadEmojis = async () => {
|
const loadEmojis = async () => {
|
||||||
if (!reportData) return
|
if (!reportData) return
|
||||||
|
setMyEmojiUrl(null)
|
||||||
|
setFriendEmojiUrl(null)
|
||||||
const stats = reportData.stats
|
const stats = reportData.stats
|
||||||
if (stats.myTopEmojiUrl) {
|
if (stats.myTopEmojiUrl) {
|
||||||
const res = await window.electronAPI.chat.downloadEmoji(stats.myTopEmojiUrl, stats.myTopEmojiMd5)
|
const res = await window.electronAPI.chat.downloadEmoji(stats.myTopEmojiUrl, stats.myTopEmojiMd5)
|
||||||
@@ -273,12 +192,15 @@ function DualReportWindow() {
|
|||||||
: null
|
: null
|
||||||
const yearFirstChat = reportData.yearFirstChat
|
const yearFirstChat = reportData.yearFirstChat
|
||||||
const stats = reportData.stats
|
const stats = reportData.stats
|
||||||
|
const initiativeTotal = (reportData.initiative?.initiated || 0) + (reportData.initiative?.received || 0)
|
||||||
|
const initiatedPercent = initiativeTotal > 0 ? (reportData.initiative!.initiated / initiativeTotal) * 100 : 0
|
||||||
|
const receivedPercent = initiativeTotal > 0 ? (reportData.initiative!.received / initiativeTotal) * 100 : 0
|
||||||
const statItems = [
|
const statItems = [
|
||||||
{ label: '总消息数', value: stats.totalMessages },
|
{ label: '总消息数', value: stats.totalMessages, color: '#07C160' },
|
||||||
{ label: '总字数', value: stats.totalWords },
|
{ label: '总字数', value: stats.totalWords, color: '#10AEFF' },
|
||||||
{ label: '图片', value: stats.imageCount },
|
{ label: '图片', value: stats.imageCount, color: '#FFC300' },
|
||||||
{ label: '语音', value: stats.voiceCount },
|
{ label: '语音', value: stats.voiceCount, color: '#FA5151' },
|
||||||
{ label: '表情', value: stats.emojiCount },
|
{ label: '表情', value: stats.emojiCount, color: '#FA9D3B' },
|
||||||
]
|
]
|
||||||
|
|
||||||
const decodeEntities = (text: string) => (
|
const decodeEntities = (text: string) => (
|
||||||
@@ -290,7 +212,28 @@ function DualReportWindow() {
|
|||||||
.replace(/'/g, "'")
|
.replace(/'/g, "'")
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const filterDisplayMessages = (messages: DualReportMessage[], maxActual: number = 3) => {
|
||||||
|
let actualCount = 0
|
||||||
|
const result: DualReportMessage[] = []
|
||||||
|
for (const msg of messages) {
|
||||||
|
const isSystem = msg.localType === 10000 || msg.localType === 10002
|
||||||
|
if (!isSystem) {
|
||||||
|
if (actualCount >= maxActual) break
|
||||||
|
actualCount++
|
||||||
|
}
|
||||||
|
result.push(msg)
|
||||||
|
}
|
||||||
|
return result
|
||||||
|
}
|
||||||
|
|
||||||
const stripCdata = (text: string) => text.replace(/<!\[CDATA\[([\s\S]*?)\]\]>/g, '$1')
|
const stripCdata = (text: string) => text.replace(/<!\[CDATA\[([\s\S]*?)\]\]>/g, '$1')
|
||||||
|
const compactMessageText = (text: string) => (
|
||||||
|
text
|
||||||
|
.replace(/\r\n/g, '\n')
|
||||||
|
.replace(/\s*\n+\s*/g, ' ')
|
||||||
|
.replace(/\s{2,}/g, ' ')
|
||||||
|
.trim()
|
||||||
|
)
|
||||||
|
|
||||||
const extractXmlText = (content: string) => {
|
const extractXmlText = (content: string) => {
|
||||||
const titleMatch = content.match(/<title>([\s\S]*?)<\/title>/i)
|
const titleMatch = content.match(/<title>([\s\S]*?)<\/title>/i)
|
||||||
@@ -304,16 +247,62 @@ function DualReportWindow() {
|
|||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
|
|
||||||
const formatMessageContent = (content?: string) => {
|
const formatMessageContent = (content?: string, localType?: number) => {
|
||||||
const raw = String(content || '').trim()
|
const isSystemMsg = localType === 10000 || localType === 10002
|
||||||
|
if (!isSystemMsg) {
|
||||||
|
if (localType === 3) return '[图片]'
|
||||||
|
if (localType === 34) return '[语音]'
|
||||||
|
if (localType === 43) return '[视频]'
|
||||||
|
if (localType === 47) return '[表情]'
|
||||||
|
if (localType === 42) return '[名片]'
|
||||||
|
if (localType === 48) return '[位置]'
|
||||||
|
if (localType === 49) return '[链接/文件]'
|
||||||
|
}
|
||||||
|
|
||||||
|
const raw = compactMessageText(String(content || '').trim())
|
||||||
if (!raw) return '(空)'
|
if (!raw) return '(空)'
|
||||||
|
|
||||||
|
// 1. 尝试提取 XML 关键字段
|
||||||
|
const titleMatch = raw.match(/<title>([\s\S]*?)<\/title>/i)
|
||||||
|
if (titleMatch?.[1]) return compactMessageText(decodeEntities(stripCdata(titleMatch[1]).trim()))
|
||||||
|
|
||||||
|
const descMatch = raw.match(/<des>([\s\S]*?)<\/des>/i)
|
||||||
|
if (descMatch?.[1]) return compactMessageText(decodeEntities(stripCdata(descMatch[1]).trim()))
|
||||||
|
|
||||||
|
const summaryMatch = raw.match(/<summary>([\s\S]*?)<\/summary>/i)
|
||||||
|
if (summaryMatch?.[1]) return compactMessageText(decodeEntities(stripCdata(summaryMatch[1]).trim()))
|
||||||
|
|
||||||
|
// 2. 检查是否是 XML 结构
|
||||||
const hasXmlTag = /<\s*[a-zA-Z]+[^>]*>/.test(raw)
|
const hasXmlTag = /<\s*[a-zA-Z]+[^>]*>/.test(raw)
|
||||||
const looksLikeXml = /<\?xml|<msg\b|<appmsg\b|<sysmsg\b|<appattach\b|<emoji\b|<img\b|<voip\b/i.test(raw)
|
const looksLikeXml = /<\?xml|<msg\b|<appmsg\b|<sysmsg\b|<appattach\b|<emoji\b|<img\b|<voip\b/i.test(raw) || hasXmlTag
|
||||||
|| hasXmlTag
|
|
||||||
if (!looksLikeXml) return raw
|
if (!looksLikeXml) return raw
|
||||||
const extracted = extractXmlText(raw)
|
|
||||||
if (!extracted) return '(XML消息)'
|
// 3. 最后的尝试:移除所有 XML 标签,看是否还有有意义的文本
|
||||||
return decodeEntities(stripCdata(extracted).trim()) || '(XML消息)'
|
const stripped = raw.replace(/<[^>]+>/g, '').trim()
|
||||||
|
if (stripped && stripped.length > 0 && stripped.length < 50) {
|
||||||
|
return compactMessageText(decodeEntities(stripped))
|
||||||
|
}
|
||||||
|
|
||||||
|
return '[多媒体消息]'
|
||||||
|
}
|
||||||
|
|
||||||
|
const ReportMessageItem = ({ msg }: { msg: DualReportMessage }) => {
|
||||||
|
if (msg.localType === 47 && (msg.emojiMd5 || msg.emojiCdnUrl)) {
|
||||||
|
const emojiUrl = msg.emojiCdnUrl || (msg.emojiMd5 ? `https://emoji.qpic.cn/wx_emoji/${msg.emojiMd5}/0` : '')
|
||||||
|
if (emojiUrl) {
|
||||||
|
return (
|
||||||
|
<div className="report-emoji-container">
|
||||||
|
<img src={emojiUrl} alt="表情" className="report-emoji-img" onError={(e) => {
|
||||||
|
(e.target as HTMLImageElement).style.display = 'none';
|
||||||
|
(e.target as HTMLImageElement).nextElementSibling?.removeAttribute('style');
|
||||||
|
}} />
|
||||||
|
<span style={{ display: 'none' }}>[表情]</span>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return <span>{formatMessageContent(msg.content, msg.localType)}</span>
|
||||||
}
|
}
|
||||||
const formatFullDate = (timestamp: number) => {
|
const formatFullDate = (timestamp: number) => {
|
||||||
const d = new Date(timestamp)
|
const d = new Date(timestamp)
|
||||||
@@ -325,6 +314,87 @@ function DualReportWindow() {
|
|||||||
return `${year}/${month}/${day} ${hour}:${minute}`
|
return `${year}/${month}/${day} ${hour}:${minute}`
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const getMostActiveTime = (data: number[][]) => {
|
||||||
|
let maxHour = 0
|
||||||
|
let maxWeekday = 0
|
||||||
|
let maxVal = -1
|
||||||
|
data.forEach((row, weekday) => {
|
||||||
|
row.forEach((value, hour) => {
|
||||||
|
if (value > maxVal) {
|
||||||
|
maxVal = value
|
||||||
|
maxHour = hour
|
||||||
|
maxWeekday = weekday
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
const weekdayNames = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
|
||||||
|
return {
|
||||||
|
weekday: weekdayNames[maxWeekday] || '周一',
|
||||||
|
hour: maxHour,
|
||||||
|
value: Math.max(0, maxVal)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const mostActive = reportData.heatmap ? getMostActiveTime(reportData.heatmap) : null
|
||||||
|
const responseAvgMinutes = reportData.response ? Math.max(0, Math.round(reportData.response.avg / 60)) : 0
|
||||||
|
const getSceneAvatarUrl = (isSentByMe: boolean) => (isSentByMe ? reportData.selfAvatarUrl : reportData.friendAvatarUrl)
|
||||||
|
const getSceneAvatarFallback = (isSentByMe: boolean) => (isSentByMe ? '我' : reportData.friendName.substring(0, 1))
|
||||||
|
const renderSceneAvatar = (isSentByMe: boolean) => {
|
||||||
|
const avatarUrl = getSceneAvatarUrl(isSentByMe)
|
||||||
|
if (avatarUrl) {
|
||||||
|
return (
|
||||||
|
<div className="scene-avatar with-image">
|
||||||
|
<img src={avatarUrl} alt={isSentByMe ? 'me-avatar' : 'friend-avatar'} />
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
return <div className="scene-avatar fallback">{getSceneAvatarFallback(isSentByMe)}</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
const renderMessageList = (messages: DualReportMessage[]) => {
|
||||||
|
const displayMsgs = filterDisplayMessages(messages)
|
||||||
|
let lastTime = 0
|
||||||
|
const TIME_THRESHOLD = 5 * 60 * 1000 // 5 分钟
|
||||||
|
|
||||||
|
return displayMsgs.map((msg, idx) => {
|
||||||
|
const isSystem = msg.localType === 10000 || msg.localType === 10002
|
||||||
|
const showTime = idx === 0 || (msg.createTime - lastTime > TIME_THRESHOLD)
|
||||||
|
lastTime = msg.createTime
|
||||||
|
|
||||||
|
if (isSystem) {
|
||||||
|
return (
|
||||||
|
<div key={idx} className="scene-message system">
|
||||||
|
{showTime && (
|
||||||
|
<div className="scene-meta">
|
||||||
|
{formatFullDate(msg.createTime).split(' ')[1]}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<div className="system-msg-content">
|
||||||
|
<ReportMessageItem msg={msg} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<div key={idx} className={`scene-message ${msg.isSentByMe ? 'sent' : 'received'}`}>
|
||||||
|
{showTime && (
|
||||||
|
<div className="scene-meta">
|
||||||
|
{formatFullDate(msg.createTime).split(' ')[1]}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<div className="scene-body">
|
||||||
|
{renderSceneAvatar(msg.isSentByMe)}
|
||||||
|
<div className="scene-content-wrapper">
|
||||||
|
<div className={`scene-bubble ${msg.localType === 47 ? 'no-bubble' : ''}`}>
|
||||||
|
<div className="scene-content"><ReportMessageItem msg={msg} /></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="annual-report-window dual-report-window">
|
<div className="annual-report-window dual-report-window">
|
||||||
<div className="drag-region" />
|
<div className="drag-region" />
|
||||||
@@ -344,7 +414,7 @@ function DualReportWindow() {
|
|||||||
<h1 className="hero-title dual-cover-title">{yearTitle}<br />双人聊天报告</h1>
|
<h1 className="hero-title dual-cover-title">{yearTitle}<br />双人聊天报告</h1>
|
||||||
<hr className="divider" />
|
<hr className="divider" />
|
||||||
<div className="dual-names">
|
<div className="dual-names">
|
||||||
<span>{reportData.selfName}</span>
|
<span>我</span>
|
||||||
<span className="amp">&</span>
|
<span className="amp">&</span>
|
||||||
<span>{reportData.friendName}</span>
|
<span>{reportData.friendName}</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -355,105 +425,217 @@ function DualReportWindow() {
|
|||||||
<div className="label-text">首次聊天</div>
|
<div className="label-text">首次聊天</div>
|
||||||
<h2 className="hero-title">故事的开始</h2>
|
<h2 className="hero-title">故事的开始</h2>
|
||||||
{firstChat ? (
|
{firstChat ? (
|
||||||
<>
|
<div className="first-chat-scene">
|
||||||
<div className="dual-info-grid">
|
<div className="scene-title">第一次遇见</div>
|
||||||
<div className="dual-info-card">
|
<div className="scene-subtitle">{formatFullDate(firstChat.createTime).split(' ')[0]}</div>
|
||||||
<div className="info-label">第一次聊天时间</div>
|
|
||||||
<div className="info-value">{formatFullDate(firstChat.createTime)}</div>
|
|
||||||
</div>
|
|
||||||
<div className="dual-info-card">
|
|
||||||
<div className="info-label">距今天数</div>
|
|
||||||
<div className="info-value">{daysSince} 天</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{firstChatMessages.length > 0 ? (
|
{firstChatMessages.length > 0 ? (
|
||||||
<div className="dual-message-list">
|
<div className="scene-messages">
|
||||||
{firstChatMessages.map((msg, idx) => (
|
{renderMessageList(firstChatMessages)}
|
||||||
<div
|
|
||||||
key={idx}
|
|
||||||
className={`dual-message ${msg.isSentByMe ? 'sent' : 'received'}`}
|
|
||||||
>
|
|
||||||
<div className="message-meta">
|
|
||||||
{msg.isSentByMe ? reportData.selfName : reportData.friendName} · {formatFullDate(msg.createTime)}
|
|
||||||
</div>
|
|
||||||
<div className="message-content">{formatMessageContent(msg.content)}</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : (
|
||||||
</>
|
<div className="hero-desc" style={{ textAlign: 'center' }}>暂无消息详情</div>
|
||||||
|
)}
|
||||||
|
<div className="scene-footer" style={{ marginTop: '20px', textAlign: 'center', fontSize: '14px', opacity: 0.6 }}>
|
||||||
|
距离今天已经 {daysSince} 天
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<p className="hero-desc">暂无首条消息</p>
|
<p className="hero-desc">暂无首条消息</p>
|
||||||
)}
|
)}
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{yearFirstChat ? (
|
{yearFirstChat && (!firstChat || yearFirstChat.createTime !== firstChat.createTime) ? (
|
||||||
<section className="section">
|
<section className="section">
|
||||||
<div className="label-text">第一段对话</div>
|
<div className="label-text">第一段对话</div>
|
||||||
<h2 className="hero-title">
|
<h2 className="hero-title">
|
||||||
{reportData.year === 0 ? '你们的第一段对话' : `${reportData.year}年的第一段对话`}
|
{reportData.year === 0 ? '你们的第一段对话' : `${reportData.year}年的第一段对话`}
|
||||||
</h2>
|
</h2>
|
||||||
<div className="dual-info-grid">
|
<div className="first-chat-scene">
|
||||||
<div className="dual-info-card">
|
<div className="scene-title">久别重逢</div>
|
||||||
<div className="info-label">第一段对话时间</div>
|
<div className="scene-subtitle">{formatFullDate(yearFirstChat.createTime).split(' ')[0]}</div>
|
||||||
<div className="info-value">{formatFullDate(yearFirstChat.createTime)}</div>
|
<div className="scene-messages">
|
||||||
|
{renderMessageList(yearFirstChat.firstThreeMessages)}
|
||||||
</div>
|
</div>
|
||||||
<div className="dual-info-card">
|
|
||||||
<div className="info-label">发起者</div>
|
|
||||||
<div className="info-value">{yearFirstChat.isSentByMe ? reportData.selfName : reportData.friendName}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="dual-message-list">
|
|
||||||
{yearFirstChat.firstThreeMessages.map((msg, idx) => (
|
|
||||||
<div key={idx} className={`dual-message ${msg.isSentByMe ? 'sent' : 'received'}`}>
|
|
||||||
<div className="message-meta">
|
|
||||||
{msg.isSentByMe ? reportData.selfName : reportData.friendName} · {formatFullDate(msg.createTime)}
|
|
||||||
</div>
|
|
||||||
<div className="message-content">{formatMessageContent(msg.content)}</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
) : null}
|
) : null}
|
||||||
|
|
||||||
|
{reportData.heatmap && (
|
||||||
|
<section className="section">
|
||||||
|
<div className="label-text">聊天习惯</div>
|
||||||
|
<h2 className="hero-title">作息规律</h2>
|
||||||
|
{mostActive && (
|
||||||
|
<p className="hero-desc active-time dual-active-time">
|
||||||
|
在 <span className="hl">{mostActive.weekday} {String(mostActive.hour).padStart(2, '0')}:00</span> 最活跃({mostActive.value}条)
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
<ReportHeatmap data={reportData.heatmap} />
|
||||||
|
</section>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{reportData.initiative && (
|
||||||
|
<section className="section">
|
||||||
|
<div className="label-text">主动性</div>
|
||||||
|
<h2 className="hero-title">情感的天平</h2>
|
||||||
|
<div className="initiative-container">
|
||||||
|
<div className="initiative-bar-wrapper">
|
||||||
|
<div className="initiative-side">
|
||||||
|
<div className="avatar-placeholder">
|
||||||
|
{reportData.selfAvatarUrl ? <img src={reportData.selfAvatarUrl} alt="me-avatar" /> : '我'}
|
||||||
|
</div>
|
||||||
|
<div className="count">{reportData.initiative.initiated}次</div>
|
||||||
|
<div className="percent">{initiatedPercent.toFixed(1)}%</div>
|
||||||
|
</div>
|
||||||
|
<div className="initiative-progress">
|
||||||
|
<div className="line-bg" />
|
||||||
|
<div
|
||||||
|
className="initiative-indicator"
|
||||||
|
style={{ left: `${initiatedPercent}%` }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="initiative-side">
|
||||||
|
<div className="avatar-placeholder">
|
||||||
|
{reportData.friendAvatarUrl ? <img src={reportData.friendAvatarUrl} alt="friend-avatar" /> : reportData.friendName.substring(0, 1)}
|
||||||
|
</div>
|
||||||
|
<div className="count">{reportData.initiative.received}次</div>
|
||||||
|
<div className="percent">{receivedPercent.toFixed(1)}%</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="initiative-desc">
|
||||||
|
{reportData.initiative.initiated > reportData.initiative.received ? '每一个话题都是你对TA的在意' : 'TA总是那个率先打破沉默的人'}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{reportData.response && (
|
||||||
|
<section className="section">
|
||||||
|
<div className="label-text">回应速度</div>
|
||||||
|
<h2 className="hero-title">你说,我在</h2>
|
||||||
|
<div className="response-pulse-container">
|
||||||
|
<div className="pulse-visual">
|
||||||
|
<div className="pulse-ripple one" />
|
||||||
|
<div className="pulse-ripple two" />
|
||||||
|
<div className="pulse-ripple three" />
|
||||||
|
|
||||||
|
<div className="pulse-node left">
|
||||||
|
<div className="label">最快回复</div>
|
||||||
|
<div className="value">{reportData.response.fastest}<span>秒</span></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="pulse-hub">
|
||||||
|
<div className="label">平均回复</div>
|
||||||
|
<div className="value">{Math.round(reportData.response.avg / 60)}<span>分</span></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="pulse-node right">
|
||||||
|
<div className="label">最慢回复</div>
|
||||||
|
<div className="value">
|
||||||
|
{reportData.response.slowest > 3600
|
||||||
|
? (reportData.response.slowest / 3600).toFixed(1)
|
||||||
|
: Math.round(reportData.response.slowest / 60)}
|
||||||
|
<span>{reportData.response.slowest > 3600 ? '时' : '分'}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p className="hero-desc response-note">
|
||||||
|
{`在 ${reportData.response.count} 次互动中,平均约 ${responseAvgMinutes} 分钟,最快 ${reportData.response.fastest} 秒。`}
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{reportData.streak && (
|
||||||
|
<section className="section">
|
||||||
|
<div className="label-text">聊天火花</div>
|
||||||
|
<h2 className="hero-title">最长连续聊天</h2>
|
||||||
|
<div className="streak-spark-visual premium">
|
||||||
|
<div className="spark-ambient-glow" />
|
||||||
|
|
||||||
|
<div className="spark-ember one" />
|
||||||
|
<div className="spark-ember two" />
|
||||||
|
<div className="spark-ember three" />
|
||||||
|
<div className="spark-ember four" />
|
||||||
|
|
||||||
|
<div className="spark-core-wrapper">
|
||||||
|
<div className="spark-flame-outer" />
|
||||||
|
<div className="spark-flame-inner" />
|
||||||
|
<div className="spark-core">
|
||||||
|
<div className="spark-days">{reportData.streak.days}</div>
|
||||||
|
<div className="spark-label">DAYS</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="streak-bridge premium">
|
||||||
|
<div className="bridge-date start">
|
||||||
|
<div className="date-orb" />
|
||||||
|
<span>{reportData.streak.startDate}</span>
|
||||||
|
</div>
|
||||||
|
<div className="bridge-line">
|
||||||
|
<div className="line-glow" />
|
||||||
|
<div className="line-string" />
|
||||||
|
</div>
|
||||||
|
<div className="bridge-date end">
|
||||||
|
<span>{reportData.streak.endDate}</span>
|
||||||
|
<div className="date-orb" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
)}
|
||||||
|
|
||||||
<section className="section">
|
<section className="section">
|
||||||
<div className="label-text">常用语</div>
|
<div className="label-text">常用语</div>
|
||||||
<h2 className="hero-title">{yearTitle}常用语</h2>
|
<h2 className="hero-title">{yearTitle}常用语</h2>
|
||||||
<WordCloud words={reportData.topPhrases} />
|
<ReportWordCloud words={reportData.topPhrases} />
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="section">
|
<section className="section">
|
||||||
<div className="label-text">年度统计</div>
|
<div className="label-text">年度统计</div>
|
||||||
<h2 className="hero-title">{yearTitle}数据概览</h2>
|
<h2 className="hero-title">{yearTitle}数据概览</h2>
|
||||||
<div className="dual-stat-grid">
|
<div className="dual-stat-grid">
|
||||||
{statItems.map((item) => {
|
{statItems.slice(0, 2).map((item) => (
|
||||||
const valueText = item.value.toLocaleString()
|
<div key={item.label} className="dual-stat-card">
|
||||||
const isLong = valueText.length > 7
|
<div className="stat-num">{item.value.toLocaleString()}</div>
|
||||||
return (
|
<div className="stat-unit">{item.label}</div>
|
||||||
<div key={item.label} className={`dual-stat-card ${isLong ? 'long' : ''}`}>
|
</div>
|
||||||
<div className="stat-num">{valueText}</div>
|
))}
|
||||||
<div className="stat-unit">{item.label}</div>
|
</div>
|
||||||
</div>
|
<div className="dual-stat-grid bottom">
|
||||||
)
|
{statItems.slice(2).map((item) => (
|
||||||
})}
|
<div key={item.label} className="dual-stat-card">
|
||||||
|
<div className="stat-num small">{item.value.toLocaleString()}</div>
|
||||||
|
<div className="stat-unit">{item.label}</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="emoji-row">
|
<div className="emoji-row">
|
||||||
<div className="emoji-card">
|
<div className="emoji-card">
|
||||||
<div className="emoji-title">我常用的表情</div>
|
<div className="emoji-title">我常用的表情</div>
|
||||||
{myEmojiUrl ? (
|
{myEmojiUrl ? (
|
||||||
<img src={myEmojiUrl} alt="my-emoji" />
|
<img src={myEmojiUrl} alt="my-emoji" onError={(e) => {
|
||||||
) : (
|
(e.target as HTMLImageElement).nextElementSibling?.removeAttribute('style');
|
||||||
<div className="emoji-placeholder">{stats.myTopEmojiMd5 || '暂无'}</div>
|
(e.target as HTMLImageElement).style.display = 'none';
|
||||||
)}
|
}} />
|
||||||
|
) : null}
|
||||||
|
<div className="emoji-placeholder" style={myEmojiUrl ? { display: 'none' } : undefined}>
|
||||||
|
{stats.myTopEmojiMd5 || '暂无'}
|
||||||
|
</div>
|
||||||
|
<div className="emoji-count">{stats.myTopEmojiCount ? `${stats.myTopEmojiCount}次` : '暂无统计'}</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="emoji-card">
|
<div className="emoji-card">
|
||||||
<div className="emoji-title">{reportData.friendName}常用的表情</div>
|
<div className="emoji-title">{reportData.friendName}常用的表情</div>
|
||||||
{friendEmojiUrl ? (
|
{friendEmojiUrl ? (
|
||||||
<img src={friendEmojiUrl} alt="friend-emoji" />
|
<img src={friendEmojiUrl} alt="friend-emoji" onError={(e) => {
|
||||||
) : (
|
(e.target as HTMLImageElement).nextElementSibling?.removeAttribute('style');
|
||||||
<div className="emoji-placeholder">{stats.friendTopEmojiMd5 || '暂无'}</div>
|
(e.target as HTMLImageElement).style.display = 'none';
|
||||||
)}
|
}} />
|
||||||
|
) : null}
|
||||||
|
<div className="emoji-placeholder" style={friendEmojiUrl ? { display: 'none' } : undefined}>
|
||||||
|
{stats.friendTopEmojiMd5 || '暂无'}
|
||||||
|
</div>
|
||||||
|
<div className="emoji-count">{stats.friendTopEmojiCount ? `${stats.friendTopEmojiCount}次` : '暂无统计'}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { useState, useEffect, useCallback, useRef } from 'react'
|
import { useState, useEffect, useCallback, useRef, useMemo } from 'react'
|
||||||
|
import { useLocation } from 'react-router-dom'
|
||||||
import { Search, Download, FolderOpen, RefreshCw, Check, Calendar, FileJson, FileText, Table, Loader2, X, ChevronDown, ChevronLeft, ChevronRight, FileSpreadsheet, Database, FileCode, CheckCircle, XCircle, ExternalLink } from 'lucide-react'
|
import { Search, Download, FolderOpen, RefreshCw, Check, Calendar, FileJson, FileText, Table, Loader2, X, ChevronDown, ChevronLeft, ChevronRight, FileSpreadsheet, Database, FileCode, CheckCircle, XCircle, ExternalLink } from 'lucide-react'
|
||||||
import * as configService from '../services/config'
|
import * as configService from '../services/config'
|
||||||
import './ExportPage.scss'
|
import './ExportPage.scss'
|
||||||
@@ -12,7 +13,7 @@ interface ChatSession {
|
|||||||
}
|
}
|
||||||
|
|
||||||
interface ExportOptions {
|
interface ExportOptions {
|
||||||
format: 'chatlab' | 'chatlab-jsonl' | 'json' | 'html' | 'txt' | 'excel' | 'sql'
|
format: 'chatlab' | 'chatlab-jsonl' | 'json' | 'html' | 'txt' | 'excel' | 'weclone' | 'sql'
|
||||||
dateRange: { start: Date; end: Date } | null
|
dateRange: { start: Date; end: Date } | null
|
||||||
useAllTime: boolean
|
useAllTime: boolean
|
||||||
exportAvatars: boolean
|
exportAvatars: boolean
|
||||||
@@ -38,6 +39,7 @@ interface ExportResult {
|
|||||||
type SessionLayout = 'shared' | 'per-session'
|
type SessionLayout = 'shared' | 'per-session'
|
||||||
|
|
||||||
function ExportPage() {
|
function ExportPage() {
|
||||||
|
const location = useLocation()
|
||||||
const defaultTxtColumns = ['index', 'time', 'senderRole', 'messageType', 'content']
|
const defaultTxtColumns = ['index', 'time', 'senderRole', 'messageType', 'content']
|
||||||
const [sessions, setSessions] = useState<ChatSession[]>([])
|
const [sessions, setSessions] = useState<ChatSession[]>([])
|
||||||
const [filteredSessions, setFilteredSessions] = useState<ChatSession[]>([])
|
const [filteredSessions, setFilteredSessions] = useState<ChatSession[]>([])
|
||||||
@@ -46,14 +48,36 @@ function ExportPage() {
|
|||||||
const [searchKeyword, setSearchKeyword] = useState('')
|
const [searchKeyword, setSearchKeyword] = useState('')
|
||||||
const [exportFolder, setExportFolder] = useState<string>('')
|
const [exportFolder, setExportFolder] = useState<string>('')
|
||||||
const [isExporting, setIsExporting] = useState(false)
|
const [isExporting, setIsExporting] = useState(false)
|
||||||
const [exportProgress, setExportProgress] = useState({ current: 0, total: 0, currentName: '' })
|
const [exportProgress, setExportProgress] = useState({ current: 0, total: 0, currentName: '', phaseLabel: '', phaseProgress: 0, phaseTotal: 0 })
|
||||||
const [exportResult, setExportResult] = useState<ExportResult | null>(null)
|
const [exportResult, setExportResult] = useState<ExportResult | null>(null)
|
||||||
const [showDatePicker, setShowDatePicker] = useState(false)
|
const [showDatePicker, setShowDatePicker] = useState(false)
|
||||||
const [calendarDate, setCalendarDate] = useState(new Date())
|
const [calendarDate, setCalendarDate] = useState(new Date())
|
||||||
const [selectingStart, setSelectingStart] = useState(true)
|
const [selectingStart, setSelectingStart] = useState(true)
|
||||||
const [showMediaLayoutPrompt, setShowMediaLayoutPrompt] = useState(false)
|
const [showMediaLayoutPrompt, setShowMediaLayoutPrompt] = useState(false)
|
||||||
const [showDisplayNameSelect, setShowDisplayNameSelect] = useState(false)
|
const [showDisplayNameSelect, setShowDisplayNameSelect] = useState(false)
|
||||||
|
const [showPreExportDialog, setShowPreExportDialog] = useState(false)
|
||||||
|
const [preExportStats, setPreExportStats] = useState<{
|
||||||
|
totalMessages: number; voiceMessages: number; cachedVoiceCount: number;
|
||||||
|
needTranscribeCount: number; mediaMessages: number; estimatedSeconds: number
|
||||||
|
} | null>(null)
|
||||||
|
const [isLoadingStats, setIsLoadingStats] = useState(false)
|
||||||
|
const [pendingLayout, setPendingLayout] = useState<SessionLayout>('shared')
|
||||||
|
const exportStartTime = useRef<number>(0)
|
||||||
|
const [elapsedSeconds, setElapsedSeconds] = useState(0)
|
||||||
const displayNameDropdownRef = useRef<HTMLDivElement>(null)
|
const displayNameDropdownRef = useRef<HTMLDivElement>(null)
|
||||||
|
const preselectAppliedRef = useRef(false)
|
||||||
|
|
||||||
|
const preselectSessionIds = useMemo(() => {
|
||||||
|
const state = location.state as { preselectSessionIds?: unknown; preselectSessionId?: unknown } | null
|
||||||
|
const rawList = Array.isArray(state?.preselectSessionIds)
|
||||||
|
? state?.preselectSessionIds
|
||||||
|
: (typeof state?.preselectSessionId === 'string' ? [state.preselectSessionId] : [])
|
||||||
|
|
||||||
|
return rawList
|
||||||
|
.filter((item): item is string => typeof item === 'string')
|
||||||
|
.map(item => item.trim())
|
||||||
|
.filter(Boolean)
|
||||||
|
}, [location.state])
|
||||||
|
|
||||||
const [options, setOptions] = useState<ExportOptions>({
|
const [options, setOptions] = useState<ExportOptions>({
|
||||||
format: 'excel',
|
format: 'excel',
|
||||||
@@ -68,7 +92,7 @@ function ExportPage() {
|
|||||||
exportVoices: true,
|
exportVoices: true,
|
||||||
exportVideos: true,
|
exportVideos: true,
|
||||||
exportEmojis: true,
|
exportEmojis: true,
|
||||||
exportVoiceAsText: true,
|
exportVoiceAsText: false,
|
||||||
excelCompactColumns: true,
|
excelCompactColumns: true,
|
||||||
txtColumns: defaultTxtColumns,
|
txtColumns: defaultTxtColumns,
|
||||||
displayNamePreference: 'remark',
|
displayNamePreference: 'remark',
|
||||||
@@ -159,7 +183,7 @@ function ExportPage() {
|
|||||||
useAllTime: rangeDefaults.useAllTime,
|
useAllTime: rangeDefaults.useAllTime,
|
||||||
dateRange: rangeDefaults.dateRange,
|
dateRange: rangeDefaults.dateRange,
|
||||||
exportMedia: savedMedia ?? false,
|
exportMedia: savedMedia ?? false,
|
||||||
exportVoiceAsText: savedVoiceAsText ?? true,
|
exportVoiceAsText: savedVoiceAsText ?? false,
|
||||||
excelCompactColumns: savedExcelCompactColumns ?? true,
|
excelCompactColumns: savedExcelCompactColumns ?? true,
|
||||||
txtColumns,
|
txtColumns,
|
||||||
exportConcurrency: savedConcurrency ?? 2
|
exportConcurrency: savedConcurrency ?? 2
|
||||||
@@ -175,6 +199,24 @@ function ExportPage() {
|
|||||||
loadExportDefaults()
|
loadExportDefaults()
|
||||||
}, [loadSessions, loadExportPath, loadExportDefaults])
|
}, [loadSessions, loadExportPath, loadExportDefaults])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
preselectAppliedRef.current = false
|
||||||
|
}, [location.key, preselectSessionIds])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (preselectAppliedRef.current) return
|
||||||
|
if (sessions.length === 0 || preselectSessionIds.length === 0) return
|
||||||
|
|
||||||
|
const exists = new Set(sessions.map(session => session.username))
|
||||||
|
const matched = preselectSessionIds.filter(id => exists.has(id))
|
||||||
|
preselectAppliedRef.current = true
|
||||||
|
|
||||||
|
if (matched.length > 0) {
|
||||||
|
setSelectedSessions(new Set(matched))
|
||||||
|
setSearchKeyword('')
|
||||||
|
}
|
||||||
|
}, [sessions, preselectSessionIds])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const handleChange = () => {
|
const handleChange = () => {
|
||||||
setSelectedSessions(new Set())
|
setSelectedSessions(new Set())
|
||||||
@@ -189,17 +231,30 @@ function ExportPage() {
|
|||||||
}, [loadSessions])
|
}, [loadSessions])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const removeListener = window.electronAPI.export.onProgress?.((payload: { current: number; total: number; currentSession: string; phase: string }) => {
|
const removeListener = window.electronAPI.export.onProgress?.((payload: { current: number; total: number; currentSession: string; phase: string; phaseProgress?: number; phaseTotal?: number; phaseLabel?: string }) => {
|
||||||
setExportProgress({
|
setExportProgress({
|
||||||
current: payload.current,
|
current: payload.current,
|
||||||
total: payload.total,
|
total: payload.total,
|
||||||
currentName: payload.currentSession
|
currentName: payload.currentSession,
|
||||||
|
phaseLabel: payload.phaseLabel || '',
|
||||||
|
phaseProgress: payload.phaseProgress || 0,
|
||||||
|
phaseTotal: payload.phaseTotal || 0
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
return () => {
|
return () => {
|
||||||
removeListener?.()
|
removeListener?.()
|
||||||
}
|
}
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
// 导出计时器
|
||||||
|
useEffect(() => {
|
||||||
|
if (!isExporting) return
|
||||||
|
const timer = setInterval(() => {
|
||||||
|
setElapsedSeconds(Math.floor((Date.now() - exportStartTime.current) / 1000))
|
||||||
|
}, 1000)
|
||||||
|
return () => clearInterval(timer)
|
||||||
|
}, [isExporting])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const handleClickOutside = (event: MouseEvent) => {
|
const handleClickOutside = (event: MouseEvent) => {
|
||||||
const target = event.target as Node
|
const target = event.target as Node
|
||||||
@@ -260,8 +315,7 @@ function ExportPage() {
|
|||||||
exportImages: true,
|
exportImages: true,
|
||||||
exportVoices: true,
|
exportVoices: true,
|
||||||
exportVideos: true,
|
exportVideos: true,
|
||||||
exportEmojis: true,
|
exportEmojis: true
|
||||||
exportVoiceAsText: true
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return next
|
return next
|
||||||
@@ -278,8 +332,10 @@ function ExportPage() {
|
|||||||
if (selectedSessions.size === 0 || !exportFolder) return
|
if (selectedSessions.size === 0 || !exportFolder) return
|
||||||
|
|
||||||
setIsExporting(true)
|
setIsExporting(true)
|
||||||
setExportProgress({ current: 0, total: selectedSessions.size, currentName: '' })
|
setExportProgress({ current: 0, total: selectedSessions.size, currentName: '', phaseLabel: '', phaseProgress: 0, phaseTotal: 0 })
|
||||||
setExportResult(null)
|
setExportResult(null)
|
||||||
|
exportStartTime.current = Date.now()
|
||||||
|
setElapsedSeconds(0)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const sessionList = Array.from(selectedSessions)
|
const sessionList = Array.from(selectedSessions)
|
||||||
@@ -304,7 +360,7 @@ function ExportPage() {
|
|||||||
} : null
|
} : null
|
||||||
}
|
}
|
||||||
|
|
||||||
if (options.format === 'chatlab' || options.format === 'chatlab-jsonl' || options.format === 'json' || options.format === 'excel' || options.format === 'txt' || options.format === 'html') {
|
if (options.format === 'chatlab' || options.format === 'chatlab-jsonl' || options.format === 'json' || options.format === 'excel' || options.format === 'txt' || options.format === 'html' || options.format === 'weclone') {
|
||||||
const result = await window.electronAPI.export.exportSessions(
|
const result = await window.electronAPI.export.exportSessions(
|
||||||
sessionList,
|
sessionList,
|
||||||
exportFolder,
|
exportFolder,
|
||||||
@@ -322,9 +378,41 @@ function ExportPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const startExport = () => {
|
const startExport = async () => {
|
||||||
if (selectedSessions.size === 0 || !exportFolder) return
|
if (selectedSessions.size === 0 || !exportFolder) return
|
||||||
|
|
||||||
|
// 先获取预估统计
|
||||||
|
setIsLoadingStats(true)
|
||||||
|
setShowPreExportDialog(true)
|
||||||
|
try {
|
||||||
|
const sessionList = Array.from(selectedSessions)
|
||||||
|
const exportOptions = {
|
||||||
|
format: options.format,
|
||||||
|
exportVoiceAsText: options.exportVoiceAsText,
|
||||||
|
exportMedia: options.exportMedia,
|
||||||
|
exportImages: options.exportMedia && options.exportImages,
|
||||||
|
exportVoices: options.exportMedia && options.exportVoices,
|
||||||
|
exportVideos: options.exportMedia && options.exportVideos,
|
||||||
|
exportEmojis: options.exportMedia && options.exportEmojis,
|
||||||
|
dateRange: options.useAllTime ? null : options.dateRange ? {
|
||||||
|
start: Math.floor(options.dateRange.start.getTime() / 1000),
|
||||||
|
end: Math.floor(new Date(options.dateRange.end.getFullYear(), options.dateRange.end.getMonth(), options.dateRange.end.getDate(), 23, 59, 59).getTime() / 1000)
|
||||||
|
} : null
|
||||||
|
}
|
||||||
|
const stats = await window.electronAPI.export.getExportStats(sessionList, exportOptions)
|
||||||
|
setPreExportStats(stats)
|
||||||
|
} catch (e) {
|
||||||
|
console.error('获取导出统计失败:', e)
|
||||||
|
setPreExportStats(null)
|
||||||
|
} finally {
|
||||||
|
setIsLoadingStats(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const confirmExport = () => {
|
||||||
|
setShowPreExportDialog(false)
|
||||||
|
setPreExportStats(null)
|
||||||
|
|
||||||
if (options.exportMedia && selectedSessions.size > 1) {
|
if (options.exportMedia && selectedSessions.size > 1) {
|
||||||
setShowMediaLayoutPrompt(true)
|
setShowMediaLayoutPrompt(true)
|
||||||
return
|
return
|
||||||
@@ -425,6 +513,7 @@ function ExportPage() {
|
|||||||
{ value: 'html', label: 'HTML', icon: FileText, desc: '网页格式,可直接浏览' },
|
{ value: 'html', label: 'HTML', icon: FileText, desc: '网页格式,可直接浏览' },
|
||||||
{ value: 'txt', label: 'TXT', icon: Table, desc: '纯文本,通用格式' },
|
{ value: 'txt', label: 'TXT', icon: Table, desc: '纯文本,通用格式' },
|
||||||
{ value: 'excel', label: 'Excel', icon: FileSpreadsheet, desc: '电子表格,适合统计分析' },
|
{ value: 'excel', label: 'Excel', icon: FileSpreadsheet, desc: '电子表格,适合统计分析' },
|
||||||
|
{ value: 'weclone', label: 'WeClone CSV', icon: Table, desc: 'WeClone 兼容字段格式(CSV)' },
|
||||||
{ value: 'sql', label: 'PostgreSQL', icon: Database, desc: '数据库脚本,便于导入到数据库' }
|
{ value: 'sql', label: 'PostgreSQL', icon: Database, desc: '数据库脚本,便于导入到数据库' }
|
||||||
]
|
]
|
||||||
const displayNameOptions = [
|
const displayNameOptions = [
|
||||||
@@ -814,6 +903,71 @@ function ExportPage() {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{/* 导出前预估弹窗 */}
|
||||||
|
{showPreExportDialog && (
|
||||||
|
<div className="export-overlay">
|
||||||
|
<div className="export-layout-modal" onClick={e => e.stopPropagation()}>
|
||||||
|
<h3>导出预估</h3>
|
||||||
|
{isLoadingStats ? (
|
||||||
|
<div style={{ display: 'flex', alignItems: 'center', gap: 8, padding: '24px 0', justifyContent: 'center' }}>
|
||||||
|
<Loader2 size={20} className="spin" />
|
||||||
|
<span style={{ fontSize: 14, color: 'var(--text-secondary)' }}>正在统计消息...</span>
|
||||||
|
</div>
|
||||||
|
) : preExportStats ? (
|
||||||
|
<div style={{ padding: '12px 0' }}>
|
||||||
|
<div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '12px 24px', fontSize: 14 }}>
|
||||||
|
<div>
|
||||||
|
<span style={{ color: 'var(--text-secondary)' }}>会话数</span>
|
||||||
|
<div style={{ fontWeight: 600, fontSize: 18, marginTop: 2 }}>{selectedSessions.size}</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span style={{ color: 'var(--text-secondary)' }}>总消息</span>
|
||||||
|
<div style={{ fontWeight: 600, fontSize: 18, marginTop: 2 }}>{preExportStats.totalMessages.toLocaleString()}</div>
|
||||||
|
</div>
|
||||||
|
{options.exportVoiceAsText && preExportStats.voiceMessages > 0 && (
|
||||||
|
<>
|
||||||
|
<div>
|
||||||
|
<span style={{ color: 'var(--text-secondary)' }}>语音消息</span>
|
||||||
|
<div style={{ fontWeight: 600, fontSize: 18, marginTop: 2 }}>{preExportStats.voiceMessages}</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span style={{ color: 'var(--text-secondary)' }}>已有缓存</span>
|
||||||
|
<div style={{ fontWeight: 600, fontSize: 18, marginTop: 2, color: 'var(--primary)' }}>{preExportStats.cachedVoiceCount}</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
{options.exportVoiceAsText && preExportStats.needTranscribeCount > 0 && (
|
||||||
|
<div style={{ marginTop: 16, padding: '10px 12px', background: 'var(--bg-tertiary)', borderRadius: 8, fontSize: 13 }}>
|
||||||
|
<span style={{ color: 'var(--text-warning, #e6a23c)' }}>⚠</span>
|
||||||
|
{' '}需要转写 <b>{preExportStats.needTranscribeCount}</b> 条语音,预计耗时约 <b>{preExportStats.estimatedSeconds > 60
|
||||||
|
? `${Math.round(preExportStats.estimatedSeconds / 60)} 分钟`
|
||||||
|
: `${preExportStats.estimatedSeconds} 秒`
|
||||||
|
}</b>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{options.exportVoiceAsText && preExportStats.voiceMessages > 0 && preExportStats.needTranscribeCount === 0 && (
|
||||||
|
<div style={{ marginTop: 16, padding: '10px 12px', background: 'var(--bg-tertiary)', borderRadius: 8, fontSize: 13 }}>
|
||||||
|
<span style={{ color: 'var(--text-success, #67c23a)' }}>✓</span>
|
||||||
|
{' '}所有 {preExportStats.voiceMessages} 条语音已有转写缓存,无需重新转写
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<p style={{ fontSize: 14, color: 'var(--text-secondary)', padding: '16px 0' }}>统计信息获取失败,仍可继续导出</p>
|
||||||
|
)}
|
||||||
|
<div className="layout-actions" style={{ display: 'flex', gap: 8, justifyContent: 'flex-end', marginTop: 8 }}>
|
||||||
|
<button className="layout-cancel-btn" onClick={() => { setShowPreExportDialog(false); setPreExportStats(null) }}>
|
||||||
|
取消
|
||||||
|
</button>
|
||||||
|
<button className="layout-option-btn primary" onClick={confirmExport} disabled={isLoadingStats}>
|
||||||
|
<span className="layout-title">开始导出</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* 导出进度弹窗 */}
|
{/* 导出进度弹窗 */}
|
||||||
{isExporting && (
|
{isExporting && (
|
||||||
<div className="export-overlay">
|
<div className="export-overlay">
|
||||||
@@ -823,13 +977,31 @@ function ExportPage() {
|
|||||||
</div>
|
</div>
|
||||||
<h3>正在导出</h3>
|
<h3>正在导出</h3>
|
||||||
<p className="progress-text">{exportProgress.currentName}</p>
|
<p className="progress-text">{exportProgress.currentName}</p>
|
||||||
|
{exportProgress.phaseLabel && (
|
||||||
|
<p className="progress-phase-label" style={{ fontSize: 13, color: 'var(--text-secondary)', margin: '4px 0 8px' }}>
|
||||||
|
{exportProgress.phaseLabel}
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
{exportProgress.phaseTotal > 0 && (
|
||||||
|
<div className="progress-bar" style={{ marginBottom: 8 }}>
|
||||||
|
<div
|
||||||
|
className="progress-fill"
|
||||||
|
style={{ width: `${(exportProgress.phaseProgress / exportProgress.phaseTotal) * 100}%`, background: 'var(--primary-light, #79bbff)' }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
<div className="progress-bar">
|
<div className="progress-bar">
|
||||||
<div
|
<div
|
||||||
className="progress-fill"
|
className="progress-fill"
|
||||||
style={{ width: `${(exportProgress.current / exportProgress.total) * 100}%` }}
|
style={{ width: `${exportProgress.total > 0 ? (exportProgress.current / exportProgress.total) * 100 : 0}%` }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<p className="progress-count">{exportProgress.current} / {exportProgress.total}</p>
|
<p className="progress-count">
|
||||||
|
{exportProgress.current} / {exportProgress.total} 个会话
|
||||||
|
<span style={{ marginLeft: 12, fontSize: 12, color: 'var(--text-secondary)' }}>
|
||||||
|
{elapsedSeconds > 0 && `已用 ${elapsedSeconds >= 60 ? `${Math.floor(elapsedSeconds / 60)}分${elapsedSeconds % 60}秒` : `${elapsedSeconds}秒`}`}
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { useState, useEffect, useRef, useCallback } from 'react'
|
import { useState, useEffect, useRef, useCallback, useMemo } from 'react'
|
||||||
|
import { useLocation } from 'react-router-dom'
|
||||||
import { Users, BarChart3, Clock, Image, Loader2, RefreshCw, User, Medal, Search, X, ChevronLeft, Copy, Check, Download } from 'lucide-react'
|
import { Users, BarChart3, Clock, Image, Loader2, RefreshCw, User, Medal, Search, X, ChevronLeft, Copy, Check, Download } from 'lucide-react'
|
||||||
import { Avatar } from '../components/Avatar'
|
import { Avatar } from '../components/Avatar'
|
||||||
import ReactECharts from 'echarts-for-react'
|
import ReactECharts from 'echarts-for-react'
|
||||||
@@ -30,6 +31,7 @@ interface GroupMessageRank {
|
|||||||
type AnalysisFunction = 'members' | 'ranking' | 'activeHours' | 'mediaStats'
|
type AnalysisFunction = 'members' | 'ranking' | 'activeHours' | 'mediaStats'
|
||||||
|
|
||||||
function GroupAnalyticsPage() {
|
function GroupAnalyticsPage() {
|
||||||
|
const location = useLocation()
|
||||||
const [groups, setGroups] = useState<GroupChatInfo[]>([])
|
const [groups, setGroups] = useState<GroupChatInfo[]>([])
|
||||||
const [filteredGroups, setFilteredGroups] = useState<GroupChatInfo[]>([])
|
const [filteredGroups, setFilteredGroups] = useState<GroupChatInfo[]>([])
|
||||||
const [isLoading, setIsLoading] = useState(true)
|
const [isLoading, setIsLoading] = useState(true)
|
||||||
@@ -58,11 +60,28 @@ function GroupAnalyticsPage() {
|
|||||||
const [sidebarWidth, setSidebarWidth] = useState(300)
|
const [sidebarWidth, setSidebarWidth] = useState(300)
|
||||||
const [isResizing, setIsResizing] = useState(false)
|
const [isResizing, setIsResizing] = useState(false)
|
||||||
const containerRef = useRef<HTMLDivElement>(null)
|
const containerRef = useRef<HTMLDivElement>(null)
|
||||||
|
const preselectAppliedRef = useRef(false)
|
||||||
|
|
||||||
|
const preselectGroupIds = useMemo(() => {
|
||||||
|
const state = location.state as { preselectGroupIds?: unknown; preselectGroupId?: unknown } | null
|
||||||
|
const rawList = Array.isArray(state?.preselectGroupIds)
|
||||||
|
? state.preselectGroupIds
|
||||||
|
: (typeof state?.preselectGroupId === 'string' ? [state.preselectGroupId] : [])
|
||||||
|
|
||||||
|
return rawList
|
||||||
|
.filter((item): item is string => typeof item === 'string')
|
||||||
|
.map(item => item.trim())
|
||||||
|
.filter(Boolean)
|
||||||
|
}, [location.state])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
loadGroups()
|
loadGroups()
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
preselectAppliedRef.current = false
|
||||||
|
}, [location.key, preselectGroupIds])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (searchQuery) {
|
if (searchQuery) {
|
||||||
setFilteredGroups(groups.filter(g => g.displayName.toLowerCase().includes(searchQuery.toLowerCase())))
|
setFilteredGroups(groups.filter(g => g.displayName.toLowerCase().includes(searchQuery.toLowerCase())))
|
||||||
@@ -71,6 +90,20 @@ function GroupAnalyticsPage() {
|
|||||||
}
|
}
|
||||||
}, [searchQuery, groups])
|
}, [searchQuery, groups])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (preselectAppliedRef.current) return
|
||||||
|
if (groups.length === 0 || preselectGroupIds.length === 0) return
|
||||||
|
|
||||||
|
const matchedGroup = groups.find(group => preselectGroupIds.includes(group.username))
|
||||||
|
preselectAppliedRef.current = true
|
||||||
|
|
||||||
|
if (matchedGroup) {
|
||||||
|
setSelectedGroup(matchedGroup)
|
||||||
|
setSelectedFunction(null)
|
||||||
|
setSearchQuery('')
|
||||||
|
}
|
||||||
|
}, [groups, preselectGroupIds])
|
||||||
|
|
||||||
// 拖动调整宽度
|
// 拖动调整宽度
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const handleMouseMove = (e: MouseEvent) => {
|
const handleMouseMove = (e: MouseEvent) => {
|
||||||
|
|||||||
@@ -651,14 +651,80 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
margin-top: 6px;
|
margin-top: 10px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: var(--bg-primary);
|
||||||
|
border-radius: 12px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
transition: all 0.2s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: var(--text-tertiary);
|
||||||
|
background: color-mix(in srgb, var(--bg-primary) 98%, var(--primary));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.log-status {
|
.log-status {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
color: var(--text-secondary);
|
color: var(--text-secondary);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Premium Switch Style */
|
||||||
|
.switch {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
width: 44px;
|
||||||
|
height: 24px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
input {
|
||||||
|
opacity: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
|
||||||
|
&:checked+.switch-slider {
|
||||||
|
background-color: var(--primary);
|
||||||
|
box-shadow: 0 0 8px color-mix(in srgb, var(--primary) 30%, transparent);
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
transform: translateX(18px);
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus+.switch-slider {
|
||||||
|
box-shadow: 0 0 1px var(--primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch-slider {
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: var(--bg-tertiary);
|
||||||
|
transition: .4s cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
|
border-radius: 24px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
content: "";
|
||||||
|
height: 18px;
|
||||||
|
width: 18px;
|
||||||
|
left: 2px;
|
||||||
|
bottom: 2px;
|
||||||
|
background-color: var(--text-tertiary);
|
||||||
|
transition: .4s cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.language-checkboxes {
|
.language-checkboxes {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
@@ -1125,6 +1191,109 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 通用弹窗覆盖层
|
||||||
|
.modal-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 1000;
|
||||||
|
animation: fadeIn 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
// API 警告弹窗
|
||||||
|
.api-warning-modal {
|
||||||
|
width: 420px;
|
||||||
|
background: var(--bg-primary);
|
||||||
|
border-radius: 16px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.2);
|
||||||
|
animation: slideUp 0.25s ease;
|
||||||
|
|
||||||
|
.modal-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
padding: 20px 24px;
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
svg {
|
||||||
|
color: var(--warning, #f59e0b);
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-body {
|
||||||
|
padding: 20px 24px;
|
||||||
|
|
||||||
|
.warning-text {
|
||||||
|
margin: 0 0 16px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
|
||||||
|
.warning-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 8px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
.bullet {
|
||||||
|
color: var(--warning, #f59e0b);
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 10px;
|
||||||
|
padding: 16px 24px;
|
||||||
|
border-top: 1px solid var(--border-color);
|
||||||
|
background: var(--bg-secondary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideUp {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(10px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 协议弹窗
|
// 协议弹窗
|
||||||
.agreement-overlay {
|
.agreement-overlay {
|
||||||
@@ -1555,4 +1724,382 @@
|
|||||||
min-height: 100px;
|
min-height: 100px;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: var(--text-tertiary);
|
color: var(--text-tertiary);
|
||||||
|
|
||||||
|
// Add styles for the new model cards
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-control.vertical.has-border {
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 16px;
|
||||||
|
background: var(--bg-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.model-status-card {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.model-info {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
|
||||||
|
.model-name {
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
margin-bottom: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.model-path {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
|
||||||
|
.status-indicator {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&.success {
|
||||||
|
color: #10b981;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.warning {
|
||||||
|
color: #f59e0b;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.path-text {
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
font-family: monospace;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.model-actions {
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
.btn-download {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 8px 16px;
|
||||||
|
background: var(--primary);
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
border-radius: 999px;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
|
box-shadow: 0 4px 12px color-mix(in srgb, var(--primary) 25%, transparent);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--primary-hover);
|
||||||
|
transform: translateY(-1px);
|
||||||
|
box-shadow: 0 6px 16px color-mix(in srgb, var(--primary) 35%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.download-status {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 6px;
|
||||||
|
width: 280px;
|
||||||
|
|
||||||
|
.status-header,
|
||||||
|
.progress-info {
|
||||||
|
// specific layout class
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center; // Align vertically
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.percent {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--primary);
|
||||||
|
font-family: 'Inter', system-ui, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.metrics,
|
||||||
|
.details {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
font-family: var(--font-mono);
|
||||||
|
|
||||||
|
.speed {
|
||||||
|
color: var(--text-primary);
|
||||||
|
font-weight: 600;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-bar-mini {
|
||||||
|
width: 100%;
|
||||||
|
height: 6px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border-radius: 3px;
|
||||||
|
overflow: hidden;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
.fill {
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(90deg, var(--primary) 0%, color-mix(in srgb, var(--primary) 80%, white) 100%);
|
||||||
|
border-radius: 3px;
|
||||||
|
transition: width 0.3s ease;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: linear-gradient(90deg,
|
||||||
|
transparent,
|
||||||
|
rgba(255, 255, 255, 0.2),
|
||||||
|
transparent);
|
||||||
|
animation: progress-shimmer 2s infinite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.spin {
|
||||||
|
animation: spin 1s linear infinite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes progress-shimmer {
|
||||||
|
0% {
|
||||||
|
transform: translateX(-100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateX(100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sub-setting {
|
||||||
|
margin-top: 16px;
|
||||||
|
padding-top: 16px;
|
||||||
|
border-top: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
.sub-label {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.path-selector {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
|
||||||
|
input {
|
||||||
|
margin-bottom: 0 !important;
|
||||||
|
flex: 1;
|
||||||
|
font-family: monospace;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-icon {
|
||||||
|
width: 38px;
|
||||||
|
height: 38px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 999px; // Circle
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
background: var(--bg-primary);
|
||||||
|
color: var(--text-secondary);
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: var(--text-primary);
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.danger:hover {
|
||||||
|
color: var(--danger);
|
||||||
|
background: rgba(220, 38, 38, 0.1);
|
||||||
|
border-color: rgba(220, 38, 38, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
from {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// API 地址显示样式
|
||||||
|
.api-url-display {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
margin-top: 8px;
|
||||||
|
|
||||||
|
input {
|
||||||
|
flex: 1;
|
||||||
|
font-family: 'SF Mono', 'Consolas', monospace;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// API 服务设置样式
|
||||||
|
.status-badge {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 4px 10px;
|
||||||
|
border-radius: 12px;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&.running {
|
||||||
|
background: rgba(34, 197, 94, 0.15);
|
||||||
|
color: #22c55e;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.stopped {
|
||||||
|
background: rgba(156, 163, 175, 0.15);
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-url {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 8px 14px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border-radius: 6px;
|
||||||
|
font-family: 'SF Mono', 'Consolas', monospace;
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-primary);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-docs {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-item {
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
.api-endpoint {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
margin-bottom: 6px;
|
||||||
|
|
||||||
|
.method {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 2px 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 600;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
&.get {
|
||||||
|
background: rgba(34, 197, 94, 0.15);
|
||||||
|
color: #22c55e;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.post {
|
||||||
|
background: rgba(59, 130, 246, 0.15);
|
||||||
|
color: #3b82f6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
font-family: 'SF Mono', 'Consolas', monospace;
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-desc {
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
margin: 0 0 8px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.api-params {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 6px;
|
||||||
|
|
||||||
|
.param {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 2px 8px;
|
||||||
|
background: var(--bg-secondary);
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 11px;
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
|
||||||
|
code {
|
||||||
|
color: var(--primary);
|
||||||
|
font-family: 'SF Mono', 'Consolas', monospace;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-block {
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
overflow-x: auto;
|
||||||
|
|
||||||
|
code {
|
||||||
|
font-family: 'SF Mono', 'Consolas', monospace;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-primary);
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-sm {
|
||||||
|
padding: 4px 10px !important;
|
||||||
|
font-size: 12px !important;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@@ -9,20 +9,21 @@ import {
|
|||||||
Eye, EyeOff, FolderSearch, FolderOpen, Search, Copy,
|
Eye, EyeOff, FolderSearch, FolderOpen, Search, Copy,
|
||||||
RotateCcw, Trash2, Plug, Check, Sun, Moon,
|
RotateCcw, Trash2, Plug, Check, Sun, Moon,
|
||||||
Palette, Database, Download, HardDrive, Info, RefreshCw, ChevronDown, Mic,
|
Palette, Database, Download, HardDrive, Info, RefreshCw, ChevronDown, Mic,
|
||||||
ShieldCheck, Fingerprint, Lock, KeyRound, Bell
|
ShieldCheck, Fingerprint, Lock, KeyRound, Bell, Globe
|
||||||
} from 'lucide-react'
|
} from 'lucide-react'
|
||||||
import { Avatar } from '../components/Avatar'
|
import { Avatar } from '../components/Avatar'
|
||||||
import './SettingsPage.scss'
|
import './SettingsPage.scss'
|
||||||
|
|
||||||
type SettingsTab = 'appearance' | 'notification' | 'database' | 'whisper' | 'export' | 'cache' | 'security' | 'about'
|
type SettingsTab = 'appearance' | 'notification' | 'database' | 'models' | 'export' | 'cache' | 'api' | 'security' | 'about'
|
||||||
|
|
||||||
const tabs: { id: SettingsTab; label: string; icon: React.ElementType }[] = [
|
const tabs: { id: SettingsTab; label: string; icon: React.ElementType }[] = [
|
||||||
{ id: 'appearance', label: '外观', icon: Palette },
|
{ id: 'appearance', label: '外观', icon: Palette },
|
||||||
{ id: 'notification', label: '通知', icon: Bell },
|
{ id: 'notification', label: '通知', icon: Bell },
|
||||||
{ id: 'database', label: '数据库连接', icon: Database },
|
{ id: 'database', label: '数据库连接', icon: Database },
|
||||||
{ id: 'whisper', label: '语音识别模型', icon: Mic },
|
{ id: 'models', label: '模型管理', icon: Mic },
|
||||||
{ id: 'export', label: '导出', icon: Download },
|
{ id: 'export', label: '导出', icon: Download },
|
||||||
{ id: 'cache', label: '缓存', icon: HardDrive },
|
{ id: 'cache', label: '缓存', icon: HardDrive },
|
||||||
|
{ id: 'api', label: 'API 服务', icon: Globe },
|
||||||
{ id: 'security', label: '安全', icon: ShieldCheck },
|
{ id: 'security', label: '安全', icon: ShieldCheck },
|
||||||
{ id: 'about', label: '关于', icon: Info }
|
{ id: 'about', label: '关于', icon: Info }
|
||||||
]
|
]
|
||||||
@@ -76,13 +77,27 @@ function SettingsPage() {
|
|||||||
const [whisperModelDir, setWhisperModelDir] = useState('')
|
const [whisperModelDir, setWhisperModelDir] = useState('')
|
||||||
const [isWhisperDownloading, setIsWhisperDownloading] = useState(false)
|
const [isWhisperDownloading, setIsWhisperDownloading] = useState(false)
|
||||||
const [whisperDownloadProgress, setWhisperDownloadProgress] = useState(0)
|
const [whisperDownloadProgress, setWhisperDownloadProgress] = useState(0)
|
||||||
|
const [whisperProgressData, setWhisperProgressData] = useState<{ downloaded: number; total: number; speed: number }>({ downloaded: 0, total: 0, speed: 0 })
|
||||||
const [whisperModelStatus, setWhisperModelStatus] = useState<{ exists: boolean; modelPath?: string; tokensPath?: string } | null>(null)
|
const [whisperModelStatus, setWhisperModelStatus] = useState<{ exists: boolean; modelPath?: string; tokensPath?: string } | null>(null)
|
||||||
|
const [llamaModelStatus, setLlamaModelStatus] = useState<{ exists: boolean; path?: string; size?: number } | null>(null)
|
||||||
|
const [isLlamaDownloading, setIsLlamaDownloading] = useState(false)
|
||||||
|
const [llamaDownloadProgress, setLlamaDownloadProgress] = useState(0)
|
||||||
|
const [llamaProgressData, setLlamaProgressData] = useState<{ downloaded: number; total: number; speed: number }>({ downloaded: 0, total: 0, speed: 0 })
|
||||||
|
|
||||||
|
const formatBytes = (bytes: number) => {
|
||||||
|
if (bytes === 0) return '0 B';
|
||||||
|
const k = 1024;
|
||||||
|
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
|
||||||
|
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||||
|
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
|
||||||
|
};
|
||||||
|
|
||||||
const [autoTranscribeVoice, setAutoTranscribeVoice] = useState(false)
|
const [autoTranscribeVoice, setAutoTranscribeVoice] = useState(false)
|
||||||
const [transcribeLanguages, setTranscribeLanguages] = useState<string[]>(['zh'])
|
const [transcribeLanguages, setTranscribeLanguages] = useState<string[]>(['zh'])
|
||||||
const [exportDefaultFormat, setExportDefaultFormat] = useState('excel')
|
const [exportDefaultFormat, setExportDefaultFormat] = useState('excel')
|
||||||
const [exportDefaultDateRange, setExportDefaultDateRange] = useState('today')
|
const [exportDefaultDateRange, setExportDefaultDateRange] = useState('today')
|
||||||
const [exportDefaultMedia, setExportDefaultMedia] = useState(false)
|
const [exportDefaultMedia, setExportDefaultMedia] = useState(false)
|
||||||
const [exportDefaultVoiceAsText, setExportDefaultVoiceAsText] = useState(true)
|
const [exportDefaultVoiceAsText, setExportDefaultVoiceAsText] = useState(false)
|
||||||
const [exportDefaultExcelCompactColumns, setExportDefaultExcelCompactColumns] = useState(true)
|
const [exportDefaultExcelCompactColumns, setExportDefaultExcelCompactColumns] = useState(true)
|
||||||
const [exportDefaultConcurrency, setExportDefaultConcurrency] = useState(2)
|
const [exportDefaultConcurrency, setExportDefaultConcurrency] = useState(2)
|
||||||
|
|
||||||
@@ -123,6 +138,13 @@ function SettingsPage() {
|
|||||||
const [confirmPassword, setConfirmPassword] = useState('')
|
const [confirmPassword, setConfirmPassword] = useState('')
|
||||||
const [isSettingHello, setIsSettingHello] = useState(false)
|
const [isSettingHello, setIsSettingHello] = useState(false)
|
||||||
|
|
||||||
|
// HTTP API 设置 state
|
||||||
|
const [httpApiEnabled, setHttpApiEnabled] = useState(false)
|
||||||
|
const [httpApiPort, setHttpApiPort] = useState(5031)
|
||||||
|
const [httpApiRunning, setHttpApiRunning] = useState(false)
|
||||||
|
const [isTogglingApi, setIsTogglingApi] = useState(false)
|
||||||
|
const [showApiWarning, setShowApiWarning] = useState(false)
|
||||||
|
|
||||||
const isClearingCache = isClearingAnalyticsCache || isClearingImageCache || isClearingAllCache
|
const isClearingCache = isClearingAnalyticsCache || isClearingImageCache || isClearingAllCache
|
||||||
|
|
||||||
// 检查 Hello 可用性
|
// 检查 Hello 可用性
|
||||||
@@ -132,6 +154,22 @@ function SettingsPage() {
|
|||||||
}
|
}
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
// 检查 HTTP API 服务状态
|
||||||
|
useEffect(() => {
|
||||||
|
const checkApiStatus = async () => {
|
||||||
|
try {
|
||||||
|
const status = await window.electronAPI.http.status()
|
||||||
|
setHttpApiRunning(status.running)
|
||||||
|
if (status.port) {
|
||||||
|
setHttpApiPort(status.port)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('检查 API 状态失败:', e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
checkApiStatus()
|
||||||
|
}, [])
|
||||||
|
|
||||||
async function sha256(message: string) {
|
async function sha256(message: string) {
|
||||||
const msgBuffer = new TextEncoder().encode(message)
|
const msgBuffer = new TextEncoder().encode(message)
|
||||||
const hashBuffer = await crypto.subtle.digest('SHA-256', msgBuffer)
|
const hashBuffer = await crypto.subtle.digest('SHA-256', msgBuffer)
|
||||||
@@ -255,7 +293,7 @@ function SettingsPage() {
|
|||||||
setExportDefaultFormat(savedExportDefaultFormat || 'excel')
|
setExportDefaultFormat(savedExportDefaultFormat || 'excel')
|
||||||
setExportDefaultDateRange(savedExportDefaultDateRange || 'today')
|
setExportDefaultDateRange(savedExportDefaultDateRange || 'today')
|
||||||
setExportDefaultMedia(savedExportDefaultMedia ?? false)
|
setExportDefaultMedia(savedExportDefaultMedia ?? false)
|
||||||
setExportDefaultVoiceAsText(savedExportDefaultVoiceAsText ?? true)
|
setExportDefaultVoiceAsText(savedExportDefaultVoiceAsText ?? false)
|
||||||
setExportDefaultExcelCompactColumns(savedExportDefaultExcelCompactColumns ?? true)
|
setExportDefaultExcelCompactColumns(savedExportDefaultExcelCompactColumns ?? true)
|
||||||
setExportDefaultConcurrency(savedExportDefaultConcurrency ?? 2)
|
setExportDefaultConcurrency(savedExportDefaultConcurrency ?? 2)
|
||||||
|
|
||||||
@@ -273,6 +311,9 @@ function SettingsPage() {
|
|||||||
|
|
||||||
|
|
||||||
if (savedWhisperModelDir) setWhisperModelDir(savedWhisperModelDir)
|
if (savedWhisperModelDir) setWhisperModelDir(savedWhisperModelDir)
|
||||||
|
|
||||||
|
// Load Llama status after config
|
||||||
|
void checkLlamaModelStatus()
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
console.error('加载配置失败:', e)
|
console.error('加载配置失败:', e)
|
||||||
}
|
}
|
||||||
@@ -313,7 +354,12 @@ function SettingsPage() {
|
|||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const removeListener = window.electronAPI.whisper?.onDownloadProgress?.((payload: { modelName: string; downloadedBytes: number; totalBytes?: number; percent?: number }) => {
|
const removeListener = window.electronAPI.whisper?.onDownloadProgress?.((payload: { modelName: string; downloadedBytes: number; totalBytes?: number; percent?: number; speed?: number }) => {
|
||||||
|
setWhisperProgressData({
|
||||||
|
downloaded: payload.downloadedBytes,
|
||||||
|
total: payload.totalBytes || 0,
|
||||||
|
speed: payload.speed || 0
|
||||||
|
})
|
||||||
if (typeof payload.percent === 'number') {
|
if (typeof payload.percent === 'number') {
|
||||||
setWhisperDownloadProgress(payload.percent)
|
setWhisperDownloadProgress(payload.percent)
|
||||||
}
|
}
|
||||||
@@ -582,6 +628,7 @@ function SettingsPage() {
|
|||||||
setWhisperModelDir(dir)
|
setWhisperModelDir(dir)
|
||||||
await configService.setWhisperModelDir(dir)
|
await configService.setWhisperModelDir(dir)
|
||||||
showMessage('已选择 Whisper 模型目录', true)
|
showMessage('已选择 Whisper 模型目录', true)
|
||||||
|
await checkLlamaModelStatus()
|
||||||
}
|
}
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
showMessage('选择目录失败', false)
|
showMessage('选择目录失败', false)
|
||||||
@@ -617,6 +664,68 @@ function SettingsPage() {
|
|||||||
const handleResetWhisperModelDir = async () => {
|
const handleResetWhisperModelDir = async () => {
|
||||||
setWhisperModelDir('')
|
setWhisperModelDir('')
|
||||||
await configService.setWhisperModelDir('')
|
await configService.setWhisperModelDir('')
|
||||||
|
await checkLlamaModelStatus()
|
||||||
|
}
|
||||||
|
|
||||||
|
const checkLlamaModelStatus = async () => {
|
||||||
|
try {
|
||||||
|
// @ts-ignore
|
||||||
|
const modelsPath = await window.electronAPI.llama?.getModelsPath()
|
||||||
|
if (!modelsPath) return
|
||||||
|
const modelName = "Qwen3-4B-Q4_K_M.gguf" // Hardcoded preset for now
|
||||||
|
const fullPath = `${modelsPath}\\${modelName}`
|
||||||
|
// @ts-ignore
|
||||||
|
const status = await window.electronAPI.llama?.getModelStatus(fullPath)
|
||||||
|
if (status) {
|
||||||
|
setLlamaModelStatus({
|
||||||
|
exists: status.exists,
|
||||||
|
path: status.path,
|
||||||
|
size: status.size
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error("Check llama model status failed", e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const handleLlamaProgress = (payload: { downloaded: number; total: number; speed: number }) => {
|
||||||
|
setLlamaProgressData(payload)
|
||||||
|
if (payload.total > 0) {
|
||||||
|
setLlamaDownloadProgress((payload.downloaded / payload.total) * 100)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// @ts-ignore
|
||||||
|
const removeListener = window.electronAPI.llama?.onDownloadProgress(handleLlamaProgress)
|
||||||
|
return () => {
|
||||||
|
if (typeof removeListener === 'function') removeListener()
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const handleDownloadLlamaModel = async () => {
|
||||||
|
if (isLlamaDownloading) return
|
||||||
|
setIsLlamaDownloading(true)
|
||||||
|
setLlamaDownloadProgress(0)
|
||||||
|
try {
|
||||||
|
const modelUrl = "https://www.modelscope.cn/models/Qwen/Qwen3-4B-GGUF/resolve/master/Qwen3-4B-Q4_K_M.gguf"
|
||||||
|
// @ts-ignore
|
||||||
|
const modelsPath = await window.electronAPI.llama?.getModelsPath()
|
||||||
|
const modelName = "Qwen3-4B-Q4_K_M.gguf"
|
||||||
|
const fullPath = `${modelsPath}\\${modelName}`
|
||||||
|
|
||||||
|
// @ts-ignore
|
||||||
|
const result = await window.electronAPI.llama?.downloadModel(modelUrl, fullPath)
|
||||||
|
if (result?.success) {
|
||||||
|
showMessage('Qwen3 模型下载完成', true)
|
||||||
|
await checkLlamaModelStatus()
|
||||||
|
} else {
|
||||||
|
showMessage(`模型下载失败: ${result?.error || '未知错误'}`, false)
|
||||||
|
}
|
||||||
|
} catch (e: any) {
|
||||||
|
showMessage(`模型下载失败: ${e}`, false)
|
||||||
|
} finally {
|
||||||
|
setIsLlamaDownloading(false)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleAutoGetDbKey = async () => {
|
const handleAutoGetDbKey = async () => {
|
||||||
@@ -1309,113 +1418,142 @@ function SettingsPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
const renderWhisperTab = () => (
|
const renderModelsTab = () => (
|
||||||
<div className="tab-content">
|
<div className="tab-content">
|
||||||
<div className="form-group">
|
<div className="form-group">
|
||||||
<label>自动语音转文字</label>
|
<label>模型管理</label>
|
||||||
<span className="form-hint">语音解密后自动转写为文字(需下载模型)</span>
|
<span className="form-hint">管理语音识别和 AI 对话模型</span>
|
||||||
<div className="log-toggle-line">
|
|
||||||
<span className="log-status">{autoTranscribeVoice ? '已开启' : '已关闭'}</span>
|
|
||||||
<label className="switch" htmlFor="auto-transcribe-toggle">
|
|
||||||
<input
|
|
||||||
id="auto-transcribe-toggle"
|
|
||||||
className="switch-input"
|
|
||||||
type="checkbox"
|
|
||||||
checked={autoTranscribeVoice}
|
|
||||||
onChange={async (e) => {
|
|
||||||
const enabled = e.target.checked
|
|
||||||
setAutoTranscribeVoice(enabled)
|
|
||||||
await configService.setAutoTranscribeVoice(enabled)
|
|
||||||
showMessage(enabled ? '已开启自动转文字' : '已关闭自动转文字', true)
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<span className="switch-slider" />
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="form-group">
|
<div className="form-group">
|
||||||
<label>支持的语言</label>
|
<label>语音识别模型 (Whisper)</label>
|
||||||
<span className="form-hint">选择需要识别的语言(至少选择一种)</span>
|
<span className="form-hint">用于语音消息转文字功能</span>
|
||||||
<div className="language-checkboxes">
|
|
||||||
{[
|
|
||||||
{ code: 'zh', name: '中文' },
|
|
||||||
{ code: 'yue', name: '粤语' },
|
|
||||||
{ code: 'en', name: '英文' },
|
|
||||||
{ code: 'ja', name: '日文' },
|
|
||||||
{ code: 'ko', name: '韩文' }
|
|
||||||
].map((lang) => (
|
|
||||||
<label key={lang.code} className="language-checkbox">
|
|
||||||
<input
|
|
||||||
type="checkbox"
|
|
||||||
checked={transcribeLanguages.includes(lang.code)}
|
|
||||||
onChange={async (e) => {
|
|
||||||
const checked = e.target.checked
|
|
||||||
let newLanguages: string[]
|
|
||||||
|
|
||||||
if (checked) {
|
<div className="setting-control vertical has-border">
|
||||||
newLanguages = [...transcribeLanguages, lang.code]
|
<div className="model-status-card">
|
||||||
} else {
|
<div className="model-info">
|
||||||
if (transcribeLanguages.length <= 1) {
|
<div className="model-name">SenseVoiceSmall (245 MB)</div>
|
||||||
showMessage('至少需要选择一种语言', false)
|
<div className="model-path">
|
||||||
return
|
{whisperModelStatus?.exists ? (
|
||||||
}
|
<span className="status-indicator success"><Check size={14} /> 已安装</span>
|
||||||
newLanguages = transcribeLanguages.filter(l => l !== lang.code)
|
) : (
|
||||||
}
|
<span className="status-indicator warning">未安装</span>
|
||||||
|
)}
|
||||||
setTranscribeLanguages(newLanguages)
|
{whisperModelDir && <div className="path-text" title={whisperModelDir}>{whisperModelDir}</div>}
|
||||||
await configService.setTranscribeLanguages(newLanguages)
|
|
||||||
showMessage(`已${checked ? '添加' : '移除'}${lang.name}`, true)
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<div className="checkbox-custom">
|
|
||||||
<Check size={14} />
|
|
||||||
<span>{lang.name}</span>
|
|
||||||
</div>
|
</div>
|
||||||
</label>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="form-group whisper-section">
|
|
||||||
<label>语音识别模型 (SenseVoiceSmall)</label>
|
|
||||||
<span className="form-hint">基于 Sherpa-onnx,支持中、粤、英、日、韩及情感/事件识别</span>
|
|
||||||
<span className="form-hint">模型下载目录</span>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
placeholder="留空使用默认目录"
|
|
||||||
value={whisperModelDir}
|
|
||||||
onChange={(e) => {
|
|
||||||
const value = e.target.value
|
|
||||||
setWhisperModelDir(value)
|
|
||||||
scheduleConfigSave('whisperModelDir', () => configService.setWhisperModelDir(value))
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<div className="btn-row">
|
|
||||||
<button className="btn btn-secondary" onClick={handleSelectWhisperModelDir}><FolderOpen size={16} /> 选择目录</button>
|
|
||||||
<button className="btn btn-secondary" onClick={handleResetWhisperModelDir}><RotateCcw size={16} /> 默认目录</button>
|
|
||||||
</div>
|
|
||||||
<div className="whisper-status-line">
|
|
||||||
<span className={`status ${whisperModelStatus?.exists ? 'ok' : 'warn'}`}>
|
|
||||||
{whisperModelStatus?.exists ? '已下载 (240 MB)' : '未下载 (240 MB)'}
|
|
||||||
</span>
|
|
||||||
{whisperModelStatus?.modelPath && <span className="path">{whisperModelStatus.modelPath}</span>}
|
|
||||||
</div>
|
|
||||||
{isWhisperDownloading ? (
|
|
||||||
<div className="whisper-progress">
|
|
||||||
<div className="progress-info">
|
|
||||||
<span>正在准备模型文件...</span>
|
|
||||||
<span className="percent">{whisperDownloadProgress.toFixed(0)}%</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="progress-bar-container">
|
<div className="model-actions">
|
||||||
<div className="progress-bar">
|
{!whisperModelStatus?.exists && !isWhisperDownloading && (
|
||||||
<div className="progress-fill" style={{ width: `${whisperDownloadProgress}%` }} />
|
<button
|
||||||
</div>
|
className="btn-download"
|
||||||
|
onClick={handleDownloadWhisperModel}
|
||||||
|
>
|
||||||
|
<Download size={16} /> 下载模型
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
{isWhisperDownloading && (
|
||||||
|
<div className="download-status">
|
||||||
|
<div className="status-header">
|
||||||
|
<span className="percent">{Math.round(whisperDownloadProgress)}%</span>
|
||||||
|
{whisperProgressData.total > 0 && (
|
||||||
|
<span className="details">
|
||||||
|
{formatBytes(whisperProgressData.downloaded)} / {formatBytes(whisperProgressData.total)}
|
||||||
|
<span className="speed">({formatBytes(whisperProgressData.speed)}/s)</span>
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="progress-bar-mini">
|
||||||
|
<div className="fill" style={{ width: `${whisperDownloadProgress}%` }}></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
|
||||||
<button className="btn btn-primary btn-download-model" onClick={handleDownloadWhisperModel}>
|
<div className="sub-setting">
|
||||||
<Download size={18} /> 下载模型
|
<div className="sub-label">自定义模型目录</div>
|
||||||
</button>
|
<div className="path-selector">
|
||||||
)}
|
<input
|
||||||
|
type="text"
|
||||||
|
value={whisperModelDir}
|
||||||
|
readOnly
|
||||||
|
placeholder="默认目录"
|
||||||
|
/>
|
||||||
|
<button className="btn-icon" onClick={handleSelectWhisperModelDir} title="选择目录">
|
||||||
|
<FolderOpen size={18} />
|
||||||
|
</button>
|
||||||
|
{whisperModelDir && (
|
||||||
|
<button className="btn-icon danger" onClick={handleResetWhisperModelDir} title="重置为默认">
|
||||||
|
<RotateCcw size={18} />
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="form-group">
|
||||||
|
<label>AI 对话模型 (Llama)</label>
|
||||||
|
<span className="form-hint">用于 AI 助手对话功能</span>
|
||||||
|
<div className="setting-control vertical has-border">
|
||||||
|
<div className="model-status-card">
|
||||||
|
<div className="model-info">
|
||||||
|
<div className="model-name">Qwen3 4B (Preset) (~2.6GB)</div>
|
||||||
|
<div className="model-path">
|
||||||
|
{llamaModelStatus?.exists ? (
|
||||||
|
<span className="status-indicator success"><Check size={14} /> 已安装</span>
|
||||||
|
) : (
|
||||||
|
<span className="status-indicator warning">未安装</span>
|
||||||
|
)}
|
||||||
|
{llamaModelStatus?.path && <div className="path-text" title={llamaModelStatus.path}>{llamaModelStatus.path}</div>}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="model-actions">
|
||||||
|
{!llamaModelStatus?.exists && !isLlamaDownloading && (
|
||||||
|
<button
|
||||||
|
className="btn-download"
|
||||||
|
onClick={handleDownloadLlamaModel}
|
||||||
|
>
|
||||||
|
<Download size={16} /> 下载模型
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
{isLlamaDownloading && (
|
||||||
|
<div className="download-status">
|
||||||
|
<div className="status-header">
|
||||||
|
<span className="percent">{Math.floor(llamaDownloadProgress)}%</span>
|
||||||
|
<span className="metrics">
|
||||||
|
{formatBytes(llamaProgressData.downloaded)} / {formatBytes(llamaProgressData.total)}
|
||||||
|
<span className="speed">({formatBytes(llamaProgressData.speed)}/s)</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div className="progress-bar-mini">
|
||||||
|
<div className="fill" style={{ width: `${llamaDownloadProgress}%` }}></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="form-group">
|
||||||
|
<label>自动转文字</label>
|
||||||
|
<span className="form-hint">收到语音消息时自动转换为文字</span>
|
||||||
|
<div className="log-toggle-line">
|
||||||
|
<span className="log-status">{autoTranscribeVoice ? '已开启' : '已关闭'}</span>
|
||||||
|
<label className="switch">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
className="switch-input"
|
||||||
|
checked={autoTranscribeVoice}
|
||||||
|
onChange={(e) => {
|
||||||
|
setAutoTranscribeVoice(e.target.checked)
|
||||||
|
configService.setAutoTranscribeVoice(e.target.checked)
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span className="switch-slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
@@ -1427,6 +1565,7 @@ function SettingsPage() {
|
|||||||
{ value: 'json', label: 'JSON', desc: '详细格式,包含完整消息信息' },
|
{ value: 'json', label: 'JSON', desc: '详细格式,包含完整消息信息' },
|
||||||
{ value: 'html', label: 'HTML', desc: '网页格式,可直接浏览' },
|
{ value: 'html', label: 'HTML', desc: '网页格式,可直接浏览' },
|
||||||
{ value: 'txt', label: 'TXT', desc: '纯文本,通用格式' },
|
{ value: 'txt', label: 'TXT', desc: '纯文本,通用格式' },
|
||||||
|
{ value: 'weclone', label: 'WeClone CSV', desc: 'WeClone 兼容字段格式(CSV)' },
|
||||||
{ value: 'sql', label: 'PostgreSQL', desc: '数据库脚本,便于导入到数据库' }
|
{ value: 'sql', label: 'PostgreSQL', desc: '数据库脚本,便于导入到数据库' }
|
||||||
]
|
]
|
||||||
const exportDateRangeOptions = [
|
const exportDateRangeOptions = [
|
||||||
@@ -1721,6 +1860,147 @@ function SettingsPage() {
|
|||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
||||||
|
// HTTP API 服务控制
|
||||||
|
const handleToggleApi = async () => {
|
||||||
|
if (isTogglingApi) return
|
||||||
|
|
||||||
|
// 启动时显示警告弹窗
|
||||||
|
if (!httpApiRunning) {
|
||||||
|
setShowApiWarning(true)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
setIsTogglingApi(true)
|
||||||
|
try {
|
||||||
|
await window.electronAPI.http.stop()
|
||||||
|
setHttpApiRunning(false)
|
||||||
|
showMessage('API 服务已停止', true)
|
||||||
|
} catch (e: any) {
|
||||||
|
showMessage(`操作失败: ${e}`, false)
|
||||||
|
} finally {
|
||||||
|
setIsTogglingApi(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 确认启动 API 服务
|
||||||
|
const confirmStartApi = async () => {
|
||||||
|
setShowApiWarning(false)
|
||||||
|
setIsTogglingApi(true)
|
||||||
|
try {
|
||||||
|
const result = await window.electronAPI.http.start(httpApiPort)
|
||||||
|
if (result.success) {
|
||||||
|
setHttpApiRunning(true)
|
||||||
|
if (result.port) setHttpApiPort(result.port)
|
||||||
|
showMessage(`API 服务已启动,端口 ${result.port}`, true)
|
||||||
|
} else {
|
||||||
|
showMessage(`启动失败: ${result.error}`, false)
|
||||||
|
}
|
||||||
|
} catch (e: any) {
|
||||||
|
showMessage(`操作失败: ${e}`, false)
|
||||||
|
} finally {
|
||||||
|
setIsTogglingApi(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleCopyApiUrl = () => {
|
||||||
|
const url = `http://127.0.0.1:${httpApiPort}`
|
||||||
|
navigator.clipboard.writeText(url)
|
||||||
|
showMessage('已复制 API 地址', true)
|
||||||
|
}
|
||||||
|
|
||||||
|
const renderApiTab = () => (
|
||||||
|
<div className="tab-content">
|
||||||
|
<div className="form-group">
|
||||||
|
<label>HTTP API 服务</label>
|
||||||
|
<span className="form-hint">启用后可通过 HTTP 接口查询消息数据(仅限本机访问)</span>
|
||||||
|
<div className="log-toggle-line">
|
||||||
|
<span className="log-status">
|
||||||
|
{httpApiRunning ? '运行中' : '已停止'}
|
||||||
|
</span>
|
||||||
|
<label className="switch">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
checked={httpApiRunning}
|
||||||
|
onChange={handleToggleApi}
|
||||||
|
disabled={isTogglingApi}
|
||||||
|
/>
|
||||||
|
<span className="switch-slider" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="form-group">
|
||||||
|
<label>服务端口</label>
|
||||||
|
<span className="form-hint">API 服务监听的端口号(1024-65535)</span>
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
className="field-input"
|
||||||
|
value={httpApiPort}
|
||||||
|
onChange={(e) => setHttpApiPort(parseInt(e.target.value, 10) || 5031)}
|
||||||
|
disabled={httpApiRunning}
|
||||||
|
style={{ width: 120 }}
|
||||||
|
min={1024}
|
||||||
|
max={65535}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{httpApiRunning && (
|
||||||
|
<div className="form-group">
|
||||||
|
<label>API 地址</label>
|
||||||
|
<span className="form-hint">使用以下地址访问 API</span>
|
||||||
|
<div className="api-url-display">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
className="field-input"
|
||||||
|
value={`http://127.0.0.1:${httpApiPort}`}
|
||||||
|
readOnly
|
||||||
|
/>
|
||||||
|
<button className="btn btn-secondary" onClick={handleCopyApiUrl} title="复制">
|
||||||
|
<Copy size={16} />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* API 安全警告弹窗 */}
|
||||||
|
{showApiWarning && (
|
||||||
|
<div className="modal-overlay" onClick={() => setShowApiWarning(false)}>
|
||||||
|
<div className="api-warning-modal" onClick={(e) => e.stopPropagation()}>
|
||||||
|
<div className="modal-header">
|
||||||
|
<ShieldCheck size={20} />
|
||||||
|
<h3>安全提示</h3>
|
||||||
|
</div>
|
||||||
|
<div className="modal-body">
|
||||||
|
<p className="warning-text">启用 HTTP API 服务后,本机上的其他程序可通过接口访问您的聊天记录数据。</p>
|
||||||
|
<div className="warning-list">
|
||||||
|
<div className="warning-item">
|
||||||
|
<span className="bullet">•</span>
|
||||||
|
<span>请确保您了解此功能的用途</span>
|
||||||
|
</div>
|
||||||
|
<div className="warning-item">
|
||||||
|
<span className="bullet">•</span>
|
||||||
|
<span>不要在公共或不信任的网络环境下使用</span>
|
||||||
|
</div>
|
||||||
|
<div className="warning-item">
|
||||||
|
<span className="bullet">•</span>
|
||||||
|
<span>此功能仅供高级用户或开发者使用</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="modal-footer">
|
||||||
|
<button className="btn btn-secondary" onClick={() => setShowApiWarning(false)}>
|
||||||
|
取消
|
||||||
|
</button>
|
||||||
|
<button className="btn btn-primary" onClick={confirmStartApi}>
|
||||||
|
确认启动
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
|
||||||
const handleSetupHello = async () => {
|
const handleSetupHello = async () => {
|
||||||
setIsSettingHello(true)
|
setIsSettingHello(true)
|
||||||
try {
|
try {
|
||||||
@@ -1958,9 +2238,10 @@ function SettingsPage() {
|
|||||||
{activeTab === 'appearance' && renderAppearanceTab()}
|
{activeTab === 'appearance' && renderAppearanceTab()}
|
||||||
{activeTab === 'notification' && renderNotificationTab()}
|
{activeTab === 'notification' && renderNotificationTab()}
|
||||||
{activeTab === 'database' && renderDatabaseTab()}
|
{activeTab === 'database' && renderDatabaseTab()}
|
||||||
{activeTab === 'whisper' && renderWhisperTab()}
|
{activeTab === 'models' && renderModelsTab()}
|
||||||
{activeTab === 'export' && renderExportTab()}
|
{activeTab === 'export' && renderExportTab()}
|
||||||
{activeTab === 'cache' && renderCacheTab()}
|
{activeTab === 'cache' && renderCacheTab()}
|
||||||
|
{activeTab === 'api' && renderApiTab()}
|
||||||
{activeTab === 'security' && renderSecurityTab()}
|
{activeTab === 'security' && renderSecurityTab()}
|
||||||
{activeTab === 'about' && renderAboutTab()}
|
{activeTab === 'about' && renderAboutTab()}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
108
src/services/EngineService.ts
Normal file
108
src/services/EngineService.ts
Normal file
@@ -0,0 +1,108 @@
|
|||||||
|
|
||||||
|
export interface ModelInfo {
|
||||||
|
name: string;
|
||||||
|
path: string;
|
||||||
|
downloadUrl?: string; // If it's a known preset
|
||||||
|
size?: number;
|
||||||
|
downloaded: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const PRESET_MODELS: ModelInfo[] = [
|
||||||
|
{
|
||||||
|
name: "Qwen3 4B (Preset)",
|
||||||
|
path: "Qwen3-4B-Q4_K_M.gguf",
|
||||||
|
downloadUrl: "https://www.modelscope.cn/models/Qwen/Qwen3-4B-GGUF/resolve/master/Qwen3-4B-Q4_K_M.gguf",
|
||||||
|
downloaded: false
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
class EngineService {
|
||||||
|
private onTokenCallback: ((token: string) => void) | null = null;
|
||||||
|
private onProgressCallback: ((percent: number) => void) | null = null;
|
||||||
|
private _removeTokenListener: (() => void) | null = null;
|
||||||
|
private _removeProgressListener: (() => void) | null = null;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
// Initialize listeners
|
||||||
|
this._removeTokenListener = window.electronAPI.llama.onToken((token: string) => {
|
||||||
|
if (this.onTokenCallback) {
|
||||||
|
this.onTokenCallback(token);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
this._removeProgressListener = window.electronAPI.llama.onDownloadProgress((percent: number) => {
|
||||||
|
if (this.onProgressCallback) {
|
||||||
|
this.onProgressCallback(percent);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public async checkModelExists(filename: string): Promise<boolean> {
|
||||||
|
const modelsPath = await window.electronAPI.llama.getModelsPath();
|
||||||
|
const fullPath = `${modelsPath}\\${filename}`; // Windows path separator
|
||||||
|
// We might need to handle path separator properly or let main process handle it
|
||||||
|
// Updated preload to take full path or handling in main?
|
||||||
|
// Let's rely on main process exposing join or just checking relative to models dir if implemented
|
||||||
|
// Actually main process `checkFileExists` takes a path.
|
||||||
|
// Let's assume we construct path here or Main helps.
|
||||||
|
// Better: getModelsPath returns the directory.
|
||||||
|
return await window.electronAPI.llama.checkFileExists(fullPath);
|
||||||
|
}
|
||||||
|
|
||||||
|
public async getModelsPath(): Promise<string> {
|
||||||
|
return await window.electronAPI.llama.getModelsPath();
|
||||||
|
}
|
||||||
|
|
||||||
|
public async loadModel(filename: string) {
|
||||||
|
const modelsPath = await this.getModelsPath();
|
||||||
|
const fullPath = `${modelsPath}\\${filename}`;
|
||||||
|
console.log("Loading model:", fullPath);
|
||||||
|
return await window.electronAPI.llama.loadModel(fullPath);
|
||||||
|
}
|
||||||
|
|
||||||
|
public async createSession(systemPrompt?: string) {
|
||||||
|
return await window.electronAPI.llama.createSession(systemPrompt);
|
||||||
|
}
|
||||||
|
|
||||||
|
public async chat(message: string, onToken: (token: string) => void, options?: { thinking?: boolean }) {
|
||||||
|
this.onTokenCallback = onToken;
|
||||||
|
return await window.electronAPI.llama.chat(message, options);
|
||||||
|
}
|
||||||
|
|
||||||
|
public async downloadModel(url: string, filename: string, onProgress: (percent: number) => void) {
|
||||||
|
const modelsPath = await this.getModelsPath();
|
||||||
|
const fullPath = `${modelsPath}\\${filename}`;
|
||||||
|
this.onProgressCallback = onProgress;
|
||||||
|
return await window.electronAPI.llama.downloadModel(url, fullPath);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 清除当前的回调函数引用
|
||||||
|
* 用于避免内存泄漏
|
||||||
|
*/
|
||||||
|
public clearCallbacks() {
|
||||||
|
this.onTokenCallback = null;
|
||||||
|
this.onProgressCallback = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 释放所有资源
|
||||||
|
* 包括事件监听器和回调引用
|
||||||
|
*/
|
||||||
|
public dispose() {
|
||||||
|
// 清除回调
|
||||||
|
this.clearCallbacks();
|
||||||
|
|
||||||
|
// 移除事件监听器
|
||||||
|
if (this._removeTokenListener) {
|
||||||
|
this._removeTokenListener();
|
||||||
|
this._removeTokenListener = null;
|
||||||
|
}
|
||||||
|
if (this._removeProgressListener) {
|
||||||
|
this._removeProgressListener();
|
||||||
|
this._removeProgressListener = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const engineService = new EngineService();
|
||||||
70
src/stores/batchTranscribeStore.ts
Normal file
70
src/stores/batchTranscribeStore.ts
Normal file
@@ -0,0 +1,70 @@
|
|||||||
|
import { create } from 'zustand'
|
||||||
|
|
||||||
|
export interface BatchTranscribeState {
|
||||||
|
/** 是否正在批量转写 */
|
||||||
|
isBatchTranscribing: boolean
|
||||||
|
/** 转写进度 */
|
||||||
|
progress: { current: number; total: number }
|
||||||
|
/** 是否显示进度浮窗 */
|
||||||
|
showToast: boolean
|
||||||
|
/** 是否显示结果弹窗 */
|
||||||
|
showResult: boolean
|
||||||
|
/** 转写结果 */
|
||||||
|
result: { success: number; fail: number }
|
||||||
|
/** 当前转写的会话名 */
|
||||||
|
startTime: number
|
||||||
|
sessionName: string
|
||||||
|
|
||||||
|
// Actions
|
||||||
|
startTranscribe: (total: number, sessionName: string) => void
|
||||||
|
updateProgress: (current: number, total: number) => void
|
||||||
|
finishTranscribe: (success: number, fail: number) => void
|
||||||
|
setShowToast: (show: boolean) => void
|
||||||
|
setShowResult: (show: boolean) => void
|
||||||
|
reset: () => void
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useBatchTranscribeStore = create<BatchTranscribeState>((set) => ({
|
||||||
|
isBatchTranscribing: false,
|
||||||
|
progress: { current: 0, total: 0 },
|
||||||
|
showToast: false,
|
||||||
|
showResult: false,
|
||||||
|
result: { success: 0, fail: 0 },
|
||||||
|
sessionName: '',
|
||||||
|
startTime: 0,
|
||||||
|
|
||||||
|
startTranscribe: (total, sessionName) => set({
|
||||||
|
isBatchTranscribing: true,
|
||||||
|
showToast: true,
|
||||||
|
progress: { current: 0, total },
|
||||||
|
showResult: false,
|
||||||
|
result: { success: 0, fail: 0 },
|
||||||
|
sessionName,
|
||||||
|
startTime: Date.now()
|
||||||
|
}),
|
||||||
|
|
||||||
|
updateProgress: (current, total) => set({
|
||||||
|
progress: { current, total }
|
||||||
|
}),
|
||||||
|
|
||||||
|
finishTranscribe: (success, fail) => set({
|
||||||
|
isBatchTranscribing: false,
|
||||||
|
showToast: false,
|
||||||
|
showResult: true,
|
||||||
|
result: { success, fail },
|
||||||
|
startTime: 0
|
||||||
|
}),
|
||||||
|
|
||||||
|
setShowToast: (show) => set({ showToast: show }),
|
||||||
|
setShowResult: (show) => set({ showResult: show }),
|
||||||
|
|
||||||
|
reset: () => set({
|
||||||
|
isBatchTranscribing: false,
|
||||||
|
progress: { current: 0, total: 0 },
|
||||||
|
showToast: false,
|
||||||
|
showResult: false,
|
||||||
|
result: { success: 0, fail: 0 },
|
||||||
|
sessionName: '',
|
||||||
|
startTime: 0
|
||||||
|
})
|
||||||
|
}))
|
||||||
296
src/styles/batchTranscribe.scss
Normal file
296
src/styles/batchTranscribe.scss
Normal file
@@ -0,0 +1,296 @@
|
|||||||
|
// 批量转写 - 共享基础样式(overlay / modal-content / animations)
|
||||||
|
// 被 ChatPage.scss 和 BatchTranscribeGlobal.tsx 同时使用
|
||||||
|
|
||||||
|
.batch-modal-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
backdrop-filter: blur(4px);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 10000;
|
||||||
|
animation: batchFadeIn 0.2s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-modal-content {
|
||||||
|
background: var(--bg-primary);
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
||||||
|
max-height: 90vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
animation: batchSlideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes batchFadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes batchSlideUp {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(20px);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量转写进度浮窗(非阻塞 toast)
|
||||||
|
.batch-progress-toast {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 24px;
|
||||||
|
right: 24px;
|
||||||
|
width: 320px;
|
||||||
|
background: var(--bg-primary);
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
z-index: 10000;
|
||||||
|
animation: batchToastSlideIn 0.3s cubic-bezier(0.16, 1, 0.3, 1);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.batch-progress-toast-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 14px;
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
.batch-progress-toast-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
|
||||||
|
svg {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-progress-toast-close {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
border: none;
|
||||||
|
background: transparent;
|
||||||
|
border-radius: 6px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.15s, color 0.15s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-progress-toast-body {
|
||||||
|
padding: 12px 14px;
|
||||||
|
|
||||||
|
.progress-info-row {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
|
||||||
|
.progress-text {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
|
||||||
|
.progress-percent {
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--primary);
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-eta {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
font-size: 11px; // 稍微小一点
|
||||||
|
color: var(--text-tertiary, #999); // 使用更淡的颜色
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-bar {
|
||||||
|
height: 6px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
border-radius: 3px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.progress-fill {
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(90deg, var(--primary), var(--primary));
|
||||||
|
border-radius: 3px;
|
||||||
|
transition: width 0.3s ease;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes batchToastSlideIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(16px) scale(0.96);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0) scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 批量转写结果对话框
|
||||||
|
.batch-result-modal {
|
||||||
|
width: 420px;
|
||||||
|
max-width: 90vw;
|
||||||
|
|
||||||
|
.batch-modal-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.75rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
svg {
|
||||||
|
color: #4caf50;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-modal-body {
|
||||||
|
padding: 1.5rem;
|
||||||
|
|
||||||
|
.result-summary {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.75rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
|
||||||
|
.result-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.75rem;
|
||||||
|
padding: 1rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
|
||||||
|
svg {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
margin-left: auto;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.success {
|
||||||
|
svg {
|
||||||
|
color: #4caf50;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
color: #4caf50;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.fail {
|
||||||
|
svg {
|
||||||
|
color: #f44336;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
color: #f44336;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-tip {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 0.5rem;
|
||||||
|
padding: 0.75rem;
|
||||||
|
background: rgba(255, 152, 0, 0.1);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid rgba(255, 152, 0, 0.3);
|
||||||
|
|
||||||
|
svg {
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-top: 2px;
|
||||||
|
color: #ff9800;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.batch-modal-footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 1rem 1.5rem;
|
||||||
|
border-top: 1px solid var(--border-color);
|
||||||
|
|
||||||
|
button {
|
||||||
|
padding: 0.5rem 1.5rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s;
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
&.btn-primary {
|
||||||
|
background: var(--primary);
|
||||||
|
color: white;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
39
src/types/electron.d.ts
vendored
39
src/types/electron.d.ts
vendored
@@ -85,6 +85,7 @@ export interface ElectronAPI {
|
|||||||
}>
|
}>
|
||||||
getContact: (username: string) => Promise<Contact | null>
|
getContact: (username: string) => Promise<Contact | null>
|
||||||
getContactAvatar: (username: string) => Promise<{ avatarUrl?: string; displayName?: string } | null>
|
getContactAvatar: (username: string) => Promise<{ avatarUrl?: string; displayName?: string } | null>
|
||||||
|
resolveTransferDisplayNames: (chatroomId: string, payerUsername: string, receiverUsername: string) => Promise<{ payerName: string; receiverName: string }>
|
||||||
getContacts: () => Promise<{
|
getContacts: () => Promise<{
|
||||||
success: boolean
|
success: boolean
|
||||||
contacts?: ContactInfo[]
|
contacts?: ContactInfo[]
|
||||||
@@ -111,6 +112,7 @@ export interface ElectronAPI {
|
|||||||
}>
|
}>
|
||||||
getImageData: (sessionId: string, msgId: string) => Promise<{ success: boolean; data?: string; error?: string }>
|
getImageData: (sessionId: string, msgId: string) => Promise<{ success: boolean; data?: string; error?: string }>
|
||||||
getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) => Promise<{ success: boolean; data?: string; error?: string }>
|
getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) => Promise<{ success: boolean; data?: string; error?: string }>
|
||||||
|
getAllVoiceMessages: (sessionId: string) => Promise<{ success: boolean; messages?: Message[]; error?: string }>
|
||||||
resolveVoiceCache: (sessionId: string, msgId: string) => Promise<{ success: boolean; hasCache: boolean; data?: string }>
|
resolveVoiceCache: (sessionId: string, msgId: string) => Promise<{ success: boolean; hasCache: boolean; data?: string }>
|
||||||
getVoiceTranscript: (sessionId: string, msgId: string, createTime?: number) => Promise<{ success: boolean; transcript?: string; error?: string }>
|
getVoiceTranscript: (sessionId: string, msgId: string, createTime?: number) => Promise<{ success: boolean; transcript?: string; error?: string }>
|
||||||
onVoiceTranscriptPartial: (callback: (payload: { msgId: string; text: string }) => void) => () => void
|
onVoiceTranscriptPartial: (callback: (payload: { msgId: string; text: string }) => void) => () => void
|
||||||
@@ -161,12 +163,13 @@ export interface ElectronAPI {
|
|||||||
}
|
}
|
||||||
error?: string
|
error?: string
|
||||||
}>
|
}>
|
||||||
getContactRankings: (limit?: number) => Promise<{
|
getContactRankings: (limit?: number, beginTimestamp?: number, endTimestamp?: number) => Promise<{
|
||||||
success: boolean
|
success: boolean
|
||||||
data?: Array<{
|
data?: Array<{
|
||||||
username: string
|
username: string
|
||||||
displayName: string
|
displayName: string
|
||||||
avatarUrl?: string
|
avatarUrl?: string
|
||||||
|
wechatId?: string
|
||||||
messageCount: number
|
messageCount: number
|
||||||
sentCount: number
|
sentCount: number
|
||||||
receivedCount: number
|
receivedCount: number
|
||||||
@@ -355,8 +358,10 @@ export interface ElectronAPI {
|
|||||||
data?: {
|
data?: {
|
||||||
year: number
|
year: number
|
||||||
selfName: string
|
selfName: string
|
||||||
|
selfAvatarUrl?: string
|
||||||
friendUsername: string
|
friendUsername: string
|
||||||
friendName: string
|
friendName: string
|
||||||
|
friendAvatarUrl?: string
|
||||||
firstChat: {
|
firstChat: {
|
||||||
createTime: number
|
createTime: number
|
||||||
createTimeStr: string
|
createTimeStr: string
|
||||||
@@ -393,14 +398,30 @@ export interface ElectronAPI {
|
|||||||
friendTopEmojiMd5?: string
|
friendTopEmojiMd5?: string
|
||||||
myTopEmojiUrl?: string
|
myTopEmojiUrl?: string
|
||||||
friendTopEmojiUrl?: string
|
friendTopEmojiUrl?: string
|
||||||
|
myTopEmojiCount?: number
|
||||||
|
friendTopEmojiCount?: number
|
||||||
}
|
}
|
||||||
topPhrases: Array<{ phrase: string; count: number }>
|
topPhrases: Array<{ phrase: string; count: number }>
|
||||||
|
heatmap?: number[][]
|
||||||
|
initiative?: { initiated: number; received: number }
|
||||||
|
response?: { avg: number; fastest: number; count: number }
|
||||||
|
monthly?: Record<string, number>
|
||||||
|
streak?: { days: number; startDate: string; endDate: string }
|
||||||
}
|
}
|
||||||
error?: string
|
error?: string
|
||||||
}>
|
}>
|
||||||
onProgress: (callback: (payload: { status: string; progress: number }) => void) => () => void
|
onProgress: (callback: (payload: { status: string; progress: number }) => void) => () => void
|
||||||
}
|
}
|
||||||
export: {
|
export: {
|
||||||
|
getExportStats: (sessionIds: string[], options: any) => Promise<{
|
||||||
|
totalMessages: number
|
||||||
|
voiceMessages: number
|
||||||
|
cachedVoiceCount: number
|
||||||
|
needTranscribeCount: number
|
||||||
|
mediaMessages: number
|
||||||
|
estimatedSeconds: number
|
||||||
|
sessions: Array<{ sessionId: string; displayName: string; totalCount: number; voiceCount: number }>
|
||||||
|
}>
|
||||||
exportSessions: (sessionIds: string[], outputDir: string, options: ExportOptions) => Promise<{
|
exportSessions: (sessionIds: string[], outputDir: string, options: ExportOptions) => Promise<{
|
||||||
success: boolean
|
success: boolean
|
||||||
successCount?: number
|
successCount?: number
|
||||||
@@ -459,6 +480,17 @@ export interface ElectronAPI {
|
|||||||
debugResource: (url: string) => Promise<{ success: boolean; status?: number; headers?: any; error?: string }>
|
debugResource: (url: string) => Promise<{ success: boolean; status?: number; headers?: any; error?: string }>
|
||||||
proxyImage: (url: string) => Promise<{ success: boolean; dataUrl?: string; error?: string }>
|
proxyImage: (url: string) => Promise<{ success: boolean; dataUrl?: string; error?: string }>
|
||||||
}
|
}
|
||||||
|
llama: {
|
||||||
|
loadModel: (modelPath: string) => Promise<boolean>
|
||||||
|
createSession: (systemPrompt?: string) => Promise<boolean>
|
||||||
|
chat: (message: string) => Promise<{ success: boolean; response?: any; error?: string }>
|
||||||
|
downloadModel: (url: string, savePath: string) => Promise<void>
|
||||||
|
getModelsPath: () => Promise<string>
|
||||||
|
checkFileExists: (filePath: string) => Promise<boolean>
|
||||||
|
getModelStatus: (modelPath: string) => Promise<{ exists: boolean; path?: string; size?: number; error?: string }>
|
||||||
|
onToken: (callback: (token: string) => void) => () => void
|
||||||
|
onDownloadProgress: (callback: (payload: { downloaded: number; total: number; speed: number }) => void) => () => void
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ExportOptions {
|
export interface ExportOptions {
|
||||||
@@ -481,7 +513,10 @@ export interface ExportProgress {
|
|||||||
current: number
|
current: number
|
||||||
total: number
|
total: number
|
||||||
currentSession: string
|
currentSession: string
|
||||||
phase: 'preparing' | 'exporting' | 'writing' | 'complete'
|
phase: 'preparing' | 'exporting' | 'exporting-media' | 'exporting-voice' | 'writing' | 'complete'
|
||||||
|
phaseProgress?: number
|
||||||
|
phaseTotal?: number
|
||||||
|
phaseLabel?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WxidInfo {
|
export interface WxidInfo {
|
||||||
|
|||||||
@@ -64,6 +64,9 @@ export interface Message {
|
|||||||
fileSize?: number // 文件大小
|
fileSize?: number // 文件大小
|
||||||
fileExt?: string // 文件扩展名
|
fileExt?: string // 文件扩展名
|
||||||
xmlType?: string // XML 中的 type 字段
|
xmlType?: string // XML 中的 type 字段
|
||||||
|
// 转账消息
|
||||||
|
transferPayerUsername?: string // 转账付款方 wxid
|
||||||
|
transferReceiverUsername?: string // 转账收款方 wxid
|
||||||
// 名片消息
|
// 名片消息
|
||||||
cardUsername?: string // 名片的微信ID
|
cardUsername?: string // 名片的微信ID
|
||||||
cardNickname?: string // 名片的昵称
|
cardNickname?: string // 名片的昵称
|
||||||
|
|||||||
@@ -33,7 +33,8 @@ export default defineConfig({
|
|||||||
'fsevents',
|
'fsevents',
|
||||||
'whisper-node',
|
'whisper-node',
|
||||||
'shelljs',
|
'shelljs',
|
||||||
'exceljs'
|
'exceljs',
|
||||||
|
'node-llama-cpp'
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user