改造: 全局参数配置页面支持按设备管理

apps/web-antd/src/api/aiot/device/index.ts

@@ -231,10 +231,12 @@ export async function getSnapUrl(cameraCode: string, force = false): Promise<str
 
 // ==================== 算法管理 ====================
 
-/** 算法列表 */
+/** 算法列表（可选带设备参数） */
-export function getAlgorithmList() {
+export function getAlgorithmList(deviceId?: string) {
+  const params = deviceId ? { deviceId } : {};
   return wvpRequestClient.get<AiotDeviceApi.Algorithm[]>(
     '/aiot/device/algorithm/list',
+    { params },
   );
 }
 
@@ -246,6 +248,16 @@ export function saveAlgoGlobalParams(algoCode: string, globalParams: string) {
   );
 }
 
+/** 获取设备级算法参数 */
+export function getDeviceAlgoParams(deviceId: string) {
+  return wvpRequestClient.get(`/aiot/device/algorithm/device-params/${deviceId}`);
+}
+
+/** 保存设备级算法参数 */
+export function saveDeviceAlgoParams(deviceId: string, algoCode: string, params: string) {
+  return wvpRequestClient.post(`/aiot/device/algorithm/device-params/${deviceId}/${algoCode}`, { params });
+}
+
 // ==================== 算法绑定 ====================
 
 /** 绑定算法到 ROI */

apps/web-antd/src/views/aiot/device/algorithm/index.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import type { AiotDeviceApi } from '#/api/aiot/device';
+import type { AiotEdgeApi } from '#/api/aiot/edge';
 
-import { computed, onMounted, ref } from 'vue';
+import { computed, onMounted, ref, watch } from 'vue';
 
 import {
   Button,
@@ -9,11 +10,18 @@ import {
   Form,
   InputNumber,
   message,
+  Select,
   Spin,
   Tabs,
+  Tag,
 } from 'ant-design-vue';
 
-import { getAlgorithmList, saveAlgoGlobalParams } from '#/api/aiot/device';
+import {
+  getAlgorithmList,
+  saveAlgoGlobalParams,
+  saveDeviceAlgoParams,
+} from '#/api/aiot/device';
+import { getDeviceList } from '#/api/aiot/edge';
 
 // 参数名中英文映射（与 AlgorithmParamEditor 保持一致）
 const paramNameMap: Record<string, string> = {
@@ -57,11 +65,21 @@ const activeTab = ref<string>('');
 const loading = ref(false);
 const saving = ref(false);
 
+// 边缘设备
+const edgeDevices = ref<AiotEdgeApi.Device[]>([]);
+const selectedDeviceId = ref<string>('');
+const deviceLoading = ref(false);
+
+// 全局默认参数缓存（用于对比设备参数是否与全局一致）
+const globalParamsCache = ref<Record<string, Record<string, any>>>({});
+
 // 每个算法的表单数据: { algoCode: { paramKey: value } }
 const formDataMap = ref<Record<string, Record<string, any>>>({});
 // 记录用户修改过的字段
 const dirtyFieldsMap = ref<Record<string, Set<string>>>({});
 
+const isDeviceMode = computed(() => !!selectedDeviceId.value);
+
 const currentAlgo = computed(() => {
   return algorithms.value.find((a) => a.algoCode === activeTab.value);
 });
@@ -80,6 +98,11 @@ const currentFormData = computed(() => {
   return formDataMap.value[activeTab.value] || {};
 });
 
+// 当前算法的全局默认值（非 schema default，而是保存的 globalParams）
+const currentGlobalParams = computed(() => {
+  return globalParamsCache.value[activeTab.value] || {};
+});
+
 function getParamLabel(key: string): string {
   return paramNameMap[key] || key;
 }
@@ -88,17 +111,79 @@ function getParamDesc(key: string): string | undefined {
   return paramDescMap[key];
 }
 
+/** 判断设备参数值是否与全局默认一致 */
+function isSameAsGlobal(key: string): boolean {
+  if (!isDeviceMode.value) return false;
+  const form = currentFormData.value;
+  const globalVal = currentGlobalParams.value[key];
+  const schemaDefault = getSchemaDefault(key);
+  // 全局值：优先 globalParams，回退 schema default
+  const effectiveGlobal = globalVal !== undefined ? globalVal : schemaDefault;
+  return form[key] === effectiveGlobal;
+}
+
 onMounted(async () => {
+  await Promise.all([loadEdgeDevices(), loadAlgorithms()]);
+});
+
+// 切换设备时重新加载算法参数
+watch(selectedDeviceId, async () => {
   await loadAlgorithms();
 });
 
+async function loadEdgeDevices() {
+  deviceLoading.value = true;
+  try {
+    const list = await getDeviceList();
+    edgeDevices.value = Array.isArray(list) ? list : [];
+  } catch {
+    edgeDevices.value = [];
+  } finally {
+    deviceLoading.value = false;
+  }
+}
+
 async function loadAlgorithms() {
   loading.value = true;
   try {
-    const data = await getAlgorithmList();
+    const deviceId = selectedDeviceId.value || undefined;
+    const data = await getAlgorithmList(deviceId);
     algorithms.value = Array.isArray(data) ? data : [];
+
+    // 如果是设备模式且全局缓存为空，先加载一次全局参数
+    if (isDeviceMode.value && Object.keys(globalParamsCache.value).length === 0) {
+      try {
+        const globalData = await getAlgorithmList();
+        const globalAlgos = Array.isArray(globalData) ? globalData : [];
+        for (const algo of globalAlgos) {
+          const code = algo.algoCode || '';
+          try {
+            globalParamsCache.value[code] = JSON.parse(algo.globalParams || '{}');
+          } catch {
+            globalParamsCache.value[code] = {};
+          }
+        }
+      } catch { /* ignore */ }
+    }
+
+    // 非设备模式时更新全局缓存
+    if (!isDeviceMode.value) {
+      for (const algo of algorithms.value) {
+        const code = algo.algoCode || '';
+        try {
+          globalParamsCache.value[code] = JSON.parse(algo.globalParams || '{}');
+        } catch {
+          globalParamsCache.value[code] = {};
+        }
+      }
+    }
+
     if (algorithms.value.length > 0) {
+      // 保持当前 tab 选中，如果当前 tab 不在列表中则切到第一个
+      const codes = algorithms.value.map((a) => a.algoCode);
+      if (!codes.includes(activeTab.value)) {
         activeTab.value = algorithms.value[0]!.algoCode || '';
+      }
       // 初始化所有算法的表单数据
       for (const algo of algorithms.value) {
         initFormData(algo);
@@ -174,8 +259,20 @@ async function handleSave() {
       }
     }
 
+    if (isDeviceMode.value) {
+      // 设备级保存
+      await saveDeviceAlgoParams(selectedDeviceId.value, algo.algoCode, JSON.stringify(toSave));
+      const device = edgeDevices.value.find((d) => d.deviceId === selectedDeviceId.value);
+      const deviceLabel = device?.deviceName || device?.deviceId || selectedDeviceId.value;
+      message.success(`参数已保存并推送到 ${deviceLabel}`);
+    } else {
+      // 全局保存
       await saveAlgoGlobalParams(algo.algoCode, JSON.stringify(toSave));
-    message.success('全局参数保存成功');
+      message.success('参数已保存并推送到所有设备');
+      // 更新全局缓存
+      globalParamsCache.value[algo.algoCode] = { ...toSave };
+    }
+
     // 更新本地算法数据
     algo.globalParams = JSON.stringify(toSave);
     dirtyFieldsMap.value[algo.algoCode] = new Set();
@@ -205,17 +302,55 @@ function isSkippedField(key: string, schema: any): boolean {
   // working_hours 和 list 类型在全局配置中跳过（场景差异大，不适合全局设置）
   return key === 'working_hours' || schema.type === 'list';
 }
+
+// 设备选择器选项
+const deviceOptions = computed(() => {
+  const options = [
+    { value: '', label: '全局默认' },
+  ];
+  for (const d of edgeDevices.value) {
+    options.push({
+      value: d.deviceId || '',
+      label: d.deviceName || d.deviceId || '未知设备',
+    });
+  }
+  return options;
+});
+
+const saveButtonText = computed(() => {
+  if (isDeviceMode.value) {
+    const device = edgeDevices.value.find((d) => d.deviceId === selectedDeviceId.value);
+    return `保存到 ${device?.deviceName || device?.deviceId || '设备'}`;
+  }
+  return '保存全局参数';
+});
 </script>
 
 <template>
   <div class="algo-global-config">
-    <Card title="算法全局参数配置">
+    <Card title="算法参数配置">
       <template #extra>
-        <span class="card-tip">
+        <div class="card-extra">
-          配置各算法的全局默认参数，ROI 绑定时将以此为默认值
+          <span class="device-label">边缘设备：</span>
-        </span>
+          <Select
+            v-model:value="selectedDeviceId"
+            :options="deviceOptions"
+            :loading="deviceLoading"
+            style="width: 220px"
+            placeholder="选择设备"
+          />
+        </div>
       </template>
 
+      <div v-if="isDeviceMode" class="device-mode-tip">
+        <Tag color="blue">设备级配置</Tag>
+        <span>当前配置仅对选中的边缘设备生效，未单独设置的参数将继承全局默认值</span>
+      </div>
+      <div v-else class="global-mode-tip">
+        <Tag color="green">全局默认</Tag>
+        <span>配置各算法的全局默认参数，ROI 绑定时将以此为默认值</span>
+      </div>
+
       <Spin :spinning="loading">
         <div v-if="algorithms.length === 0 && !loading" class="empty-state">
           暂无可用算法
@@ -267,6 +402,13 @@ function isSkippedField(key: string, schema: any): boolean {
                       >
                         恢复默认
                       </Button>
+                      <Tag
+                        v-if="isDeviceMode && isSameAsGlobal(String(key))"
+                        color="default"
+                        class="global-hint-tag"
+                      >
+                        与全局默认一致
+                      </Tag>
                     </div>
                     <div v-if="getParamDesc(String(key))" class="param-desc">
                       {{ getParamDesc(String(key)) }}
@@ -296,6 +438,13 @@ function isSkippedField(key: string, schema: any): boolean {
                       >
                         恢复默认
                       </Button>
+                      <Tag
+                        v-if="isDeviceMode && isSameAsGlobal(String(key))"
+                        color="default"
+                        class="global-hint-tag"
+                      >
+                        与全局默认一致
+                      </Tag>
                     </div>
                     <div v-if="getParamDesc(String(key))" class="param-desc">
                       {{ getParamDesc(String(key)) }}
@@ -314,7 +463,7 @@ function isSkippedField(key: string, schema: any): boolean {
                 :loading="saving"
                 @click="handleSave"
               >
-                保存全局参数
+                {{ saveButtonText }}
               </Button>
             </div>
           </Tabs.TabPane>
@@ -324,7 +473,12 @@ function isSkippedField(key: string, schema: any): boolean {
       <!-- 帮助说明 -->
       <div class="help-tip">
         <span class="help-text">
+          <template v-if="isDeviceMode">
+            设备级参数仅覆盖选中设备的配置。未设置的参数将使用全局默认值。修改后需重新推送配置到边缘端才能生效。
+          </template>
+          <template v-else>
             全局参数为各算法的默认配置，当 ROI 绑定算法时未单独设置参数，将使用此处的全局默认值。修改后需重新推送配置到边缘端才能生效。
+          </template>
         </span>
       </div>
     </Card>
@@ -336,9 +490,38 @@ function isSkippedField(key: string, schema: any): boolean {
   padding: 16px;
 }
 
-.card-tip {
+.card-extra {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.device-label {
   font-size: 13px;
-  color: #8c8c8c;
+  color: #595959;
+  white-space: nowrap;
+}
+
+.device-mode-tip,
+.global-mode-tip {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 16px;
+  padding: 8px 12px;
+  border-radius: 4px;
+  font-size: 13px;
+  color: #595959;
+}
+
+.device-mode-tip {
+  background: #e6f7ff;
+  border: 1px solid #91d5ff;
+}
+
+.global-mode-tip {
+  background: #f6ffed;
+  border: 1px solid #b7eb8f;
 }
 
 .empty-state {
@@ -367,6 +550,11 @@ function isSkippedField(key: string, schema: any): boolean {
   gap: 8px;
 }
 
+.global-hint-tag {
+  font-size: 11px;
+  color: #8c8c8c !important;
+}
+
 .param-desc {
   margin-top: 4px;
   font-size: 12px;