god-ui/src/views/monitoringwarning/screenVideo/index.vue

@@ -11,16 +11,7 @@
             <div>预警</div>
         </div>
     </div>
-    <div class="right-panel" v-show="rightList.length > 0">
-      <el-collapse v-model="activeName" accordion>
-        <el-collapse-item :title="item.name" :name="(index + 1)" v-for="(item, index) in rightList" :key="index">
-          <div v-if="item.src">
-            <img :src="item.src" alt="" style="width: 100%;">
-          </div>
-          <div v-else style="width: 100%;padding: 1rem 0;text-align: center;">暂无视频</div>
-        </el-collapse-item>
-      </el-collapse>
-    </div>
+    
   </div>
 </template>
 <script>
@@ -32,11 +23,7 @@ export default {
   data() {
     return {
       map: null,
-      mouseTool: null,
-      overlays: [],
     
-      activeName: '1',
-      rightList: []
     };
   },
   mounted() {
@@ -44,19 +31,18 @@ export default {
   },
   methods: {
     initMap() {
-      const that = this
       AMapLoader.load({
         key: "e49669059fa36494531a82ed982f395c", // 申请好的Web端开发者Key，首次调用 load 时必填
         version: "1.4.15", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
         // plugins: ["AMap.AutoComplete", "AMap.PlaceSearch"], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
       })
         .then((AMap) => {
-          that.map = new AMap.Map("middleMap", {
+          this.map = new AMap.Map("middleMap", {
             zoom: 13, //级别
             center: [106.45773,29.54098], //中心点坐标
             mapStyle: "",
           });
-          that.map.on("click", (e) => {
+          this.map.on("click", (e) => {
             navigator.clipboard.writeText(
               `[${e.lnglat.R.toString()}, ${e.lnglat.Q.toString()}],`
             );
@@ -79,51 +65,21 @@ export default {
               name: "沙坪公园",
               device: "AI摄像头-CAM90801",
               address: "游客溺水",
-              src: '/images/mapIcon/img1.png'
             },
             {
               locaton: [106.48074381158418,29.54188923556404],
               name: "森林实验小学",
               device: "AI摄像头-CAM90801",
               address: "校门口出现车不礼让行人现象",
-              src: '/images/mapIcon/img2.jpeg'
+              src:this.sp2
             },
           ];
-
-          AMap.plugin(
-            ["AMap.PlaceSearch", "AMap.Autocomplete", "AMap.MouseTool"],
-            (status, result) => {
-              that.mouseTool = new AMap.MouseTool(that.map);
-              that.mouseTool.on('draw', function (e) {
-                that.overlays.push(e.obj);
-                console.log('dasda', e.obj.De.path);
-                const _path = e.obj.De.path.map(item => ([item.R, item.Q]))
-                console.log('_path', _path);
-                setTimeout(() => {
-                  const innerItem = [...marks, ...marks2].filter(item => {
-                    return AMap.GeometryUtil.isPointInRing(item.locaton, _path);
-                  })
-                  console.log('innerItem', innerItem);
-                  that.rightList = innerItem
-                  that.map.remove(that.overlays)
-                }, 200)
-              })
-              that.mouseTool.rectangle({
-                fillColor: '#00b0ff',
-                strokeColor: '#80d8ff'
-                // 同Polygon的Option设置
-              });
-            }
-          );
-          
           marks.forEach((item, index) => {
-            that.addMapMarker(item.locaton, 'sxt2', { name: item.name, device: item.device })
+            this.addMapMarker(item.locaton, 'sxt2', { name: item.name, device: item.device })
           });
           marks2.forEach((item, index) => {
-            that.addMapMarker2(item.locaton, 'jb', { name: item.name, device: item.device, address: item.address })
+            this.addMapMarker2(item.locaton, 'jb', { name: item.name, device: item.device,address: item.address})
           });
-
-
         })
         .catch((e) => {
           console.log(e);
@@ -205,21 +161,8 @@ export default {
   width: 100vw;
   height: calc(100vh - 84px);
 }
-
 .box{
     position: relative;
-  .right-panel {
-    position: absolute;
-    right: 1rem;
-    top: 1rem;
-    width: 18rem;
-    padding: 1rem;
-    z-index: 999;
-    background-color: white;
-    border-radius: .4rem;
-    box-shadow: 2px 2px 4px #25252525, -2px -2px 2px #14141414;
-  }
-
     .sl{
         width: 250px;
         height: 70px;
@@ -229,14 +172,12 @@ export default {
         display: flex;
         align-items: center;
         justify-content: space-between;
-
         .left{
             width: 49%;
             height: 100%;
             display: flex;
             align-items: center;
             justify-content: space-around;
-
             .sxt{
                 width: 2.5rem;
                 height: 2.5rem;
@@ -244,14 +185,12 @@ export default {
                 background-image: url(./assets/jk.png);
             }
         }
-
         .right{
             width: 49%;
             height: 100%;
             display: flex;
             align-items: center;
             justify-content: space-around;
-
             .warn{
                 width: 2.5rem;
                 height: 2.5rem;

god-ui/src/views/rescue/fixedVideo/index.vue

@@ -68,21 +68,21 @@ export default {
               name: "沙坪公园",
               device: "AI摄像头-CAM90801",
               address: "游客溺水",
-              src:'/images/mapIcon/img1.png'
+              src:'./assets/img1.png'
             },
             {
               locaton: [106.48074381158418,29.54188923556404],
               name: "森林实验小学",
               device: "AI摄像头-CAM90801",
               address: "校门口出现车不礼让行人现象",
-              src:'/images/mapIcon/img2.jpeg'
+              src:'./assets/img2.jpeg'
             },
           ];
           marks.forEach((item, index) => {
             this.addMapMarker(item.locaton, 'sxt2', { name: item.name, device: item.device })
           });
           marks2.forEach((item, index) => {
-            this.addMapMarker2(item.locaton, 'jb', item)
+            this.addMapMarker2(item.locaton, 'jb', { name: item.name, device: item.device,address: item.address})
           });
         })
         .catch((e) => {