From 8b7745b478e7299621d80037c785e65184c58903 Mon Sep 17 00:00:00 2001
From: LOG1997 <2694233102@qq.com>
Date: Tue, 16 Dec 2025 23:03:18 +0800
Subject: [PATCH] =?UTF-8?q?hotfix:=20=F0=9F=9A=91=EF=B8=8F=20=E6=B8=85?=
 =?UTF-8?q?=E7=90=86=E5=8A=A8=E7=94=BB=E5=BE=AA=E7=8E=AFrequestAnimationFr?=
 =?UTF-8?q?ame=E8=A7=A3=E5=86=B3=E5=A4=9A=E6=AC=A1=E5=88=87=E6=8D=A2?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=90=8E=E9=A1=B5=E9=9D=A2=E5=8D=A1=E9=A1=BF?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98=20#117=20(#118)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Home/index.vue | 38 +++++++++++++++++++++++++-------------
 1 file changed, 25 insertions(+), 13 deletions(-)

diff --git a/src/views/Home/index.vue b/src/views/Home/index.vue
index 9351c44..c3be3db 100644
--- a/src/views/Home/index.vue
+++ b/src/views/Home/index.vue
@@ -37,6 +37,7 @@ const ballRotationY = ref(0)
 const containerRef = ref<HTMLElement>()
 const canOperate = ref(true)
 const cameraZ = ref(3000)
+const animationFrameId = ref<any>(null)
 
 const scene = ref()
 const camera = ref()
@@ -119,29 +120,33 @@ function init() {
     const number = document.createElement('div')
     number.className = 'card-id'
     number.textContent = tableData.value[i].uid
-    if(isShowAvatar.value) number.style.display = 'none'
+    if (isShowAvatar.value)
+      number.style.display = 'none'
     element.appendChild(number)
 
     const symbol = document.createElement('div')
     symbol.className = 'card-name'
     symbol.textContent = tableData.value[i].name
-    if(isShowAvatar.value) symbol.className = 'card-name card-avatar-name'
+    if (isShowAvatar.value)
+      symbol.className = 'card-name card-avatar-name'
     element.appendChild(symbol)
 
     const detail = document.createElement('div')
     detail.className = 'card-detail'
     detail.innerHTML = `${tableData.value[i].department}<br/>${tableData.value[i].identity}`
-    if(isShowAvatar.value) detail.style.display = 'none'
+    if (isShowAvatar.value)
+      detail.style.display = 'none'
     element.appendChild(detail)
 
-    const avatar = document.createElement('img');
-    avatar.className = 'card-avatar';
-    avatar.src = tableData.value[i].avatar;
-    avatar.alt = 'avatar';
-    avatar.style.width = '140px';
-    avatar.style.height = '140px';
-    if(!isShowAvatar.value) avatar.style.display = 'none'
-    element.appendChild(avatar);
+    const avatar = document.createElement('img')
+    avatar.className = 'card-avatar'
+    avatar.src = tableData.value[i].avatar
+    avatar.alt = 'avatar'
+    avatar.style.width = '140px'
+    avatar.style.height = '140px'
+    if (!isShowAvatar.value)
+      avatar.style.display = 'none'
+    element.appendChild(avatar)
 
     element = useElementStyle(element, tableData.value[i], i, patternList.value, patternColor.value, cardColor.value, cardSize.value, textSize.value)
     const object = new CSS3DObject(element)
@@ -286,7 +291,7 @@ function animation() {
   }
   // 设置自动旋转
   // 设置相机位置
-  requestAnimationFrame(animation)
+  animationFrameId.value = requestAnimationFrame(animation)
 }
 
 // // 旋转的动画
@@ -635,7 +640,14 @@ function listenKeyboard(e: any) {
 }
 
 function cleanup() {
-//   animationRunning.value = false
+  // 停止所有Tween动画
+  TWEEN.removeAll()
+
+  // 清理动画循环
+  if ((window as any).cancelAnimationFrame) {
+    (window as any).cancelAnimationFrame(animationFrameId.value)
+  }
+  //   animationRunning.value = false
   clearInterval(intervalTimer.value)
   intervalTimer.value = null
   if (scene.value) {