feat: open device manegement page

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 } from '@/enums/device-type';
+import { DeviceType, DeviceTypeName, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
 import { NButton, NCard, NFlex, NTag } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
@@ -18,15 +18,20 @@ const ipAddr = computed(() => device.value.ipAddress ?? '-');
 const gbCode = computed(() => Reflect.get(device.value, 'gbCode') as string | undefined);
 const status = computed(() => device.value.deviceStatus);
 
-const isCamera = computed(() => getDeviceTypeVal(device.value.deviceType) === DeviceType['Camera']);
+const canOpenMgmtPage = computed(() => {
+  const mgmtableDeviceTypes: DeviceTypeVal[] = [DeviceType['Camera'], DeviceType['Decoder'], DeviceType['Switch']];
+  return mgmtableDeviceTypes.includes(getDeviceTypeVal(device.value.deviceType));
+});
 
-const onClickCameraLogin = () => {
-  const ipAddress = device.value.ipAddress;
-  if (ipAddress) {
-    const targetUrl = `http://${ipAddress}`;
-    window.open(targetUrl, '_blank');
-  } else {
-    window.$message.warning('未找到设备IP地址');
+const onClickOpenMgmtPage = () => {
+  if (canOpenMgmtPage.value) {
+    const ipAddress = device.value.ipAddress;
+    if (ipAddress) {
+      const targetUrl = `http://${ipAddress}`;
+      window.open(targetUrl, '_blank');
+    } else {
+      window.$message.warning('未找到设备IP地址');
+    }
   }
 };
 </script>
@@ -39,7 +44,7 @@ const onClickCameraLogin = () => {
         <NTag v-else-if="status === '20'" size="small" type="error">离线</NTag>
         <NTag v-else size="small" type="warning">未知</NTag>
         <div>{{ name }}</div>
-        <NButton v-if="isCamera" ghost size="tiny" type="default" :focusable="false" @click="onClickCameraLogin">登录</NButton>
+        <NButton v-if="canOpenMgmtPage" ghost size="tiny" type="default" :focusable="false" @click="onClickOpenMgmtPage">管理</NButton>
       </NFlex>
       <div style="font-size: small; color: #666">
         <div>