zhudie 2 anni fa
parent
commit
a0dd5e2375

+ 19 - 10
src/views/map-config/mini-map/MapBase/KonvaMap.vue

@@ -6,6 +6,7 @@
         <v-group
           v-for="camera in cameras"
           :key="camera.id"
+          :id="camera.id"
           :config="camera.groupConfig"
           @click="handleCameraClick(camera)"
           @mouseover="(e) => handleMouseOver(e)"
@@ -42,6 +43,7 @@
   import cameraImgSrc from '@/assets/camera/cameraImg.png';
   import favoritesImgSrc from '@/assets/camera/favorites.png';
   import { TipPositionEnum, camerasGroupType } from '../type';
+  import { cloneDeep } from 'lodash-es';
 
   const globSetting = useGlobSetting();
 
@@ -91,6 +93,7 @@
     backgroundSize: 'cover',
   });
 
+  //待修改
   const transformerConfig = ref({ keepRatio: true, rotateAnchorOffset: 30 });
 
   //背景大小变换
@@ -235,6 +238,12 @@
         item.isDefault = false;
       }
     });
+    const transformerNode = transformer.value.getNode();
+    const stage = transformerNode.getStage();
+    transformerNode.nodes([]);
+    const cameraNode = stage.findOne('#' + defaultCameraId.value);
+    // 将变换器附加到点击的相机
+    transformerNode.nodes([cameraNode]);
     defaultShow.value = false;
   };
 
@@ -273,22 +282,22 @@
   const saveLayout = () => {
     const stage = transformer.value.getNode().getStage();
     const groups = stage.find('.group');
-    const camerasList = groups.map((item, index) => {
-      cameras.value[index].groupConfig.x = Math.round(item.attrs.x | 0);
-      cameras.value[index].groupConfig.y = Math.round(item.attrs.y | 0);
-      cameras.value[index].groupConfig.rotation = Number((item.attrs.rotation | 0).toFixed(2));
-      cameras.value[index].groupConfig.scaleX = Number((item.attrs.scaleX | 1).toFixed(1));
-      cameras.value[index].groupConfig.scaleY = Number((item.attrs.scaleY | 1).toFixed(1));
-      cameras.value[index].config.url = cameraImgSrc;
-      return cameras.value[index];
+    const tempList = cloneDeep(cameras.value);
+    const camerasLists = tempList.map((item, index) => {
+      item.groupConfig.x = groups[index].attrs.x;
+      item.groupConfig.y = groups[index].attrs.y;
+      item.groupConfig.rotation = groups[index].attrs.rotation || 0;
+      item.groupConfig.scaleX = groups[index].attrs.scaleX || 1;
+      item.groupConfig.scaleY = groups[index].attrs.scaleY || 1;
+      item.config.url = cameraImgSrc;
+      return item;
     });
-    cameras.value = camerasList;
     const layout = {
       stageConfig: stageConfig.value,
       bgConfig: bgConfig.value,
       bgImgUrl: bgImgUrl.value,
       defaultCameraId: defaultCameraId.value,
-      cameraList: cameras.value,
+      cameraList: camerasLists,
     };
     return JSON.stringify(layout);
   };

+ 1 - 1
src/views/page-config/ConfigEdit.vue

@@ -4,7 +4,7 @@
       <el-icon size="20"><ArrowLeft /></el-icon>
       <div class="head-opt flex-1 flex justify-between items-center">
         <div>
-          <span>场景:</span>
+          <!-- <span>场景:</span> -->
           <el-select
             v-model="selectedCompany"
             class="m-2"