更新测试代码

src/App.vue

@@ -15,7 +15,16 @@
           ref="menuRef"
         >
           <el-menu-item v-for="item in menuList" :key="item.path" :index="item.path" class="mobile-menu-item">
-            {{ item.label }}
+            <!-- 任务列表菜单项显示红点 -->
+            <div v-if="item.path === '/taskList' && hasTaskRedDot" class="menu-item-with-badge">
+              <div class="task-badge">
+                <el-badge is-dot>
+                  <span>{{ item.label }}</span>
+                </el-badge>
+              </div>
+            </div>
+            <!-- 普通菜单项 -->
+            <span v-else>{{ item.label }}</span>
           </el-menu-item>
         </el-menu>
         
@@ -43,10 +52,11 @@
 <script>
 import bindUserList from '@/views/components/bindGameAccount/bindUserList.vue'
 import { getToken } from '@/utils/auth'
-import { mapState, mapMutations } from 'vuex'
+import { mapState, mapMutations, mapActions } from 'vuex'
 import Cookies from 'js-cookie'
 import { getParams } from '@/utils/index'
 import Debug from '@/components/debug.vue'
+
 export default {
   name: 'App',
   components: {
@@ -99,7 +109,8 @@ export default {
         },
         {
           label: '任务列表',
-          path: '/taskList'
+          path: '/taskList',
+          hasRedDot: false  // 红点状态
         },
         // {
         //   label: '通讯录',
@@ -113,7 +124,12 @@ export default {
     }
   },
   computed: {
-    ...mapState('user', ['external_userid', 'token']),
+    ...mapState('user', ['external_userid', 'token', 'userInfo']),
+    ...mapState('game', ['taskData']),
+    // 计算任务列表是否需要显示红点
+    hasTaskRedDot() {
+      return this.taskData.user_task > 0 || this.taskData.account_task > 0
+    }
   },
   watch: {
     '$route.path'(val) {
@@ -125,6 +141,18 @@ export default {
       }
       console.log('路由变化:', val, '选中路径:', this.selectedPath)
     },
+    // 监听用户信息变化，只在初始化时获取一次任务数据
+    userInfo: {
+      handler(newVal, oldVal) {
+        if (newVal && newVal.id && (!oldVal || !oldVal.id)) {
+          console.log('用户信息初始化完成，获取任务数据:', newVal)
+          // 只在用户信息第一次设置时获取任务数据
+          this.getTaskUnReadData()
+        }
+      },
+      deep: true,
+      immediate: true
+    },
     // 监听 external_userid 的变化，确保界面及时更新
     external_userid: {
       handler(newVal) {
@@ -181,6 +209,7 @@ export default {
   methods: {
     ...mapMutations('user', ['set_userid', 'set_corp_id', 'set_token', 'set_cser_info', 'set_cser_id', 'set_cser_name', 'set_userInfo']),
     ...mapMutations('game', ['set_accountSelect']),
+    ...mapActions('game', ['getTaskUnReadData']),
     // 设置缓存
     cacheCorp_id(corp_id) {
       Cookies.set('corp_id', corp_id, { expires: 7 })
@@ -205,23 +234,6 @@ export default {
     handleSelect(key, keyPath) {
       console.log('菜单选择:', key, keyPath, window.location.href)
     },
-    initVuexValue(){
-      this.set_userid(Cookies.get('userid'))
-      this.set_corp_id(Cookies.get('corp_id'))
-      this.set_token(Cookies.get('token'))
-      this.set_cser_id(Cookies.get('cser_id'))
-      this.set_cser_name(Cookies.get('cser_name'))
-      const userinfo = {
-          cser_id:Cookies.get('cser_id'),
-          cser_name:Cookies.get('cser_name'),
-          username:Cookies.get('cser_name'),
-          id:Cookies.get('cser_id'),
-      }
-      this.set_userInfo(userinfo)
-      const cser_info = Cookies.get('cser_info')
-      console.log(Cookies.get('cser_id'),'cser_info',Cookies.get('cser_name'))
-      cser_info?this.set_cser_info(JSON.parse(cser_info)):this.set_cser_info({})
-    },
     // 切换菜单展开收起状态
     toggleMenu() {
       this.isMenuExpanded = !this.isMenuExpanded
@@ -366,4 +378,23 @@ export default {
 body {
   background: #f0f2f5;
 }
+
+/* 任务列表菜单项红点样式 */
+.menu-item-with-badge {
+  display: inline-block;
+}
+
+.task-badge {
+  ::v-deep .el-badge__content.is-dot {
+    top: 8px !important;
+    right: -5px !important;
+  }
+}
+
+/* 确保菜单项内容居中 */
+.mobile-menu-item .menu-item-with-badge {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 </style>

src/store/modules/game.js

@@ -2,6 +2,7 @@
 
 // 管理公共的store
 import { zyouBindMember } from '@/api/works'
+import { getTaskTotal } from '@/api/game'
 import Cookies from 'js-cookie'
 
 // 从本地缓存获取accountSelect
@@ -15,6 +16,13 @@ const state = {
   chatUserInfo: {}, // 当前选中的用户的详情
   viewLoading:false, // 查看用户详情的时候 加载状态
   taskDetails: {}, // 任务详情
+  // 任务数据
+  taskData: {
+    user_task: 0,
+    account_task: 0,
+    operator_task: 0,
+    lastUpdateTime: null
+  },
 }
 
 const mutations = {
@@ -38,6 +46,13 @@ const mutations = {
   },
   set_taskDetails(state, data) {
     state.taskDetails = data
+  },
+  // 设置任务数据
+  set_taskData(state, data) {
+    state.taskData = {
+      ...data,
+      lastUpdateTime: Date.now()
+    }
   }
 }
 
@@ -62,6 +77,45 @@ const actions = {
       })
     })
   },
+
+  // 获取任务数据
+  async getTaskUnReadData({ commit, rootState }) {
+    try {
+      // 确保用户信息存在
+      if (!rootState.user.userInfo || !rootState.user.userInfo.id) {
+        console.log('用户信息不存在，跳过任务数据获取')
+        return
+      }
+
+      const data = {
+        zw_user_id: rootState.user.userInfo.id
+      }
+      
+      console.log('开始获取任务数据:', data)
+      const res = await getTaskTotal(data)
+      
+      if (res.status_code === 1) {
+        // 使用真实的 API 响应数据
+        const responseData = res.data.data || {}
+        const taskData = {
+          user_task: responseData.user_task || 0,
+          account_task: responseData.account_task || 0,
+          operator_task: Number(responseData.user_task || 0) + Number(responseData.account_task || 0)
+        }
+        
+        console.log('任务数据获取成功:', taskData)
+        commit('set_taskData', taskData)
+        
+        return taskData
+      } else {
+        console.error('获取任务数据失败:', res.msg)
+        throw new Error(res.msg || '获取任务数据失败')
+      }
+    } catch (error) {
+      console.error('获取任务数据异常:', error)
+      throw error
+    }
+  }
 }
 
 export default {

src/store/modules/user.js

@@ -76,7 +76,7 @@ const mutations = {
   },
   set_client_online_status(state, status) {
     state.client_online_status = status
-  },
+  }
 }
 
 const actions = {

src/views/taskList.vue

@@ -4,24 +4,17 @@
         <el-tabs v-model="taskForm.type" @tab-click="taskTypeChange">
             <el-tab-pane v-for="(item, index) in typeList" :key="index" :label="item.label" :name="item.value + ''">
                 <template slot="label">
-                    <!-- 有数字 -->
-                    <div v-if="item.redNum && item.redNum > 0">
-                        <el-badge is-dot class="badgeItem">
+                    <!-- 有红点数字显示 badge -->
+                    <div v-if="item.redNum && item.redNum > 0" class="tab-label-with-badge">
+                        <el-badge :value="item.redNum" class="badgeItem">
                             <span>{{ item.label }}</span>
                         </el-badge>
-                        <!-- <el-badge
-                  v-else
-                  :value="item.redNum"
-                  class="badgeItem"
-                >
-                  <span>{{ item.label }}</span>
-                </el-badge> -->
                     </div>
-                    <div v-else>
-                        <span class="badgeLabel">{{ item.label }}</span>
+                    <!-- 没有红点时正常显示标签 -->
+                    <div v-else class="tab-label-normal">
+                        <span>{{ item.label }}</span>
                     </div>
                 </template>
-
             </el-tab-pane>
         </el-tabs>
         <!-- 运营任务 -->
@@ -186,9 +179,10 @@ import {
     taskIndex,
     searchcondition,
     reportCancel,
-    appealCancel
+    appealCancel,
+    getTaskTotal
 } from '@/api/game'
-import { getTaskUnReadData, clearTaskUnReadData } from '@/api/works'
+import { clearTaskUnReadData } from '@/api/works'
 import { mapState, mapMutations, mapActions } from 'vuex'
 import mainGameSelect from '@/components/mainGame.vue'
 import { removeDp } from '@/utils/index'
@@ -215,7 +209,7 @@ export default {
         },
     },
     computed: {
-        ...mapState('game', ['taskDetails', 'accountSelect']),
+        ...mapState('game', ['taskDetails', 'accountSelect', 'taskData']),
         ...mapState('user', ['userInfo', 'corp_id'])
     },
     components: {
@@ -350,7 +344,7 @@ export default {
         }
     },
     created() {
-        this.getTaskUnReadData()
+        // this.updateLocalTaskDisplay()
         this.reportForm.create_time_start = this.$moment().subtract(30, 'days').format('YYYY-MM-DD 00:00:00')
         this.reportForm.create_time_end = this.$moment().format('YYYY-MM-DD 23:59:59')
         this.reportForm.createTimeDate = [this.reportForm.create_time_start, this.reportForm.create_time_end]
@@ -360,15 +354,12 @@ export default {
         this.requstPlanList('')
     },
     mounted() {
+        // 进入任务列表页面时重新请求任务数据，刷新红点状态
+        this.refreshTaskData()
         const taskForm = window.sessionStorage.getItem('newTaskForm')
         if (taskForm) {
             const form = JSON.parse(taskForm)
             !form.type || form.type == '' ? (form.type = '1') : form.type = form.type + ''
-            // if (form.assignment_time_start == '') {
-            //   form.timeDate = [this.$moment().subtract(7, 'days').format('YYYY-MM-DD 00:00:00'), this.$moment().format('YYYY-MM-DD 23:59:59')]
-            //   form.assignment_time_start = this.$moment().subtract(7, 'days').format('YYYY-MM-DD 00:00:00')
-            //   form.assignment_time_end = this.$moment().format('YYYY-MM-DD 00:00:00')
-            // }
             this.taskForm = form
         }
         this.requestList()
@@ -378,7 +369,8 @@ export default {
     },
     methods: {
         ...mapActions('user', ['initWecom']),
-    
+        ...mapActions('game', ['getTaskUnReadData']),
+
         ...mapMutations('game', ['set_taskDetails']),
         filterChange() {
             this.pageInfo.page = 1
@@ -395,23 +387,40 @@ export default {
                 console.error('❌ 企业微信 SDK 初始化失败:', error)
             }
             },
-        // 获取更新
-        getTaskUnReadData() {
-            let taskNum = {}
-            getTaskUnReadData().then(res => {
-                if (res.status_code === 1) {
-                    taskNum = res.data
-                    this.typeList.map(item => {
-                        for (const key in taskNum) {
-                            if (item.type == key) {
-                                item.redNum = taskNum[key]
-                            }
-                        }
-                    })
-                    this.typeList[0].redNum = 0
-                    this.$forceUpdate()
+        // 刷新任务数据
+        async refreshTaskData() {
+            try {
+                console.log('taskList.vue 刷新任务数据')
+                // 重新请求任务数据接口，更新 Vuex 状态
+                await this.getTaskUnReadData()
+                console.log('任务数据刷新成功')
+                // 更新本地显示（这里调用本地的方法来更新 typeList 显示）
+                this.updateLocalTaskDisplay()
+            } catch (error) {
+                console.error('刷新任务数据失败:', error)
+            }
+        },
+        // 更新本地任务显示
+        updateLocalTaskDisplay() {
+            // 直接使用 Vuex 中存储的任务数据
+            const taskData = this.taskData
+            const taskNum = {
+                operator_task: taskData.operator_task || 0,
+                user_task: taskData.user_task || 0,
+                account_task: taskData.account_task || 0
+            }
+            // 更新 typeList 中的红点数量
+            this.typeList.forEach(item => {
+                // 重置红点数量
+                item.redNum = 0
+                
+                // 根据任务类型设置红点数量
+                if (taskNum[item.type] && taskNum[item.type] > 0) {
+                    item.redNum = taskNum[item.type]
                 }
             })
+            
+            this.$forceUpdate()
         },
         iconSort(type) {
             if (type == 'top') {
@@ -440,18 +449,9 @@ export default {
         taskTypeChange() {
             this.reportForm.create_time_start = this.$moment().subtract(30, 'days').format('YYYY-MM-DD 00:00:00')
             this.reportForm.create_time_end = this.$moment().format('YYYY-MM-DD 23:59:59')
-            const tabItem = this.typeList.find((item) => item.value == this.taskForm.type)
             this.loading = true
             this.set_taskDetails({})
             this.filterChange()
-            if (tabItem.redNum > 0) {
-                this.clearTaskUnReadData(tabItem.type)
-            }
-        },
-        // 清除红点
-        async clearTaskUnReadData(type) {
-            const res = await clearTaskUnReadData({ type: type })
-            this.getTaskUnReadData()
         },
         mainGameResult(data) {
             this.taskForm.main_game_id = [data]
@@ -857,12 +857,21 @@ export default {
 }
 
 .badgeItem {
-    ::v-deep .is-dot {
-        top: 8px;
-    }
     ::v-deep .el-badge__content {
-        top: 8px;
+        top: 12px !important;
+        right: -2px !important;
     }
+    
+    ::v-deep .el-badge__content.is-dot {
+        top: 10px !important;
+        right: -2px !important;
+        width: 8px !important;
+        height: 8px !important;
+    }
+}
+
+.tab-label-normal {
+    display: inline-block;
 }
 
 .badgeLabel {

src/views/taskRecord.vue

@@ -581,8 +581,8 @@ export default {
       }
 
       .label {
-        color: #999999;
-      }
+          color: #999999;
+        }
 
       .text {
         color: #333333;
@@ -610,11 +610,11 @@ export default {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
-    }
+  }
 
     ::v-deep .el-form-item__label {
-      font-weight: normal;
-      color: #999999;
+    font-weight: normal;
+    color: #999999;
       padding-right: 8px;
     }