From 8bce09a17aa4cd2380c43172fa04fc355e972412 Mon Sep 17 00:00:00 2001
From: 16337 <1633794139@qq.com>
Date: Thu, 19 Mar 2026 11:42:17 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=9F=E8=83=BD=EF=BC=9A=E6=91=84=E5=83=8F?=
 =?UTF-8?q?=E5=A4=B4=E9=85=8D=E7=BD=AE=E9=A1=B5=E9=9D=A2=E9=80=82=E9=85=8D?=
 =?UTF-8?q?=20cameraName?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 表格列：app+stream 改为摄像头名称
- 编辑弹窗：去掉应用名+流ID，改为摄像头名称（必填）
- app/stream 由后端自动处理，前端不再暴露
- Camera 类型新增 cameraName 字段
---
 apps/web-antd/src/api/aiot/device/index.ts    |  1 +
 .../src/views/aiot/device/camera/index.vue    | 48 ++++++++-----------
 2 files changed, 20 insertions(+), 29 deletions(-)

diff --git a/apps/web-antd/src/api/aiot/device/index.ts b/apps/web-antd/src/api/aiot/device/index.ts
index 15ed3319b..a083e4734 100644
--- a/apps/web-antd/src/api/aiot/device/index.ts
+++ b/apps/web-antd/src/api/aiot/device/index.ts
@@ -30,6 +30,7 @@ export namespace AiotDeviceApi {
     app?: string;
     stream?: string;
     cameraCode?: string; // 摄像头唯一编码
+    cameraName?: string; // 摄像头名称（用户自定义）
     srcUrl?: string;
     timeout?: number;
     rtspType?: string; // '0'=TCP, '1'=UDP, '2'=Multicast
diff --git a/apps/web-antd/src/views/aiot/device/camera/index.vue b/apps/web-antd/src/views/aiot/device/camera/index.vue
index 018d4d912..806f82567 100644
--- a/apps/web-antd/src/views/aiot/device/camera/index.vue
+++ b/apps/web-antd/src/views/aiot/device/camera/index.vue
@@ -56,8 +56,7 @@ const total = ref(0);
 const searchQuery = ref('');
 
 const columns = [
-  { title: '应用名', dataIndex: 'app', width: 100 },
-  { title: '流ID', dataIndex: 'stream', width: 100 },
+  { title: '摄像头名称', dataIndex: 'cameraName', width: 150 },
   { title: '拉流地址', dataIndex: 'srcUrl', ellipsis: true },
   { title: '状态', key: 'status', width: 60, align: 'center' as const },
   { title: 'ROI', key: 'roiCount', width: 80, align: 'center' as const },
@@ -73,7 +72,8 @@ const mediaServerOptions = ref<{ label: string; value: string }[]>([]);
 const editForm = reactive<Partial<AiotDeviceApi.Camera>>({
   id: undefined,
   type: 'default',
-  app: 'live',
+  cameraName: '',
+  app: '',
   stream: '',
   srcUrl: '',
   timeout: 15,
@@ -177,7 +177,8 @@ function resetForm() {
   Object.assign(editForm, {
     id: undefined,
     type: 'default',
-    app: 'live',
+    cameraName: '',
+    app: '',
     stream: '',
     srcUrl: '',
     timeout: 15,
@@ -238,6 +239,7 @@ function handleEdit(row: AiotDeviceApi.Camera) {
   Object.assign(editForm, {
     id: row.id,
     type: row.type || 'default',
+    cameraName: row.cameraName || '',
     app: row.app || '',
     stream: row.stream || '',
     cameraCode: row.cameraCode || '',
@@ -257,18 +259,21 @@ function handleEdit(row: AiotDeviceApi.Camera) {
 }
 
 async function handleSave() {
-  if (!editForm.app?.trim()) {
-    message.warning('请输入应用名');
-    return;
-  }
-  if (!editForm.stream?.trim()) {
-    message.warning('请输入流ID');
+  if (!editForm.cameraName?.trim()) {
+    message.warning('请输入摄像头名称');
     return;
   }
   if (!editForm.srcUrl?.trim()) {
     message.warning('请输入拉流地址');
     return;
   }
+  // app/stream 由后端处理，前端如果没填则用 cameraName 作为 app
+  if (!editForm.app?.trim()) {
+    editForm.app = editForm.cameraName!.trim();
+  }
+  if (!editForm.stream?.trim()) {
+    editForm.stream = '001';
+  }
   saving.value = true;
   try {
     await saveCamera({ ...editForm });
@@ -299,7 +304,7 @@ async function handleSave() {
 function handleDelete(row: AiotDeviceApi.Camera) {
   Modal.confirm({
     title: '删除确认',
-    content: `确定删除摄像头 ${row.cameraCode || row.stream} ？`,
+    content: `确定删除摄像头 ${row.cameraName || row.cameraCode || row.stream} ？`,
     okType: 'danger',
     async onOk() {
       try {
@@ -480,26 +485,11 @@ onMounted(() => {
         <Form.Item v-if="editForm.id" label="摄像头编码">
           <Input :value="editForm.cameraCode" disabled />
         </Form.Item>
-        <Form.Item label="应用名" required>
-          <AutoComplete
-            v-model:value="editForm.app"
-            :options="appOptions"
-            placeholder="选择已有场景或输入新场景名"
-            allow-clear
-            @change="autoFillStreamId"
-          />
-          <div style="margin-top: 4px; font-size: 12px; color: #999">
-            场景名称，同一场景下可有多个摄像头（可选择已有或输入新名称）
-          </div>
-        </Form.Item>
-        <Form.Item label="流ID" required>
+        <Form.Item label="摄像头名称" required>
           <Input
-            v-model:value="editForm.stream"
-            placeholder="在当前场景下的唯一标识，如：001（系统会自动编号）"
+            v-model:value="editForm.cameraName"
+            placeholder="请输入摄像头名称，如：大堂吧台、室外停车场"
           />
-          <div style="margin-top: 4px; font-size: 12px; color: #999">
-            在当前场景下唯一，系统会根据应用名自动编号（可手动修改）
-          </div>
         </Form.Item>
         <Form.Item label="拉流地址" required>
           <Input