八项作业添加监控播放

src/views/eightwork_videomanager/components/add.vue

@@ -55,9 +55,10 @@
 import { serialNumber } from "@/assets/js/utils";
 import useListData from "@/assets/js/useListData";
 import {
-    getVideoManagerList, setEightWorkVideoManagerDelete,
+  getVideoManagerList,
+  setEightWorkVideoManagerDelete,
   setEightWorkVideoManagerList,
-    setVideoManagerList
+  setVideoManagerList,
 } from "@/request/eightwork_videomanager";
 import { useVModel } from "@vueuse/core";
 import { debounce } from "throttle-debounce";
@@ -71,24 +72,30 @@
   checkNo: {
     type: String,
     required: true,
-      default: '',
+    default: "",
   },
 });
-  const emits = defineEmits(["update:visible",'get-data']);
+const emits = defineEmits(["update:visible", "get-data"]);
 const visible = useVModel(props, "visible", emits);
 const { list, pagination, searchForm, fnGetData, fnResetPagination } =
   useListData(getVideoManagerList);
 const fnSubmit = debounce(
   1000,
   async (row) => {
-            const resData = await setVideoManagerList({VIDEOMANAGER_ID:row.VIDEOMANAGER_ID})
+    const resData = await setVideoManagerList({
+      VIDEOMANAGER_ID: row.VIDEOMANAGER_ID,
+    });
     if (resData.pd) {
-              await setEightWorkVideoManagerDelete({EIGHTWORKVIDEOMANAGER_ID:resData.pd.EIGHTWORKVIDEOMANAGER_ID})
-              await ElMessageBox.confirm("该监控已绑定其他作业，是否更改？", { type: "warning" });
+      await setEightWorkVideoManagerDelete({
+        EIGHTWORKVIDEOMANAGER_ID: resData.pd.EIGHTWORKVIDEOMANAGER_ID,
+      });
+      await ElMessageBox.confirm("该监控已绑定其他作业，是否更改？", {
+        type: "warning",
+      });
     }
-            await setEightWorkVideoManagerList({...row, CHECK_NO: props.checkNo})
+    await setEightWorkVideoManagerList({ ...row, CHECK_NO: props.checkNo });
     ElMessage.success("操作成功");
-            emits('get-data')
+    emits("get-data");
   },
   { atBegin: true }
 );

src/views/eightwork_videomanager/components/video.vue

@@ -0,0 +1,29 @@
+<template>
+  <el-dialog v-model="visible" title="播放视频">
+    <iframe :src="src" style="width: 100%; height: 500px" />
+    <template #footer>
+      <el-button @click="visible = false">关闭</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { useVModel } from "@vueuse/core";
+
+const prosp = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false,
+  },
+  src: {
+    type: String,
+    required: true,
+    default: "",
+  },
+});
+const emits = defineEmits(["update:visible"]);
+const visible = useVModel(prosp, "visible", emits);
+</script>
+
+<style scoped lang="scss"></style>

src/views/eightwork_videomanager/index.vue

@@ -57,16 +57,16 @@
           <el-button type="primary" @click="fnAdd"> 新增 </el-button>
         </template>
       </layout-table>
-      <layout-video
-        :src="data.videoDialog.src"
-        v-model:visible="data.videoDialog.visible"
-      />
     </layout-card>
     <add
       v-model:visible="data.addDialog.Visible"
       :check-no="data.addDialog.checkNo"
       @get-data="fnResetPagination"
     />
+    <video-view
+      v-model:visible="data.videoDialog.visible"
+      :src="data.videoDialog.src"
+    />
   </div>
 </template>
 
@@ -81,10 +81,10 @@ import { reactive } from "vue";
 import Add from "./components/add.vue";
 import { useRoute } from "vue-router";
 import { ElMessageBox } from "element-plus";
-import LayoutVideo from "@/components/video/index.vue";
+import VideoView from "./components/video.vue";
+
 const route = useRoute();
 const { CHECK_NO } = route.query;
-
 const { list, pagination, searchForm, fnGetData, fnResetPagination } =
   useListData(getEightWorkVideoManagerList, {
     otherParams: { CHECK_NO },