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>({ 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(() => { - - -
- 场景名称,同一场景下可有多个摄像头(可选择已有或输入新名称) -
-
- + -
- 在当前场景下唯一,系统会根据应用名自动编号(可手动修改) -