feat(api): 更新优秀录音文件接口路径并添加缓存系统

refactor(views): 在多个视图组件中实现数据缓存机制为API接口更新路径并添加全面的缓存系统，包括： 1. 修改优秀录音文件接口路径 2. 实现30分钟有效期的缓存机制 3. 添加缓存管理功能（清除、查看状态） 4. 在topOne、secondTop和seniorManager视图组件中应用缓存 5. 开发环境下暴露缓存管理函数方便调试
2025-08-27 14:04:04 +08:00
parent dd913f4d14
commit d4daed2ec1
4 changed files with 430 additions and 90 deletions
--- a/my-vue-app/src/views/senorManger/seniorManager.vue
+++ b/my-vue-app/src/views/senorManger/seniorManager.vue
@@ -192,6 +192,108 @@ import { getOverallTeamPerformance,getTotalGroupCount,getConversionRate,getTotal

 import { useUserStore } from '@/stores/user.js'

+// 缓存系统
+const cache = new Map()
+const CACHE_DURATION = 30 * 60 * 1000 // 30分钟
+
+// 缓存工具函数
+const getCacheKey = (functionName, params = {}) => {
+  return `${functionName}_${JSON.stringify(params)}`
+}
+
+const isValidCache = (cacheItem) => {
+  return cacheItem && (Date.now() - cacheItem.timestamp) < CACHE_DURATION
+}
+
+const setCache = (key, data) => {
+  cache.set(key, {
+    data,
+    timestamp: Date.now()
+  })
+}
+
+const getCache = (key) => {
+  const cacheItem = cache.get(key)
+  return isValidCache(cacheItem) ? cacheItem.data : null
+}
+
+const withCache = async (functionName, apiCall, params = {}) => {
+  const cacheKey = getCacheKey(functionName, params)
+  const cachedData = getCache(cacheKey)
+  
+  if (cachedData) {
+    console.log(`从缓存获取数据: ${functionName}`, params)
+    return cachedData
+  }
+  
+  console.log(`调用API获取数据: ${functionName}`, params)
+  const result = await apiCall()
+  setCache(cacheKey, result)
+  return result
+}
+
+// 缓存管理功能
+const clearCache = () => {
+  cache.clear()
+  console.log('所有缓存已清除')
+}
+
+const clearSpecificCache = (functionName, params = {}) => {
+  const cacheKey = getCacheKey(functionName, params)
+  cache.delete(cacheKey)
+  console.log(`已清除缓存: ${functionName}`, params)
+}
+
+const getCacheInfo = () => {
+  const now = Date.now()
+  const cacheInfo = []
+  
+  cache.forEach((value, key) => {
+    const isValid = isValidCache(value)
+    const age = Math.round((now - value.timestamp) / 1000 / 60) // 分钟
+    cacheInfo.push({
+      key,
+      isValid,
+      age: `${age}分钟前`,
+      timestamp: new Date(value.timestamp).toLocaleString()
+    })
+    
+    // 清除过期缓存
+    if (!isValid) {
+      cache.delete(key)
+    }
+  })
+  
+  return cacheInfo
+}
+
+const forceRefreshAllData = async () => {
+  console.log('强制刷新所有数据...')
+  clearCache()
+  
+  try {
+    isLoading.value = true
+    await fetchOverallTeamPerformance()
+    await fetchActiveGroups()
+    await fetchConversionRate()
+    await fetchTotalCallCount()
+    await fetchNewCustomers()
+    await fetchDepositConversions()
+    await fetchAbnormalResponseRate()
+    await fetchCustomerCommunicationRate()
+    await fetchAverageResponseTime()
+    await fetchTimeoutRate()
+    await fetchTableFillingRate()
+    await fetchUrgentNeedToAddress()
+    await fetchTeamRanking()
+    console.log('所有数据已强制刷新完成')
+  } catch (error) {
+    console.error('强制刷新数据失败:', error)
+  } finally {
+    isLoading.value = false
+  }
+}
+
 const customerCommunicationRate = ref(85)
 const averageResponseTime = ref(15)
 const timeoutResponseRate = ref(5)
@@ -204,21 +306,9 @@ const updateCheckType = async (newValue) => {
  CheckType.value = newValue
  console.log('CheckType已更新为:', newValue)
  
-  // 重新获取所有使用CheckType的数据
-  try {
-    isLoading.value = true
-    await fetchOverallTeamPerformance()
-    await fetchActiveGroups()
-    await fetchConversionRate()
-    await fetchTotalCallCount()
-    await fetchNewCustomers()
-    await fetchDepositConversions()
-    console.log('数据已根据新的统计模式重新加载')
-  } catch (error) {
-    console.error('重新加载数据失败:', error)
-  } finally {
-    isLoading.value = false
-  }
+  // 清除缓存并重新获取所有使用CheckType的数据
+  await forceRefreshAllData()
+  console.log('数据已根据新的统计模式重新加载')
 }

 const userStore = useUserStore()
@@ -275,12 +365,17 @@ const getRequestParams = () => {
 async function fetchOverallTeamPerformance() {
  const params = getRequestParams()
  const hasParams = params.user_name
-// 团队总业绩
+  const requestParams = hasParams ? {
+    ...params,
+    check_type: CheckType.value
+  } : {check_type: CheckType.value}
+  
  try {
-    const response = await getOverallTeamPerformance(hasParams ? {
-      ...params,
-      check_type: CheckType.value
-    } : {check_type: CheckType.value})
+    const response = await withCache(
+      'fetchOverallTeamPerformance',
+      () => getOverallTeamPerformance(requestParams),
+      requestParams
+    )
    overallTeamPerformance.value.totalPerformance = response.data
  } catch (error) {
    console.error('获取整体概览数据失败:', error)
@@ -290,14 +385,19 @@ async function fetchOverallTeamPerformance() {
 async function fetchActiveGroups() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? {
+    ...params,
+    check_type: CheckType.value
+  } : {check_type: CheckType.value}
+  
  try {
-    const response = await getTotalGroupCount(hasParams ? {
-      ...params,
-      check_type: CheckType.value
-    } : {check_type: CheckType.value})
-     overallTeamPerformance.value.activeGroups = response.data
+    const response = await withCache(
+      'fetchActiveGroups',
+      () => getTotalGroupCount(requestParams),
+      requestParams
+    )
+    overallTeamPerformance.value.activeGroups = response.data
    console.log('活跃组数:', response.data)
-
  } catch (error) {
    console.error('获取活跃组数失败:', error)
  }
@@ -306,11 +406,17 @@ async function fetchActiveGroups() {
 async function fetchConversionRate() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? {
+    ...params,
+    check_type: CheckType.value
+  } : {check_type: CheckType.value}
+  
  try {
-    const response = await getConversionRate(hasParams ? {
-      ...params,
-      check_type: CheckType.value
-    } : {check_type: CheckType.value})
+    const response = await withCache(
+      'fetchConversionRate',
+      () => getConversionRate(requestParams),
+      requestParams
+    )
    overallTeamPerformance.value.conversionRate = response.data
  } catch (error) {
    console.error('获取团队转化率失败:', error)
@@ -320,11 +426,17 @@ async function fetchConversionRate() {
 async function fetchTotalCallCount() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? {
+    ...params,
+    check_type: CheckType.value
+  } : {check_type: CheckType.value}
+  
  try {
-    const response = await getTotalCallCount(hasParams ? {
-      ...params,
-      check_type: CheckType.value
-    } : {check_type: CheckType.value})
+    const response = await withCache(
+      'fetchTotalCallCount',
+      () => getTotalCallCount(requestParams),
+      requestParams
+    )
    overallTeamPerformance.value.totalCalls = response.data
  } catch (error) {
    console.error('获取通话次数失败:', error)
@@ -334,11 +446,17 @@ async function fetchTotalCallCount() {
 async function fetchNewCustomers() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? {
+    ...params,
+    check_type: CheckType.value
+  } : {check_type: CheckType.value}
+  
  try {
-    const response = await getNewCustomer(hasParams ? {
-      ...params,
-      check_type: CheckType.value
-    } : {check_type: CheckType.value})
+    const response = await withCache(
+      'fetchNewCustomers',
+      () => getNewCustomer(requestParams),
+      requestParams
+    )
    overallTeamPerformance.value.newCustomers = response.data
  } catch (error) {
    console.error('获取新增客户失败:', error)
@@ -348,14 +466,19 @@ async function fetchNewCustomers() {
 async function fetchDepositConversions() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? {
+    ...params,
+    check_type: CheckType.value
+  } : {check_type: CheckType.value}
+  
  try {
-    const response = await getDepositConversionRate(hasParams ? {
-      ...params,
-      check_type: CheckType.value
-    } : {check_type: CheckType.value})
+    const response = await withCache(
+      'fetchDepositConversions',
+      () => getDepositConversionRate(requestParams),
+      requestParams
+    )
    overallTeamPerformance.value.depositConversions = response.data
    console.log(99888999,response.data)
-
  } catch (error) {
    console.error('获取定金转化失败:', error)
  }
@@ -375,8 +498,14 @@ const teamAlerts = ref({})
 async function fetchAbnormalResponseRate() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getAbnormalResponseRate(hasParams ? params : undefined)
+    const response = await withCache(
+      'fetchAbnormalResponseRate',
+      () => getAbnormalResponseRate(hasParams ? params : undefined),
+      requestParams
+    )
    const rawData = response.data
    
    // 转换数据格式，按团队分组生成预警消息
@@ -435,8 +564,14 @@ async function fetchAbnormalResponseRate() {
 async function fetchCustomerCommunicationRate() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getActiveCustomerCommunicationRate(hasParams ? params : undefined)
+    const response = await withCache(
+      'fetchCustomerCommunicationRate',
+      () => getActiveCustomerCommunicationRate(hasParams ? params : undefined),
+      requestParams
+    )
    statisticalIndicators.value.customerCommunicationRate = response.data
  } catch (error) {
    console.error('获取活跃客户沟通率失败:', error)
@@ -446,8 +581,14 @@ async function fetchCustomerCommunicationRate() {
 async function fetchAverageResponseTime() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getAverageAnswerTime(hasParams ? params : undefined)
+    const response = await withCache(
+      'fetchAverageResponseTime',
+      () => getAverageAnswerTime(hasParams ? params : undefined),
+      requestParams
+    )
    statisticalIndicators.value.averageResponseTime = response.data
  } catch (error) {
    console.error('获取平均应答时间失败:', error)
@@ -457,8 +598,14 @@ async function fetchAverageResponseTime() {
 async function fetchTimeoutRate() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getTimeoutRate(hasParams ? params : undefined)
+    const response = await withCache(
+      'fetchTimeoutRate',
+      () => getTimeoutRate(hasParams ? params : undefined),
+      requestParams
+    )
    statisticalIndicators.value.timeoutResponseRate = response.data
  } catch (error) {
    console.error('获取超时应答率失败:', error)
@@ -468,8 +615,14 @@ async function fetchTimeoutRate() {
 async function fetchTableFillingRate() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getTableFillingRate(hasParams ? params : undefined)
+    const response = await withCache(
+      'fetchTableFillingRate',
+      () => getTableFillingRate(hasParams ? params : undefined),
+      requestParams
+    )
    statisticalIndicators.value.formCompletionRate = response.data
  } catch (error) {
    console.error('获取表格填写率失败:', error)
@@ -481,8 +634,14 @@ const problemRanking = ref({})
 async function fetchUrgentNeedToAddress() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getUrgentNeedToAddress(hasParams ? params : undefined)
+    const response = await withCache(
+      'fetchUrgentNeedToAddress',
+      () => getUrgentNeedToAddress(hasParams ? params : undefined),
+      requestParams
+    )
    problemRanking.value = response.data
  } catch (error) {
    console.error('获取客户迫切解决的问题失败:', error)
@@ -494,9 +653,15 @@ const teamRanking = ref({})
 async function fetchTeamRanking() {
  const params = getRequestParams()
  const hasParams = params.user_name
+  const requestParams = hasParams ? params : {}
+  
  try {
-    const response = await getTeamRanking(hasParams ? params : undefined)
-        teamRanking.value = response.data
+    const response = await withCache(
+      'fetchTeamRanking',
+      () => getTeamRanking(hasParams ? params : undefined),
+      requestParams
+    )
+    teamRanking.value = response.data
  } catch (error) {
    console.error('获取团队业绩排名失败:', error)
  }
@@ -515,9 +680,14 @@ async function fetchTeamPerformanceDetail(department) {
    user_level: userStore.userInfo.user_level.toString(),
    department: department
  }
+  
  try {
    teamPerformanceDetail.value = {}
-    const response = await getTeamRankingInfo(requestParams)
+    const response = await withCache(
+      'fetchTeamPerformanceDetail',
+      () => getTeamRankingInfo(requestParams),
+      requestParams
+    )
    teamPerformanceDetail.value = response.data
  } catch (error) {
    console.error('获取团队业绩详情失败:', error)
@@ -540,6 +710,21 @@ onMounted(async ()=>{
    await fetchTableFillingRate()
    await fetchUrgentNeedToAddress()
    await fetchTeamRanking()
+    
+    // 输出缓存信息
+    console.log('缓存状态:', getCacheInfo())
+    
+    // 开发环境下暴露缓存管理函数到全局
+    if (import.meta.env.DEV) {
+      window.seniorManagerCache = {
+        clearCache,
+        clearSpecificCache,
+        getCacheInfo,
+        forceRefreshAllData,
+        cache
+      }
+      console.log('开发模式：缓存管理函数已暴露到 window.seniorManagerCache')
+    }
  } catch (error) {
    console.error('数据加载失败:', error)
  } finally {