refactor: tryGetDeviceTypeVal

src/components/dashboard-page/device-alarm-detail-modal.vue

@@ -5,7 +5,7 @@ import { ndmDeviceAlarmLogDefaultExportByTemplate, postNdmDeviceAlarmLogPage } f
 import type { StationAlarmCounts } from '@/composables/query';
 import { FaultLevel } from '@/enums/fault-level';
 import { AlarmType } from '@/enums/alarm-type';
-import { DeviceType, DeviceTypeCode, DeviceTypeName, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, DeviceTypeCode, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
 import { useQueryControlStore } from '@/stores/query-control';
 import { downloadByData } from '@/utils/download';
 import { useMutation } from '@tanstack/vue-query';
@@ -57,7 +57,9 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
     title: '设备类型',
     key: 'deviceType',
     render: (rowData) => {
-      return DeviceTypeName[getDeviceTypeVal(rowData.deviceType)];
+      const deviceTypeVal = tryGetDeviceTypeVal(rowData.deviceType);
+      if (!deviceTypeVal) return '-';
+      return DeviceTypeName[deviceTypeVal];
     },
     filter: true,
     filterMultiple: true,

src/components/dashboard-page/offline-device-detail-modal.vue

@@ -2,7 +2,7 @@
 import type { Station } from '@/apis/domains';
 import type { NdmDeviceVO } from '@/apis/models';
 import type { StationDevices } from '@/composables/query';
-import { DeviceType, DeviceTypeName, getDeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, DeviceTypeName, tryGetDeviceTypeVal } from '@/enums/device-type';
 import { useQueryControlStore } from '@/stores/query-control';
 import { NButton, NCol, NInput, NModal, NRow, NStatistic, NTree } from 'naive-ui';
 import type { TreeOption, TreeOverrideNodeClickBehavior, TreeProps } from 'naive-ui';
@@ -83,7 +83,7 @@ const treeData = computed<TreeOption[]>(() => {
                   path: '/device',
                   query: {
                     stationCode: station.value?.code,
-                    deviceType: getDeviceTypeVal(dev.deviceType),
+                    deviceType: tryGetDeviceTypeVal(dev.deviceType),
                     deviceDBId: dev.id,
                     from: route.path,
                   },
@@ -117,7 +117,7 @@ const nodeProps: TreeProps['nodeProps'] = ({ option }) => {
         path: '/device',
         query: {
           stationCode: station.value?.code,
-          deviceType: getDeviceTypeVal(device.deviceType),
+          deviceType: tryGetDeviceTypeVal(device.deviceType),
           deviceDBId: device.id,
           from: route.path,
         },

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { NdmDeviceResultVO } from '@/apis/models';
-import { DeviceType, DeviceTypeName, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
 import { NButton, NCard, NFlex, NTag } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
@@ -12,7 +12,11 @@ const props = defineProps<{
 
 const { device } = toRefs(props);
 
-const type = computed(() => DeviceTypeName[getDeviceTypeVal(device.value.deviceType)]);
+const type = computed(() => {
+  const deviceTypeVal = tryGetDeviceTypeVal(device.value.deviceType);
+  if (!deviceTypeVal) return '-';
+  return DeviceTypeName[deviceTypeVal];
+});
 const name = computed(() => device.value.name ?? '-');
 const ipAddr = computed(() => device.value.ipAddress ?? '-');
 const gbCode = computed(() => Reflect.get(device.value, 'gbCode') as string | undefined);
@@ -20,7 +24,8 @@ const status = computed(() => device.value.deviceStatus);
 
 const canOpenMgmtPage = computed(() => {
   const mgmtableDeviceTypes: DeviceTypeVal[] = [DeviceType['Camera'], DeviceType['Decoder'], DeviceType['Switch']];
-  return mgmtableDeviceTypes.includes(getDeviceTypeVal(device.value.deviceType));
+  const deviceTypeVal = tryGetDeviceTypeVal(device.value.deviceType);
+  return deviceTypeVal && mgmtableDeviceTypes.includes(deviceTypeVal);
 });
 
 const onClickOpenMgmtPage = () => {

src/components/device-page/device-card/history-diag-card/device-alarm-history-diag-card.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { NdmDeviceAlarmLogResultVO, NdmDeviceResultVO, NdmNvrResultVO, PageParams } from '@/apis/models';
 import { postNdmDeviceAlarmLogPage } from '@/apis/requests';
-import { DeviceType, getDeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, tryGetDeviceTypeVal } from '@/enums/device-type';
 import { useMutation } from '@tanstack/vue-query';
 import dayjs from 'dayjs';
 import { NButton, NCard, NDataTable, NPopover, NScrollbar, type DataTableColumns, type DataTableRowData, type DatePickerProps, type PaginationProps } from 'naive-ui';
@@ -33,7 +33,9 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
     key: 'faultDescription',
     render: (rowData) => {
       const isNvrCluster = (ndmDevice: NdmDeviceResultVO) => {
-        const isNvr = getDeviceTypeVal(ndmDevice.deviceType) === DeviceType.Nvr;
+        const deviceTypeVal = tryGetDeviceTypeVal(ndmDevice.deviceType);
+        if (!deviceTypeVal) return false;
+        const isNvr = deviceTypeVal === DeviceType.Nvr;
         if (!isNvr) return false;
         const maybeNvrCluster = ndmDevice as NdmNvrResultVO;
         return !!maybeNvrCluster.clusterList?.trim() && maybeNvrCluster.clusterList !== maybeNvrCluster.ipAddress;

src/components/device-page/device-renderer.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { NdmDeviceResultVO } from '@/apis/models';
-import { DeviceType, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
 import { computed, toRefs } from 'vue';
 
 import CameraCard from './device-card/camera-card.vue';
@@ -18,7 +18,7 @@ const props = defineProps<{
 
 const { stationCode, device } = toRefs(props);
 
-const deviceTypeVal = computed(() => getDeviceTypeVal(device.value.deviceType));
+const deviceTypeVal = computed(() => tryGetDeviceTypeVal(device.value.deviceType));
 </script>
 
 <template>
@@ -37,7 +37,7 @@ const deviceTypeVal = computed(() => getDeviceTypeVal(device.value.deviceType));
   <template v-if="deviceTypeVal === DeviceType.SecurityBox">
     <SecurityBoxCard :station-code="stationCode" :ndm-security-box="device" />
   </template>
-  <template v-if="([DeviceType.MediaServer, DeviceType.VideoServer] as DeviceTypeVal[]).includes(deviceTypeVal)">
+  <template v-if="!!deviceTypeVal && ([DeviceType.MediaServer, DeviceType.VideoServer] as DeviceTypeVal[]).includes(deviceTypeVal)">
     <ServerCard :station-code="stationCode" :ndm-server="device" />
   </template>
   <template v-if="deviceTypeVal === DeviceType.Switch">

src/components/device-page/device-tree.vue

@@ -12,7 +12,7 @@ const deviceTabPanes = Object.keys(DeviceType).map((key) => {
 import type { Station } from '@/apis/domains';
 import type { NdmDeviceResultVO, NdmNvrResultVO } from '@/apis/models';
 import type { LineDevices } from '@/composables/query';
-import { DeviceType, DeviceTypeName, getDeviceTypeVal, type DeviceTypeKey, type DeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeKey, type DeviceTypeVal } from '@/enums/device-type';
 import { destr } from 'destr';
 import {
   NButton,
@@ -216,8 +216,9 @@ const onClickLocateDeviceTree = () => {
   const stationCode = selectedStationCode.value;
   const device = selectedDevice.value;
   if (!stationCode || !device?.id) return;
-  if (device.deviceType) {
-    activeTab.value = getDeviceTypeVal(device.deviceType);
+  const deviceTypeVal = tryGetDeviceTypeVal(device.deviceType);
+  if (!!deviceTypeVal) {
+    activeTab.value = deviceTypeVal;
   }
 
   const expanded = [stationCode];

src/composables/device/use-device-selection.ts

@@ -1,5 +1,5 @@
 import type { NdmDeviceResultVO } from '@/apis/models';
-import { DeviceType, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
 import { ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import type { LineDevices } from '../query';
@@ -39,7 +39,10 @@ export function useDeviceSelection() {
   const selectDevice = (device: NdmDeviceResultVO, stationCode: string) => {
     selectedDevice.value = device;
     selectedStationCode.value = stationCode;
-    selectedDeviceType.value = getDeviceTypeVal(device.deviceType);
+    const deviceTypeVal = tryGetDeviceTypeVal(device.deviceType);
+    if (!!deviceTypeVal) {
+      selectedDeviceType.value = deviceTypeVal;
+    }
   };
 
   const syncToRoute = () => {

src/composables/query/alarm/use-line-alarm-counts-query.ts

@@ -8,7 +8,7 @@ import { computed } from 'vue';
 import dayjs from 'dayjs';
 import { postNdmDeviceAlarmLogPage } from '@/apis/requests';
 import type { Station } from '@/apis/domains';
-import { DeviceType, getDeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, tryGetDeviceTypeVal } from '@/enums/device-type';
 import type { StationAlarmCounts } from './domains';
 import { runTask } from '@/utils/run-task';
 
@@ -88,7 +88,10 @@ function useStationAlarmCountsMutation() {
         signal,
       );
       for (const alarm of alarmList) {
-        stationAlarmCounts[getDeviceTypeVal(alarm.deviceType)]++;
+        const deviceTypeVal = tryGetDeviceTypeVal(alarm.deviceType);
+        if (deviceTypeVal) {
+          stationAlarmCounts[deviceTypeVal]++;
+        }
       }
       stationAlarmCounts.unclassified = parseInt(total);
       return stationAlarmCounts;

src/enums/device-type.ts

@@ -34,11 +34,14 @@ export const DeviceTypeName: Record<DeviceTypeVal, string> = {
   [DeviceType.Keyboard]: '网络键盘',
 };
 
-export const getDeviceTypeVal = (devcieTypeCode?: string): DeviceTypeVal => {
+/**
+ * @deprecated
+ */
+export const getDeviceTypeVal = (deviceTypeCode?: string): DeviceTypeVal => {
   let result: DeviceTypeVal = DeviceType.Camera;
-  if (devcieTypeCode) {
+  if (deviceTypeCode) {
     for (const key in DeviceTypeCode) {
-      if (DeviceTypeCode[key as DeviceTypeVal].includes(devcieTypeCode)) {
+      if (DeviceTypeCode[key as DeviceTypeVal].includes(deviceTypeCode)) {
         result = key as DeviceTypeVal;
         break;
       }
@@ -46,3 +49,9 @@ export const getDeviceTypeVal = (devcieTypeCode?: string): DeviceTypeVal => {
   }
   return result;
 };
+
+export const tryGetDeviceTypeVal = (deviceTypeCode?: string) => {
+  if (!deviceTypeCode) return undefined;
+  const entry = Object.entries(DeviceTypeCode).find(([, codes]) => codes.includes(deviceTypeCode));
+  return entry?.[0] as DeviceTypeVal | undefined;
+};

src/pages/alarm-page.vue

@@ -3,7 +3,7 @@ import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
 import { ndmDeviceAlarmLogDefaultExportByTemplate, postNdmDeviceAlarmLogPage } from '@/apis/requests';
 import { FaultLevel } from '@/enums/fault-level';
 import { AlarmType } from '@/enums/alarm-type';
-import { DeviceType, DeviceTypeCode, DeviceTypeName, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
+import { DeviceType, DeviceTypeCode, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
 import { useCurrentAlarmsStore } from '@/stores/current-alarms';
 import { useStationStore } from '@/stores/station';
 import { downloadByData } from '@/utils/download';
@@ -79,7 +79,9 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
     title: '设备类型',
     key: 'deviceType',
     render: (rowData) => {
-      return DeviceTypeName[getDeviceTypeVal(rowData.deviceType)];
+      const deviceTypeVal = tryGetDeviceTypeVal(rowData.deviceType);
+      if (!deviceTypeVal) return '-';
+      return DeviceTypeName[deviceTypeVal];
     },
   },
   { title: '设备名称', key: 'deviceName' },

src/stores/line-devices.ts

@@ -1,11 +1,27 @@
+import type { NdmDeviceResultVO } from '@/apis/models';
 import type { LineDevices } from '@/composables/query';
+import { tryGetDeviceTypeVal } from '@/enums/device-type';
 import { defineStore } from 'pinia';
 import { ref } from 'vue';
 
 export const useLineDevicesStore = defineStore('ndm-line-devices-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);
+        if (index > -1) {
+          lineDevices.value[stationCode][deviceTypeVal][index] = device;
+        }
+      }
+    }
+  };
+
   return {
     lineDevices,
+
+    patch,
   };
 });