通过rtsp添加的相机，编辑时也要出现原界面

src/views/cameras/overview/CamerasOverview.vue

@@ -38,6 +38,7 @@
     </div>
     <AddCamera class="add-popover" v-model="showAddPopover" />
     <EditCamera class="add-popover" v-model="showEditPopover" :edit-data="editCameraData" />
+    <EditSRSCamera class="add-popover" v-model="showEditSRSPopover" :edit-data="editCameraData!" />
     <ShareCamera class="add-popover" v-model="addSharedPopover" :share-data="shareCameraData" />
     <EditSharedCamera
       class="add-popover"
@@ -56,6 +57,7 @@
   import AddCamera from './components/CameraAddPopover.vue';
   import ShareCamera from './components/CameraSharePopover.vue';
   import EditCamera from './components/CameraEditPopover.vue';
+  import EditSRSCamera from './components/CameraEditSRSPopover.vue';
   import EditSharedCamera from './components/CameraSharedEdit.vue';
   import emptyImg from '@/assets/images/table/table-empty.png';
   import { Plus } from '@element-plus/icons-vue';
@@ -91,6 +93,7 @@
   const addSharedPopover = ref(false);
 
   const showEditPopover = ref(false);
+  const showEditSRSPopover = ref(false);
   const editCameraData = ref<CameraIPItem | null>();
   const shareCameraData = ref<CameraShowItem | null>();
 
@@ -178,7 +181,11 @@
   };
 
   const handleEdit = (row) => {
-    showEditPopover.value = true;
+    if (row.rtspurl) {
+      showEditSRSPopover.value = true;
+    } else {
+      showEditPopover.value = true;
+    }
     editCameraData.value = row;
   };
 

src/views/cameras/overview/components/AddCameraBySRS.vue

@@ -40,7 +40,7 @@
             :disabled="true"
           />
         </el-form-item>
-        <el-form-item label="rsp地址：" prop="rtspurl">
+        <el-form-item label="rtsp地址：" prop="rtspurl">
           <el-input
             v-model="CameraSRSData.rtspurl"
             placeholder="rtsp://192.168.0.249:557/34020000000_00000000000001"
@@ -60,9 +60,8 @@
 </template>
 
 <script setup lang="ts">
-  import { computed, onBeforeMount, ref } from 'vue';
+  import { onBeforeMount, ref } from 'vue';
   import { CameraSRS } from '../type';
-  import { cameraIPAddForm } from '../constant';
   import useSceneInfos from '@/hooks/useSceneInfos';
   import { cloneDeep } from 'lodash-es';
 

src/views/cameras/overview/components/CameraEditSRSPopover.vue

@@ -0,0 +1,96 @@
+<template>
+  <el-card v-if="props.modelValue" class="pop-card">
+    <template #header>
+      <div class="flex justify-between items-center pop-head">
+        <span class="pop-head-name">编辑相机（通过rtsp添加）</span>
+
+        <el-icon :size="16" class="mr-3" @click="updateValue(false)"><Close /></el-icon>
+      </div>
+    </template>
+    <div class="pop-content flex justify-center items-center">
+      <SRSAddCamera
+        @cancel-execute="updateValue(false)"
+        @confirm-execute="onUpdateSRSCamera"
+        :form-data="props.editData!"
+      />
+    </div>
+  </el-card>
+</template>
+
+<script setup lang="ts">
+  import { Close } from '@element-plus/icons-vue';
+  import SRSAddCamera from './AddCameraBySRS.vue';
+  import useCameraOverview from '../stores/useCameraOverview';
+  import { CameraIPItem } from '../type';
+
+  const props = defineProps<{ modelValue: boolean; editData?: CameraIPItem }>();
+
+  const emits = defineEmits(['update:modelValue']);
+
+  const cameraOverview = useCameraOverview();
+  const { editCamera } = cameraOverview;
+
+  const updateValue = (value) => {
+    emits('update:modelValue', value);
+  };
+
+  const onUpdateSRSCamera = (data) => {
+    editCamera(data).then(() => {
+      updateValue(false);
+    });
+  };
+</script>
+
+<style scoped lang="scss">
+  .pop-card {
+    position: relative;
+    margin-left: 21px !important;
+  }
+
+  .pop-head {
+    height: 56px;
+
+    &-name {
+      margin-left: 24px;
+      font-size: 16px;
+      font-weight: 500;
+      color: #252525;
+    }
+
+    &-tabs {
+      margin-top: 18px;
+
+      :first-child {
+        border-radius: 8px 0px 0px 0px;
+      }
+
+      :last-child {
+        border-radius: 0px 8px 0px 0px;
+      }
+    }
+  }
+
+  .tab-item {
+    width: 188px;
+    height: 38px;
+    background: #fafafa;
+    border: 1px solid #d9d9d9;
+    cursor: pointer;
+
+    &-active {
+      background: #e2eefe;
+      border: 1px solid #1890ff;
+    }
+  }
+
+  .pop-content {
+    height: 566px;
+  }
+
+  :deep(.el-card__header) {
+    padding: 0;
+  }
+  :deep(.el-card__body) {
+    padding: 0;
+  }
+</style>

src/views/cameras/overview/stores/useCameraOverview.ts

@@ -75,7 +75,7 @@ export const useCameraOverview = defineStore('camera-overview', () => {
   };
 
   const editCamera = (data: Partial<CameraShowItem>) => {
-    updateCameraItem(data).then(() => {
+    return updateCameraItem(data).then(() => {
       getCameraItems();
     });
   };

src/views/cameras/overview/type.ts

@@ -25,6 +25,7 @@ export interface CameraIPItem {
   workspaceCode?: string;
   /** 推流地址 */
   pushstreamIp: string;
+  rtspurl: string;
 }
 
 export interface CameraShowItem extends CameraIPItem {