feat: 增加用户皮肤管理功能和Yggdrasil密码重置

- 在用户资料页面添加皮肤选择和管理功能，支持上传、配置和移除皮肤
- 实现Yggdrasil密码重置功能，用户可生成新密码并显示
- 优化皮肤展示和选择界面，增强用户体验
- 更新SkinViewer组件，支持跑步和跳跃动画

src/components/SkinViewer.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useEffect, useRef, useState } from 'react';
-import { SkinViewer as SkinViewer3D, WalkingAnimation, FunctionAnimation } from 'skinview3d';
+import { SkinViewer as SkinViewer3D, WalkingAnimation, RunningAnimation, FlyingAnimation, IdleAnimation } from 'skinview3d';
 
 interface SkinViewerProps {
   skinUrl: string;
@@ -12,6 +12,9 @@ interface SkinViewerProps {
   className?: string;
   autoRotate?: boolean;
   walking?: boolean;
+  running?: boolean; // 新增：跑步动画
+  jumping?: boolean; // 新增：跳跃动画
+  rotation?: boolean; // 新增：旋转控制
 }
 
 export default function SkinViewer({
@@ -23,6 +26,9 @@ export default function SkinViewer({
   className = '',
   autoRotate = true,
   walking = false,
+  running = false,
+  jumping = false,
+  rotation = true,
 }: SkinViewerProps) {
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const viewerRef = useRef<SkinViewer3D | null>(null);
@@ -86,11 +92,11 @@ export default function SkinViewer({
 
       // 设置背景和控制选项 - 参考blessingskin
       viewer.background = null; // 透明背景
-      viewer.autoRotate = false; // 禁用自动旋转
+      viewer.autoRotate = autoRotate && !walking && !running && !jumping; // 只在无动画时自动旋转
       
-      // 禁用所有交互控制
-      viewer.controls.enableRotate = false; // 禁用旋转控制
-      viewer.controls.enableZoom = false;   // 禁用缩放
+      // 设置交互控制
+      viewer.controls.enableRotate = rotation; // 根据参数控制旋转
+      viewer.controls.enableZoom = true;   // 启用缩放
       viewer.controls.enablePan = false;    // 禁用平移
 
       console.log('3D皮肤查看器初始化成功');
@@ -112,7 +118,37 @@ export default function SkinViewer({
         }
       }
     };
-  }, [skinUrl, capeUrl, isSlim, width, height, autoRotate, walking, imageLoaded, hasError]);
+  }, [skinUrl, capeUrl, isSlim, width, height, autoRotate, walking, running, jumping, rotation, imageLoaded, hasError]);
+
+  // 控制动画效果 - 参考 Blessing Skin 的实现
+  useEffect(() => {
+    if (!viewerRef.current) return;
+
+    const viewer = viewerRef.current;
+    
+    // 根据优先级设置动画 - 参考 Blessing Skin 的 animationFactories
+    if (running) {
+      // 跑步动画
+      viewer.animation = new RunningAnimation();
+      console.log('启用跑步动画');
+    } else if (walking) {
+      // 普通步行动画
+      viewer.animation = new WalkingAnimation();
+      console.log('启用步行动画');
+    } else if (jumping) {
+      // 飞行动画作为跳跃
+      viewer.animation = new FlyingAnimation();
+      console.log('启用跳跃动画');
+    } else {
+      // 静止动画
+      viewer.animation = new IdleAnimation();
+      console.log('启用静止动画');
+    }
+    
+    // 更新自动旋转状态
+    viewer.autoRotate = autoRotate && !walking && !running && !jumping;
+    
+  }, [walking, running, jumping, autoRotate]);
 
   // 当皮肤URL改变时更新
   useEffect(() => {
@@ -145,7 +181,7 @@ export default function SkinViewer({
       }
     } else if (viewerRef.current && !capeUrl && imageLoaded) {
       try {
-        viewerRef.current.loadCape(null);
+        viewerRef.current.resetCape();
       } catch (error) {
         console.error('移除披风失败:', error);
       }