refactor: extract isNvrCluster

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

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { NdmNvrResultVO } from '@/apis/models';
+import { isNvrCluster } from '@/components/helper';
 import dayjs from 'dayjs';
 import { NButton, NCard, NDatePicker, NFlex, NGi, NGrid, NSelect, type DatePickerProps, type SelectOption } from 'naive-ui';
 import { computed, onMounted, reactive, ref, toRefs, useTemplateRef } from 'vue';
@@ -66,12 +67,11 @@ onMounted(() => {
 });
 
 const diagCards = computed<SelectOption[]>(() => {
-  const isCluster = (maybeNvrCluster: NdmNvrResultVO) => !!maybeNvrCluster.clusterList?.trim() && maybeNvrCluster.clusterList !== maybeNvrCluster.ipAddress;
   const baseOptions: SelectOption[] = [
     { label: '设备状态', value: 'status' },
     { label: '设备告警', value: 'alarm' },
   ];
-  if (!isCluster(ndmNvr.value)) {
+  if (!isNvrCluster(ndmNvr.value)) {
     baseOptions.push({ label: '硬件使用率', value: 'usage' }, { label: '硬盘健康', value: 'health' });
   }
   return baseOptions;

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

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { NdmNvrDiagInfo } from '@/apis/domains';
 import type { NdmNvrResultVO } from '@/apis/models';
+import { isNvrCluster } from '@/components/helper';
 import { useDebugModeStore } from '@/stores/debug-mode';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
@@ -46,10 +47,7 @@ const diskHealth = computed(() => lastDiagInfo.value?.info.diskHealth);
 const groupInfoList = computed(() => lastDiagInfo.value?.info.groupInfoList);
 
 const isCluster = computed(() => {
-  const { ipAddress, clusterList } = ndmNvr.value;
+  return isNvrCluster(ndmNvr.value);
-  if (!clusterList?.trim()) return false;
-  if (clusterList === ipAddress) return false;
-  return true;
 });
 
 const selectedTab = ref('设备状态');

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

@@ -11,6 +11,7 @@ const deviceTabPanes = Object.keys(DeviceType).map((key) => {
 <script setup lang="ts">
 import type { Station } from '@/apis/domains';
 import type { NdmDeviceResultVO, NdmNvrResultVO } from '@/apis/models';
+import { isNvrCluster } from '@/components/helper';
 import type { LineDevices } from '@/composables/query';
 import { DeviceType, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeKey, type DeviceTypeVal } from '@/enums/device-type';
 import { destr } from 'destr';
@@ -85,13 +86,12 @@ const lineDeviceTreeData = computed<Record<string, TreeOption[]>>(() => {
       const onlineDevices = devices?.filter((device) => device.deviceStatus === '10');
       const offlineDevices = devices?.filter((device) => device.deviceStatus === '20');
       // 对于录像机，需要根据clusterList字段以分号分隔设备IP，进一步形成子树结构
-      const isCluster = (maybeNvrCluster: NdmNvrResultVO) => !!maybeNvrCluster.clusterList?.trim() && maybeNvrCluster.clusterList !== maybeNvrCluster.ipAddress;
       if (paneName === DeviceType.Nvr) {
         const nvrs = devices as NdmNvrResultVO[];
         const nvrClusters: NdmNvrResultVO[] = [];
         const nvrSingletons: NdmNvrResultVO[] = [];
         for (const device of nvrs) {
-          if (isCluster(device)) {
+          if (isNvrCluster(device)) {
             nvrClusters.push(device);
           } else {
             nvrSingletons.push(device);

src/components/helper/index.ts

@@ -1,2 +1,3 @@
 export * from './device-alarm';
+export * from './nvr-cluster';
 export * from './switch-port';

src/components/helper/nvr-cluster.ts

@@ -0,0 +1,8 @@
+import type { NdmNvrResultVO } from '@/apis/models';
+
+export const isNvrCluster = (maybeNvrCluster: NdmNvrResultVO) => {
+  const { ipAddress, clusterList } = maybeNvrCluster;
+  if (!clusterList?.trim()) return false;
+  if (clusterList === ipAddress) return false;
+  return true;
+};