fix: 1

src/view/map/pc4Helper.ts

@@ -12,7 +12,6 @@ import {
 import { noValidPoint } from "./install";
 import { PointTypeEnum } from "@/lib/board/4dmap";
 import { addWatermark } from "@/util/image";
-import { Message, MessageBox } from "@element-plus/icons-vue";
 
 export const exportFile = async (
   points: ScenePoint[],

src/view/pano/pano.vue

@@ -109,16 +109,35 @@ watch(
   },
   { immediate: true }
 );
-
-const panoUrls = ref<string | string[]>();
-watchEffect(() => {
-  if (point.value) {
-    panoUrls.value = getPointPano(
-      point.value,
-      [SceneType.CLUNT, SceneType.MESH].includes(point.value.sceneType)
-    );
-  }
+const panoGroups = computed(() => {
+  currentNdx.value = 0;
+  if (!point.value) return [];
+  console.log(point.value);
+  return [
+    getPointPano(point.value, true, true),
+    getPointPano(point.value, false, true),
+    getPointPano(point.value, false, false),
+  ];
 });
+const currentNdx = ref(0);
+const panoUrls = computed(() => panoGroups.value[currentNdx.value]);
+// const panoUrls = ref<string | string[]>();
+// watchEffect(() => {
+//   if (point.value) {
+//     panoUrls.value = getPointPano(
+//       point.value,
+//       [SceneType.CLUNT, SceneType.MESH].includes(point.value.sceneType)
+//     );
+//   }
+// });
+// watchEffect(() => {
+//   if (point.value) {
+//     panoUrls.value = getPointPano(
+//       point.value,
+//       [SceneType.CLUNT, SceneType.MESH].includes(point.value.sceneType)
+//     );
+//   }
+// });
 
 const update = ref(false);
 const loading = ref(false);
@@ -203,7 +222,7 @@ onMounted(() => {
   window.addEventListener("resize", resizeHandler);
   const s1 = watch(
     panoUrls,
-    (n, o) => {
+    async (n, o) => {
       if (inRevise(n, o) && n) {
         loading.value = true;
         //     getPointPano(
@@ -212,17 +231,21 @@ onMounted(() => {
         // )
         pano.getTexs(n).then(
           (texs) => {
+            console.log("成功？");
             loading.value = false;
             thumbnailTexs.value.forEach((t) => t.dispose());
             thumbnailTexs.value = texs;
           },
           (err) => {
             loading.value = false;
-            panoUrls.value = getPointPano(
-              point.value,
-              [SceneType.CLUNT, SceneType.MESH].includes(point.value.sceneType),
-              false
-            );
+            if (currentNdx.value < panoGroups.value.length) {
+              currentNdx.value++;
+            }
+            // panoUrls.value = getPointPano(
+            //   point.value,
+            //   [SceneType.CLUNT, SceneType.MESH].includes(point.value.sceneType),
+            //   false
+            // );
           }
         );
       }

src/view/pano/three-env.ts

@@ -21,29 +21,29 @@ import {
 import { OrbitControls } from "three/examples/jsm/Addons.js";
 
 export const init = (canvas: HTMLCanvasElement) => {
-  const manager = new LoadingManager()
+  const manager = new LoadingManager();
   const texLoader = new TextureLoader(manager);
-  const cubeLoader = new CubeTextureLoader(manager)
+  const cubeLoader = new CubeTextureLoader(manager);
   const scene = new Scene();
   const camera = new PerspectiveCamera(70, 1, 1, 8000);
   const rang = 4000;
 
   const controls = new OrbitControls(camera, canvas.parentElement);
-  controls.target.set(0, 0, 0)
+  controls.target.set(0, 0, 0);
   controls.enableDamping = true;
   controls.enableZoom = false;
   controls.enablePan = false;
   controls.rotateSpeed = -0.25;
 
-  camera.position.set(0, 0, -1)
+  camera.position.set(0, 0, -1);
 
   // 处理鼠标滚轮事件以实现 zoomToCursor 效果
   function onMouseWheel(event) {
     event.preventDefault();
     const scaleFactor = 0.01;
     const delta = event.deltaY;
-    camera.fov = Math.min(Math.max(30, camera.fov + scaleFactor * delta), 89)
-    camera.updateProjectionMatrix()
+    camera.fov = Math.min(Math.max(30, camera.fov + scaleFactor * delta), 89);
+    camera.updateProjectionMatrix();
 
     // // 获取当前鼠标位置
     // const mouse = new Vector2();
@@ -73,18 +73,19 @@ export const init = (canvas: HTMLCanvasElement) => {
   }
 
   // 监听滚轮事件
-  canvas.parentElement.addEventListener("wheel", onMouseWheel, { passive: false });
-
+  canvas.parentElement.addEventListener("wheel", onMouseWheel, {
+    passive: false,
+  });
 
   const redraw = () => {
-    renderer.clear()
+    renderer.clear();
     controls.update();
     renderer.render(scene, camera);
-  }
-  
+  };
+
   const renderer = new WebGLRenderer({ antialias: true, canvas });
   renderer.setPixelRatio(1);
-  renderer.autoClear = false
+  renderer.autoClear = false;
   renderer.setAnimationLoop(redraw);
 
   const setSize = ([w, h]: [number, number]) => {
@@ -94,49 +95,60 @@ export const init = (canvas: HTMLCanvasElement) => {
   };
 
   let mesh: Mesh;
-  let prevMat: Matrix4
-  controls.saveState()
+  let prevMat: Matrix4;
+  controls.saveState();
   return {
     setSize,
     redraw,
     async getTexs(urls: string | string[]) {
-      urls = Array.isArray(urls) ? urls : [urls]
-      const texs: Texture[] = []
+      urls = Array.isArray(urls) ? urls : [urls];
+      const texs: Texture[] = [];
+      let promise: Promise<void>;
       if (urls.length === 1) {
-        texs.push(texLoader.load(urls[0]))
-        texs[0].mapping = EquirectangularReflectionMapping;
+        promise = new Promise((resolve, reject) => {
+          texs.push(texLoader.load(urls[0], () => {
+            resolve()
+          }, void 0, reject));
+          texs[0].mapping = EquirectangularReflectionMapping;
+        });
       } else {
         const mapper = [2, 4, 0, 5, 1, 3];
-        texs.push(cubeLoader.load(mapper.map(i => urls[i])))
+        promise = new Promise((resolve, reject) => {
+          texs.push(
+            cubeLoader.load(
+              mapper.map((i) => urls[i]),
+              () => resolve(),
+              void 0,
+              reject
+            )
+          );
+        });
       }
-      texs.forEach(tex => tex.colorSpace = SRGBColorSpace)
+      texs.forEach((tex) => (tex.colorSpace = SRGBColorSpace));
+      await promise;
       
-      await new Promise<void>((resolve, reject) => {
-        manager.onLoad = resolve
-        manager.onError = reject
-      })
       return texs;
     },
     async changeEnv(texs: Texture[]) {
       mesh && scene.remove(mesh);
-      scene.background = texs[0]
+      scene.background = texs[0];
     },
     reset() {
-      camera.fov = 70
-      camera.updateProjectionMatrix()
-      
-      camera.position.applyMatrix4(prevMat.invert())
-      prevMat = null
-      controls.reset()
+      camera.fov = 70;
+      camera.updateProjectionMatrix();
+
+      camera.position.applyMatrix4(prevMat.invert());
+      prevMat = null;
+      controls.reset();
     },
     setYaw(yaw: number) {
-      const mat = new Matrix4().makeRotationY(-yaw)
+      const mat = new Matrix4().makeRotationY(-yaw);
       if (prevMat) {
-        mat.multiply(prevMat.invert())
+        mat.multiply(prevMat.invert());
       }
-      prevMat = mat
-      camera.position.applyMatrix4(mat)
-      controls.update()
+      prevMat = mat;
+      camera.position.applyMatrix4(mat);
+      controls.update();
     },
     destory() {
       window.removeEventListener("wheel", onMouseWheel);