fix: 修复消息中心已读计数更新问题

src/views/user/message/components/MyMessage.vue

@@ -1,6 +1,6 @@
 <template>
   <GiTable
-    v-model:selectedKeys="selectedKeys"
+    v-model:selected-keys="selectedKeys"
     row-key="id"
     :data="dataList"
     :columns="columns"
@@ -62,6 +62,7 @@ import { Message, Modal } from '@arco-design/web-vue'
 import { type MessageQuery, deleteMessage, listMessage, readAllMessage, readMessage } from '@/apis'
 import { useTable } from '@/hooks'
 import { useDict } from '@/hooks/app'
+import mittBus from '@/utils/mitt'
 
 defineOptions({ name: 'SystemMessage' })
 
@@ -70,7 +71,10 @@ const { message_type } = useDict('message_type')
 const queryForm = reactive<MessageQuery>({
   sort: ['createTime,desc'],
 })
-
+// 表格更新回调
+const onSuccess = () => {
+  mittBus.emit('count-refresh')
+}
 const {
   tableData: dataList,
   loading,
@@ -80,7 +84,7 @@ const {
   selectAll,
   search,
   handleDelete,
-} = useTable((page) => listMessage({ ...queryForm, ...page }), { immediate: true })
+} = useTable((page) => listMessage({ ...queryForm, ...page }), { immediate: true, onSuccess })
 
 const columns: TableInstance['columns'] = [
   {

src/views/user/message/index.vue

@@ -30,6 +30,7 @@ import MyMessage from './components/MyMessage.vue'
 import MyNotice from './components/MyNotice.vue'
 import { useDevice } from '@/hooks'
 import { type MessageResp, type NoticeResp, listMessage, listNotice } from '@/apis'
+import mittBus from '@/utils/mitt'
 
 defineOptions({ name: 'UserMessage' })
 
@@ -84,6 +85,9 @@ const getNoticeData = async () => {
 onMounted(() => {
   getMessageData()
   getNoticeData()
+  mittBus.on('count-refresh', () => {
+    getMessageData()
+  })
 })
 
 const menuList = [
@@ -152,7 +156,7 @@ const change = (key: string | number) => {
 
 :deep(.arco-tabs .arco-tabs-nav-type-card-gutter .arco-tabs-tab-active) {
   box-shadow: inset 0 2px 0 rgb(var(--primary-6)), inset -1px 0 0 var(--color-border-2),
-  inset 1px 0 0 var(--color-border-2);
+    inset 1px 0 0 var(--color-border-2);
   position: relative;
 }