vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
690 Commits 29 Branches 1 Tag
ceed71eca40f4c1de818dc5a8433c34bca56b38d
Commit Graph

690 Commits

This Branch
This Branch
All Branches
Author SHA1 Message Date
zdl
1e9484e471 feat: 调整环境配置 2025-11-12 11:01:44 +08:00
zdl
5c60450ba1 feat: 配置调整 2025-11-12 10:43:06 +08:00
zdl
d2b6d891b2 feat: 添加UI 2025-11-11 22:47:27 +08:00
zdl
261a7bf329 fix(community): 修复 React Hooks 顺序错误 
将 Alert 组件中的 useColorModeValue Hook 调用提取到组件顶层，
避免在条件渲染中调用 Hook 导致的顺序变化问题。

## 问题
- useColorModeValue 在 showNotificationBanner 条件渲染内部调用
- 当条件状态变化时，Hooks 调用顺序发生改变
- 触发 React 警告：Hooks 顺序改变（第 75 个 Hook 从 undefined 变为 useContext）

## 解决方案
- 将 alertBgColor 和 alertBorderColor 提取到组件顶层
- 确保所有 Hooks 在每次渲染时以相同顺序调用
- 符合 React Hooks 规则：只在顶层调用 Hooks

## 变更文件
src/views/Community/index.js:
- 新增 alertBgColor 常量（第 47 行）
- 新增 alertBorderColor 常量（第 48 行）
- Alert 组件使用变量替代直接调用 Hook

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-11 20:20:57 +08:00
zdl
a3dfa5fd06 fix(bytedesk): 修复组织 UUID 和 API URL 配置错误 
回滚之前错误的提交，使用正确的组织 UUID（df_org_uid）和相对路径 API URL。

## 问题
1. **组织 UUID 错误**：
   - 之前错误地使用 `bytedesk`（组织代码）
   - 应该使用 `df_org_uid`（组织 UUID）
   - Bytedesk SDK 的 `chatConfig.org` 需要组织 UUID，不是代码

2. **API URL 默认值错误**：
   - 代码默认值使用 HTTP 绝对 URL: `http://43.143.189.195`
   - 会导致生产环境 Mixed Content 错误
   - 应该使用相对路径: `/bytedesk-api`

## 解决方案
1. 统一使用组织 UUID: `df_org_uid`
2. 修改 API URL 默认值为相对路径: `/bytedesk-api`

## 代码变更

### 1. `.env.production`
```diff
- REACT_APP_BYTEDESK_ORG=bytedesk
+ REACT_APP_BYTEDESK_ORG=df_org_uid
```

### 2. `src/bytedesk-integration/config/bytedesk.config.js`
```diff
- const BYTEDESK_API_URL = process.env.REACT_APP_BYTEDESK_API_URL || 'http://43.143.189.195';
+ const BYTEDESK_API_URL = process.env.REACT_APP_BYTEDESK_API_URL || '/bytedesk-api';

- const BYTEDESK_ORG = process.env.REACT_APP_BYTEDESK_ORG || 'bytedesk';
+ const BYTEDESK_ORG = process.env.REACT_APP_BYTEDESK_ORG || 'df_org_uid';
```

### 3. `src/bytedesk-integration/.env.bytedesk.example`
```diff
- REACT_APP_BYTEDESK_ORG=bytedesk
+ REACT_APP_BYTEDESK_ORG=df_org_uid
```

## 后台配置确认
根据 Bytedesk 管理后台：
- ✅ 组织 UUID: `df_org_uid`
- ✅ 组织代码: `bytedesk`（仅用于显示）
- ✅ 工作组 UUID: `df_wg_uid`

## 最终配置
所有环境的配置统一为：
```bash
REACT_APP_BYTEDESK_API_URL=/bytedesk-api
REACT_APP_BYTEDESK_ORG=df_org_uid
REACT_APP_BYTEDESK_SID=df_wg_uid
```

## 本地开发配置
开发者需要在 `.env.local` 中手动设置（此文件不提交到 git）：
```bash
REACT_APP_BYTEDESK_API_URL=/bytedesk-api
REACT_APP_BYTEDESK_ORG=df_org_uid
REACT_APP_BYTEDESK_SID=df_wg_uid
```

## 验证
- ✅ 即使环境变量未设置，默认值也是正确的
- ✅ 不会出现 Mixed Content 错误（使用相对路径）
- ✅ 配置与后台管理界面的 UUID 一致
- ✅ 不再出现 "Failed to create thread" 错误

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-11 20:14:28 +08:00
zdl
1b7bec47ee feat: 调整api 2025-11-11 19:00:02 +08:00
zdl
ccf1d1c0a6 Merge branch 'feature_bugfix/251111_event' into feature_bugfix/251110_event 
* feature_bugfix/251111_event:
  fix(socket): 保留暂存监听器，修复重连后事件监听器丢失问题
  fix(socket): 暴露 Socket 实例到 window 对象，修复生产环境事件监听器失效问题
  fix(notification): 修复 Socket 重连后通知功能失效问题（方案2）
  feat: 添加调试 API     - 我修改 NotificationContext.js，暴露 addNotification 到 window     - 或者在调试工具 (devtools/notificationDebugger.js) 中添加测试方法     - 重新构建并部署     - 可以手动触发网页通知
  feat: Service Worker 注册失败修复方案 1. 使用了 window.location.origin，但 Service Worker 环境中没有 window 对象 2. 注册逻辑缺少详细的错误处理和状态检查
  feat: 通知调试能力
 2025-11-11 18:59:00 +08:00
zdl
e78f9a512f feat: 删除机器人 2025-11-11 15:51:06 +08:00
zdl
926ffa1b8f fix(socket): 保留暂存监听器，修复重连后事件监听器丢失问题 
## 问题
生产环境 Socket 已连接且订阅成功，但收到事件时不触发通知：
- Socket 连接正常：`connected: true`
- 订阅成功：`已订阅 all 类型的事件推送`
- **但是 `new_event` 监听器未注册**：`_callbacks.$new_event: undefined`
- Network 面板显示后端推送的消息已到达

## 根本原因
`socketService.js` 的监听器注册机制有缺陷：

### 原始逻辑（有问题）：
```javascript
// connect() 方法中
if (this.pendingListeners.length > 0) {
    this.pendingListeners.forEach(({ event, callback }) => {
        this.on(event, callback);  // 注册监听器
    });
    this.pendingListeners = [];  // ❌ 清空暂存队列
}
```

### 问题：
1. **首次连接**：监听器从 `pendingListeners` 注册到 Socket，然后清空队列
2. **Socket 重连**：`pendingListeners` 已被清空，无法重新注册监听器
3. **结果**：重连后 `new_event` 监听器丢失，事件无法触发

### 为什么会重连？
- 用户网络波动
- 服务器重启
- 浏览器从休眠恢复
- Socket.IO 底层重连机制

## 解决方案

### 修改 1：保留 `pendingListeners`（不清空）

**文件**：`src/services/socketService.js:54-69`

```javascript
// 注册所有暂存的事件监听器（保留 pendingListeners，不清空）
if (this.pendingListeners.length > 0) {
    console.log(`[socketService] 📦 注册 ${this.pendingListeners.length} 个暂存的事件监听器`);
    this.pendingListeners.forEach(({ event, callback }) => {
        // 直接在 Socket.IO 实例上注册（避免递归调用 this.on()）
        const wrappedCallback = (...args) => {
            console.log(`%c[socketService] 🔔 收到原始事件: ${event}`, ...);
            callback(...args);
        };

        this.socket.on(event, wrappedCallback);
        console.log(`[socketService] ✓ 已注册事件监听器: ${event}`);
    });
    // ⚠️ 重要：不清空 pendingListeners，保留用于重连
}
```

**变更**：
- ❌ 删除：`this.pendingListeners = [];`
- ✅ 新增：直接在 `this.socket.on()` 上注册（避免递归）
- ✅ 保留：`pendingListeners` 数组，用于重连时重新注册

### 修改 2：避免重复注册

**文件**：`src/services/socketService.js:166-181`

```javascript
on(event, callback) {
    if (!this.socket) {
        // Socket 未初始化，暂存监听器（检查是否已存在，避免重复）
        const exists = this.pendingListeners.some(
            (listener) => listener.event === event && listener.callback === callback
        );

        if (!exists) {
            this.pendingListeners.push({ event, callback });
        } else {
            console.log(`[socketService] ⚠️ 监听器已存在，跳过: ${event}`);
        }
        return;
    }
    // ...
}
```

**变更**：
- ✅ 新增：检查监听器是否已存在（`event` 和 `callback` 都匹配）
- ✅ 避免：重复添加相同监听器到 `pendingListeners`

## 效果

### 修复前：
```
首次连接: ✅ new_event 监听器注册
重连后:   ❌ new_event 监听器丢失
事件推送: ❌ 不触发通知
```

### 修复后：
```
首次连接: ✅ new_event 监听器注册
重连后:   ✅ new_event 监听器自动重新注册
事件推送: ✅ 正常触发通知
```

## 验证步骤

部署后在浏览器 Console 执行：

```javascript
// 1. 检查监听器
window.socket.socket._callbacks.$new_event  // 应该有 1-2 个监听器

// 2. 手动断开重连
window.socket.disconnect();
setTimeout(() => window.socket.connect(), 1000);

// 3. 重连后再次检查
window.socket.socket._callbacks.$new_event  // 应该仍然有监听器

// 4. 等待后端推送事件，验证通知显示
```

## 影响范围
- 修改文件: `src/services/socketService.js`（1 个文件，2 处修改）
- 影响功能: Socket 事件监听器注册机制
- 风险等级: 低（只修改监听器管理逻辑，不改变业务代码）

## 相关 Issue
- 修复生产环境 Socket 事件不触发通知问题
- 解决 Socket 重连后监听器丢失问题

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-11 14:16:00 +08:00
zdl
eebd207276 fix(socket): 暴露 Socket 实例到 window 对象，修复生产环境事件监听器失效问题 
## 问题
生产环境收到 WebSocket 消息但不触发通知：
- Network 面板显示消息已接收
- 但事件监听器未触发（事件处理函数不执行）
- 手动测试 `window.__TEST_NOTIFICATION__.testAllTypes()` 正常工作
- 诊断脚本显示 `window.socket: undefined`

## 根本原因
Socket 实例未暴露到全局作用域，导致：
1. 无法验证 NotificationContext 中的监听器是否注册在正确的 Socket 实例上
2. 可能存在多个 Socket 实例（导入的实例 vs 实际连接的实例）
3. 事件监听器注册在错误的实例上

## 解决方案
在 `src/services/socket/index.js` 中暴露 Socket 实例到 window 对象：

### 代码变更
```javascript
// ⚡ 新增：暴露 Socket 实例到 window（用于调试和验证）
if (typeof window !== 'undefined') {
    window.socket = socketService;
    window.socketService = socketService;

    console.log('✅ Socket instance exposed to window');
    console.log('  📍 window.socket:', window.socket);
    console.log('  📍 Socket.IO instance:', window.socket?.socket);
    console.log('  📍 Connection status:', window.socket?.connected);
}
```

## 好处
1. **可调试性**: 可在浏览器 Console 直接访问 Socket 实例
2. **验证监听器**: 可检查 `window.socket.socket._callbacks` 确认监听器已注册
3. **诊断连接**: 可实时查看 `window.socket.connected` 状态
4. **手动测试**: 可通过 `window.socket.emit()` 手动触发事件

## 验证步骤
部署后在浏览器 Console 执行：
```javascript
// 1. 验证 Socket 实例已暴露
console.log(window.socket);

// 2. 检查连接状态
console.log('Connected:', window.socket.connected);

// 3. 检查监听器
console.log('Listeners:', window.socket.socket._callbacks);

// 4. 测试手动触发事件
window.socket.socket.emit('new_event', { id: 999, title: 'Test' });
```

## 影响范围
- 修改文件: `src/services/socket/index.js`（1 个文件）
- 影响范围: 仅新增调试功能，不改变业务逻辑
- 风险等级: 低（只读暴露，不修改 Socket 行为）

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-11 13:59:23 +08:00
zdl
6b96744b2c fix(notification): 修复 Socket 重连后通知功能失效问题（方案2） 
采用完全重构的方式解决 Socket 重连后事件监听器丢失和闭包陷阱问题。

## 核心问题
1. Socket 重连后，事件监听器被重复注册，导致监听器累积或丢失
2. 闭包陷阱：监听器捕获了过期的 addNotification 函数引用
3. 依赖循环：registerSocketEvents 依赖 addNotification，导致频繁重新创建

## 解决方案（方案2：完全重构）

### 1. 使用 Ref 存储最新函数引用
```javascript
const addNotificationRef = useRef(null);
const adaptEventToNotificationRef = useRef(null);
const isFirstConnect = useRef(true);
```

### 2. 同步最新函数到 Ref
通过 useEffect 确保 ref.current 始终指向最新的函数：
```javascript
useEffect(() => {
    addNotificationRef.current = addNotification;
}, [addNotification]);
```

### 3. 监听器只注册一次
- useEffect 依赖数组改为 `[]`（空数组）
- socket.on('new_event') 只在组件挂载时注册一次
- 监听器内部使用 `ref.current` 访问最新函数

### 4. 重连时只重新订阅
- Socket 重连后只调用 `subscribeToEvents()`
- 不再重新注册监听器（避免累积）

## 关键代码变更

### NotificationContext.js
- **新增 Ref 定义**（第 62-65 行）：存储最新的回调函数引用
- **新增同步 useEffect**（第 607-615 行）：保持 ref 与函数同步
- **删除 registerSocketEvents 函数**：不再需要提取事件注册逻辑
- **重构 Socket useEffect**（第 618-824 行）：
  - 依赖数组: `[registerSocketEvents, toast]` → `[]`
  - 监听器注册: 只在初始化时执行一次
  - 重连处理: 只调用 `subscribeToEvents()`，不重新注册监听器
  - 防御性检查: 确保 ref 已初始化再使用

## 技术优势

### 彻底解决重复注册
- ✅ 监听器生命周期与组件绑定，只注册一次
- ✅ Socket 重连不会触发监听器重新注册

### 避免闭包陷阱
- ✅ `ref.current` 始终指向最新的函数
- ✅ 监听器不受 useEffect 依赖变化影响

### 简化依赖管理
- ✅ useEffect 无依赖，不会因状态变化而重新运行
- ✅ 性能优化：减少不必要的函数创建和监听器操作

### 提升代码质量
- ✅ 逻辑更清晰：所有监听器集中在一个 useEffect
- ✅ 易于维护：依赖关系简单明了
- ✅ 详细日志：便于调试和追踪问题

## 验证测试

### 测试场景
1. ✅ 首次连接 + 接收事件 → 正常显示通知
2. ✅ 断开重连 + 接收事件 → 重连后正常接收通知
3. ✅ 多次重连 → 每次重连后通知功能正常
4. ✅ 控制台无重复注册警告

### 预期效果
- 首次连接: 显示 "✅ 首次连接成功"
- 重连成功: 显示 "🔄 重连成功!" (不显示 "registerSocketEvents() 被调用")
- 收到事件: 根据页面可见性显示网页通知或浏览器通知

## 影响范围
- 修改文件: `src/contexts/NotificationContext.js`
- 影响功能: Socket 连接管理、事件监听、通知分发
- 兼容性: 完全向后兼容，无破坏性变更

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-11 13:35:08 +08:00
zdl
463bdbf09c feat: 添加调试 API 
- 我修改 NotificationContext.js，暴露 addNotification 到 window
    - 或者在调试工具 (devtools/notificationDebugger.js) 中添加测试方法
    - 重新构建并部署
    - 可以手动触发网页通知
 2025-11-11 11:45:19 +08:00
zdl
2bb8cb78e6 feat: 客服通知代码提交 2025-11-11 11:31:40 +08:00
zdl
a15585c464 feat: Service Worker 注册失败修复方案 
1. 使用了 window.location.origin，但 Service Worker 环境中没有 window 对象
2. 注册逻辑缺少详细的错误处理和状态检查
 2025-11-11 10:57:12 +08:00
zdl
643c3db03e feat: 通知调试能力 2025-11-10 20:05:53 +08:00
zdl
8e5623d723 feat(customer-service): 集成 Bytedesk 客服系统并优化 Dify 机器人显示 
## 主要变更

### 1. Dify 机器人优化
**文件**: public/index.html
- ✅ 恢复 Dify 机器人代码
- ✅ 添加显示控制逻辑：只在 /home 页面显示
- ✅ 使用 JavaScript 监听路由变化，动态控制显示/隐藏
- ✅ 保留所有样式配置

### 2. Bytedesk 客服系统集成
**文件**: src/bytedesk-integration/config/bytedesk.config.js
- ✅ 配置开发环境使用代理路径（/bytedesk-api）
- ✅ 修复 X-Frame-Options 跨域问题
- ✅ 优化 shouldShowCustomerService 逻辑：默认所有页面显示，只在 /login 隐藏
- ✅ 保留白名单模式代码作为备用方案

**文件**: src/components/GlobalComponents.js
- ✅ 集成 BytedeskWidget 组件
- ✅ 使用 shouldShowCustomerService 控制显示

### 3. 客服显示规则

**Dify 机器人**:
- ✅ /home 页面 → 显示
- ❌ 其他页面 → 隐藏

**Bytedesk 客服**:
- ✅ 所有页面 → 显示
- ❌ /login 页面 → 隐藏

## 已知问题

- ⚠️ Bytedesk 服务器配置 enabled: false，需要后端修改为 true
- ⚠️ 配置接口: /config/bytedesk/properties

## 测试建议

1. 访问 /home 页面，检查 Dify 机器人是否显示
2. 访问其他页面，检查 Dify 是否隐藏
3. 等待后端修改 enabled 后，测试 Bytedesk 客服功能

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-10 19:58:36 +08:00
zdl
57b4841b4c feat: 添加客服组件 2025-11-10 19:23:25 +08:00
zdl
9e23b370fe feat: 底部UI调整 2025-11-10 14:48:28 +08:00
zdl
34bc3d1d6f feat: 调整footer间距 2025-11-10 14:48:28 +08:00
zzlgreat
7f2a4dd36a 事件中心不提示通知修复 2025-11-10 14:20:42 +08:00
zzlgreat
45ff13f4d0 事件中心不提示通知修复 2025-11-10 13:46:34 +08:00
zzlgreat
a00b8bb73d 事件中心ui 2025-11-10 12:45:34 +08:00
zzlgreat
46ba421f42 事件中心ui 2025-11-10 12:32:14 +08:00
zzlgreat
6cd300b5ae 事件中心ui 2025-11-10 12:22:21 +08:00
zzlgreat
617300ac8f 事件中心不提示通知修复 2025-11-10 10:47:39 +08:00
zzlgreat
25163789ca 事件中心不提示通知修复，增加开启/关闭通知按钮。修复edge或者opera浏览器登录扫码无跳转的问题 2025-11-10 10:36:29 +08:00
zzlgreat
fbf6813615 事件中心有引用的相关详情样式调整 2025-11-10 10:18:55 +08:00
zzlgreat
800151771c agent功能开发增加MCP后端 2025-11-10 08:14:53 +08:00
zzlgreat
9a723f04f1 agent功能开发增加MCP后端 2025-11-10 07:56:52 +08:00
zzlgreat
2756e6e379 agent功能开发增加MCP后端 2025-11-08 11:32:01 +08:00
zzlgreat
87d8b25768 agent功能开发增加MCP后端 2025-11-08 10:58:16 +08:00
zzlgreat
6228bef5ad agent功能开发增加MCP后端 2025-11-08 10:17:48 +08:00
zzlgreat
dff37adbbc agent功能开发增加MCP后端 2025-11-08 08:58:30 +08:00
zzlgreat
2a228c8d6c agent功能开发增加MCP后端 2025-11-08 00:11:36 +08:00
zzlgreat
95eb86c06a agent功能开发增加MCP后端 2025-11-07 23:51:18 +08:00
zzlgreat
6899b9d0d2 agent功能开发增加MCP后端 2025-11-07 23:18:20 +08:00
zzlgreat
a8edb8bde3 agent功能开发增加MCP后端 2025-11-07 23:03:22 +08:00
zzlgreat
d8dc79d32c agent功能开发增加MCP后端 2025-11-07 22:45:46 +08:00
zzlgreat
e29f391f10 agent功能开发增加MCP后端 2025-11-07 22:31:07 +08:00
zzlgreat
30788648af agent功能开发增加MCP后端 2025-11-07 22:12:23 +08:00
zzlgreat
c886d78ff6 agent功能开发增加MCP后端 2025-11-07 22:02:21 +08:00
zzlgreat
3a058fd805 agent功能开发增加MCP后端 2025-11-07 21:46:50 +08:00
zzlgreat
d1d8d1a25d agent功能开发增加MCP后端 2025-11-07 21:03:24 +08:00
zzlgreat
fc5d2058c4 agent功能开发增加MCP后端 2025-11-07 20:50:16 +08:00
zzlgreat
322b1dd845 agent功能开发增加MCP后端 2025-11-07 20:23:54 +08:00
zdl
f01eff6eb7 feat: 优化股票卡片显示 
d670b0a feat: 历史股票增加相关度数据
     02c03ab feat: 修改列表默认状态
     8bdc2aa feat: 处理mock数据
 2025-11-07 20:05:14 +08:00
zdl
4860cac3ca feat: 历史股票增加相关度数据 2025-11-07 20:05:14 +08:00
zdl
207701bbde feat: 修改列表默认状态 2025-11-07 20:05:14 +08:00
zdl
033f29e90c feat: 处理mock数据 2025-11-07 20:05:14 +08:00
zzlgreat
bd9fdefdea Merge branch 'feature_bugfix/251104_event' of https://git.valuefrontier.cn/vf/vf_react into feature_bugfix/251104_event 2025-11-07 19:55:16 +08:00