八项作业摄像头播放相关

src/request/map.js

@@ -7,3 +7,4 @@ export const getUserByCardNo = (params) =>
 export const getEightWorks = (params) => post("/map/getEightWorks", params);
 
 export const getHotworkList = (params) => post("/map/getHotworkList", params);
+export const getCameraList = (params) => post("/map/getCameraList", params);

src/views/BI/components/bottom_options.vue

@@ -39,6 +39,7 @@ import VideoAIAnalysisRight from "@/views/BI/components/video_ai_analysisRight.v
 import { useVModels } from "@vueuse/core";
 import { handleTrajectory } from "@/views/BI/js/trajectory.js";
 import { handleHortwork } from "@/views/BI/js/eight_work.js";
+import { handleCamera } from "@/views/BI/js/camera.js";
 
 const props = defineProps({
   leftCurrentComponent: {
@@ -219,8 +220,9 @@ const bottomOptionsList = [
           import.meta.url
         ).href,
         title: "摄像头",
-        type: "camera",
+        type: "workSafelyCamera",
         check: false,
+        action: handleCamera,
       },
     ],
   },
@@ -336,7 +338,7 @@ const fnBottomChildOptionsListChange = (index, item1, index1) => {
   data.bottomOptionsList[index].list[index1].check =
     !data.bottomOptionsList[index].list[index1].check;
   data.bottomOptionsList[index].list[index1].action(
-    data.bottomOptionsList[index].list[index1].check
+    data.bottomOptionsList[index].list[index1].check,item1.type
   );
 };
 </script>

src/views/BI/components/dialog/camera_dialog.vue

@@ -0,0 +1,91 @@
+<template>
+  <el-dialog v-model="visible" title="摄像头">
+    <table>
+      <thead>
+        <tr>
+          <td colspan="10" style="border: none">
+            <el-divider content-position="left">
+              {{ data.info.cameraType }}
+            </el-divider>
+            <div class="tr">摄像头名称:{{ data.info.VIDEONAME }}</div>
+          </td>
+        </tr>
+      </thead>
+      <tr>
+        <td class="title">摄像头编码</td>
+        <td>{{ data.info.CODE }}</td>
+      </tr>
+      <tr>
+        <td colspan="10">
+          <div class="video">
+            <iframe
+              :src="data.info.VIDEOURL"
+              style="width: 100%; height: 100%"
+            />
+          </div>
+        </td>
+      </tr>
+    </table>
+    <template #footer>
+      <el-button @click="fnClose">关闭</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { useVModels } from "@vueuse/core";
+import { reactive, onMounted } from "vue";
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false,
+  },
+  pd: {
+    type: Object,
+    required: true,
+    default: () => ({}),
+  },
+});
+
+const data = reactive({
+  info: {},
+});
+
+onMounted(() => {
+  data.info = props.pd.pd;
+});
+
+const emits = defineEmits(["update:visible"]);
+const { visible } = useVModels(props, emits);
+const fnClose = () => {
+  visible.value = false;
+};
+</script>
+
+<style lang="scss" scoped>
+table {
+  border-collapse: collapse;
+  width: 100%;
+  .video {
+    width: 100%;
+    height: 500px;
+    border: 2px solid #11acd7;
+    border-radius: 4px;
+  }
+
+  td,
+  th {
+    border: 1px solid var(--el-border-color);
+    padding: 8px 12px;
+    font-size: 14px;
+  }
+
+  .title {
+    background: var(--el-fill-color-light);
+    width: 200px;
+    text-align: center;
+  }
+}
+</style>

src/views/BI/components/video_ai_analysisRight.vue

@@ -36,8 +36,8 @@
                 </div>
               </div>
               <div class="time">{{ item.WARNING_TIME }}</div>
-              <div class="text">{{ "摄像头名称" + item.VIDEONAME }}</div>
-              <div class="text">{{ "摄像头编号" + item.CODE }}</div>
+              <div class="text">{{ "摄像头名称：" + item.VIDEONAME }}</div>
+              <div class="text">{{ "摄像头编号：" + item.CODE }}</div>
             </div>
           </div>
         </div>

src/views/BI/js/camera.js

@@ -0,0 +1,37 @@
+import { getCameraList } from "@/request/map";
+import { addEntity } from "./map.js";
+
+let cameraList = [];
+
+export const handleCamera = (b, type) => {
+  if (b) {
+    showCameraList(type);
+  } else {
+    if (cameraList) {
+      cameraList.children.forEach((e) => {
+        e.destroy();
+      });
+    }
+  }
+};
+
+const showCameraList = async (mapPointName) => {
+  cameraList = new window.CustomCesium.GroupModel(mapPointName);
+  const { varList } = await getCameraList({ CAMREA_TYPE: mapPointName });
+  const NAME_POINT = {
+    workSafelyCamera: "八项作业摄像头",
+  };
+  varList.forEach(({ VIDEOMANAGER_ID, VIDEONAME, lon, lat, alt }) => {
+    addEntity(
+      cameraList,
+      VIDEOMANAGER_ID,
+      NAME_POINT[mapPointName],
+      VIDEONAME,
+      lon,
+      lat,
+      alt,
+      "/src/assets/images/map/bottom/ico12_on.png"
+    );
+  });
+  cameraList.show(true);
+};

src/views/BI/js/map.js

@@ -1,10 +1,12 @@
 import { h, render, ref } from "vue";
 import userDialog from "../components/dialog/user_dialog.vue";
 import hotworkDialog from "../components/dialog/hotwork_dialog.vue";
+import cameraDialog from "../components/dialog/camera_dialog.vue";
 import { Loadglb } from "./loadglb.js";
 
 import { getUserByCardNo } from "@/request/map";
 import { getHotWorkView } from "@/request/eight_work.js";
+import { getVideoManagerView } from "@/request/video_manager.js";
 // const mapUrl =
 //   "https://gac-geo.googlecnapps.cn/maps/vt?lyrs=s&x={x}&y={y}&z={z}";
 const loadMap = 2;
@@ -61,6 +63,7 @@ const handleMouseClick = () => {
   const $mouse = new window.CustomCesium.Mouse(window.$icy);
   // 隐藏逻辑
   $mouse.mouseLeft((model) => {
+    console.log("model");
     console.log(model);
     if (model._name === "建筑") {
       clickBuilding(model);
@@ -71,6 +74,9 @@ const handleMouseClick = () => {
     if (model._name.indexOf("动火作业") > -1) {
       clickHotwork(model);
     }
+    if (model._name.indexOf("八项作业摄像头") > -1) {
+      clickCamera(model);
+    }
   });
 };
 
@@ -184,6 +190,13 @@ const clickPerson = async (model) => {
   const { pd } = await getUserByCardNo({ CARDNO: cacrdNo });
   handleDialog(userDialog, pd);
 };
+const clickCamera = async (model) => {
+  const id = model._id;
+  const pd = await getVideoManagerView({ VIDEOMANAGER_ID: id });
+  pd.pd.cameraType = model._name;
+  console.log(pd);
+  handleDialog(cameraDialog, pd);
+};
 
 const clickHotwork = async (model) => {
   const id = model._id;