车间小地图点击左侧在画布上出现相机提示

src/views/map-config/mini-map/MapBase/KonvaMap.vue

@@ -321,6 +321,12 @@
     });
   };
 
+  //根据id找到对应的相机
+  const findCamera = (cameraId: string) => {
+    const camera = cameras.value.find((item) => item.id === cameraId);
+    return camera;
+  };
+
   //保存布局
   const saveLayout = () => {
     const stage = transformer.value.getNode().getStage();
@@ -424,7 +430,16 @@
     });
   };
 
-  defineExpose({ addBg, createMap, resetMap, addCamera, resizeContainer, saveLayout });
+  defineExpose({
+    addBg,
+    createMap,
+    handleCameraClick,
+    findCamera,
+    resetMap,
+    addCamera,
+    resizeContainer,
+    saveLayout,
+  });
 
   onMounted(() => {
     window.addEventListener('keydown', handleKeyDown);

src/views/map-config/mini-map/MiniMapConfig.vue

@@ -46,7 +46,11 @@
             <el-button :icon="Refresh" :disabled="!hasBg"> 替换照片 </el-button>
           </el-upload>
 
-          <el-button @click="handleSave" style="margin-left: 40px" type="primary" :disabled="isSave"
+          <el-button
+            @click="handleSave"
+            style="margin-left: 40px"
+            type="primary"
+            :disabled="!isSave"
             >保存为布局
           </el-button>
         </div>
@@ -166,7 +170,7 @@
   const hasBg = ref(false);
 
   //是否能够保存
-  const isSave = computed(() => !(selectedShopCode.value && hasBg.value));
+  const isSave = computed(() => selectedShopCode.value && hasBg.value);
 
   //单个相机时是否上传图片
   const isUploadBg = ref<boolean>(true);
@@ -273,6 +277,11 @@
   });
 
   const handleAddCamera = (cameraId: string) => {
+    if (isAddedCamera(cameraId)) {
+      const camera = konvaMap.value.findCamera(cameraId);
+      konvaMap.value.handleCameraClick(camera);
+      return;
+    }
     if (!hasBg.value) {
       ElMessage.warning({
         message: '请先添加背景图片',
@@ -309,7 +318,7 @@
   };
 
   onBeforeRouteLeave(async () => {
-    if (!isSave.value) {
+    if (isSave.value) {
       await ElMessageBox.confirm('是否保存当前修改?', '提示', {
         confirmButtonText: '是',
         cancelButtonText: '否',
@@ -399,7 +408,7 @@
   }
   .isAdded {
     color: #1890ff;
-    cursor: not-allowed;
+    //cursor: not-allowed;
   }
   .isActive {
     background-color: #e6f7ff;