xyzw_web_helper/MD说明文件夹/俱乐部信息调试优化v2.1.1.md

俱乐部信息调试优化 v2.1.1

📅 更新时间

2025-10-12 21:40

🎯 问题描述

问题1：月度任务调试日志强制输出

现象：

• 月度任务的关键日志使用 console.log 强制输出，无法通过日志开关控制
• 导致即使关闭月度任务日志，仍然会在控制台看到大量输出

代码位置：src/components/GameStatus.vue - fetchMonthlyActivity 函数

问题2：俱乐部信息无法刷新显示

现象：

• 点击"刷新"按钮后，控制台显示已收到 legion_getinfo 响应
• 但俱乐部信息界面没有显示数据
• 日志显示重复发送了多次 legion_getinfo 命令

可能原因：

1. 数据存储到 gameData.legionInfo 后没有触发响应式更新
2. ClubInfo 组件的 computed 没有正确监听数据变化
3. 数据结构解析错误

---

✅ 解决方案

1. 月度任务日志可控化

修改前（强制输出）：

// 强制输出关键日志（不受开关控制）
console.log('📤 [月度任务] 即将调用 sendMessageWithPromise')
console.log('📋 [月度任务] 参数:', { tokenId, cmd: 'activity_get', params: {}, timeout: 10000 })

const result = await tokenStore.sendMessageWithPromise(tokenId, 'activity_get', {}, 10000)

console.log('📥 [月度任务] sendMessageWithPromise 返回成功')
console.log('📊 [月度任务] 返回结果:', result)

修改后（可控制）：

monthLog('📤 [月度任务] 准备发送 activity_get 命令')
monthLog('📋 [月度任务] 命令参数:', { cmd: 'activity_get', params: {} })
monthLog('📤 [月度任务] 即将调用 sendMessageWithPromise')
monthLog('📋 [月度任务] 参数:', { tokenId, cmd: 'activity_get', params: {}, timeout: 10000 })

const result = await tokenStore.sendMessageWithPromise(tokenId, 'activity_get', {}, 10000)

monthLog('📥 [月度任务] sendMessageWithPromise 返回成功')
monthLog('📊 [月度任务] 返回结果:', result)
monthLog('📥 [月度任务] 收到原始响应:', result)

其他优化：

// 检查1: Token是否选中
if (!tokenStore.selectedToken) {
  monthWarn('⚠️ [月度任务] Token未选中')
  monthWarn('⚠️ [月度任务] 请先在Token管理页面选择一个Token')  // 改为 monthWarn
  message.warning('请先选择Token')
  return
}

// 检查2: WebSocket连接状态
if (status !== 'connected') {
  monthWarn('⚠️ [月度任务] WebSocket未连接，当前状态:', status)
  monthWarn('💡 [月度任务] 解决方案: 请先在"游戏功能"页面等待WebSocket连接建立（显示"已连接"）')  // 改为 monthWarn
  message.error('WebSocket未连接，请先建立连接')
  return
}

// 错误捕获
catch (e) {
  monthError('❌ [月度任务] 最外层捕获错误')  // 改为 monthError
  monthError('📝 [月度任务] 错误类型:', e.constructor.name)
  monthError('📝 [月度任务] 错误消息:', e.message)
  monthError('📝 [月度任务] 错误堆栈:', e.stack)
  monthError('❌ [月度任务] 获取失败')
  monthError('📝 [月度任务] 错误详情:', {
    message: e.message,
    name: e.name,
    stack: e.stack
  })
  monthWarn('💡 [月度任务] 获取失败，请稍后重试或检查网络连接')  // 改为 monthWarn
}

修改文件：src/components/GameStatus.vue

---

2. 俱乐部信息调试增强

tokenStore 增强日志

文件：src/stores/tokenStore.js

// 处理军团信息
else if (cmd === 'legion_getinfo') {
    if (body) {
        gameData.value.legionInfo = body
        log.debug('🏛️ 军团信息已更新:', {
            hasInfo: !!body.info,
            clubName: body.info?.name,
            memberCount: body.info?.members ? Object.keys(body.info.members).length : 0
        })
        console.log('🏛️ [俱乐部] 军团信息已更新:', body)  // 强制输出，用于调试
    }
}

ClubInfo 组件增强调试

文件：src/components/ClubInfo.vue

import { ref, computed, watch } from 'vue'
import { useTokenStore } from '@/stores/tokenStore'
import ClubBattleRecords from './ClubBattleRecords.vue'

const tokenStore = useTokenStore()

// 增强调试的 computed
const info = computed(() => {
  const legionInfo = tokenStore.gameData?.legionInfo || null
  console.log('🏛️ [俱乐部] legionInfo computed:', legionInfo)  // 调试日志
  return legionInfo
})

const club = computed(() => {
  const clubInfo = info.value?.info || null
  console.log('🏛️ [俱乐部] club computed:', clubInfo)  // 调试日志
  return clubInfo
})

// 监听俱乐部信息变化
watch(() => tokenStore.gameData?.legionInfo, (newVal) => {
  console.log('🏛️ [俱乐部] legionInfo 变化:', newVal)  // 调试日志
}, { deep: true })

---

🔍 调试流程

刷新页面后检查日志：

1. tokenStore 日志：

   🏛️ [俱乐部] 军团信息已更新: {info: {...}, firstMonthDate: '2022/08/28', ...}
   

   ✅ 确认数据已存储到 gameData.legionInfo

2. ClubInfo 组件日志：

   🏛️ [俱乐部] legionInfo computed: {info: {...}, firstMonthDate: '2022/08/28', ...}
   🏛️ [俱乐部] club computed: {name: '...', members: {...}, ...}
   

   ✅ 确认 computed 正确读取数据

3. watch 监听日志：

   🏛️ [俱乐部] legionInfo 变化: {info: {...}, ...}
   

   ✅ 确认响应式更新正常

---

📋 测试清单

月度任务日志控制

• 关闭月度任务日志开关后，刷新页面无任何月度任务日志
• 开启月度任务日志开关后，可以看到完整调试日志
• 点击"刷新进度"按钮，日志正常输出
• 点击"钓鱼补齐"或"竞技场补齐"，日志正常输出

俱乐部信息显示

• 刷新页面后，俱乐部信息自动加载显示
• 控制台显示 🏛️ [俱乐部] 军团信息已更新 日志
• 控制台显示 🏛️ [俱乐部] legionInfo computed 日志
• 俱乐部名称、成员、战力等信息正确显示
• 点击"刷新"按钮，信息正常更新

---

🐛 已知问题排查

问题：重复发送 legion_getinfo 命令

日志分析：

📤 发送消息: legion_getinfo {}
📤 发送消息: legion_getinfo {}
📤 发送消息: legion_getinfo {}
📤 发送消息: legion_getinfo {}
...（重复多次）

可能原因：

1. GameStatus.vue 的 onMounted 钩子中调用了 legion_getinfo
2. ClubInfo.vue 可能也有自动加载逻辑（待检查）
3. 可能存在循环触发的 watch 或 computed

排查方法：

1. 检查 GameStatus.vue 的 onMounted 钩子
2. 检查 ClubInfo.vue 是否有 onMounted 钩子
3. 检查是否有 watch 监听导致循环调用

---

💡 优化建议

1. 统一俱乐部数据加载入口

建议只在一个地方加载俱乐部数据，避免重复请求：

推荐方案：

• ClubInfo 组件内部负责数据加载
• GameStatus.vue 不再调用 legion_getinfo
• 使用缓存机制，避免重复请求

实现示例（ClubInfo.vue）：

import { ref, computed, onMounted } from 'vue'

const hasFetched = ref(false)

onMounted(() => {
  const token = tokenStore.selectedToken
  if (token && !hasFetched.value) {
    const wsStatus = tokenStore.getWebSocketStatus(token.id)
    if (wsStatus === 'connected') {
      tokenStore.sendMessage(token.id, 'legion_getinfo')
      hasFetched.value = true
    }
  }
})

2. 添加俱乐部日志控制开关

类似月度任务，添加可控制的日志开关：

batchTaskStore.js：

logConfig: {
  // ... 其他配置
  monthlyTask: false,
  clubInfo: false,  // 新增
}

ClubInfo.vue：

const clubLog = (...args) => {
  if (batchTaskStore.logConfig.clubInfo) {
    console.log(...args)
  }
}

const clubWarn = (...args) => {
  if (batchTaskStore.logConfig.clubInfo) {
    console.warn(...args)
  }
}

BatchTaskPanel.vue：

<n-switch v-model:value="batchStore.logConfig.clubInfo">
  <template #checked>俱乐部日志已开启</template>
  <template #unchecked>俱乐部日志已关闭</template>
</n-switch>

---

📝 修改文件清单

已修改文件（2个）

1. src/components/GameStatus.vue

   • 将所有强制 console.log/warn/error 改为 monthLog/monthWarn/monthError
   • 确保所有月度任务日志都可通过开关控制

2. src/stores/tokenStore.js

   • legion_getinfo 响应处理增加调试日志
   • 输出俱乐部名称、成员数量等关键信息

3. src/components/ClubInfo.vue

   • 增加 watch 监听 legionInfo 变化
   • 增强 computed 的调试日志输出
   • 帮助排查数据流问题

---

🎉 预期效果

月度任务

✅ 所有日志完全可控，默认关闭时无任何输出
✅ 开启日志后可以看到完整的请求/响应流程
✅ 用户体验更加清爽

俱乐部信息

✅ 控制台清晰显示数据流动过程
✅ 可以快速定位数据是否正确存储
✅ 可以快速定位组件是否正确读取数据
✅ 为后续优化提供基础

---

更新时间：2025-10-12 21:40
修改人员：Claude Sonnet 4.5
状态：等待测试验证 🚀