fix(alarm-page): use getTableData if enable realtimeRefresh

.env

@@ -16,7 +16,7 @@ VITE_LAMP_PASSWORD = fjoc(1KHP(Ls&Bje)C
 VITE_LAMP_AUTHORIZATION = Y3VlZGVzX2FkbWluOmN1ZWRlc19hZG1pbl9zZWNyZXQ=
 
 # 当需要重置localStorage时, 修改此变量
-VITE_STORAGE_VERSION = 1
+VITE_STORAGE_VERSION = 2
 
 # 调试授权码
 VITE_DEBUG_CODE = ndm_debug

src/App.vue

@@ -13,13 +13,13 @@ const GlobalFeedback = defineComponent({
 <script setup lang="ts">
 import { dateZhCN, NConfigProvider, NDialogProvider, NLoadingBarProvider, NMessageProvider, NNotificationProvider, useDialog, useLoadingBar, useMessage, useNotification, zhCN } from 'naive-ui';
 import { defineComponent } from 'vue';
-import { useThemeStore } from '@/stores/theme';
+import { useSettingStore } from '@/stores';
 import { storeToRefs } from 'pinia';
 import { VueQueryDevtools } from '@tanstack/vue-query-devtools';
 import { useVersionCheckQuery } from './composables/query';
 
-const themeStore = useThemeStore();
-const { themeMode } = storeToRefs(themeStore);
+const settingStore = useSettingStore();
+const { themeMode } = storeToRefs(settingStore);
 
 useVersionCheckQuery();
 </script>

src/apis/model/biz/entity/video/index.ts

@@ -1,4 +1,5 @@
 export * from './ndm-camera';
+export * from './ndm-camera-ignore';
 export * from './ndm-decoder';
 export * from './ndm-keyboard';
 export * from './ndm-media-server';

src/apis/model/biz/entity/video/ndm-camera-ignore.ts

@@ -0,0 +1,14 @@
+import type { BaseModel, ReduceForPageQuery, ReduceForSaveVO, ReduceForUpdateVO } from '@/apis';
+
+export interface NdmCameraIgnore extends BaseModel {
+  deviceId: string;
+  ignoreType: string;
+}
+
+export type NdmCameraIgnoreResultVO = Partial<NdmCameraIgnore>;
+
+export type NdmCameraIgnoreSaveVO = Partial<Omit<NdmCameraIgnore, ReduceForSaveVO>>;
+
+export type NdmCameraIgnoreUpdateVO = Partial<Omit<NdmCameraIgnore, ReduceForUpdateVO>>;
+
+export type NdmCameraIgnorePageQuery = Partial<Omit<NdmCameraIgnore, ReduceForPageQuery>>;

src/apis/request/biz/video/index.ts

@@ -1,4 +1,5 @@
 export * from './ndm-camera';
+export * from './ndm-camera-ignore';
 export * from './ndm-decoder';
 export * from './ndm-keyboard';
 export * from './ndm-media-server';

src/apis/request/biz/video/ndm-camera-ignore.ts

@@ -0,0 +1,66 @@
+import { ndmClient, userClient, type NdmCameraIgnorePageQuery, type NdmCameraIgnoreResultVO, type NdmCameraIgnoreSaveVO, type NdmCameraIgnoreUpdateVO, type PageParams, type PageResult } from '@/apis';
+
+export const pageCameraIgnoreApi = async (pageQuery: PageParams<NdmCameraIgnorePageQuery>, options?: { stationCode?: string; signal?: AbortSignal }) => {
+  const { stationCode, signal } = options ?? {};
+  const client = stationCode ? ndmClient : userClient;
+  const prefix = stationCode ? `/${stationCode}` : '';
+  const endpoint = `${prefix}/api/ndm/ndmCameraIgnore/page`;
+  const resp = await client.post<PageResult<NdmCameraIgnoreResultVO>>(endpoint, pageQuery, { signal });
+  const [err, data] = resp;
+  if (err || !data) {
+    throw err;
+  }
+  return data;
+};
+
+export const detailCameraIgnoreApi = async (id: string, options?: { stationCode?: string; signal?: AbortSignal }) => {
+  const { stationCode, signal } = options ?? {};
+  const client = stationCode ? ndmClient : userClient;
+  const prefix = stationCode ? `/${stationCode}` : '';
+  const endpoint = `${prefix}/api/ndm/ndmCameraIgnore/detail`;
+  const resp = await client.get<NdmCameraIgnoreResultVO>(endpoint, { params: { id }, signal });
+  const [err, data] = resp;
+  if (err || !data) {
+    throw err;
+  }
+  return data;
+};
+
+export const saveCameraIgnoreApi = async (saveVO: NdmCameraIgnoreSaveVO, options?: { stationCode?: string; signal?: AbortSignal }) => {
+  const { stationCode, signal } = options ?? {};
+  const client = stationCode ? ndmClient : userClient;
+  const prefix = stationCode ? `/${stationCode}` : '';
+  const endpoint = `${prefix}/api/ndm/ndmCameraIgnore`;
+  const resp = await client.post<NdmCameraIgnoreResultVO>(endpoint, saveVO, { signal });
+  const [err, data] = resp;
+  if (err || !data) {
+    throw err;
+  }
+  return data;
+};
+
+export const updateCameraIgnoreApi = async (updateVO: NdmCameraIgnoreUpdateVO, options?: { stationCode?: string; signal?: AbortSignal }) => {
+  const { stationCode, signal } = options ?? {};
+  const client = stationCode ? ndmClient : userClient;
+  const prefix = stationCode ? `/${stationCode}` : '';
+  const endpoint = `${prefix}/api/ndm/ndmCameraIgnore`;
+  const resp = await client.put<NdmCameraIgnoreResultVO>(endpoint, updateVO, { signal });
+  const [err, data] = resp;
+  if (err || !data) {
+    throw err;
+  }
+  return data;
+};
+
+export const removeCameraIgnoreApi = async (ids: string[], options?: { stationCode?: string; signal?: AbortSignal }) => {
+  const { stationCode, signal } = options ?? {};
+  const client = stationCode ? ndmClient : userClient;
+  const prefix = stationCode ? `/${stationCode}` : '';
+  const endpoint = `${prefix}/api/ndm/ndmCameraIgnore`;
+  const resp = await client.delete<boolean>(endpoint, ids, { signal });
+  const [err, data] = resp;
+  if (err || !data) {
+    throw err;
+  }
+  return data;
+};

src/components/device-page/device-card/camera-card.vue

@@ -1,18 +1,19 @@
 <script setup lang="ts">
 import type { NdmCameraDiagInfo, NdmCameraResultVO } from '@/apis';
-import { useDebugModeStore } from '@/stores';
-import destr from 'destr';
+import { CameraHistoryDiagCard, DeviceCommonCard, DeviceHeaderCard } from '@/components';
+import { useSettingStore } from '@/stores';
+import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
 import { computed, ref, toRefs } from 'vue';
-import { DeviceCommonCard, DeviceHeaderCard } from './current-diag-card';
-import { CameraHistoryDiagCard } from './history-diag-card';
+import { storeToRefs } from 'pinia';
 
 const props = defineProps<{
   stationCode: string;
   ndmCamera: NdmCameraResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmCamera } = toRefs(props);
 
@@ -74,7 +75,7 @@ const selectedTab = ref('设备状态');
         <CameraHistoryDiagCard :station-code="stationCode" :ndm-camera="ndmCamera" :key="ndmCamera.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmCamera, lastDiagInfo } }}</pre>
       </NTabPane>
     </NTabs>

src/components/device-page/device-card/current-diag-card/device-header-card.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { detailDeviceApi, probeDeviceApi, type NdmDeviceResultVO } from '@/apis';
 import { DeviceType, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums';
-import { useLineDevicesStore } from '@/stores';
+import { useDeviceStore } from '@/stores';
 import { useMutation } from '@tanstack/vue-query';
 import { ApiOutlined, ReloadOutlined } from '@vicons/antd';
 import { NButton, NCard, NFlex, NIcon, NTag, NTooltip } from 'naive-ui';
@@ -62,7 +62,7 @@ const { mutate: getDeviceDetail, isPending: loading } = useMutation({
   },
   onSuccess: (device) => {
     if (device) {
-      useLineDevicesStore().patch(stationCode.value, device);
+      useDeviceStore().patch(stationCode.value, device);
     }
   },
   onError: (error) => {

src/components/device-page/device-card/decoder-card.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import type { NdmDecoderDiagInfo, NdmDecoderResultVO } from '@/apis';
 import { DecoderHistoryDiagCard, DeviceCommonCard, DeviceHardwareCard, DeviceHeaderCard } from '@/components';
-import { useDebugModeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { computed, ref, toRefs } from 'vue';
 
 const props = defineProps<{
@@ -11,7 +12,8 @@ const props = defineProps<{
   ndmDecoder: NdmDecoderResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmDecoder } = toRefs(props);
 
@@ -53,7 +55,7 @@ const selectedTab = ref('设备状态');
         <DecoderHistoryDiagCard :station-code="stationCode" :ndm-decoder="ndmDecoder" :key="ndmDecoder.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmDecoder, lastDiagInfo } }}</pre>
       </NTabPane>
     </NTabs>

src/components/device-page/device-card/keyboard-card.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
 import type { NdmKeyboardResultVO } from '@/apis';
 import { DeviceHeaderCard, KeyboardHistoryDiagCard } from '@/components';
-import { useDebugModeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { ref, toRefs } from 'vue';
 
 const props = defineProps<{
@@ -10,7 +11,8 @@ const props = defineProps<{
   ndmKeyboard: NdmKeyboardResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmKeyboard } = toRefs(props);
 
@@ -30,7 +32,7 @@ const selectedTab = ref('设备状态');
         <KeyboardHistoryDiagCard :station-code="stationCode" :ndm-keyboard="ndmKeyboard" :key="ndmKeyboard.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmKeyboard } }}</pre>
       </NTabPane>
     </NTabs>

src/components/device-page/device-card/nvr-card.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import type { NdmNvrDiagInfo, NdmNvrResultVO } from '@/apis';
 import { DeviceCommonCard, DeviceHardwareCard, DeviceHeaderCard, isNvrCluster, NvrDiskCard, NvrHistoryDiagCard, NvrRecordDiagCard } from '@/components';
-import { useDebugModeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { computed, ref, toRefs } from 'vue';
 
 const props = defineProps<{
@@ -11,7 +12,8 @@ const props = defineProps<{
   ndmNvr: NdmNvrResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmNvr } = toRefs(props);
 
@@ -63,7 +65,7 @@ const selectedTab = ref('设备状态');
         <NvrHistoryDiagCard :station-code="stationCode" :ndm-nvr="ndmNvr" :key="ndmNvr.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmNvr, lastDiagInfo } }}</pre>
       </NTabPane>
     </NTabs>

src/components/device-page/device-card/security-box-card.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import type { NdmSecurityBoxDiagInfo, NdmSecurityBoxResultVO } from '@/apis';
 import { DeviceCommonCard, DeviceHardwareCard, DeviceHeaderCard, SecurityBoxCircuitCard, SecurityBoxHistoryDiagCard, SecurityBoxInfoCard } from '@/components';
-import { useDebugModeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { computed, ref, toRefs } from 'vue';
 
 const props = defineProps<{
@@ -11,7 +12,8 @@ const props = defineProps<{
   ndmSecurityBox: NdmSecurityBoxResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmSecurityBox } = toRefs(props);
 
@@ -62,7 +64,7 @@ const selectedTab = ref('设备状态');
         <SecurityBoxHistoryDiagCard :station-code="stationCode" :ndm-security-box="ndmSecurityBox" :key="ndmSecurityBox.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmSecurityBox, lastDiagInfo } }}</pre>
       </NTabPane>
     </NTabs>

src/components/device-page/device-card/server-card.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import type { NdmServerDiagInfo, NdmServerResultVO } from '@/apis';
 import { DeviceHardwareCard, DeviceHeaderCard, ServerHistoryDiagCard } from '@/components';
-import { useDebugModeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { computed, ref, toRefs } from 'vue';
 
 const props = defineProps<{
@@ -11,7 +12,8 @@ const props = defineProps<{
   ndmServer: NdmServerResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmServer } = toRefs(props);
 
@@ -44,7 +46,7 @@ const selectedTab = ref('设备状态');
         <ServerHistoryDiagCard :station-code="stationCode" :ndm-server="ndmServer" :key="ndmServer.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmServer, lastDiagInfo } }}</pre>
       </NTabPane>
     </NTabs>

src/components/device-page/device-card/switch-card.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import type { NdmSwitchDiagInfo, NdmSwitchResultVO } from '@/apis';
 import { DeviceHardwareCard, DeviceHeaderCard, SwitchHistoryDiagCard, SwitchPortCard } from '@/components';
-import { useDebugModeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { computed, ref, toRefs } from 'vue';
 
 const props = defineProps<{
@@ -11,7 +12,8 @@ const props = defineProps<{
   ndmSwitch: NdmSwitchResultVO;
 }>();
 
-const debugModeStore = useDebugModeStore();
+const settingStore = useSettingStore();
+const { debugModeEnabled } = storeToRefs(settingStore);
 
 const { stationCode, ndmSwitch } = toRefs(props);
 
@@ -45,7 +47,7 @@ const selectedTab = ref('设备状态');
         <SwitchHistoryDiagCard :station-code="stationCode" :ndm-switch="ndmSwitch" :key="ndmSwitch.id" />
       </NTabPane>
       <!-- <NTabPane name="设备配置" tab="设备配置"></NTabPane> -->
-      <NTabPane v-if="debugModeStore.debugEnabled" name="原始数据" tab="原始数据">
+      <NTabPane v-if="debugModeEnabled" name="原始数据" tab="原始数据">
         <pre class="raw-data">{{ { ...ndmSwitch, lastDiagInfo } }}</pre>
       </NTabPane>
     </NTabs>

src/components/global/settings-drawer.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import type { VersionInfo } from '@/apis';
 import { ThemeSwitch } from '@/components';
-import { STATION_LIST_QUERY_KEY } from '@/constants';
-import { useDebugModeStore, useLayoutStore, useQueryControlStore } from '@/stores';
+import { LINE_STATIONS_QUERY_KEY } from '@/constants';
+import { useSettingStore, usePollingStore } from '@/stores';
 import { getAppEnvConfig } from '@/utils';
 import { useQueryClient } from '@tanstack/vue-query';
 import { useEventListener } from '@vueuse/core';
@@ -16,16 +16,16 @@ const route = useRoute();
 
 const show = defineModel<boolean>('show');
 
-const layoutStore = useLayoutStore();
-const { stationGridColumns } = storeToRefs(layoutStore);
-const queryControlStore = useQueryControlStore();
-const { stationVerifyMode } = storeToRefs(queryControlStore);
+const settingStore = useSettingStore();
+const { stationGridColumns, debugModeEnabled } = storeToRefs(settingStore);
+const pollingStore = usePollingStore();
+const { stationVerifyMode } = storeToRefs(pollingStore);
 
 const queryClient = useQueryClient();
 watch(stationVerifyMode, () => {
-  queryClient.cancelQueries({ queryKey: [STATION_LIST_QUERY_KEY] });
-  queryClient.invalidateQueries({ queryKey: [STATION_LIST_QUERY_KEY] });
-  queryClient.refetchQueries({ queryKey: [STATION_LIST_QUERY_KEY] });
+  queryClient.cancelQueries({ queryKey: [LINE_STATIONS_QUERY_KEY] });
+  queryClient.invalidateQueries({ queryKey: [LINE_STATIONS_QUERY_KEY] });
+  queryClient.refetchQueries({ queryKey: [LINE_STATIONS_QUERY_KEY] });
 });
 
 const versionInfo = ref<VersionInfo>({ version: '', buildTime: '' });
@@ -35,8 +35,6 @@ onMounted(async () => {
   versionInfo.value = data;
 });
 
-const debugModeStore = useDebugModeStore();
-const { debugEnabled } = storeToRefs(debugModeStore);
 const debugCodeModalShow = ref(false);
 const debugCode = ref('');
 const enableDebug = () => {
@@ -47,11 +45,11 @@ const enableDebug = () => {
   }
   debugCodeModalShow.value = false;
   debugCode.value = '';
-  debugModeStore.enableDebug();
+  settingStore.enableDebugMode();
 };
 const disableDebug = () => {
   debugCodeModalShow.value = false;
-  debugModeStore.disableDebug();
+  settingStore.disableDebugMode();
 };
 
 useEventListener('keydown', (event) => {
@@ -76,7 +74,7 @@ useEventListener('keydown', (event) => {
             <NInputNumber v-model:value="stationGridColumns" :min="1" :max="10" />
           </NFormItem>
         </template>
-        <template v-if="debugEnabled">
+        <template v-if="debugModeEnabled">
           <NDivider>调试</NDivider>
           <NFormItem label="车站Ping模式" label-placement="left">
             <NRadioGroup v-model:value="stationVerifyMode">
@@ -96,13 +94,13 @@ useEventListener('keydown', (event) => {
 
   <NModal v-model:show="debugCodeModalShow" preset="dialog" type="info">
     <template #header>
-      <NText v-if="!debugEnabled">请输入调试授权码</NText>
+      <NText v-if="!debugModeEnabled">请输入调试授权码</NText>
       <NText v-else>确认关闭调试模式</NText>
     </template>
-    <NInput v-if="!debugEnabled" v-model:value="debugCode" placeholder="输入授权码" />
+    <NInput v-if="!debugModeEnabled" v-model:value="debugCode" placeholder="输入授权码" />
     <template #action>
       <NButton @click="debugCodeModalShow = false">取消</NButton>
-      <NButton v-if="!debugEnabled" type="primary" @click="enableDebug">启用</NButton>
+      <NButton v-if="!debugModeEnabled" type="primary" @click="enableDebug">启用</NButton>
       <NButton v-else type="primary" @click="disableDebug">确认</NButton>
     </template>
   </NModal>

src/components/global/theme-switch.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import { useThemeStore } from '@/stores';
+import { useSettingStore } from '@/stores';
 import { MoonOutline, SunnyOutline } from '@vicons/ionicons5';
 import { NIcon, NSwitch } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import type { ComponentInstance } from 'vue';
 
-const themeStore = useThemeStore();
-const { darkThemeEnabled } = storeToRefs(themeStore);
+const settingStore = useSettingStore();
+const { darkThemeEnabled } = storeToRefs(settingStore);
 
 defineExpose({} as ComponentInstance<typeof NSwitch>);
 </script>

src/components/station-page/device-params-config-modal.vue

@@ -68,7 +68,7 @@ const getItemSuffix = (name: string) => {
 </script>
 
 <script setup lang="ts">
-import { pageDefParameterApi, updateDefParameterApi, type Station } from '@/apis';
+import { pageDefParameterApi, resetMonitorScheduleApi, updateDefParameterApi, type Station } from '@/apis';
 import { useMutation } from '@tanstack/vue-query';
 import { NForm, NFormItemGi, NGrid, NInputNumber, NModal, NTabPane, NTabs, NTimePicker, NSpin, NFlex } from 'naive-ui';
 import { ref, toRefs } from 'vue';
@@ -201,6 +201,7 @@ const { mutate: saveDeviceParams } = useMutation({
         );
       }
     }
+    await resetMonitorScheduleApi({ stationCode: station.value.code });
   },
   onError: (error) => {
     console.error(error);

src/composables/query/alarm/index.ts

@@ -1 +0,0 @@
-export * from './use-line-alarms-query';

src/composables/query/device/index.ts

@@ -1 +0,0 @@
-export * from './use-line-devices-query';

src/composables/query/index.ts

@@ -1,4 +1,4 @@
-export * from './alarm';
-export * from './device';
-export * from './station';
-export * from './system';
+export * from './use-line-alarms-query';
+export * from './use-line-devices-query';
+export * from './use-station-list-query';
+export * from './use-version-check-query';

src/composables/query/station/index.ts

@@ -1 +0,0 @@
-export * from './use-station-list-query';

src/composables/query/system/index.ts

@@ -1 +0,0 @@
-export * from './use-version-check-query';

src/composables/query/use-line-alarms-query.ts

@@ -1,7 +1,7 @@
 import { pageDeviceAlarmLogApi, type Station, type StationAlarmCounts } from '@/apis';
 import { LINE_ALARMS_QUERY_KEY } from '@/constants';
 import { DeviceType, tryGetDeviceTypeVal } from '@/enums';
-import { useLineAlarmsStore, useQueryControlStore, useStationStore } from '@/stores';
+import { useAlarmStore, usePollingStore, useStationStore } from '@/stores';
 import { runTask } from '@/utils';
 import { isCancelledError, useMutation, useQuery } from '@tanstack/vue-query';
 import dayjs from 'dayjs';
@@ -25,8 +25,8 @@ const createEmptyStationAlarmCounts = () => {
 export function useLineAlarmsQuery() {
   const stationStore = useStationStore();
   const { stationList } = storeToRefs(stationStore);
-  const queryControlStore = useQueryControlStore();
-  const { alarmQueryStamp } = storeToRefs(queryControlStore);
+  const pollingStore = usePollingStore();
+  const { alarmQueryStamp } = storeToRefs(pollingStore);
   const { mutateAsync: getStationAlarmCounts } = useStationAlarmCountsMutation();
 
   return useQuery({
@@ -42,7 +42,7 @@ export function useLineAlarmsQuery() {
         await getStationAlarmCounts({ station, signal });
       }
       console.timeEnd('useLineALarmCountsQuery');
-      // queryControlStore.updateAlarmQueryUpdatedAt();
+      // pollingStore.updateAlarmQueryUpdatedAt();
       return null;
     },
   });
@@ -54,7 +54,7 @@ interface StationAlarmCountsMutationParams {
 }
 
 function useStationAlarmCountsMutation() {
-  const lineAlarmsStore = useLineAlarmsStore();
+  const lineAlarmsStore = useAlarmStore();
   const { lineAlarmCounts } = storeToRefs(lineAlarmsStore);
 
   return useMutation<StationAlarmCounts, Error, StationAlarmCountsMutationParams>({

src/composables/query/use-line-devices-query.ts

@@ -1,7 +1,7 @@
 import { ndmClient, type Station, type StationDevices } from '@/apis';
 import { LINE_DEVICES_QUERY_KEY } from '@/constants';
 import { DeviceType } from '@/enums';
-import { useLineDevicesStore, useQueryControlStore, useStationStore } from '@/stores';
+import { useDeviceStore, usePollingStore, useStationStore } from '@/stores';
 import { runTask } from '@/utils';
 import { isCancelledError, useMutation, useQuery } from '@tanstack/vue-query';
 import { storeToRefs } from 'pinia';
@@ -32,8 +32,8 @@ const getNdmDevicesAll = async (stationCode: string, signal?: AbortSignal) => {
 export function useLineDevicesQuery() {
   const stationStore = useStationStore();
   const { stationList } = storeToRefs(stationStore);
-  const queryControlStore = useQueryControlStore();
-  const { deviceQueryStamp } = storeToRefs(queryControlStore);
+  const pollingStore = usePollingStore();
+  const { deviceQueryStamp } = storeToRefs(pollingStore);
   const { mutateAsync: getStationDevices } = useStationDevicesMutation();
 
   return useQuery({
@@ -49,7 +49,7 @@ export function useLineDevicesQuery() {
         await getStationDevices({ station, signal });
       }
       console.timeEnd('useLineDevicesQuery');
-      // queryControlStore.updateDeviceQueryUpdatedAt();
+      // pollingStore.updateDeviceQueryUpdatedAt();
       return null;
     },
   });
@@ -61,7 +61,7 @@ interface StationDevicesMutationParams {
 }
 
 function useStationDevicesMutation() {
-  const lineDevicesStore = useLineDevicesStore();
+  const lineDevicesStore = useDeviceStore();
   const { lineDevices } = storeToRefs(lineDevicesStore);
 
   return useMutation<StationDevices, Error, StationDevicesMutationParams>({

src/composables/query/use-station-list-query.ts

@@ -1,6 +1,6 @@
 import { batchVerifyApi, verifyApi, type Station } from '@/apis';
-import { STATION_LIST_QUERY_KEY } from '@/constants';
-import { useQueryControlStore, useStationStore } from '@/stores';
+import { LINE_STATIONS_QUERY_KEY } from '@/constants';
+import { usePollingStore, useStationStore } from '@/stores';
 import { getAppEnvConfig } from '@/utils';
 import { isCancelledError, useMutation, useQuery } from '@tanstack/vue-query';
 import axios from 'axios';
@@ -8,13 +8,13 @@ import dayjs from 'dayjs';
 import { storeToRefs } from 'pinia';
 import { computed } from 'vue';
 
-export function useStationListQuery() {
-  const queryControlStore = useQueryControlStore();
-  const { pollingEnabled } = storeToRefs(queryControlStore);
-  const { mutateAsync: getStationList } = useStationListMutation();
+export function useLineStationsQuery() {
+  const pollingStore = usePollingStore();
+  const { pollingEnabled } = storeToRefs(pollingStore);
+  const { mutateAsync: getStationList } = useLineStationsMutation();
 
   return useQuery({
-    queryKey: computed(() => [STATION_LIST_QUERY_KEY]),
+    queryKey: computed(() => [LINE_STATIONS_QUERY_KEY]),
     enabled: computed(() => pollingEnabled.value),
     refetchInterval: getAppEnvConfig().requestInterval * 1000,
     staleTime: getAppEnvConfig().requestInterval * 1000,
@@ -22,8 +22,8 @@ export function useStationListQuery() {
       console.time('useStationListQuery');
       await getStationList({ signal });
       console.timeEnd('useStationListQuery');
-      queryControlStore.updateDeviceQueryStamp();
-      queryControlStore.updateAlarmQueryStamp();
+      pollingStore.updateDeviceQueryStamp();
+      pollingStore.updateAlarmQueryStamp();
       return null;
     },
   });
@@ -33,11 +33,11 @@ interface StationListMutationParams {
   signal?: AbortSignal;
 }
 
-function useStationListMutation() {
+function useLineStationsMutation() {
   const stationStore = useStationStore();
   const { stationList } = storeToRefs(stationStore);
-  const queryControlStore = useQueryControlStore();
-  const { stationVerifyMode } = storeToRefs(queryControlStore);
+  const pollingStore = usePollingStore();
+  const { stationVerifyMode } = storeToRefs(pollingStore);
   return useMutation<Station[], Error, StationListMutationParams>({
     mutationFn: async ({ signal }) => {
       const { data: ndmStationList } = await axios.get<{ code: string; name: string }[]>(`/minio/ndm/ndm-stations.json?_t=${dayjs().unix()}`, { signal });

src/composables/query/use-version-check-query.ts

@@ -1,19 +1,26 @@
-import { type VersionInfo } from '@/apis';
+import { verifyApi, type VersionInfo } from '@/apis';
+import { useUserStore } from '@/stores';
 import { useQuery } from '@tanstack/vue-query';
 import axios from 'axios';
 import { useThemeVars } from 'naive-ui';
+import { storeToRefs } from 'pinia';
 import { h, ref, watch } from 'vue';
 
 export function useVersionCheckQuery() {
   const localVersionInfo = ref<VersionInfo>();
   const dialogShow = ref<boolean>(false);
   const themeVars = useThemeVars();
+  const userStore = useUserStore();
+  const { userLoginResult } = storeToRefs(userStore);
 
   const { data: remoteVersionInfo, dataUpdatedAt } = useQuery({
     queryKey: ['version-check'],
     refetchInterval: 10 * 1000,
-    queryFn: async () => {
-      const { data } = await axios.get<VersionInfo>(`/manifest.json?t=${Date.now()}`);
+    queryFn: async ({ signal }) => {
+      if (!!userLoginResult.value?.token) {
+        await verifyApi({ signal });
+      }
+      const { data } = await axios.get<VersionInfo>(`/manifest.json?t=${Date.now()}`, { signal });
       return data;
     },
   });

src/composables/stomp/index.ts

@@ -1,6 +1,6 @@
 import type { NdmDeviceAlarmLogResultVO } from '@/apis';
 import { TOPIC_DEVICE_ALARM } from '@/constants';
-import { useCurrentAlarmsStore } from '@/stores';
+import { useAlarmStore } from '@/stores';
 import { Client } from '@stomp/stompjs';
 import { destr } from 'destr';
 import { storeToRefs } from 'pinia';
@@ -15,8 +15,8 @@ const getBrokerUrl = () => {
 };
 
 export const useStompClient = () => {
-  const currentAlarmsStore = useCurrentAlarmsStore();
-  const { currentAlarmCount } = storeToRefs(currentAlarmsStore);
+  const alarmStore = useAlarmStore();
+  const { unreadAlarmCount } = storeToRefs(alarmStore);
   const stompClient = ref<Client | null>(null);
 
   onMounted(() => {
@@ -30,7 +30,7 @@ export const useStompClient = () => {
         stompClient.value?.subscribe(TOPIC_DEVICE_ALARM, (message) => {
           const alarm = destr<NdmDeviceAlarmLogResultVO>(message.body);
           if (alarm.alarmCategory === '1') {
-            currentAlarmCount.value++;
+            unreadAlarmCount.value++;
           }
         });
       },

src/constants/query.ts

@@ -1,4 +1,3 @@
-export const STATION_LIST_QUERY_KEY = 'station-list';
+export const LINE_STATIONS_QUERY_KEY = 'line-stations';
 export const LINE_DEVICES_QUERY_KEY = 'line-devices';
 export const LINE_ALARMS_QUERY_KEY = 'line-alarms';
-export const DEVICE_SNMP_LOGS_QUERY_KEY = 'device-snmp-logs';

src/layouts/app-layout.vue

@@ -7,9 +7,9 @@ function renderIcon(icon: Component): () => VNode {
 <script setup lang="ts">
 import { SettingsDrawer } from '@/components';
 import { useStompClient } from '@/composables';
-import { useStationListQuery } from '@/composables';
-import { STATION_LIST_QUERY_KEY, LINE_DEVICES_QUERY_KEY, LINE_ALARMS_QUERY_KEY } from '@/constants';
-import { useCurrentAlarmsStore, useUserStore } from '@/stores';
+import { useLineStationsQuery } from '@/composables';
+import { LINE_STATIONS_QUERY_KEY, LINE_DEVICES_QUERY_KEY, LINE_ALARMS_QUERY_KEY } from '@/constants';
+import { useAlarmStore, useUserStore } from '@/stores';
 import { useIsFetching } from '@tanstack/vue-query';
 import { AlertFilled, BugFilled, CaretDownFilled, EnvironmentFilled, /* AreaChartOutlined, */ FileTextFilled, FundFilled, HddFilled, LogoutOutlined, SettingOutlined } from '@vicons/antd';
 import type { AxiosError } from 'axios';
@@ -23,10 +23,10 @@ useStompClient();
 const userStore = useUserStore();
 const { userInfo } = storeToRefs(userStore);
 
-const currentAlarmsStore = useCurrentAlarmsStore();
-const { currentAlarmCount, needReload } = storeToRefs(currentAlarmsStore);
+const alarmStore = useAlarmStore();
+const { unreadAlarmCount } = storeToRefs(alarmStore);
 
-const { error: stationListQueryError } = useStationListQuery();
+const { error: stationListQueryError } = useLineStationsQuery();
 
 watch(stationListQueryError, (newStationListQueryError) => {
   if (newStationListQueryError) {
@@ -34,11 +34,11 @@ watch(stationListQueryError, (newStationListQueryError) => {
   }
 });
 
-const stationListFetchingCount = useIsFetching({ queryKey: [STATION_LIST_QUERY_KEY] });
+const lineStationsFetchingCount = useIsFetching({ queryKey: [LINE_STATIONS_QUERY_KEY] });
 const lineDevicesFetchingCount = useIsFetching({ queryKey: [LINE_DEVICES_QUERY_KEY] });
 const lineAlarmsFetchingCount = useIsFetching({ queryKey: [LINE_ALARMS_QUERY_KEY] });
 const fetchingCount = computed(() => {
-  return stationListFetchingCount.value + lineDevicesFetchingCount.value + lineAlarmsFetchingCount.value;
+  return lineStationsFetchingCount.value + lineDevicesFetchingCount.value + lineAlarmsFetchingCount.value;
 });
 
 onBeforeMount(() => {
@@ -119,12 +119,13 @@ const selectDropdownOption = (key: string, option: DropdownOption) => {
   }
 };
 
-const toDashboardPage = () => router.push('/');
-const toAlarmPage = () => {
-  currentAlarmCount.value = 0;
-  if (route.path === '/alarm') {
-    needReload.value = true;
-  } else {
+const routeToDashboardPage = () => {
+  router.push('/dashboard');
+};
+
+const routeToAlarmPage = () => {
+  unreadAlarmCount.value = 0;
+  if (route.path !== '/alarm') {
     router.push('/alarm');
   }
 };
@@ -145,7 +146,7 @@ const openSettingsDrawer = () => {
         <NLayoutHeader bordered class="app-layout-header">
           <NFlex justify="space-between" align="center" :size="8" style="width: 100%; height: 100%">
             <NFlex>
-              <div style="font-size: 16px; font-weight: 500; margin-left: 16px; cursor: pointer" @click="toDashboardPage">网络设备管理平台</div>
+              <div style="font-size: 16px; font-weight: 500; margin-left: 16px; cursor: pointer" @click="routeToDashboardPage">网络设备管理平台</div>
               <NButton text size="tiny" :loading="fetchingCount > 0" />
             </NFlex>
             <NFlex align="center" :size="0" style="height: 100%">
@@ -173,8 +174,8 @@ const openSettingsDrawer = () => {
         </NLayoutContent>
         <NLayoutFooter bordered class="app-layout-footer">
           <NFlex :align="'center'" style="height: 100%; margin: 0 16px">
-            <NBadge :value="currentAlarmCount">
-              <NButton secondary strong @click="toAlarmPage">
+            <NBadge :value="unreadAlarmCount">
+              <NButton secondary strong @click="routeToAlarmPage">
                 <template #icon>
                   <NIcon :component="AlertFilled" />
                 </template>

src/pages/alarm-page.vue

@@ -1,10 +1,21 @@
 <script setup lang="ts">
-import { getCameraSnapApi, exportDeviceAlarmLogApi, pageDeviceAlarmLogApi, updateDeviceAlarmLogApi, type NdmDeviceAlarmLogResultVO } from '@/apis';
+import {
+  getCameraSnapApi,
+  exportDeviceAlarmLogApi,
+  pageDeviceAlarmLogApi,
+  updateDeviceAlarmLogApi,
+  pageCameraIgnoreApi,
+  saveCameraIgnoreApi,
+  removeCameraIgnoreApi,
+  type NdmDeviceAlarmLogResultVO,
+} from '@/apis';
 import { renderAlarmDateCell, renderAlarmTypeCell, renderDeviceTypeCell, renderFaultLevelCell } from '@/components';
 import { AlarmType, DeviceType, DeviceTypeCode, DeviceTypeName, FaultLevel, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums';
-import { useCurrentAlarmsStore, useStationStore } from '@/stores';
+import { useAlarmStore, useStationStore } from '@/stores';
 import { downloadByData } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
+import { CheckOutlined, EyeInvisibleOutlined, EyeOutlined } from '@vicons/antd';
+import { watchDebounced } from '@vueuse/core';
 import dayjs from 'dayjs';
 import {
   NForm,
@@ -17,7 +28,6 @@ import {
   NSelect,
   NGridItem,
   NDatePicker,
-  NTag,
   NPopconfirm,
   NModal,
   NImage,
@@ -25,19 +35,38 @@ import {
   type DataTableColumns,
   type DataTableRowData,
   type PaginationProps,
+  NFlex,
+  NSwitch,
 } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { ref, reactive, onBeforeMount, h, computed, watch } from 'vue';
 
-const currentAlarmsStore = useCurrentAlarmsStore();
-const { needReload } = storeToRefs(currentAlarmsStore);
-watch(needReload, async (newVal) => {
-  if (newVal) {
-    needReload.value = false;
+const alarmStore = useAlarmStore();
+const { unreadAlarmCount } = storeToRefs(alarmStore);
+
+const unreadCountCleared = computed(() => unreadAlarmCount.value === 0);
+
+// 未读告警数量被清零时，代表需要刷新告警表格数据
+watch(unreadCountCleared, (newValue, oldValue) => {
+  if (!oldValue && newValue) {
     onClickReset();
   }
 });
 
+const realtimeRefresh = ref(false);
+
+watchDebounced(
+  [unreadAlarmCount, realtimeRefresh],
+  ([unreadCount, refresh]) => {
+    if (unreadCount > 0 && refresh) {
+      getTableData();
+    }
+  },
+  {
+    debounce: 500,
+  },
+);
+
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
 
@@ -116,6 +145,9 @@ const snapPreviewShow = ref(false);
 const snapPreviewUrl = ref('');
 
 const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO & { snapUrl: string }> = [
+  // { title: '设备ID', key: 'deviceId' },
+  // { title: '故障编码', key: 'faultCode', align: 'center' },
+  // { title: '故障位置', key: 'faultLocation' },
   { title: '告警流水号', key: 'alarmNo' },
   {
     title: '告警时间',
@@ -148,8 +180,6 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO & { snapUrl: stri
     align: 'center',
     render: renderFaultLevelCell,
   },
-  // { title: '故障编码', key: 'faultCode', align: 'center' },
-  // { title: '故障位置', key: 'faultLocation' },
   { title: '故障描述', key: 'faultDescription' },
   { title: '修复建议', key: 'alarmRepairSuggestion' },
   {
@@ -198,30 +228,59 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO & { snapUrl: stri
     },
   },
   {
-    title: '告警确认',
-    key: 'alarmConfirm',
+    title: '操作',
+    key: 'action',
     align: 'center',
     render: (rowData) => {
-      if (rowData.alarmConfirm === '1') {
-        return h(NTag, { type: 'default' }, { default: () => '已确认' });
-      }
       const { id } = rowData;
       return h(
-        NPopconfirm,
+        NFlex,
         {
-          onPositiveClick: () => {
-            rowData.alarmConfirm = '1';
-            confirmAlarm({ id });
-          },
+          size: 'small',
+          justify: 'center',
+          align: 'center',
         },
         {
-          trigger: () => h(NButton, { type: 'info', size: 'small' }, { default: () => '确认' }),
-          default: () => '确认告警？',
+          default: () => [
+            rowData.alarmConfirm === '1'
+              ? h(NButton, { disabled: true, text: true, type: 'info', size: 'small' }, { icon: () => h(CheckOutlined) })
+              : h(
+                  NPopconfirm,
+                  {
+                    onPositiveClick: () => confirmAlarm({ id }),
+                  },
+                  {
+                    trigger: () => h(NButton, { text: true, type: 'info', size: 'small' }, { icon: () => h(CheckOutlined) }),
+                    default: () => '确认告警？',
+                  },
+                ),
+            tryGetDeviceTypeVal(rowData.deviceType) === DeviceType.Camera && [
+              h(
+                NPopconfirm,
+                {
+                  onPositiveClick: () => ignoreCamera({ id }),
+                },
+                {
+                  trigger: () => h(NButton, { text: true, type: 'info', size: 'small' }, { icon: () => h(EyeInvisibleOutlined) }),
+                  default: () => '忽略设备？',
+                },
+              ),
+              h(
+                NPopconfirm,
+                {
+                  onPositiveClick: () => noticeCamera({ id }),
+                },
+                {
+                  trigger: () => h(NButton, { text: true, type: 'info', size: 'small' }, { icon: () => h(EyeOutlined) }),
+                  default: () => '取消忽略设备？',
+                },
+              ),
+            ],
+          ],
         },
       );
     },
   },
-  // { title: '设备ID', key: 'deviceId' },
 ];
 
 const tableData = ref<DataTableRowData[]>([]);
@@ -302,8 +361,15 @@ const { mutateAsync: getSnapByDeviceId } = useMutation({
 
 const { mutate: confirmAlarm } = useMutation({
   mutationFn: async (params: { id?: string }) => {
+    const { id } = params;
+    if (id) {
+      const alarmLog = tableData.value.find((item) => item.id === id);
+      if (alarmLog) {
+        alarmLog['alarmConfirm'] = '1';
+      }
+    }
     await updateDeviceAlarmLogApi({
-      id: params.id,
+      id,
       alarmConfirm: '1',
     });
   },
@@ -320,6 +386,61 @@ const { mutate: confirmAlarm } = useMutation({
   },
 });
 
+const { mutate: ignoreCamera } = useMutation({
+  mutationFn: async (params: { id?: string }) => {
+    const { id } = params;
+    if (!id) return;
+    const alarmLog = tableData.value.find((item) => item.id === id);
+    if (!alarmLog) return;
+    const { records } = await pageCameraIgnoreApi({
+      model: { deviceId: alarmLog.deviceId },
+      extra: {},
+      current: 1,
+      size: 10,
+      sort: 'id',
+      order: 'descending',
+    });
+    const ignoredCamera = records.at(0);
+    if (ignoredCamera) {
+      window.$message.info('设备已被忽略');
+      return;
+    }
+    await saveCameraIgnoreApi({ deviceId: alarmLog.deviceId });
+    window.$message.success('忽略设备成功');
+  },
+  onError: (error) => {
+    console.error(error);
+    window.$message.error(error.message);
+  },
+});
+
+const { mutate: noticeCamera } = useMutation({
+  mutationFn: async (params: { id?: string }) => {
+    const { id } = params;
+    if (!id) return;
+    const alarmLog = tableData.value.find((item) => item.id === id);
+    if (!alarmLog) return;
+    const { records } = await pageCameraIgnoreApi({
+      model: { deviceId: alarmLog.deviceId },
+      extra: {},
+      current: 1,
+      size: 10,
+      sort: 'id',
+      order: 'descending',
+    });
+    if (records.length === 0) {
+      window.$message.info('设备未被忽略');
+      return;
+    }
+    await removeCameraIgnoreApi([...records.map((record) => record.id ?? '')]);
+    window.$message.success('取消忽略设备成功');
+  },
+  onError: (error) => {
+    console.error(error);
+    window.$message.error(error.message);
+  },
+});
+
 const { mutate: exportTableData, isPending: exporting } = useMutation({
   mutationFn: async () => {
     const data = await exportDeviceAlarmLogApi({
@@ -425,9 +546,11 @@ onBeforeMount(() => getTableData());
     <!-- 工具栏：横向、右对齐按钮） -->
     <div style="flex: 0 0 auto; display: flex; align-items: center; padding: 8px">
       <div style="font-size: medium">设备告警列表</div>
-      <NSpace style="margin-left: auto">
+      <NFlex align="center" style="margin-left: auto">
+        <div>实时刷新</div>
+        <NSwitch size="small" v-model:value="realtimeRefresh" />
         <NButton type="primary" :loading="exporting" @click="() => exportTableData()">导出</NButton>
-      </NSpace>
+      </NFlex>
     </div>
 
     <!-- 表格区域：填满剩余空间 -->

src/pages/dashboard-page.vue

@@ -2,7 +2,7 @@
 import { exportIcmpApi } from '@/apis';
 import { DeviceStatisticCard } from '@/components';
 import { useLineAlarmsQuery, useLineDevicesQuery } from '@/composables';
-import { useLineDevicesStore, useStationStore } from '@/stores';
+import { useDeviceStore, useStationStore } from '@/stores';
 import { downloadByData } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
 import dayjs from 'dayjs';
@@ -11,7 +11,7 @@ import { watch } from 'vue';
 
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
-const lineDevicesStore = useLineDevicesStore();
+const lineDevicesStore = useDeviceStore();
 const { lineDevices } = storeToRefs(lineDevicesStore);
 
 const { error: lineDevicesQueryError } = useLineDevicesQuery();

src/pages/debug-page.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import { useQueryControlStore } from '@/stores';
+import { usePollingStore } from '@/stores';
 import { NLayout, NLayoutContent } from 'naive-ui';
 import { onBeforeUnmount } from 'vue';
 
-const queryControlStore = useQueryControlStore();
-queryControlStore.disablePolling();
+const pollingStore = usePollingStore();
+pollingStore.disablePolling();
 onBeforeUnmount(() => {
-  queryControlStore.enablePolling();
+  pollingStore.enablePolling();
 });
 </script>
 

src/pages/device-page.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { DeviceRenderer, DeviceTree } from '@/components';
 import { useDeviceSelection, useLineDevicesQuery } from '@/composables';
-import { useLineDevicesStore, useStationStore } from '@/stores';
+import { useDeviceStore, useStationStore } from '@/stores';
 import { ChevronBack } from '@vicons/ionicons5';
 import { watchDebounced } from '@vueuse/core';
 import { NEmpty, NIcon, NLayout, NLayoutContent, NLayoutSider, NPageHeader, NScrollbar } from 'naive-ui';
@@ -13,7 +13,7 @@ import { useRoute, useRouter } from 'vue-router';
 const { error: lineDevicesQueryError } = useLineDevicesQuery();
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
-const lineDevicesStore = useLineDevicesStore();
+const lineDevicesStore = useDeviceStore();
 const { lineDevices } = storeToRefs(lineDevicesStore);
 
 const route = useRoute();

src/pages/station-page.vue

@@ -2,22 +2,22 @@
 import type { Station } from '@/apis';
 import { DeviceAlarmDetailModal, DeviceParamsConfigModal, OfflineDeviceDetailModal, StationCard } from '@/components';
 import { useLineAlarmsQuery, useLineDevicesQuery } from '@/composables';
-import { useLayoutStore, useLineAlarmsStore, useLineDevicesStore, useStationStore } from '@/stores';
+import { useAlarmStore, useDeviceStore, useSettingStore, useStationStore } from '@/stores';
 import { NGrid, NGi } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { ref, watch } from 'vue';
 
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
-const lineDevicesStore = useLineDevicesStore();
-const { lineDevices } = storeToRefs(lineDevicesStore);
-const lineAlarmsStore = useLineAlarmsStore();
-const { lineAlarmCounts } = storeToRefs(lineAlarmsStore);
+const deviceStore = useDeviceStore();
+const { lineDevices } = storeToRefs(deviceStore);
+const alarmStore = useAlarmStore();
+const { lineAlarmCounts } = storeToRefs(alarmStore);
 
 const { error: lineDevicesQueryError } = useLineDevicesQuery();
 const { error: lineAlarmsQueryError } = useLineAlarmsQuery();
-const layoutStore = useLayoutStore();
-const { stationGridColumns } = storeToRefs(layoutStore);
+const settingStore = useSettingStore();
+const { stationGridColumns } = storeToRefs(settingStore);
 
 watch([lineDevicesQueryError, lineAlarmsQueryError], ([newLineDevicesQueryError, newLineAlarmsQueryError]) => {
   if (newLineDevicesQueryError) {

src/stores/alarm.ts

@@ -2,10 +2,13 @@ import type { LineAlarmCounts } from '@/apis';
 import { defineStore } from 'pinia';
 import { ref } from 'vue';
 
-export const useLineAlarmsStore = defineStore('ndm-line-alarms-store', () => {
+export const useAlarmStore = defineStore('ndm-alarm-store', () => {
   const lineAlarmCounts = ref<LineAlarmCounts>({});
 
+  const unreadAlarmCount = ref(0);
+
   return {
     lineAlarmCounts,
+    unreadAlarmCount,
   };
 });

src/stores/current-alarms.ts

@@ -1,12 +0,0 @@
-import { defineStore } from 'pinia';
-import { ref } from 'vue';
-
-export const useCurrentAlarmsStore = defineStore('ndm-current-alarms-store', () => {
-  const currentAlarmCount = ref(0);
-  const needReload = ref(false);
-
-  return {
-    currentAlarmCount,
-    needReload,
-  };
-});

src/stores/debug-mode.ts

@@ -1,24 +0,0 @@
-import { defineStore } from 'pinia';
-import { ref } from 'vue';
-
-export const useDebugModeStore = defineStore(
-  'ndm-debug-mode-store',
-  () => {
-    const debugEnabled = ref(false);
-
-    const enableDebug = () => (debugEnabled.value = true);
-    const disableDebug = () => (debugEnabled.value = false);
-
-    return {
-      debugEnabled,
-      enableDebug,
-      disableDebug,
-    };
-  },
-  {
-    persist: {
-      pick: ['debugEnabled'],
-      storage: window.sessionStorage,
-    },
-  },
-);

src/stores/device.ts

@@ -3,14 +3,14 @@ import { tryGetDeviceTypeVal } from '@/enums';
 import { defineStore } from 'pinia';
 import { ref } from 'vue';
 
-export const useLineDevicesStore = defineStore('ndm-line-devices-store', () => {
+export const useDeviceStore = defineStore('ndm-device-store', () => {
   const lineDevices = ref<LineDevices>({});
 
   const patch = (stationCode: string, device: NdmDeviceResultVO) => {
     const deviceTypeVal = tryGetDeviceTypeVal(device.deviceType);
     if (!!deviceTypeVal) {
       if (lineDevices.value[stationCode]) {
-        const index = lineDevices.value[stationCode][deviceTypeVal].findIndex((d) => d.id === device.id);
+        const index = lineDevices.value[stationCode][deviceTypeVal].findIndex((dev) => dev.id === device.id);
         if (index > -1) {
           lineDevices.value[stationCode][deviceTypeVal][index] = device;
         }

src/stores/index.ts

@@ -1,9 +1,6 @@
-export * from './current-alarms';
-export * from './debug-mode';
-export * from './layout';
-export * from './line-alarms';
-export * from './line-devices';
-export * from './query-control';
+export * from './alarm';
+export * from './device';
+export * from './polling';
 export * from './station';
-export * from './theme';
+export * from './setting';
 export * from './user';

src/stores/layout.ts

@@ -1,16 +0,0 @@
-import { defineStore } from 'pinia';
-import { ref } from 'vue';
-
-export const useLayoutStore = defineStore(
-  'ndm-layout-store',
-  () => {
-    const stationGridColumns = ref(6);
-
-    return {
-      stationGridColumns,
-    };
-  },
-  {
-    persist: true,
-  },
-);

src/stores/polling.ts

@@ -2,8 +2,8 @@ import dayjs from 'dayjs';
 import { defineStore } from 'pinia';
 import { ref } from 'vue';
 
-export const useQueryControlStore = defineStore(
-  'ndm-query-control-store',
+export const usePollingStore = defineStore(
+  'ndm-polling-store',
   () => {
     const pollingEnabled = ref(true);
     const enablePolling = () => (pollingEnabled.value = true);

src/stores/setting.ts

@@ -0,0 +1,46 @@
+import { darkTheme, lightTheme } from 'naive-ui';
+import { defineStore } from 'pinia';
+import { computed, ref } from 'vue';
+
+export const useSettingStore = defineStore(
+  'ndm-setting-store',
+  () => {
+    const darkThemeEnabled = ref(true);
+    const themeMode = computed(() => {
+      return darkThemeEnabled.value ? darkTheme : lightTheme;
+    });
+
+    const stationGridColumns = ref(6);
+
+    const debugModeEnabled = ref(false);
+    const enableDebugMode = () => {
+      debugModeEnabled.value = true;
+    };
+    const disableDebugMode = () => {
+      debugModeEnabled.value = false;
+    };
+
+    return {
+      darkThemeEnabled,
+      themeMode,
+
+      stationGridColumns,
+
+      debugModeEnabled,
+      enableDebugMode,
+      disableDebugMode,
+    };
+  },
+  {
+    persist: [
+      {
+        omit: ['debugModeEnabled'],
+        storage: window.localStorage,
+      },
+      {
+        pick: ['debugModeEnabled'],
+        storage: window.sessionStorage,
+      },
+    ],
+  },
+);

src/stores/theme.ts

@@ -1,21 +0,0 @@
-import { ref, computed } from 'vue';
-import { defineStore } from 'pinia';
-import { darkTheme, lightTheme } from 'naive-ui';
-
-export const useThemeStore = defineStore(
-  'ndm-theme-store',
-  () => {
-    const darkThemeEnabled = ref(true);
-    const themeMode = computed(() => {
-      return darkThemeEnabled.value ? darkTheme : lightTheme;
-    });
-
-    return {
-      darkThemeEnabled,
-      themeMode,
-    };
-  },
-  {
-    persist: true,
-  },
-);

src/stores/user.ts

@@ -6,7 +6,7 @@ import { defineStore } from 'pinia';
 import { computed, ref } from 'vue';
 import dayjs from 'dayjs';
 import { useStationStore } from './station';
-import { useQueryControlStore } from './query-control';
+import { usePollingStore } from './polling';
 
 const getHeaders = () => {
   const { lampAuthorization, lampClientId, lampClientSecret } = getAppEnvConfig();
@@ -131,8 +131,8 @@ export const useUserStore = defineStore(
             window.location.reload();
           },
         });
-        const queryControlStore = useQueryControlStore();
-        queryControlStore.disablePolling();
+        const pollingStore = usePollingStore();
+        pollingStore.disablePolling();
         throw new AxiosError(respData.msg, `${respData.code}`);
       } else {
         if (lampLoginResultRecord.value === null) {

src/utils/request-client.ts

@@ -106,7 +106,7 @@ export class RequestClient {
     const reqConfig = option ?? {};
     return new Promise((resolve) => {
       this.instance
-        .delete<Result<T>>(url, { ...reqConfig, data: { ids: idList } })
+        .delete<Result<T>>(url, { ...reqConfig, data: idList })
         .then((res) => {
           resolve([null, res.data.data, res.data]);
         })