bugFix

pnpm-lock.yaml

@@ -111,7 +111,7 @@ dependencies:
     specifier: 1.8.6
     version: 1.8.6(vue@3.3.4)
   vue-konva:
-    specifier: ^3.0.2
+    specifier: 3.0.2
     version: 3.0.2(konva@9.3.0)
   vue-router:
     specifier: 4.1.2
@@ -156,7 +156,7 @@ devDependencies:
     version: 5.30.7(eslint@8.20.0)(typescript@4.7.4)
   '@vitejs/plugin-vue':
     specifier: 2.3.3
-    version: 2.3.3(vite@5.0.10)(vue@3.3.4)
+    version: 2.3.3(vite@5.1.3)(vue@3.3.4)
   '@vitejs/plugin-vue-jsx':
     specifier: 1.3.10
     version: 1.3.10
@@ -232,6 +232,9 @@ devDependencies:
   sass:
     specifier: 1.53.0
     version: 1.53.0
+  simple-git:
+    specifier: 3.22.0
+    version: 3.22.0
   stylelint:
     specifier: 14.9.1
     version: 14.9.1
@@ -257,26 +260,26 @@ devDependencies:
     specifier: 4.7.4
     version: 4.7.4
   vite:
-    specifier: 5.0.10
-    version: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+    specifier: 5.1.3
+    version: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
   vite-plugin-compression:
     specifier: 0.5.1
-    version: 0.5.1(vite@5.0.10)
+    version: 0.5.1(vite@5.1.3)
   vite-plugin-html:
-    specifier: 3.2.0
-    version: 3.2.0(vite@5.0.10)
+    specifier: 3.2.2
+    version: 3.2.2(vite@5.1.3)
   vite-plugin-mock:
     specifier: 2.9.6
-    version: 2.9.6(mockjs@1.1.0)(vite@5.0.10)
+    version: 2.9.6(mockjs@1.1.0)(vite@5.1.3)
   vite-plugin-style-import:
     specifier: 2.0.0
-    version: 2.0.0(vite@5.0.10)
+    version: 2.0.0(vite@5.1.3)
   vite-plugin-svg-icons:
     specifier: 2.0.1
-    version: 2.0.1(vite@5.0.10)
+    version: 2.0.1(vite@5.1.3)
   vite-plugin-vue-setup-extend:
     specifier: 0.4.0
-    version: 0.4.0(vite@5.0.10)
+    version: 0.4.0(vite@5.1.3)
   vue-eslint-parser:
     specifier: 9.0.3
     version: 9.0.3(eslint@8.20.0)
@@ -1133,6 +1136,18 @@ packages:
       '@jridgewell/sourcemap-codec': 1.4.15
     dev: true
 
+  /@kwsites/file-exists@1.1.1:
+    resolution: {integrity: sha512-m9/5YGR18lIwxSFDwfE3oA7bWuq9kdau6ugN4H2rJeyhFQZcG9AgSHkQtSD15a8WvTgfz9aikZMrKPHvbpqFiw==}
+    dependencies:
+      debug: 4.3.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@kwsites/promise-deferred@1.1.1:
+    resolution: {integrity: sha512-GaHYm+c0O9MjZRu0ongGBRbinu8gVAMd2UZjji6jVmqKtZluZnptXGWhz1E8j8D2HJ3f/yMxKAUC0b+57wncIw==}
+    dev: true
+
   /@lukeed/csprng@1.1.0:
     resolution: {integrity: sha512-Z7C/xXCiGWsg0KuKsHTKJxbWhpI3Vs5GwLfOean7MGyVFGqdRgBbAjOCh6u4bbjPc/8MJ2pZmK/0DLdCbivLDA==}
     engines: {node: '>=8'}
@@ -1646,14 +1661,14 @@ packages:
       - supports-color
     dev: true
 
-  /@vitejs/plugin-vue@2.3.3(vite@5.0.10)(vue@3.3.4):
+  /@vitejs/plugin-vue@2.3.3(vite@5.1.3)(vue@3.3.4):
     resolution: {integrity: sha512-SmQLDyhz+6lGJhPELsBdzXGc+AcaT8stgkbiTFGpXPe8Tl1tJaBw1A6pxDqDuRsVkD8uscrkx3hA7QDOoKYtyw==}
     engines: {node: '>=12.0.0'}
     peerDependencies:
       vite: ^2.5.10
       vue: ^3.2.25
     dependencies:
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
       vue: 3.3.4
     dev: true
 
@@ -6542,8 +6557,8 @@ packages:
       source-map-js: 1.0.2
     dev: true
 
-  /postcss@8.4.32:
-    resolution: {integrity: sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==}
+  /postcss@8.4.35:
+    resolution: {integrity: sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==}
     engines: {node: ^10 || ^12 || >=14}
     dependencies:
       nanoid: 3.3.7
@@ -7096,6 +7111,16 @@ packages:
     dev: false
     optional: true
 
+  /simple-git@3.22.0:
+    resolution: {integrity: sha512-6JujwSs0ac82jkGjMHiCnTifvf1crOiY/+tfs/Pqih6iow7VrpNKRRNdWm6RtaXpvvv/JGNYhlUtLhGFqHF+Yw==}
+    dependencies:
+      '@kwsites/file-exists': 1.1.1
+      '@kwsites/promise-deferred': 1.1.1
+      debug: 4.3.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /slash@3.0.0:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
     engines: {node: '>=8'}
@@ -8040,7 +8065,7 @@ packages:
     engines: {node: '>= 0.8'}
     dev: true
 
-  /vite-plugin-compression@0.5.1(vite@5.0.10):
+  /vite-plugin-compression@0.5.1(vite@5.1.3):
     resolution: {integrity: sha512-5QJKBDc+gNYVqL/skgFAP81Yuzo9R+EAf19d+EtsMF/i8kFUpNi3J/H01QD3Oo8zBQn+NzoCIFkpPLynoOzaJg==}
     peerDependencies:
       vite: '>=2.0.0'
@@ -8048,13 +8073,13 @@ packages:
       chalk: 4.1.2
       debug: 4.3.4
       fs-extra: 10.1.0
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /vite-plugin-html@3.2.0(vite@5.0.10):
-    resolution: {integrity: sha512-2VLCeDiHmV/BqqNn5h2V+4280KRgQzCFN47cst3WiNK848klESPQnzuC3okH5XHtgwHH/6s1Ho/YV6yIO0pgoQ==}
+  /vite-plugin-html@3.2.2(vite@5.1.3):
+    resolution: {integrity: sha512-vb9C9kcdzcIo/Oc3CLZVS03dL5pDlOFuhGlZYDCJ840BhWl/0nGeZWf3Qy7NlOayscY4Cm/QRgULCQkEZige5Q==}
     peerDependencies:
       vite: '>=2.0.0'
     dependencies:
@@ -8070,10 +8095,10 @@ packages:
       html-minifier-terser: 6.1.0
       node-html-parser: 5.3.3
       pathe: 0.2.0
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
     dev: true
 
-  /vite-plugin-mock@2.9.6(mockjs@1.1.0)(vite@5.0.10):
+  /vite-plugin-mock@2.9.6(mockjs@1.1.0)(vite@5.1.3):
     resolution: {integrity: sha512-/Rm59oPppe/ncbkSrUuAxIQihlI2YcBmnbR4ST1RA2VzM1C0tEQc1KlbQvnUGhXECAGTaQN2JyasiwXP6EtKgg==}
     engines: {node: '>=12.0.0'}
     peerDependencies:
@@ -8090,13 +8115,13 @@ packages:
       fast-glob: 3.2.12
       mockjs: 1.1.0
       path-to-regexp: 6.2.1
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
     transitivePeerDependencies:
       - rollup
       - supports-color
     dev: true
 
-  /vite-plugin-style-import@2.0.0(vite@5.0.10):
+  /vite-plugin-style-import@2.0.0(vite@5.1.3):
     resolution: {integrity: sha512-qtoHQae5dSUQPo/rYz/8p190VU5y19rtBaeV7ryLa/AYAU/e9CG89NrN/3+k7MR8mJy/GPIu91iJ3zk9foUOSA==}
     peerDependencies:
       vite: '>=2.0.0'
@@ -8108,10 +8133,10 @@ packages:
       fs-extra: 10.1.0
       magic-string: 0.25.9
       pathe: 0.2.0
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
     dev: true
 
-  /vite-plugin-svg-icons@2.0.1(vite@5.0.10):
+  /vite-plugin-svg-icons@2.0.1(vite@5.1.3):
     resolution: {integrity: sha512-6ktD+DhV6Rz3VtedYvBKKVA2eXF+sAQVaKkKLDSqGUfnhqXl3bj5PPkVTl3VexfTuZy66PmINi8Q6eFnVfRUmA==}
     peerDependencies:
       vite: '>=2.0.0'
@@ -8124,23 +8149,23 @@ packages:
       pathe: 0.2.0
       svg-baker: 1.7.0
       svgo: 2.8.0
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /vite-plugin-vue-setup-extend@0.4.0(vite@5.0.10):
+  /vite-plugin-vue-setup-extend@0.4.0(vite@5.1.3):
     resolution: {integrity: sha512-WMbjPCui75fboFoUTHhdbXzu4Y/bJMv5N9QT9a7do3wNMNHHqrk+Tn2jrSJU0LS5fGl/EG+FEDBYVUeWIkDqXQ==}
     peerDependencies:
       vite: '>=2.0.0'
     dependencies:
       '@vue/compiler-sfc': 3.3.4
       magic-string: 0.25.9
-      vite: 5.0.10(@types/node@17.0.45)(sass@1.53.0)
+      vite: 5.1.3(@types/node@17.0.45)(sass@1.53.0)
     dev: true
 
-  /vite@5.0.10(@types/node@17.0.45)(sass@1.53.0):
-    resolution: {integrity: sha512-2P8J7WWgmc355HUMlFrwofacvr98DAjoE52BfdbwQtyLH06XKwaL/FMnmKM2crF0iX4MpmMKoDlNCB1ok7zHCw==}
+  /vite@5.1.3(@types/node@17.0.45)(sass@1.53.0):
+    resolution: {integrity: sha512-UfmUD36DKkqhi/F75RrxvPpry+9+tTkrXfMNZD+SboZqBCMsxKtO52XeGzzuh7ioz+Eo/SYDBbdb0Z7vgcDJew==}
     engines: {node: ^18.0.0 || >=20.0.0}
     hasBin: true
     peerDependencies:
@@ -8169,7 +8194,7 @@ packages:
     dependencies:
       '@types/node': 17.0.45
       esbuild: 0.19.10
-      postcss: 8.4.32
+      postcss: 8.4.35
       rollup: 4.9.1
       sass: 1.53.0
     optionalDependencies:

src/api/scene/scene.ts

@@ -240,3 +240,28 @@ export const getCompanyLayoutApi = (params: { companyId: number; labelId: number
     params,
   });
 };
+
+// /** 查询公司主页配置 */
+// export const getCompanyLayoutApi = (params: { companyId: number; labelId: number }) => {
+//   return http.request({
+//     url: '/homepageConfig/getCompanyLayoutByCompanyLabel',
+//     method: 'get',
+//     params,
+//   });
+// };
+
+/** 查询所有公司主页配置 */
+export const getCompanyLayoutList = () => {
+  return http.request({
+    url: '/homepageConfig/getCompanyLayoutList',
+    method: 'get',
+  });
+};
+
+/** 删除公司主页配置 */
+export const delCompanyLayout = (params: number) => {
+  return http.request({
+    url: `/homepageConfig/deleteCompanyLayout?layoutId=${params}`,
+    method: 'delete',
+  });
+};

src/hooks/useSceneInfos.ts

@@ -60,24 +60,6 @@ export function useSceneInfos() {
 
   const getCameraList = (workshop: number) => {
     return getCamerasByWorkSpace({ workshopId: workshop }).then((res) => {
-      res[0]?.cameraList?.push(
-        {
-          name: 'C204',
-          code: 'C204',
-          cameraIp: '192.168.1.203',
-          remark: '',
-          status: 0,
-          pushstreamIp: 'http://192.168.1.138:8080/live/C203.flv',
-        },
-        {
-          name: 'C205',
-          code: 'C205',
-          cameraIp: '192.168.1.203',
-          remark: '',
-          status: 0,
-          pushstreamIp: 'http://192.168.1.138:8080/live/C203.flv',
-        },
-      );
       return res;
     });
   };

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

@@ -94,7 +94,11 @@
   });
 
   //待修改
-  const transformerConfig = ref({ keepRatio: true, rotateAnchorOffset: 30 });
+  const transformerConfig = ref({
+    keepRatio: true,
+    rotateAnchorOffset: 30,
+    enabledAnchors: ['top-left', 'top-right', 'bottom-left', 'bottom-right'],
+  });
 
   //背景大小变换
   const resizeContainer = (width, height) => {
@@ -198,8 +202,6 @@
   const addCamera = (id: string) => {
     const existingCamera = cameras.value.find((camera) => camera.id === id);
     if (existingCamera) return;
-    // const camImg = new Image();
-    // camImg.src = cameraImgSrc;
     const config = {
       width: 52,
       height: 37,
@@ -263,19 +265,22 @@
     { immediate: true, deep: true },
   );
 
+  const clearBg = () => {
+    bgImg.src = null as any as string;
+  };
+
   //添加背景
   const addBg = (imgBg) => {
-    bgImgUrl.value = imgBg;
-    if (!bgImgUrl.value) {
-      bgImg.src = null as any as string;
-      return;
-    }
-    bgImg.src = urlJoin(globSetting.imgUrl!, imgBg) as string;
-    bgImg.onload = () => {
-      bgConfig.value.width = bgImg.width;
-      bgConfig.value.height = bgImg.height;
-      resizeContainer(bgImg.width, bgImg.height);
-    };
+    return new Promise((resolve) => {
+      bgImgUrl.value = imgBg;
+      bgImg.src = urlJoin(globSetting.imgUrl!, imgBg) as string;
+      bgImg.onload = () => {
+        bgConfig.value.width = bgImg.width;
+        bgConfig.value.height = bgImg.height;
+        resizeContainer(bgImg.width, bgImg.height);
+        resolve(null);
+      };
+    });
   };
 
   //保存布局
@@ -324,7 +329,7 @@
   //重置
   const resetMap = () => {
     bgImgUrl.value = null;
-    addBg('');
+    clearBg();
     cameras.value = [];
     lastClickedGroupId.value = null;
     defaultCameraId.value = '';
@@ -332,16 +337,15 @@
 
   /** 导入布局json */
   const createMap = (layout) => {
-    addBg(layout.bgImgUrl);
-    stageConfig.value = layout.stageConfig;
-    // const camImg = new Image();
-    // camImg.src = cameraImgSrc;
-    defaultCameraId.value = layout.defaultCameraId;
-    layout.cameraList = layout.cameraList?.map((item) => {
-      item.config.image = camImg;
-      return item;
+    addBg(layout.bgImgUrl).then((_res) => {
+      stageConfig.value = layout.stageConfig;
+      defaultCameraId.value = layout.defaultCameraId;
+      layout.cameraList = layout.cameraList?.map((item) => {
+        item.config.image = camImg;
+        return item;
+      });
+      cameras.value = layout.cameraList;
     });
-    cameras.value = layout.cameraList;
   };
 
   defineExpose({ addBg, createMap, resetMap, addCamera, resizeContainer, saveLayout });

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

@@ -1,5 +1,5 @@
 <template>
-  <div class="page" @click="handleWholeClick">
+  <div class="page">
     <div class="page-head flex items-center">
       <el-icon size="20"><ArrowLeft /></el-icon>
       <div class="head-opt flex-1 flex justify-between items-center">
@@ -26,9 +26,7 @@
             name="file"
             :data="{ workshopId: selectedShopDetail?.id }"
           >
-            <el-button style="font-size: 12px" :icon="Refresh" :disabled="!hasBg">
-              替换照片
-            </el-button>
+            <el-button :icon="Refresh" :disabled="!hasBg"> 替换照片 </el-button>
           </el-upload>
 
           <el-button
@@ -144,7 +142,6 @@
     camerasAdded.value = camerasList.map((item) => {
       return item.id;
     });
-    // console.log('camerasAdded.value', camerasAdded.value);
   };
 
   /** 判断相机是否已经添加 */
@@ -158,7 +155,6 @@
   };
 
   const handleAvatarSuccess = (e) => {
-    //自己的
     imgUrlBg.value = e.data;
     konvaMap.value.addBg(imgUrlBg.value);
     hasBg.value = true;
@@ -181,12 +177,6 @@
     });
   };
 
-  const handleWholeClick = (e) => {
-    // if (e.button === 0) {
-    //   mapEditor.destoryOptBlock();
-    // }
-  };
-
   onMounted(() => {
     getScenesTree({ level: 2, valueKey: 'code', labelKey: 'name', disabled: true });
     konvaMap.value.resizeContainer(
@@ -212,12 +202,9 @@
       return;
     }
     konvaMap.value.addCamera(cameraId);
-    // mapEditor.addCamera(cameraId);
-    // konvaMap.value.addCamera(cameraId);
   };
 
   const handleSave = () => {
-    // const layout = mapEditor.toJson();
     const layout = konvaMap.value.saveLayout();
     updateMinMapViewLayoutApi({ layout, targetId: String(selectedShopDetail.value?.id) }).then(
       (res) => {

src/views/page-config/ConfigEdit.vue

@@ -20,7 +20,7 @@
             />
           </el-select>
         </div>
-        <div v-if="selectedCompany" style="display: flex; margin-top: 8px">
+        <div v-if="selectedCompany" style="display: flex">
           <div class="label-workshop">选择标签:</div>
           <div>
             <el-radio-group
@@ -50,9 +50,7 @@
             name="file"
             :data="{ companyId: selectedCompany, labelId: label, deleteFileName: bgImg }"
           >
-            <el-button style="font-size: 12px" :icon="Refresh" :disabled="!hasBg">
-              替换照片
-            </el-button>
+            <el-button :icon="Refresh" :disabled="!hasBg"> 替换照片 </el-button>
           </el-upload>
 
           <el-button
@@ -242,8 +240,8 @@
 
   const handleAvatarSuccess = (e) => {
     bgImg.value = e.data;
-    addBg();
     hasBg.value = true;
+    addBg();
   };
 
   const changeShop = () => {
@@ -261,14 +259,12 @@
         }
         layoutId.value = res.id;
         const layoutJSON = res.layout ? safeParse(res.layout) : null;
-        // console.log();
 
         if (!layoutJSON) {
           return;
         }
         hasBg.value = true;
         createMap(layoutJSON);
-        // addBg()
       },
     );
   };
@@ -292,6 +288,9 @@
     if (routerParams.companyId) {
       selectedCompany.value = Number(routerParams.companyId);
     }
+    if (routerParams.labelId) {
+      label.value = Number(routerParams.labelId);
+    }
 
     window.addEventListener('keydown', handleKeyDown);
 

src/views/page-config/component/ConfigDrawer.vue

@@ -147,7 +147,6 @@
   const { addedShops, showShops, activeShopId } = storeToRefs(mapEditor);
 
   const globSetting = useGlobSetting();
-  const thumbnailChange = ref('');
 
   const editShop = computed(() => {
     const val =
@@ -157,6 +156,10 @@
     return val;
   });
 
+  const thumbnailChange = computed(() => {
+    return editShop.value.thumbnail?.replace(globSetting.imgUrl!, '');
+  });
+
   const emit = defineEmits(['onClose', 'transformerChange']);
 
   const showColor = computed(() => colorRGB2Hex(editShop.value!.bgColor));
@@ -171,7 +174,6 @@
   };
 
   const handleAvatarSuccess = (e) => {
-    thumbnailChange.value = e.data;
     editShop.value.thumbnail = urlJoin(globSetting.imgUrl!, e.data);
   };
 

src/views/page-config/component/PageMain.vue

@@ -11,13 +11,19 @@
       </div>
 
       <div
-        v-for="item in picList"
+        v-for="item in companyLayoutList"
         :key="item.id"
         class="content-show"
         @mouseover="showDeleteIcon(item)"
         @mouseleave="hideDeleteIcon(item)"
+        @click="handleClick(item)"
       >
-        <div class="pic-box"><img src="" alt="图片" class="content-pic" /></div>
+        <div class="pic-box"
+          ><img
+            :src="globSetting.imgUrl! +(item.layout as any).bgInfo.img"
+            alt="图片"
+            class="content-pic"
+        /></div>
 
         <div class="pic-word">
           <img src="~@/assets/icons/file.png" alt="" />
@@ -26,41 +32,79 @@
             v-show="item.id === IconId"
             src="~@/assets/icons/del.png"
             alt=""
-            @click="deleteItem(item)"
+            @click.stop="deleteItem(item)"
             class="del-icon"
           />
-          <!-- <el-icon v-show="item.id === IconId" @click="deleteItem(item)" class="del-icon"
-            ><Delete
-          /></el-icon> -->
         </div>
-      </div>
-    </div></div
-  >
+      </div> </div
+  ></div>
 </template>
 <script lang="ts" setup>
-  import { ref } from 'vue';
-  import { picList } from '../constant';
+  import { ref, onMounted } from 'vue';
   import { useRouter } from 'vue-router';
+  import { useGlobSetting } from '@/hooks/setting';
   import { Plus } from '@element-plus/icons-vue';
+  import { getCompanyLayoutList, delCompanyLayout } from '@/api/scene/scene';
+
+  const globSetting = useGlobSetting();
+  interface companyLayoutType {
+    createdAt: string;
+    id: number;
+    isDelete: number;
+    labelId: number;
+    layout: string;
+    name: string;
+    status: number;
+    targetId: number;
+    updatedAt: string;
+    version: string;
+    viewType: number;
+  }
+  const companyLayoutList = ref<companyLayoutType[]>([]);
+
+  onMounted(() => {
+    getCompanyLayoutList().then((res) => {
+      companyLayoutList.value = res;
+      companyLayoutList.value = companyLayoutList.value.map((item) => {
+        item.layout = JSON.parse(item.layout);
+        return item;
+      });
+    });
+  });
+
   const router = useRouter();
 
-  // const pageAdd = ref<boolean>(true);
   const handleAddPage = () => {
     router.push('/page-config/config');
   };
 
-  const IconId = ref('');
+  const IconId = ref<number>();
   const showDeleteIcon = (item) => {
     IconId.value = item.id;
   };
 
   const hideDeleteIcon = (_item) => {
-    IconId.value = '';
+    IconId.value = undefined;
+  };
+
+  const handleClick = (item) => {
+    router.push({
+      path: '/page-config/config',
+      query: { companyId: item.targetId, labelId: item.labelId },
+    });
   };
 
   const deleteItem = (item) => {
     // 处理删除逻辑
-    console.log(item);
+    delCompanyLayout(item.id).then(() => {
+      getCompanyLayoutList().then((res) => {
+        companyLayoutList.value = res;
+        companyLayoutList.value = companyLayoutList.value.map((item) => {
+          item.layout = JSON.parse(item.layout);
+          return item;
+        });
+      });
+    });
   };
 
   // const label = ref('');
@@ -127,6 +171,7 @@
     margin-left: 26px;
     border: 1px solid #e8ecf2;
     margin-bottom: 24px;
+    cursor: pointer;
   }
 
   .pic-box {

src/views/page-config/stores/useMapEditor.ts

@@ -5,6 +5,7 @@ import { cloneDeep } from 'lodash-es';
 import { useGlobSetting } from '@/hooks/setting';
 import safeParse from '@/utils/safeParse';
 import urlJoin from 'url-join';
+import { resolve } from 'path';
 // import emptyImg from '@/assets/images/table/table-empty.png';
 
 export enum LabelPositionEnum {
@@ -46,15 +47,18 @@ export const useMapEditor = defineStore('home-map-ediotr', () => {
   };
 
   const addBg = () => {
-    const imgUrl = urlJoin(globSetting.imgUrl!, bgImg.value);
-
-    const tempImg = new Image();
-    tempImg.onload = () => {
-      mapWidth.value = tempImg.width;
-      mapHeight.value = tempImg.height;
-      bgImage.value = tempImg;
-    };
-    tempImg.src = imgUrl;
+    return new Promise((resolve) => {
+      const imgUrl = urlJoin(globSetting.imgUrl!, bgImg.value);
+
+      const tempImg = new Image();
+      tempImg.onload = () => {
+        mapWidth.value = tempImg.width;
+        mapHeight.value = tempImg.height;
+        bgImage.value = tempImg;
+      };
+      tempImg.src = imgUrl;
+      resolve(null);
+    });
   };
 
   const addShop = (shop: MapWorkShopInfoItem) => {
@@ -88,11 +92,12 @@ export const useMapEditor = defineStore('home-map-ediotr', () => {
 
   const createMap = (layout) => {
     bgImg.value = layout.bgInfo.img;
-    mapWidth.value = layout.bgInfo.width;
-    mapHeight.value = layout.bgInfo.height;
-    addedShops.value = cloneDeep(layout.shopList);
-    showShops.value = cloneDeep(layout.shopList);
-    addBg();
+    addBg().then(() => {
+      mapWidth.value = layout.bgInfo.width;
+      mapHeight.value = layout.bgInfo.height;
+      addedShops.value = cloneDeep(layout.shopList);
+      showShops.value = cloneDeep(layout.shopList);
+    });
   };
 
   const deleteShop = () => {

src/views/system-config/scene-manage/CompanyDrawer.vue

@@ -100,7 +100,7 @@
   } from '@/api/scene/secene-templet';
   import { ENABLED } from './constant';
   import type { FormInstance, FormRules } from 'element-plus';
-  import { ElMessageBox } from 'element-plus';
+  import { ElMessage, ElMessageBox } from 'element-plus';
   import { CirclePlus } from '@element-plus/icons-vue';
   import { addCompany, editCompany } from '@/api/scene/sceneOperate';
 
@@ -213,6 +213,10 @@
         .catch(() => {
           console.log('取消删除物件');
         });
+    } else {
+      ElMessage.warning({
+        message: '无法删除',
+      });
     }
   };
   //添加新公司的提交