Forráskód Böngészése

Merge branch 'FixMap' into 'master'

车间地图跳转保存提示

See merge request tian-group/skyeye-admin-fe!75
楼航飞 2 éve
szülő
commit
7b87454ef7

+ 16 - 1
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);

+ 30 - 3
src/views/map-config/mini-map/MiniMapConfig.vue

@@ -50,7 +50,7 @@
             @click="handleSave"
             style="margin-left: 40px"
             type="primary"
-            :disabled="!selectedShopCode"
+            :disabled="!isSave"
             >保存为布局
           </el-button>
         </div>
@@ -136,7 +136,7 @@
 <script setup lang="ts">
   import useMiniMap from './use-mini-map';
   import { storeToRefs } from 'pinia';
-  import { ElMessage, ElInput } from 'element-plus';
+  import { ElMessage, ElInput, ElMessageBox } from 'element-plus';
   import { onMounted, onUnmounted, ref } from 'vue';
   import { updateMinMapViewLayoutApi } from '@/api/scene/scene';
   import { computed } from 'vue';
@@ -144,6 +144,7 @@
   import KonvaMap from './MapBase/KonvaMap.vue';
   import { useUserStore } from '@/store/modules/user';
   import useCameraStatus from '@/views/cameras/preview/store/useCameraStatus';
+  import { onBeforeRouteLeave } from 'vue-router';
 
   const cameraStatus = useCameraStatus();
   const { openInterval, closeInterval } = cameraStatus;
@@ -168,6 +169,9 @@
   // 是否已有背景图
   const hasBg = ref(false);
 
+  //是否能够保存
+  const isSave = computed(() => selectedShopCode.value && hasBg.value);
+
   //单个相机时是否上传图片
   const isUploadBg = ref<boolean>(true);
   const isMap = ref(false);
@@ -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: '请先添加背景图片',
@@ -307,6 +316,24 @@
       });
     }
   };
+
+  onBeforeRouteLeave(async () => {
+    if (isSave.value) {
+      await ElMessageBox.confirm('是否保存当前修改?', '提示', {
+        confirmButtonText: '是',
+        cancelButtonText: '否',
+        type: 'warning',
+      })
+        .then(() => {
+          handleSave();
+        })
+        .catch(() => {
+          return true;
+        });
+    } else {
+      return true;
+    }
+  });
 </script>
 
 <style scoped lang="scss">
@@ -381,7 +408,7 @@
   }
   .isAdded {
     color: #1890ff;
-    cursor: not-allowed;
+    //cursor: not-allowed;
   }
   .isActive {
     background-color: #e6f7ff;