From a92e47bc189fecc3916785bbdb095acf9c15b2bf Mon Sep 17 00:00:00 2001
From: yangsy <ysy@ittc.sh.cn>
Date: Wed, 27 May 2026 15:43:53 +0800
Subject: [PATCH] =?UTF-8?q?refactor(vimp):=20=E9=87=8D=E6=9E=84vimp?=
 =?UTF-8?q?=E6=A8=A1=E5=9D=97=E7=9A=84API=E7=9B=AE=E5=BD=95=E4=B8=8E?=
 =?UTF-8?q?=E5=AF=BC=E5=85=A5=E8=B7=AF=E5=BE=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

重新梳理vimp模块的API代码结构，拆分为client、model、query、request子模块并添加统一导出入口；修正所有相关文件的导入路径，新增通用响应类型与工具函数，优化树组件的类型判断逻辑，同时新增设备查询相关API与查询hook。
---
 src/pages/vimp/apis/client/index.ts           |  1 +
 .../request.ts => apis/client/vimp-client.ts} | 32 ++-----------------
 src/pages/vimp/{api => apis}/index.ts         |  1 +
 src/pages/vimp/apis/model/index.ts            |  2 ++
 .../model.ts => apis/model/vimp-channel.ts}   |  6 ----
 src/pages/vimp/apis/model/vimp-station.ts     |  5 +++
 .../query/device-center-query.ts}             | 10 +++---
 src/pages/vimp/apis/query/index.ts            |  1 +
 .../vimp/apis/request/catalog.all-device.ts   | 11 +++++++
 .../vimp/apis/request/catalog.channel.ts      | 11 +++++++
 src/pages/vimp/apis/request/index.ts          |  2 ++
 src/pages/vimp/components/alarm-tree.vue      | 21 ++++++------
 src/pages/vimp/components/camera-tree.vue     | 27 ++++++++--------
 src/pages/vimp/stores/alarm.ts                |  2 +-
 src/pages/vimp/stores/camera.ts               |  2 +-
 src/pages/vimp/types/axios.ts                 |  9 ++++++
 src/pages/vimp/types/index.ts                 |  1 +
 src/pages/vimp/types/tree.ts                  | 26 ++++++++++++++-
 18 files changed, 102 insertions(+), 68 deletions(-)
 create mode 100644 src/pages/vimp/apis/client/index.ts
 rename src/pages/vimp/{api/request.ts => apis/client/vimp-client.ts} (55%)
 rename src/pages/vimp/{api => apis}/index.ts (74%)
 create mode 100644 src/pages/vimp/apis/model/index.ts
 rename src/pages/vimp/{api/model.ts => apis/model/vimp-channel.ts} (76%)
 create mode 100644 src/pages/vimp/apis/model/vimp-station.ts
 rename src/pages/vimp/{api/query.ts => apis/query/device-center-query.ts} (92%)
 create mode 100644 src/pages/vimp/apis/query/index.ts
 create mode 100644 src/pages/vimp/apis/request/catalog.all-device.ts
 create mode 100644 src/pages/vimp/apis/request/catalog.channel.ts
 create mode 100644 src/pages/vimp/apis/request/index.ts
 create mode 100644 src/pages/vimp/types/axios.ts

diff --git a/src/pages/vimp/apis/client/index.ts b/src/pages/vimp/apis/client/index.ts
new file mode 100644
index 0000000..d5450b2
--- /dev/null
+++ b/src/pages/vimp/apis/client/index.ts
@@ -0,0 +1 @@
+export * from './vimp-client';
diff --git a/src/pages/vimp/api/request.ts b/src/pages/vimp/apis/client/vimp-client.ts
similarity index 55%
rename from src/pages/vimp/api/request.ts
rename to src/pages/vimp/apis/client/vimp-client.ts
index 7e780c3..1ec7176 100644
--- a/src/pages/vimp/api/request.ts
+++ b/src/pages/vimp/apis/client/vimp-client.ts
@@ -1,16 +1,8 @@
-import type { VimpChannel, VimpStation } from './model';
 import type { AxiosError, AxiosRequestConfig, CreateAxiosDefaults } from 'axios';
 import axios from 'axios';
+import type { VimpResponse, VimpResult } from '../../types';
 
-interface VimpResult<T = unknown> {
-  code: number;
-  data: T;
-  msg: string;
-}
-
-type VimpResponse<T> = [err: AxiosError | null, data: T | null, resp: VimpResult<T> | null];
-
-const createVimpClient = (config?: CreateAxiosDefaults) => {
+export const createVimpClient = (config?: CreateAxiosDefaults) => {
   const instance = axios.create(config);
 
   const vimpPost = <T>(url: string, data?: AxiosRequestConfig['data'], options?: Partial<Omit<AxiosRequestConfig, 'data'>> & { retRaw?: boolean; upload?: boolean }): Promise<VimpResponse<T>> => {
@@ -38,7 +30,7 @@ const createVimpClient = (config?: CreateAxiosDefaults) => {
   };
 };
 
-const unwrapVimpResponse = <T>(resp: VimpResponse<T>) => {
+export const unwrapVimpResponse = <T>(resp: VimpResponse<T>) => {
   const [err, data, result] = resp;
   if (err) throw err;
   if (result) {
@@ -51,21 +43,3 @@ const unwrapVimpResponse = <T>(resp: VimpResponse<T>) => {
 export const vimpClient = createVimpClient({
   baseURL: `/vimp/api/client`,
 });
-
-export const catalogAllDeviceApi = async (options?: { signal?: AbortSignal }) => {
-  const { signal } = options ?? {};
-  const client = vimpClient;
-  const endpoint = `/catalog/allDevice`;
-  const resp = await client.post<VimpStation[]>(endpoint, {}, { signal });
-  const data = unwrapVimpResponse(resp);
-  return data;
-};
-
-export const catalogChannelApi = async (code: string, options?: { signal?: AbortSignal }) => {
-  const { signal } = options ?? {};
-  const client = vimpClient;
-  const endpoint = `/catalog/channel`;
-  const resp = await client.post<VimpChannel[]>(endpoint, { code, time: '' }, { signal });
-  const data = unwrapVimpResponse(resp);
-  return data;
-};
diff --git a/src/pages/vimp/api/index.ts b/src/pages/vimp/apis/index.ts
similarity index 74%
rename from src/pages/vimp/api/index.ts
rename to src/pages/vimp/apis/index.ts
index bdcf6f5..f12f1f1 100644
--- a/src/pages/vimp/api/index.ts
+++ b/src/pages/vimp/apis/index.ts
@@ -1,3 +1,4 @@
+export * from './client';
 export * from './model';
 export * from './query';
 export * from './request';
diff --git a/src/pages/vimp/apis/model/index.ts b/src/pages/vimp/apis/model/index.ts
new file mode 100644
index 0000000..e9c03f7
--- /dev/null
+++ b/src/pages/vimp/apis/model/index.ts
@@ -0,0 +1,2 @@
+export * from './vimp-channel';
+export * from './vimp-station';
diff --git a/src/pages/vimp/api/model.ts b/src/pages/vimp/apis/model/vimp-channel.ts
similarity index 76%
rename from src/pages/vimp/api/model.ts
rename to src/pages/vimp/apis/model/vimp-channel.ts
index a004f56..d585c70 100644
--- a/src/pages/vimp/api/model.ts
+++ b/src/pages/vimp/apis/model/vimp-channel.ts
@@ -1,9 +1,3 @@
-export interface VimpStation {
-  code: string;
-  name: string;
-  online: boolean;
-}
-
 export interface VimpChannel {
   address: string;
   block: string;
diff --git a/src/pages/vimp/apis/model/vimp-station.ts b/src/pages/vimp/apis/model/vimp-station.ts
new file mode 100644
index 0000000..6891af8
--- /dev/null
+++ b/src/pages/vimp/apis/model/vimp-station.ts
@@ -0,0 +1,5 @@
+export interface VimpStation {
+  code: string;
+  name: string;
+  online: boolean;
+}
diff --git a/src/pages/vimp/api/query.ts b/src/pages/vimp/apis/query/device-center-query.ts
similarity index 92%
rename from src/pages/vimp/api/query.ts
rename to src/pages/vimp/apis/query/device-center-query.ts
index 49cf840..3358915 100644
--- a/src/pages/vimp/api/query.ts
+++ b/src/pages/vimp/apis/query/device-center-query.ts
@@ -1,13 +1,13 @@
 import { useQuery } from '@tanstack/vue-query';
 import { computed } from 'vue';
-import { catalogChannelApi, catalogAllDeviceApi } from './request';
+import { catalogChannelApi, catalogAllDeviceApi } from '../request';
 import type { AxiosRequestConfig } from 'axios';
 import axios from 'axios';
-import type { CodeArea, CodeLines, CodeSites } from '../types';
-import type { VimpChannel } from '.';
-import { useCameraStore, useAlarmStore } from '../stores';
+import type { CodeArea, CodeLines, CodeSites } from '../../types';
+import { useCameraStore, useAlarmStore } from '../../stores';
+import type { VimpChannel } from '../model';
 
-export const useVimpDeviceQuery = () => {
+export const useDeviceCenterQuery = () => {
   const cameraStore = useCameraStore();
   const alarmStore = useAlarmStore();
 
diff --git a/src/pages/vimp/apis/query/index.ts b/src/pages/vimp/apis/query/index.ts
new file mode 100644
index 0000000..a9c6448
--- /dev/null
+++ b/src/pages/vimp/apis/query/index.ts
@@ -0,0 +1 @@
+export * from './device-center-query';
diff --git a/src/pages/vimp/apis/request/catalog.all-device.ts b/src/pages/vimp/apis/request/catalog.all-device.ts
new file mode 100644
index 0000000..df28213
--- /dev/null
+++ b/src/pages/vimp/apis/request/catalog.all-device.ts
@@ -0,0 +1,11 @@
+import { unwrapVimpResponse, vimpClient } from '../client';
+import type { VimpStation } from '../model';
+
+export const catalogAllDeviceApi = async (options?: { signal?: AbortSignal }) => {
+  const { signal } = options ?? {};
+  const client = vimpClient;
+  const endpoint = `/catalog/allDevice`;
+  const resp = await client.post<VimpStation[]>(endpoint, {}, { signal });
+  const data = unwrapVimpResponse(resp);
+  return data;
+};
diff --git a/src/pages/vimp/apis/request/catalog.channel.ts b/src/pages/vimp/apis/request/catalog.channel.ts
new file mode 100644
index 0000000..0f12fad
--- /dev/null
+++ b/src/pages/vimp/apis/request/catalog.channel.ts
@@ -0,0 +1,11 @@
+import { unwrapVimpResponse, vimpClient } from '../client';
+import type { VimpChannel } from '../model';
+
+export const catalogChannelApi = async (code: string, options?: { signal?: AbortSignal }) => {
+  const { signal } = options ?? {};
+  const client = vimpClient;
+  const endpoint = `/catalog/channel`;
+  const resp = await client.post<VimpChannel[]>(endpoint, { code, time: '' }, { signal });
+  const data = unwrapVimpResponse(resp);
+  return data;
+};
diff --git a/src/pages/vimp/apis/request/index.ts b/src/pages/vimp/apis/request/index.ts
new file mode 100644
index 0000000..15cde47
--- /dev/null
+++ b/src/pages/vimp/apis/request/index.ts
@@ -0,0 +1,2 @@
+export * from './catalog.channel';
+export * from './catalog.all-device';
diff --git a/src/pages/vimp/components/alarm-tree.vue b/src/pages/vimp/components/alarm-tree.vue
index babaa2d..5983c1d 100644
--- a/src/pages/vimp/components/alarm-tree.vue
+++ b/src/pages/vimp/components/alarm-tree.vue
@@ -1,13 +1,12 @@
 <script setup lang="ts">
 import { NTabPane, NTabs, NTree, type TreeOverrideNodeClickBehavior, type TreeProps } from 'naive-ui';
-import { useVimpDeviceQuery } from '../api/query';
-import type { VimpChannel, VimpStation } from '../api/model';
 import { h, type CSSProperties } from 'vue';
-import { hasOwn } from '@vueuse/core';
 import { useAlarmStore } from '../stores';
 import { storeToRefs } from 'pinia';
+import { useDeviceCenterQuery, type VimpChannel, type VimpStation } from '../apis';
+import { isAlarmNode, isAlarmSiteNode, isAlarmAreaNode } from '../types';
 
-const { isLoading } = useVimpDeviceQuery();
+const { isLoading } = useDeviceCenterQuery();
 
 const alarmStore = useAlarmStore();
 const { lineTabPanes } = storeToRefs(alarmStore);
@@ -25,8 +24,8 @@ const overrideNodeClickBehavior: TreeOverrideNodeClickBehavior = ({ option }) =>
 
 const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
   // 是车站节点
-  if (hasOwn(option, 'online')) {
-    const siteOnline = option['online'] as boolean;
+  if (isAlarmSiteNode(option)) {
+    const siteOnline = option.online;
     const siteNodeStyle: CSSProperties = {
       opacity: siteOnline ? 1 : 0.5,
     };
@@ -34,8 +33,8 @@ const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
   }
 
   // 是中间节点(一级/二级区域)
-  if (!hasOwn(option, 'device') && hasOwn(option, 'site')) {
-    const site = option['site'] as VimpStation;
+  if (isAlarmAreaNode(option)) {
+    const site = option.site;
     const nodeStyle: CSSProperties = {
       opacity: site.online ? 1 : 0.5,
     };
@@ -43,9 +42,9 @@ const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
   }
 
   // 是警报器节点
-  if (hasOwn(option, 'alarm') && hasOwn(option, 'site')) {
-    const alarm = option['alarm'] as VimpChannel;
-    const site = option['site'] as VimpStation;
+  if (isAlarmNode(option)) {
+    const alarm = option.alarm;
+    const site = option.site;
 
     const alarmOnline = () => {
       return alarm.status === 1 && site.online;
diff --git a/src/pages/vimp/components/camera-tree.vue b/src/pages/vimp/components/camera-tree.vue
index 391fa70..c90261c 100644
--- a/src/pages/vimp/components/camera-tree.vue
+++ b/src/pages/vimp/components/camera-tree.vue
@@ -1,13 +1,12 @@
 <script setup lang="ts">
 import { NTabPane, NTabs, NTree, type TreeOverrideNodeClickBehavior, type TreeProps } from 'naive-ui';
-import { useVimpDeviceQuery } from '../api/query';
-import type { VimpChannel, VimpStation } from '../api/model';
 import { h, type CSSProperties } from 'vue';
-import { hasOwn } from '@vueuse/core';
 import { useCameraStore } from '../stores';
 import { storeToRefs } from 'pinia';
+import { useDeviceCenterQuery } from '../apis';
+import { isCameraNode, isCameraSiteNode, isCameraAreaNode } from '../types';
 
-const { isLoading } = useVimpDeviceQuery();
+const { isLoading } = useDeviceCenterQuery();
 
 const cameraStore = useCameraStore();
 const { lineTabPanes } = storeToRefs(cameraStore);
@@ -25,8 +24,8 @@ const overrideNodeClickBehavior: TreeOverrideNodeClickBehavior = ({ option }) =>
 
 const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
   // 是车站节点
-  if (hasOwn(option, 'online')) {
-    const siteOnline = option['online'] as boolean;
+  if (isCameraSiteNode(option)) {
+    const siteOnline = option.online;
     const siteNodeStyle: CSSProperties = {
       opacity: siteOnline ? 1 : 0.5,
     };
@@ -34,8 +33,8 @@ const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
   }
 
   // 是中间节点(一级/二级区域)
-  if (!hasOwn(option, 'device') && hasOwn(option, 'site')) {
-    const site = option['site'] as VimpStation;
+  if (isCameraAreaNode(option)) {
+    const site = option.site;
     const nodeStyle: CSSProperties = {
       opacity: site.online ? 1 : 0.5,
     };
@@ -43,9 +42,9 @@ const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
   }
 
   // 是摄像机节点
-  if (hasOwn(option, 'camera') && hasOwn(option, 'site')) {
-    const camera = option['camera'] as VimpChannel;
-    const site = option['site'] as VimpStation;
+  if (isCameraNode(option)) {
+    const camera = option.camera;
+    const site = option.site;
 
     const cameraOnline = () => {
       return camera.status === 1 && site.online;
@@ -59,14 +58,14 @@ const renderNodeLabel: TreeProps['renderLabel'] = ({ option }) => {
       'div',
       {
         style: cameraNodeStyle,
-        draggable: camera.status === 1,
+        draggable: cameraOnline(),
         onDblclick() {
-          if (camera.status === 0) return;
+          if (!cameraOnline()) return;
           selectedDeviceGbCode.value = [camera.code];
           window.$message.info(`播放：${JSON.stringify({ code: camera.code, name: camera.name })}`);
         },
         onDragstart(event) {
-          if (camera.status === 0) return;
+          if (!cameraOnline()) return;
           console.log(event);
           event.dataTransfer?.setData('type', 'camera');
           event.dataTransfer?.setData('code', camera.code);
diff --git a/src/pages/vimp/stores/alarm.ts b/src/pages/vimp/stores/alarm.ts
index eefa229..2b8a882 100644
--- a/src/pages/vimp/stores/alarm.ts
+++ b/src/pages/vimp/stores/alarm.ts
@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia';
-import type { VimpChannel, VimpStation } from '../api';
+import type { VimpChannel, VimpStation } from '../apis';
 import { h, ref } from 'vue';
 import type { AlarmAreaNodeOption, AlarmNodeOption, CodeArea, CodeLines, CodeSites, AlarmLineTabPane, AlarmSiteNodeOption, AlarmSubAreaNodeOption } from '../types';
 
diff --git a/src/pages/vimp/stores/camera.ts b/src/pages/vimp/stores/camera.ts
index 099b787..8c250d9 100644
--- a/src/pages/vimp/stores/camera.ts
+++ b/src/pages/vimp/stores/camera.ts
@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia';
-import type { VimpChannel, VimpStation } from '../api';
+import type { VimpChannel, VimpStation } from '../apis';
 import { h, ref } from 'vue';
 import type { CameraAreaNodeOption, CameraNodeOption, CodeArea, CodeLines, CodeSites, CameraLineTabPane, CameraSiteNodeOption, CameraSubAreaNodeOption } from '../types';
 
diff --git a/src/pages/vimp/types/axios.ts b/src/pages/vimp/types/axios.ts
new file mode 100644
index 0000000..2635a8e
--- /dev/null
+++ b/src/pages/vimp/types/axios.ts
@@ -0,0 +1,9 @@
+import type { AxiosError } from 'axios';
+
+export interface VimpResult<T = unknown> {
+  code: number;
+  data: T;
+  msg: string;
+}
+
+export type VimpResponse<T> = [err: AxiosError | null, data: T | null, resp: VimpResult<T> | null];
diff --git a/src/pages/vimp/types/index.ts b/src/pages/vimp/types/index.ts
index 50842b5..05ca5d9 100644
--- a/src/pages/vimp/types/index.ts
+++ b/src/pages/vimp/types/index.ts
@@ -1 +1,2 @@
+export * from './axios';
 export * from './tree';
diff --git a/src/pages/vimp/types/tree.ts b/src/pages/vimp/types/tree.ts
index 5592179..757792d 100644
--- a/src/pages/vimp/types/tree.ts
+++ b/src/pages/vimp/types/tree.ts
@@ -1,5 +1,5 @@
 import type { TabPaneProps, TreeOption } from 'naive-ui';
-import type { VimpChannel, VimpStation } from '../api';
+import type { VimpChannel, VimpStation } from '../apis/model';
 
 export type SiteType = 'station' | 'parking' | 'occ' | 'train';
 export type CodeLines = Record<string, { name: string; color: string }>;
@@ -39,6 +39,18 @@ export interface CameraSiteNodeOption extends TreeOption {
   online: boolean;
 }
 
+export function isCameraSiteNode(option: TreeOption): option is CameraSiteNodeOption {
+  return 'online' in option && !('camera' in option);
+}
+
+export function isCameraAreaNode(option: TreeOption): option is CameraAreaNodeOption | CameraSubAreaNodeOption {
+  return 'site' in option && !('camera' in option) && !('online' in option);
+}
+
+export function isCameraNode(option: TreeOption): option is CameraNodeOption {
+  return 'camera' in option && 'site' in option;
+}
+
 export interface CameraLineTabPane extends TabPaneProps {
   lineCode: string;
   lineName: string;
@@ -72,6 +84,18 @@ export interface AlarmSiteNodeOption extends TreeOption {
   online: boolean;
 }
 
+export function isAlarmSiteNode(option: TreeOption): option is AlarmSiteNodeOption {
+  return 'online' in option && !('alarm' in option);
+}
+
+export function isAlarmAreaNode(option: TreeOption): option is AlarmAreaNodeOption | AlarmSubAreaNodeOption {
+  return 'site' in option && !('alarm' in option) && !('online' in option);
+}
+
+export function isAlarmNode(option: TreeOption): option is AlarmNodeOption {
+  return 'alarm' in option && 'site' in option;
+}
+
 export interface AlarmLineTabPane extends TabPaneProps {
   lineCode: string;
   lineName: string;