From f278a690c62ae2cbecd1602344b2a5672c3a1409 Mon Sep 17 00:00:00 2001
From: yangsy <ysy@ittc.sh.cn>
Date: Thu, 27 Nov 2025 16:01:50 +0800
Subject: [PATCH] refactor: move /helper

---
 .../nvr-record-diag-card.vue                  | 92 +------------------
 .../current-diag-card/switch-port-card.vue    |  2 +-
 .../device-alarm-history-diag-card.vue        |  2 +-
 .../nvr-history-diag-card.vue                 |  3 +-
 .../switch-port-history-diag-card.vue         |  2 +-
 .../device-page/device-card/nvr-card.vue      |  3 +-
 src/components/device-page/device-tree.vue    |  2 +-
 .../device-alarm-detail-modal.vue             |  2 +-
 src/{components => }/helper/device-alarm.ts   |  0
 src/helper/export-record-diag-csv.ts          | 26 ++++++
 src/{components => }/helper/index.ts          |  2 +
 src/{components => }/helper/nvr-cluster.ts    |  0
 src/helper/record-check.ts                    | 68 ++++++++++++++
 src/{components => }/helper/switch-port.ts    |  0
 src/pages/alarm-page.vue                      |  2 +-
 15 files changed, 110 insertions(+), 96 deletions(-)
 rename src/{components => }/helper/device-alarm.ts (100%)
 create mode 100644 src/helper/export-record-diag-csv.ts
 rename src/{components => }/helper/index.ts (55%)
 rename src/{components => }/helper/nvr-cluster.ts (100%)
 create mode 100644 src/helper/record-check.ts
 rename src/{components => }/helper/switch-port.ts (100%)

diff --git a/src/components/device-page/device-card/current-diag-card/nvr-record-diag-card.vue b/src/components/device-page/device-card/current-diag-card/nvr-record-diag-card.vue
index 746de83..7600022 100644
--- a/src/components/device-page/device-card/current-diag-card/nvr-record-diag-card.vue
+++ b/src/components/device-page/device-card/current-diag-card/nvr-record-diag-card.vue
@@ -1,81 +1,15 @@
 <script setup lang="ts">
-import type { NdmNvrResultVO, NdmRecordCheck, RecordInfo, RecordItem, Station } from '@/apis';
+import type { NdmNvrResultVO, NdmRecordCheck, RecordItem, Station } from '@/apis';
 import { getChannelListApi, getRecordCheckApi as getRecordCheckByParentIdApi, reloadAllRecordCheckApi as reloadAllRecordCheckApi, reloadRecordCheckApi as reloadRecordCheckByGbIdApi } from '@/apis';
+import { exportRecordDiagCsv, transformRecordChecks } from '@/helper';
 import { useStationStore } from '@/stores';
-import { downloadByData, formatDuration } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
 import { DownloadOutlined } from '@vicons/antd';
 import { RefreshOutline } from '@vicons/ionicons5';
 import dayjs from 'dayjs';
-import destr from 'destr';
-import { groupBy } from 'es-toolkit';
 import { NButton, NCard, NFlex, NIcon, NPagination, NPopconfirm, NPopover, NRadioButton, NRadioGroup, NTooltip, useThemeVars } from 'naive-ui';
 import { computed, onMounted, ref, toRefs } from 'vue';
 
-type NvrRecordDiag = {
-  gbCode: string;
-  channelName: string;
-  recordDuration: RecordItem;
-  lostChunks: RecordItem[];
-};
-
-// 解析出丢失的录像时间段
-const transformRecordChecks = (rawRecordChecks: NdmRecordCheck[]): NvrRecordDiag[] => {
-  // 解析diagInfo
-  const parsedRecordChecks = rawRecordChecks.map((recordCheck) => ({
-    ...recordCheck,
-    diagInfo: destr<RecordInfo>(recordCheck.diagInfo),
-  }));
-  // 按国标码分组
-  const recordChecksByGbCode = groupBy(parsedRecordChecks, (recordCheck) => recordCheck.gbCode);
-  // 提取分组后的国标码和录像诊断记录
-  const channelGbCodes = Object.keys(recordChecksByGbCode);
-  const recordChecksList = Object.values(recordChecksByGbCode);
-  // 初始化每个通道的录像诊断数据结构
-  const recordDiags = channelGbCodes.map((gbCode, index) => ({
-    gbCode,
-    channelName: recordChecksList.at(index)?.at(-1)?.name ?? '',
-    records: [] as RecordItem[],
-    lostChunks: [] as RecordItem[],
-  }));
-  // 写入同一gbCode的录像片段
-  recordChecksList.forEach((recordChecks, index) => {
-    recordChecks.forEach((recordCheck) => {
-      recordDiags.at(index)?.records.push(...recordCheck.diagInfo.recordList);
-    });
-  });
-  // 过滤掉没有录像记录的通道
-  const filteredRecordDiags = recordDiags.filter((recordDiag) => recordDiag.records.length > 0);
-  // 计算每个通道丢失的录像时间片段
-  filteredRecordDiags.forEach((recordDiag) => {
-    recordDiag.records.forEach((record, index, records) => {
-      if (!!records.at(index + 1)) {
-        // 如果下一段录像的开始时间不等于当前录像的结束时间，则判定为丢失
-        const nextStartTime = records[index + 1].startTime;
-        const currEndTime = record.endTime;
-        if (nextStartTime !== currEndTime) {
-          recordDiag.lostChunks.push({
-            startTime: currEndTime,
-            endTime: nextStartTime,
-          });
-        }
-      }
-    });
-  });
-  return recordDiags.map((recordDiag) => {
-    const firstRecord = recordDiag.records.at(0);
-    const startTime = firstRecord ? dayjs(firstRecord.startTime).format('YYYY-MM-DD HH:mm:ss') : '';
-    const lastRecord = recordDiag.records.at(-1);
-    const endTime = lastRecord ? dayjs(lastRecord.endTime).format('YYYY-MM-DD HH:mm:ss') : '';
-    return {
-      gbCode: recordDiag.gbCode,
-      channelName: recordDiag.channelName,
-      recordDuration: { startTime, endTime },
-      lostChunks: recordDiag.lostChunks,
-    };
-  });
-};
-
 const props = defineProps<{
   stationCode: Station['code'];
   ndmNvr: NdmNvrResultVO;
@@ -128,27 +62,9 @@ const { mutate: reloadAllRecordCheck, isPending: reloading } = useMutation({
 });
 
 const onExportRecordCheck = () => {
-  const header = '通道名称,开始时间,结束时间,持续时长\n';
-  const rows = recordDiags.value
-    .map((channel) => {
-      if (channel.lostChunks.length === 0) {
-        return `${channel.channelName},,,`;
-      }
-      return channel.lostChunks
-        .map((loss) => {
-          const duration = formatDuration(loss.startTime, loss.endTime);
-          const startTime = dayjs(loss.startTime).format('YYYY-MM-DD HH:mm:ss');
-          const endTime = dayjs(loss.endTime).format('YYYY-MM-DD HH:mm:ss');
-          return `${channel.channelName},${startTime},${endTime},${duration}`;
-        })
-        .join('\n');
-    })
-    .join('\n');
-  const csvContent = header + rows;
   const stationStore = useStationStore();
-  const stationName = stationStore.stationList.find((station) => station.code === stationCode.value)?.name;
-  const time = dayjs().format('YYYY-MM-DD_HH-mm-ss');
-  downloadByData(csvContent, `${stationName}_录像缺失记录_${time}.csv`, 'text/csv;charset=utf-8', '\ufeff');
+  const stationName = stationStore.stationList.find((station) => station.code === stationCode.value)?.name ?? '';
+  exportRecordDiagCsv(recordDiags.value, stationName);
 };
 
 const page = ref(1);
diff --git a/src/components/device-page/device-card/current-diag-card/switch-port-card.vue b/src/components/device-page/device-card/current-diag-card/switch-port-card.vue
index b7e8216..5745b1e 100644
--- a/src/components/device-page/device-card/current-diag-card/switch-port-card.vue
+++ b/src/components/device-page/device-card/current-diag-card/switch-port-card.vue
@@ -16,7 +16,7 @@
  */
 
 import type { NdmSwitchPortInfo } from '@/apis';
-import { getPortStatusVal, transformPortSpeed } from '@/components';
+import { getPortStatusVal, transformPortSpeed } from '@/helper';
 import { NCard, NGrid, NGridItem, NPopover } from 'naive-ui';
 import { computed, toRefs } from 'vue';
 
diff --git a/src/components/device-page/device-card/history-diag-card/device-alarm-history-diag-card.vue b/src/components/device-page/device-card/history-diag-card/device-alarm-history-diag-card.vue
index ea579b7..9a4b508 100644
--- a/src/components/device-page/device-card/history-diag-card/device-alarm-history-diag-card.vue
+++ b/src/components/device-page/device-card/history-diag-card/device-alarm-history-diag-card.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { pageDeviceAlarmLogApi, type NdmDeviceAlarmLogResultVO, type NdmDeviceResultVO, type PageParams } from '@/apis';
-import { renderAlarmDateCell, renderAlarmTypeCell, renderFaultDescriptionCell, renderFaultLevelCell } from '@/components';
+import { renderAlarmDateCell, renderAlarmTypeCell, renderFaultDescriptionCell, renderFaultLevelCell } from '@/helper';
 import { useMutation } from '@tanstack/vue-query';
 import { NCard, NDataTable, type DataTableColumns, type DataTableRowData, type DatePickerProps, type PaginationProps } from 'naive-ui';
 import { h } from 'vue';
diff --git a/src/components/device-page/device-card/history-diag-card/nvr-history-diag-card.vue b/src/components/device-page/device-card/history-diag-card/nvr-history-diag-card.vue
index 7961349..5757bee 100644
--- a/src/components/device-page/device-card/history-diag-card/nvr-history-diag-card.vue
+++ b/src/components/device-page/device-card/history-diag-card/nvr-history-diag-card.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { NdmNvrResultVO } from '@/apis';
-import { DeviceAlarmHistoryDiagCard, DeviceStatusHistoryDiagCard, DeviceUsageHistoryDiagCard, isNvrCluster, NvrDiskHealthHistoryDiagCard } from '@/components';
+import { DeviceAlarmHistoryDiagCard, DeviceStatusHistoryDiagCard, DeviceUsageHistoryDiagCard, NvrDiskHealthHistoryDiagCard } from '@/components';
+import { isNvrCluster } from '@/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';
diff --git a/src/components/device-page/device-card/history-diag-card/switch-port-history-diag-card.vue b/src/components/device-page/device-card/history-diag-card/switch-port-history-diag-card.vue
index a2b96c8..f5fbe0f 100644
--- a/src/components/device-page/device-card/history-diag-card/switch-port-history-diag-card.vue
+++ b/src/components/device-page/device-card/history-diag-card/switch-port-history-diag-card.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { pageSnmpLogApi, type NdmSwitchDiagInfo, type NdmSwitchPortInfo, type NdmSwitchResultVO, type PageParams } from '@/apis';
-import { getPortStatusVal, transformPortSpeed } from '@/components';
+import { getPortStatusVal, transformPortSpeed } from '@/helper';
 import { useMutation } from '@tanstack/vue-query';
 import dayjs from 'dayjs';
 import destr from 'destr';
diff --git a/src/components/device-page/device-card/nvr-card.vue b/src/components/device-page/device-card/nvr-card.vue
index 07aa426..fadfd90 100644
--- a/src/components/device-page/device-card/nvr-card.vue
+++ b/src/components/device-page/device-card/nvr-card.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { NdmNvrDiagInfo, NdmNvrResultVO } from '@/apis';
-import { DeviceCommonCard, DeviceHardwareCard, DeviceHeaderCard, isNvrCluster, NvrDiskCard, NvrHistoryDiagCard, NvrRecordDiagCard } from '@/components';
+import { DeviceCommonCard, DeviceHardwareCard, DeviceHeaderCard, NvrDiskCard, NvrHistoryDiagCard, NvrRecordDiagCard } from '@/components';
+import { isNvrCluster } from '@/helper';
 import { useSettingStore } from '@/stores';
 import { destr } from 'destr';
 import { NCard, NFlex, NTabPane, NTabs } from 'naive-ui';
diff --git a/src/components/device-page/device-tree.vue b/src/components/device-page/device-tree.vue
index 229a71d..265e2b0 100644
--- a/src/components/device-page/device-tree.vue
+++ b/src/components/device-page/device-tree.vue
@@ -10,7 +10,7 @@ const deviceTabPanes = Object.keys(DeviceType).map((key) => {
 
 <script setup lang="ts">
 import type { LineDevices, NdmDeviceResultVO, NdmNvrResultVO, Station } from '@/apis';
-import { isNvrCluster } from '@/components';
+import { isNvrCluster } from '@/helper';
 import { DeviceType, DeviceTypeName, tryGetDeviceTypeVal, type DeviceTypeKey, type DeviceTypeVal } from '@/enums';
 import { destr } from 'destr';
 import {
diff --git a/src/components/station-page/device-alarm-detail-modal.vue b/src/components/station-page/device-alarm-detail-modal.vue
index 907ed71..0afbd20 100644
--- a/src/components/station-page/device-alarm-detail-modal.vue
+++ b/src/components/station-page/device-alarm-detail-modal.vue
@@ -10,12 +10,12 @@ import {
   type StationAlarmCounts,
 } from '@/apis';
 import { AlarmType, DeviceType, DeviceTypeCode, DeviceTypeName, FaultLevel, type DeviceTypeVal } from '@/enums';
+import { renderAlarmDateCell, renderDeviceTypeCell, renderAlarmTypeCell, renderFaultLevelCell } from '@/helper';
 import { downloadByData } from '@/utils';
 import { useMutation } from '@tanstack/vue-query';
 import dayjs from 'dayjs';
 import { NButton, NCol, NDataTable, NModal, NRow, NSpace, NStatistic, NTag, type DataTableColumns, type DataTableProps, type DataTableRowData, type PaginationProps } from 'naive-ui';
 import { computed, h, reactive, ref, toRefs } from 'vue';
-import { renderAlarmDateCell, renderDeviceTypeCell, renderAlarmTypeCell, renderFaultLevelCell } from '../helper';
 
 interface Props {
   station?: Station;
diff --git a/src/components/helper/device-alarm.ts b/src/helper/device-alarm.ts
similarity index 100%
rename from src/components/helper/device-alarm.ts
rename to src/helper/device-alarm.ts
diff --git a/src/helper/export-record-diag-csv.ts b/src/helper/export-record-diag-csv.ts
new file mode 100644
index 0000000..d13845f
--- /dev/null
+++ b/src/helper/export-record-diag-csv.ts
@@ -0,0 +1,26 @@
+import type { Station } from '@/apis';
+import type { NvrRecordDiag } from './record-check';
+import { downloadByData, formatDuration } from '@/utils';
+import dayjs from 'dayjs';
+
+export const exportRecordDiagCsv = (recordDiags: NvrRecordDiag[], stationName: Station['name']) => {
+  const header = '通道名称,开始时间,结束时间,持续时长\n';
+  const rows = recordDiags
+    .map((channel) => {
+      if (channel.lostChunks.length === 0) {
+        return `${channel.channelName},,,`;
+      }
+      return channel.lostChunks
+        .map((loss) => {
+          const duration = formatDuration(loss.startTime, loss.endTime);
+          const startTime = dayjs(loss.startTime).format('YYYY-MM-DD HH:mm:ss');
+          const endTime = dayjs(loss.endTime).format('YYYY-MM-DD HH:mm:ss');
+          return `${channel.channelName},${startTime},${endTime},${duration}`;
+        })
+        .join('\n');
+    })
+    .join('\n');
+  const csvContent = header + rows;
+  const time = dayjs().format('YYYY-MM-DD_HH-mm-ss');
+  downloadByData(csvContent, `${stationName}_录像缺失记录_${time}.csv`, 'text/csv;charset=utf-8', '\ufeff');
+};
diff --git a/src/components/helper/index.ts b/src/helper/index.ts
similarity index 55%
rename from src/components/helper/index.ts
rename to src/helper/index.ts
index 52fd2af..f3bdd0b 100644
--- a/src/components/helper/index.ts
+++ b/src/helper/index.ts
@@ -1,3 +1,5 @@
 export * from './device-alarm';
+export * from './export-record-diag-csv';
 export * from './nvr-cluster';
+export * from './record-check';
 export * from './switch-port';
diff --git a/src/components/helper/nvr-cluster.ts b/src/helper/nvr-cluster.ts
similarity index 100%
rename from src/components/helper/nvr-cluster.ts
rename to src/helper/nvr-cluster.ts
diff --git a/src/helper/record-check.ts b/src/helper/record-check.ts
new file mode 100644
index 0000000..535053e
--- /dev/null
+++ b/src/helper/record-check.ts
@@ -0,0 +1,68 @@
+import type { NdmRecordCheck, RecordInfo, RecordItem } from '@/apis';
+import dayjs from 'dayjs';
+import { destr } from 'destr';
+import { groupBy } from 'es-toolkit';
+
+export type NvrRecordDiag = {
+  gbCode: string;
+  channelName: string;
+  recordDuration: RecordItem;
+  lostChunks: RecordItem[];
+};
+
+// 解析出丢失的录像时间段
+export const transformRecordChecks = (rawRecordChecks: NdmRecordCheck[]): NvrRecordDiag[] => {
+  // 解析diagInfo
+  const parsedRecordChecks = rawRecordChecks.map((recordCheck) => ({
+    ...recordCheck,
+    diagInfo: destr<RecordInfo>(recordCheck.diagInfo),
+  }));
+  // 按国标码分组
+  const recordChecksByGbCode = groupBy(parsedRecordChecks, (recordCheck) => recordCheck.gbCode);
+  // 提取分组后的国标码和录像诊断记录
+  const channelGbCodes = Object.keys(recordChecksByGbCode);
+  const recordChecksList = Object.values(recordChecksByGbCode);
+  // 初始化每个通道的录像诊断数据结构
+  const recordDiags = channelGbCodes.map((gbCode, index) => ({
+    gbCode,
+    channelName: recordChecksList.at(index)?.at(-1)?.name ?? '',
+    records: [] as RecordItem[],
+    lostChunks: [] as RecordItem[],
+  }));
+  // 写入同一gbCode的录像片段
+  recordChecksList.forEach((recordChecks, index) => {
+    recordChecks.forEach((recordCheck) => {
+      recordDiags.at(index)?.records.push(...recordCheck.diagInfo.recordList);
+    });
+  });
+  // 过滤掉没有录像记录的通道
+  const filteredRecordDiags = recordDiags.filter((recordDiag) => recordDiag.records.length > 0);
+  // 计算每个通道丢失的录像时间片段
+  filteredRecordDiags.forEach((recordDiag) => {
+    recordDiag.records.forEach((record, index, records) => {
+      if (!!records.at(index + 1)) {
+        // 如果下一段录像的开始时间不等于当前录像的结束时间，则判定为丢失
+        const nextStartTime = records[index + 1].startTime;
+        const currEndTime = record.endTime;
+        if (nextStartTime !== currEndTime) {
+          recordDiag.lostChunks.push({
+            startTime: currEndTime,
+            endTime: nextStartTime,
+          });
+        }
+      }
+    });
+  });
+  return recordDiags.map((recordDiag) => {
+    const firstRecord = recordDiag.records.at(0);
+    const startTime = firstRecord ? dayjs(firstRecord.startTime).format('YYYY-MM-DD HH:mm:ss') : '';
+    const lastRecord = recordDiag.records.at(-1);
+    const endTime = lastRecord ? dayjs(lastRecord.endTime).format('YYYY-MM-DD HH:mm:ss') : '';
+    return {
+      gbCode: recordDiag.gbCode,
+      channelName: recordDiag.channelName,
+      recordDuration: { startTime, endTime },
+      lostChunks: recordDiag.lostChunks,
+    };
+  });
+};
diff --git a/src/components/helper/switch-port.ts b/src/helper/switch-port.ts
similarity index 100%
rename from src/components/helper/switch-port.ts
rename to src/helper/switch-port.ts
diff --git a/src/pages/alarm-page.vue b/src/pages/alarm-page.vue
index edcabee..c0b6cf6 100644
--- a/src/pages/alarm-page.vue
+++ b/src/pages/alarm-page.vue
@@ -9,7 +9,7 @@ import {
   removeCameraIgnoreApi,
   type NdmDeviceAlarmLogResultVO,
 } from '@/apis';
-import { renderAlarmDateCell, renderAlarmTypeCell, renderDeviceTypeCell, renderFaultLevelCell } from '@/components';
+import { renderAlarmDateCell, renderAlarmTypeCell, renderDeviceTypeCell, renderFaultLevelCell } from '@/helper';
 import { AlarmType, DeviceType, DeviceTypeCode, DeviceTypeName, FaultLevel, tryGetDeviceTypeVal, type DeviceTypeVal } from '@/enums';
 import { useAlarmStore, useStationStore } from '@/stores';
 import { downloadByData } from '@/utils';