From f90fbbc76d23340e4568dd4dadbab5f7f02a030f Mon Sep 17 00:00:00 2001
From: pengwei <2071057782@qq.com>
Date: 星期一, 24 三月 2025 14:49:24 +0800
Subject: [PATCH] 3.24功能新增

---
 项目代码/client/src/views/tts/TheCurrentJob/Startjob.vue |  516 +++++++++++++++++++++++++++++++++++++++++++--------------
 1 files changed, 387 insertions(+), 129 deletions(-)

diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/client/src/views/tts/TheCurrentJob/Startjob.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/client/src/views/tts/TheCurrentJob/Startjob.vue"
index 4118283..66c4238 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/client/src/views/tts/TheCurrentJob/Startjob.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/client/src/views/tts/TheCurrentJob/Startjob.vue"
@@ -126,6 +126,7 @@
                   "
                 >
                   <el-table
+                    empty-text="鏆傛棤鏁版嵁"
                     :data="taskData"
                     width="100%"
                     :header-cell-style="{
@@ -172,6 +173,7 @@
           </div>
           <div style="position: absolute; width: 47rem; height: 2.5rem">
             <el-table
+              empty-text="鏆傛棤鏁版嵁"
               style="margin-top: 0.88rem"
               :data="gridData"
               width="100%"
@@ -229,6 +231,7 @@
             </el-table>
             <div class="consten" v-if="contentShow">
               <el-table
+                empty-text="鏆傛棤鏁版嵁"
                 :data="gridData"
                 width="100%"
                 :header-cell-style="{
@@ -313,7 +316,10 @@
                 v-model="torqueFrom.torqueSize"
                 style="font-size: 0.75rem; height: 2rem"
                 placeholder="璇疯緭鍏ユ壄鍔涘��"
-              />
+                ><template #suffix>
+                  <span style="font-size: 0.88rem; color: black">N*m</span>
+                </template>
+              </el-input>
               <!-- @blur="addTorque" -->
             </el-scrollbar>
           </div>
@@ -357,12 +363,17 @@
           justify-content: center;
           align-items: center;
           position: absolute;
-          top: 33%;
+          top: 35%;
           left: 50%;
           transform: translateX(-50%);
+          z-index: 999;
         "
       >
-        <div ref="container" style="width: 100%; height: 100%"></div>
+        <div
+          ref="container"
+          class="my-three"
+          style="width: 100%; height: 100%"
+        ></div>
         <!-- <model-gltf
           :width="400"
           :height="400"
@@ -373,6 +384,11 @@
             enableZoom,
           }"
         /> -->
+      </div>
+      <div style="position: absolute; bottom: 5%; left: 2%">
+        <span style="color: rgba(26, 201, 255, 1); font-size: 1.5em"
+          >X:{{ xPos }}&nbsp;&nbsp;Y:{{ yPos }}&nbsp;&nbsp;Z:{{ zPos }}</span
+        >
       </div>
       <div
         style="
@@ -471,10 +487,11 @@
 import * as THREE from "three";
 import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader"; //gltf
+import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
 
 const container = ref(null);
 
-let scene, camera, renderer, controls;
+// let scene, camera, renderer, controls;
 
 const router = useRouter();
 const gridData = ref([]);
@@ -524,16 +541,38 @@
 
 const innerRef = ref();
 const scrollbarRef = ref();
+const isJob = ref([]); //宸茬粡瀹屾垚鐨勬楠�
+
 //涓婁竴姝�
 const Previous = (val) => {
+  //涓婁竴涓殑鍊�
   from.value.group = info.value.grouptype;
   from.value.takeid = info.value.njtakeid;
   from.value.setnum = obj.value.setpNum;
   flag.value = val;
-  console.log(from.value, info.value);
   GetPre(from.value, flag.value).then((res) => {
     gridData.value = [res.data.nex];
     obj.value = res.data.nex;
+    xPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[0]
+        : -585;
+    yPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[1]
+        : 692;
+    zPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[2]
+        : 692;
+    isJob.value = nodeList.slice(0, gridData.value[0].setpNum - 1); //宸茬粡瀹屾垚鐨勬楠�
+    cameraAnimate(
+      [xPos.value, yPos.value, zPos.value],
+      gridData.value[0].moduleName
+    );
     queryData.value.setnum = obj.value.setpNum;
     GetTorque(queryData.value).then((res) => {
       Torque.value = res.data;
@@ -542,12 +581,10 @@
 };
 //涓嬩竴姝�
 const Next = (val) => {
-  console.log(obj.value);
   from.value.group = info.value.grouptype;
   from.value.takeid = info.value.njtakeid;
   from.value.setnum = obj.value.setpNum;
   flag.value = val;
-
   GetNext(from.value, flag.value).then((res) => {
     if (res.message == "娌℃湁瀹屾垚褰撳墠姝ラ") {
       gridData.value = res.data.nowdate;
@@ -560,8 +597,29 @@
     }
     centerDialogVisible.value = false;
     gridData.value = [res.data.nex];
+    xPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[0]
+        : -585;
+    yPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[1]
+        : 692;
+    zPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[2]
+        : 692;
+    isJob.value = res.data.finish.map((item) => {
+      return item.moduleName;
+    });
+    cameraAnimate(
+      [xPos.value, yPos.value, zPos.value],
+      gridData.value[0].moduleName
+    );
     obj.value = res.data.nex;
-
     queryData.value.setnum = obj.value.setpNum;
     GetTorque(queryData.value).then((res) => {
       Torque.value = res.data;
@@ -611,138 +669,269 @@
   takeid: info.value.njtakeid,
   setnum: "",
 });
-const initData = () => {
-  console.log(obj.value);
-  GetScreenData({
+const initData = async () => {
+  await GetScreenData({
     group: info.value.grouptype,
     takeid: info.value.njtakeid,
   }).then((res) => {
-    if (res.message == "杩斿洖宸ヨ壓琛ㄤ腑鐨勭涓�鏉�") {
-      gridData.value = res.data.proNoe;
-      obj.value = res.data.proNoe[0];
-      sunNUm.value = res.data.maxproce;
-      queryData.value.setnum = obj.value.setpNum;
-      GetTorque(queryData.value).then((res) => {
-        Torque.value = res.data;
-      });
-      return;
-    }
-    gridData.value = res.data.maxpro;
+    // if (res.message == "杩斿洖宸ヨ壓琛ㄤ腑鐨勭涓�鏉�") {
+    //   gridData.value = res.data.proNoe;
+    //   obj.value = res.data.proNoe[0];
+    //   sunNUm.value = res.data.maxproce;
+    //   queryData.value.setnum = obj.value.setpNum;
+    //   xPos.value =
+    //     gridData.value[0].pointAxisXYZ != null &&
+    //     gridData.value[0].pointAxisXYZ != 0
+    //       ? gridData.value[0].pointAxisXYZ.split(",")[0]
+    //       : -585;
+    //   yPos.value =
+    //     gridData.value[0].pointAxisXYZ != null &&
+    //     gridData.value[0].pointAxisXYZ != 0
+    //       ? gridData.value[0].pointAxisXYZ.split(",")[1]
+    //       : 692;
+    //   zPos.value =
+    //     gridData.value[0].pointAxisXYZ != null &&
+    //     gridData.value[0].pointAxisXYZ != 0
+    //       ? gridData.value[0].pointAxisXYZ.split(",")[2]
+    //       : 692;
+    //   cameraAnimate(
+    //     [xPos.value, yPos.value, zPos.value],
+    //     nodeList[gridData.value[0].setpNum]
+    //   );
+    //   GetTorque(queryData.value).then((res) => {
+    //     Torque.value = res.data;
+    //   });
+    //   return;
+    // }
+    gridData.value = [res.data.proNow];
     sunNUm.value = res.data.maxproce;
-    obj.value = res.data.maxpro[0];
+    obj.value = res.data.proNow;
     queryData.value.setnum = obj.value.setpNum;
+    xPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[0]
+        : -585;
+    yPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[1]
+        : 692;
+    zPos.value =
+      gridData.value[0].pointAxisXYZ != null &&
+      gridData.value[0].pointAxisXYZ != 0
+        ? gridData.value[0].pointAxisXYZ.split(",")[2]
+        : 692;
+    isJob.value = res.data.finish;
+    cameraAnimate(
+      [xPos.value, yPos.value, zPos.value],
+      gridData.value[0].moduleName
+    );
     GetTorque(queryData.value).then((res) => {
       Torque.value = res.data;
     });
   });
 };
 
-const showModel = () => {
-  scene = new THREE.Scene();
-  console.log("model", window.innerWidth, window.innerHeight);
+const CAMERA_POS = [100, 100, 150];
+const BASE_COLOR = [0.2, 0.4, 0.6];
+const RED_COLOR = [3.0, 0.2, 0.4];
+const GREEN_COLOR = [0.0, 1.0, 0.0];
+const xPos = ref("");
+const yPos = ref("");
+const zPos = ref("");
+const scene = new THREE.Scene();
+const camera = new THREE.PerspectiveCamera(
+  75,
+  window.innerWidth / window.innerHeight,
+  0.1,
+  3000
+);
+const renderer = new THREE.WebGLRenderer({
+  antialias: true,
+  alpha: true,
+  precision: "highp",
+});
 
-  // 鍒涘缓鐩告満 (瑙嗚锛屽楂樻瘮锛岃繎瑁佸壀闈紝杩滆鍓潰)
-  camera = new THREE.PerspectiveCamera(75, 1, 0.1, 1000);
+const painting = (part) => {
+  let newArr = [];
+  // let newArr = flatten(isJob.value);
+  scene.traverse(function (child) {
+    // 妫�鏌ュ璞℃槸鍚﹀叿鏈夋潗璐ㄥ睘鎬�
+    if (child.isMesh) {
+      let materials = child.material;
+      // 濡傛灉鏉愯川鏄崟涓璞¤�屼笉鏄暟缁勶紝鍒欏皢鍏舵斁鍏ユ暟缁勪腑浠ヤ究缁熶竴澶勭悊
+      if (!Array.isArray(materials)) {
+        materials = [materials];
+      }
+      let isString = []; // 鍒ゆ柇鏄惁鏄瓧绗︿覆
+      // 閬嶅巻鏉愯川鏁扮粍骞惰缃鑹�
+      //宸茬粡瀹屾垚鐨勮妭鐐�
+      isJob.value.forEach((item) => {
+        if (
+          item ==
+            "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4" &&
+          item != part
+        ) {
+          isString = item.split(",");
+          materials.forEach(function (material) {
+            if (isString.includes(material.name)) {
+              material.color.setRGB(...GREEN_COLOR);
+            }
+            material.needsUpdate = true; // 寮哄埗鏇存柊鏉愯川
+          });
+        }
+        materials.forEach(function (material) {
+          if (material.name === item) {
+            material.color.setRGB(...GREEN_COLOR);
+          }
+          material.needsUpdate = true; // 寮哄埗鏇存柊鏉愯川
+        });
+      });
+      console.log(part.split(","));
+      if (
+        part ==
+        "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4"
+      ) {
+        materials.forEach(function (material) {
+          if (part.split(",").includes(material.name)) {
+            material.color.setRGB(...RED_COLOR);
+          }
+          material.needsUpdate = true; // 寮哄埗鏇存柊鏉愯川
+        });
+      } else {
+        materials.forEach(function (material) {
+          if (material.name == part) {
+            material.color.setRGB(...RED_COLOR);
+          }
+          material.needsUpdate = true; // 寮哄埗鏇存柊鏉愯川
+        });
+      }
 
-  // 鍒涘缓娓叉煋鍣�
-  renderer = new THREE.WebGLRenderer({
-    antialias: true,
-    alpha: true,
-  });
-  renderer.setSize(400, 400); // 璁剧疆娓叉煋鍣ㄧ殑澶у皬
-  container.value.appendChild(renderer.domElement);
-  scene.background = null;
-  // 鍔犺浇GLTF妯″瀷
-  const loader = new GLTFLoader();
-  loader.load(
-    "ThreeModel/test.gltf",
-    (gltf) => {
-      const model = gltf.scene;
-
-      // 璁$畻妯″瀷鐨勮竟鐣屾骞惰幏鍙栦腑蹇冪偣
-      const box = new THREE.Box3().setFromObject(model);
-      const center = box.getCenter(new THREE.Vector3());
-
-      // 鍒涘缓涓�涓┖瀵硅薄浣滀负鐖惰妭鐐癸紝灏嗗潗鏍囪酱鍜屾ā鍨嬫坊鍔犲埌杩欎釜鐖惰妭鐐�
-      const parent = new THREE.Object3D();
-      scene.add(parent);
-
-      // 灏嗘ā鍨嬬殑浣嶇疆璁剧疆涓烘ā鍨嬬殑杈圭晫妗嗙殑涓績锛岀‘淇濆畠灞呬腑
-      model.position.sub(center); // 璁╂ā鍨嬬殑涓績涓庣埗鑺傜偣瀵归綈
-
-      // 灏嗗潗鏍囪酱鍔╂墜娣诲姞鍒扮埗鑺傜偣
-      // const axesHelper = new THREE.AxesHelper(100); // 杞寸殑闀垮害涓�100  x,y,z鐨勯鑹插垎鍒负锛堢孩鑹诧紝缁胯壊锛岃摑鑹诧級
-      // parent.add(axesHelper); // 灏嗗潗鏍囪酱娣诲姞鍒扮埗鑺傜偣
-
-      // 灏嗘ā鍨嬫坊鍔犲埌鐖惰妭鐐�
-      parent.add(model);
-
-      // 纭繚妯″瀷鐨勫ぇ灏忛�傚綋锛屽彲浠ヨ皟鏁存ā鍨嬬殑澶у皬
-      model.scale.set(1, 1, 1); // 濡傛灉闇�瑕佺殑璇濆彲浠ョ缉鏀炬ā鍨�
-    },
-    undefined,
-    (error) => {
-      console.error("妯″瀷鍔犺浇澶辫触", error);
+      // if (
+      //   typeof part ==
+      //   "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4"
+      // ) {
+      //   newArr = part.split(",");
+      //   materials.forEach(function (material) {
+      //     if (newArr.includes(material.name)) {
+      //       material.color.setRGB(...GREEN_COLOR);
+      //     }
+      //     if (part.includes(material.name)) {
+      //       material.color.setRGB(...RED_COLOR);
+      //     } else {
+      //       material.color.setRGB(...BASE_COLOR);
+      //     }
+      //     material.needsUpdate = true; // 寮哄埗鏇存柊鏉愯川
+      //   });
+      // } else {
+      //   materials.forEach(function (material) {
+      //     if (newArr.includes(material.name)) {
+      //       material.color.setRGB(...GREEN_COLOR);
+      //     } else if (material.name === part) {
+      //       material.color.setRGB(...RED_COLOR);
+      //     } else {
+      //       material.color.setRGB(...BASE_COLOR);
+      //     }
+      //     // if (newArr.includes(material.name)) {
+      //     //   material.color.setRGB(...GREEN_COLOR);
+      //     // }
+      //     material.needsUpdate = true; // 寮哄埗鏇存柊鏉愯川
+      //   });
+      // }
     }
-  );
-
-  const metalMaterial = new THREE.MeshStandardMaterial({
-    color: 0xaaaaaa,
-    metalness: 1,
-    roughness: 0.2,
   });
-
-  const sphereGeometry = new THREE.SphereGeometry(1, 32, 32);
-  const metalSphere = new THREE.Mesh(sphereGeometry, metalMaterial);
-  scene.add(metalSphere);
-
-  // 鍒涘缓鐏厜
-  const light = new THREE.AmbientLight(0xffffff); // 鐜鍏夋槸涓�绉嶅叏灞�鎬х殑鍏夋簮锛屽潎鍖�鍦扮収浜暣涓満鏅紝骞朵笖涓嶄細鏈夐槾褰辨晥鏋�
-  scene.add(light);
-
-  const directionalLight = new THREE.DirectionalLight(0xffffff, 3); //杩欐浠g爜鍒涘缓浜嗕竴涓櫧鑹层�佸己搴︿负 1 鐨勫钩琛屽厜婧�
-  directionalLight.position.set(300, 300, 300).normalize(); //骞跺皢鍏朵綅缃缃湪 (300, 300, 300)銆傜劧鍚庯紝閫氳繃 normalize() 鏂规硶锛岀‘淇濆钩琛屽厜婧愮殑鍏夌嚎浠ヤ竴涓爣鍑嗙殑鏂瑰悜鐓у皠
-  scene.add(directionalLight);
-
-  // 璁剧疆鐩告満鍒濆浣嶇疆锛坸,y,z锛�
-  camera.position.set(100, 100, 50); // 璁剧疆鐩告満浣嶇疆锛岀‘淇濆彲浠ョ湅鍒版ā鍨�
-
-  // 鍒涘缓 OrbitControls 瀹炰緥
-  controls = new OrbitControls(camera, renderer.domElement);
-  controls.enableZoom = false;
-  controls.enablePan = false;
-  controls.enableDamping = true; // 鍚敤闃诲凹鏁堟灉
-  controls.dampingFactor = 0.25; // 闃诲凹绯绘暟
-  controls.screenSpacePanning = false; // 绂佺敤灞忓箷绌洪棿骞崇Щ
-  controls.maxPolarAngle = Math.PI / 2; // 闄愬埗鐩告満鍨傜洿鏃嬭浆鐨勮搴︼紝闃叉缈昏浆
-  controls.target.set(0, 0, 0); // 纭繚鐩告満濮嬬粓鍥寸粫鍦烘櫙涓績锛堟ā鍨嬩綅缃級
-  controls.minDistance = 2; // 鏈�灏忚窛绂伙紝闃叉缂╁緱澶繎
-  controls.maxDistance = 500; // 鏈�澶ц窛绂伙紝闃叉缂╁緱澶繙
-
-  // 娓叉煋寰幆
-  function animate() {
-    requestAnimationFrame(animate);
-
-    // 鏇存柊鎺у埗鍣�
-    controls.update(); // 鍙湁鍦ㄥ惎鐢ㄩ樆灏肩殑鏃跺�欓渶瑕佽皟鐢ㄦ鍑芥暟
-
-    // 娓叉煋鍦烘櫙
-    renderer.render(scene, camera);
-  }
-
-  animate();
-
-  // 鍝嶅簲绐楀彛澶у皬鍙樺寲;
-  window.addEventListener("resize", onWindowResize, false);
-
-  function onWindowResize() {
-    console.log(window.innerWidth, window.innerHeight);
-
-    camera.aspect = window.innerWidth / window.innerHeight;
-    camera.updateProjectionMatrix();
-    renderer.setSize(window.innerWidth / 2, window.innerHeight / 2);
-  }
 };
+const cameraAnimate = (
+  targetPosition = CAMERA_POS,
+  part = null,
+  duration = 500
+) => {
+  let startTime = null;
+  const startPosition = {
+    x: camera.position.x,
+    y: camera.position.y,
+    z: camera.position.z,
+  };
+  const distance = {
+    x: targetPosition[0] - startPosition.x,
+    y: targetPosition[1] - startPosition.y,
+    z: targetPosition[2] - startPosition.z,
+  };
+
+  function animate(time) {
+    if (!startTime) startTime = time;
+    const elapsed = time - startTime;
+    const progress = Math.min(elapsed / duration, 1);
+
+    // 浣跨敤绾挎�ф彃鍊艰绠楁柊鐨勪綅缃�
+    camera.position.x = startPosition.x + distance.x * progress;
+    camera.position.y = startPosition.y + distance.y * progress;
+    camera.position.z = startPosition.z + distance.z * progress;
+    xPos.value = Math.floor(camera.position.x);
+    yPos.value = Math.floor(camera.position.y);
+    zPos.value = Math.floor(camera.position.z);
+    if (progress < 1) {
+      requestAnimationFrame(animate);
+    }
+  }
+  requestAnimationFrame(animate);
+  painting(part);
+  renderer.render(scene, camera); // 寮哄埗娓叉煋涓�娆�
+};
+const flatten = (arr) => {
+  return arr.reduce(
+    (acc, val) =>
+      Array.isArray(val) ? acc.concat(flatten(val)) : acc.concat(val),
+    []
+  );
+};
+window.addEventListener("resize", () => {
+  console.log("鍒濆鍖栧満鏅�", window.innerWidth, window.innerHeight);
+  // camera.aspect = window.innerWidth / window.innerHeight;
+  // camera.updateProjectionMatrix();
+  // renderer.setSize(window.innerWidth, window.innerHeight);
+});
+const nodeList = [
+  "杞悜鏋�",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴2",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴3",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴2",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴3",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "楂樺害璋冩暣鏉�",
+  "楂樺害璋冩暣鏉�",
+  "楂樺害璋冩暣鏉�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴2",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴3",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "鎶楄泧琛屽噺鎸櫒铻烘爴1,鎶楄泧琛屽噺鎸櫒铻烘爴2,鎶楄泧琛屽噺鎸櫒铻烘爴3,鎶楄泧琛屽噺鎸櫒铻烘爴4",
+  "楂樺害璋冩暣鏉�",
+  "楂樺害璋冩暣鏉�",
+  "楂樺害璋冩暣鏉�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+  "杞悜鏋�",
+];
+
 const spanHide = ref();
 const spanHide1 = ref();
 const handleClickOutside = () => {
@@ -763,9 +952,9 @@
 };
 //娣诲姞鎵姏鍊�
 const addTorque = () => {
-  torqueFrom.value.processSte = Torque.value[0].processSte;
-  torqueFrom.value.takeId = Torque.value[0].takeId;
-  torqueFrom.value.groupOp = Torque.value[0].groupOp;
+  torqueFrom.value.processSte = queryData.value.setnum;
+  torqueFrom.value.takeId = queryData.value.takeid;
+  torqueFrom.value.groupOp = queryData.value.grop;
   if (
     torqueFrom.value.torqueSize == null ||
     torqueFrom.value.torqueSize == "" ||
@@ -798,10 +987,79 @@
       console.error("娣诲姞澶辫触", error);
     });
 };
+
 onMounted(() => {
-  document.addEventListener("click", handleClickOutside);
+  // 鍒濆鍖栧満鏅�
+  renderer.setSize(window.innerWidth / 1.5, window.innerHeight / 2);
+  renderer.setClearColor(0xeeeeee); // 璁剧疆鑳屾櫙鑹�
+  // 鍚敤鐗╃悊娓叉煋妯″紡
+  // renderer.physicallyCorrectLights = true;
+  // renderer.toneMapping = THREE.ACESFilmicToneMapping;
+  const mainTag = document.querySelector(".my-three");
+  mainTag.appendChild(renderer.domElement);
+
+  // 娣诲姞浜や簰鎺у埗鍣紙榧犳爣鎷栨嫿缂╂斁锛�
+  const controls = new OrbitControls(camera, renderer.domElement);
+  camera.position.set(...CAMERA_POS);
+  controls.update();
+
+  // 娣诲姞鍏夋簮锛堥噸瑕侊紒鍚﹀垯妯″瀷鍙兘鏄剧ず涓哄叏榛戯級
+  const light = new THREE.DirectionalLight(0xffffff, 3);
+  light.position.set(5, 5, 5);
+  scene.add(light);
+  scene.add(new THREE.AmbientLight(0x404040));
+  renderer.setClearAlpha(0);
+  renderer.setPixelRatio(window.devicePixelRatio);
+  scene.background = null;
+  let dracoLoader = new DRACOLoader();
+  dracoLoader.setDecoderPath("ThreeModel/draco/");
+  dracoLoader.setDecoderConfig({ type: "js" });
+  dracoLoader.preload();
+  // 鍔犺浇GLTF妯″瀷
+  const loader = new GLTFLoader();
+  loader.setDRACOLoader(dracoLoader);
+  loader.load(
+    "ThreeModel/modelDraco.glb", // 鏇挎崲涓轰綘鐨�.gltf鏂囦欢璺緞
+    (gltf) => {
+      const model = gltf.scene;
+      model.scale.set(80, 80, 80);
+      scene.add(model);
+      // 鑷姩灞呬腑妯″瀷锛堝彲閫夛級
+      const box = new THREE.Box3().setFromObject(model);
+      const center = box.getCenter(new THREE.Vector3());
+      model.position.sub(center);
+    },
+    (xhr) => {
+      // 鍔犺浇杩涘害鍥炶皟
+      // console.log(`${(xhr.loaded / xhr.total * 100).toFixed(1)}% loaded`);
+    },
+    (error) => {
+      console.error("鍔犺浇澶辫触:", error);
+    }
+  );
+  // 鍔ㄧ敾寰幆
+  const animate = () => {
+    requestAnimationFrame(animate);
+    controls.update(); // 鍚敤鎺у埗鍣ㄦ椂闇�瑕�
+    renderer.render(scene, camera);
+  };
   initData();
-  showModel();
+
+  animate();
+  mainTag.addEventListener("wheel", () => {
+    xPos.value = Math.floor(camera.position.x);
+    yPos.value = Math.floor(camera.position.y);
+    zPos.value = Math.floor(camera.position.z);
+  });
+  mainTag.addEventListener("mousemove", () => {
+    xPos.value = Math.floor(camera.position.x);
+    yPos.value = Math.floor(camera.position.y);
+    zPos.value = Math.floor(camera.position.z);
+  });
+  // };
+  document.addEventListener("click", handleClickOutside);
+
+  // showModel();
 });
 </script>
 <style lang="scss" scoped>

--
Gitblit v1.9.3