diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index 2462425..c58569e 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -215,8 +215,14 @@ const handleCommand = (command: string) => { //用深度监听 消息 watch( () => noticeStore.state.value.notices, - (newVal) => { + async (newVal) => { newNotice.value = newVal.filter((item: any) => !item.read).length; + //监听到消息变化,刷新告警列表 + await warningListStore.getWarningList({ + status: 0, + pageNum: 1, + pageSize: 300 + }); }, { deep: true } ); diff --git a/src/store/modules/warnningList.ts b/src/store/modules/warnningList.ts index 2967a04..a0ace2f 100644 --- a/src/store/modules/warnningList.ts +++ b/src/store/modules/warnningList.ts @@ -1,3 +1,5 @@ +/** 此数据源跟表列不一致,(后端接口重复使用因逻辑复杂, 经商定不动后端接口, 设置此数据源) 适用于消息 */ +/** 抽取公用代码更加复杂模糊-暂存数据源 */ import { listDemo, updateDemo } from '@/api/WarningList/index'; import { defineStore } from 'pinia'; import { ref, computed } from 'vue'; @@ -5,14 +7,11 @@ import { any } from 'vue-types'; export const useWarningListStore = defineStore('warningListStore', () => { // --- State (状态) --- - // 相当于 Vuex 中的 state,用 ref 或 reactive 定义 const warningList = ref(); const warningListTotal = ref(0); // --- Getters (计算属性) --- - // 相当于 Vuex 中的 getters,直接用 computed 定义 // --- Actions (动作) --- - // 相当于 Vuex 中的 actions/mutations,直接写同步或异步函数 async function getWarningList(query?: any) { try { const response = await listDemo({ diff --git a/src/views/WarningList/list.vue b/src/views/WarningList/list.vue index 5e7e6c3..844c5d4 100644 --- a/src/views/WarningList/list.vue +++ b/src/views/WarningList/list.vue @@ -301,4 +301,10 @@ onMounted(() => { getList(); getDeviceName(); }); + +//监听数据源变化,自动刷新列表 +watch(warningListTotal, async (newVal) => { + console.log('监听到报警列表变化,自动刷新列表', newVal); + await getList(); +});