diff --git a/package-lock.json b/package-lock.json
index e528da0..7f2a6fd 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "@wangeditor/editor": "^5.1.23",
         "@wangeditor/editor-for-vue": "^5.1.12",
         "axios": "^1.7.9",
+        "diff": "^7.0.0",
         "element-plus": "^2.9.6",
         "jquery": "^3.7.1",
         "js-cookie": "^3.0.5",
@@ -2479,6 +2480,14 @@
         "node": ">=0.10"
       }
     },
+    "node_modules/diff": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-7.0.0.tgz",
+      "integrity": "sha512-PJWHUb1RFevKCwaFA9RlG5tCd+FO5iRh9A8HEtkmBH2Li03iJriB6m6JIN4rGz3K3JLawI7/veA1xzRKP6ISBw==",
+      "engines": {
+        "node": ">=0.3.1"
+      }
+    },
     "node_modules/dom7": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/dom7/-/dom7-3.0.0.tgz",
diff --git a/package.json b/package.json
index 7f23e0a..9c483c9 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "^5.1.12",
     "axios": "^1.7.9",
+    "diff": "^7.0.0",
     "element-plus": "^2.9.6",
     "jquery": "^3.7.1",
     "js-cookie": "^3.0.5",
diff --git a/public/static/isolatedPages/gungame3d/audio/受击.mp3 b/public/static/isolatedPages/gungame3d/audio/受击.mp3
new file mode 100644
index 0000000..c6b3ec3
Binary files /dev/null and b/public/static/isolatedPages/gungame3d/audio/受击.mp3 differ
diff --git a/public/static/isolatedPages/gungame3d/audio/手枪开枪.mp3 b/public/static/isolatedPages/gungame3d/audio/手枪开枪.mp3
new file mode 100644
index 0000000..06ddcb8
Binary files /dev/null and b/public/static/isolatedPages/gungame3d/audio/手枪开枪.mp3 differ
diff --git a/public/static/isolatedPages/gungame3d/audio/手枪换弹.mp3 b/public/static/isolatedPages/gungame3d/audio/手枪换弹.mp3
new file mode 100644
index 0000000..a036593
Binary files /dev/null and b/public/static/isolatedPages/gungame3d/audio/手枪换弹.mp3 differ
diff --git a/public/static/isolatedPages/gungame3d/index.html b/public/static/isolatedPages/gungame3d/index.html
index 5a4e3db..4e267b9 100644
--- a/public/static/isolatedPages/gungame3d/index.html
+++ b/public/static/isolatedPages/gungame3d/index.html
@@ -2,10 +2,11 @@
 <html lang="zh-CN">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
     <title>3D第一人称射击游戏</title>
     <style>
         body { margin: 0; overflow: hidden; }
+        canvas { touch-action: none; }
         #crosshair {
             position: absolute;
             top: 50%;
@@ -15,76 +16,223 @@
             height: 10px;
             background-color: red;
             border-radius: 50%;
+            pointer-events: none;
         }
-        .ui { font-family: Arial, sans-serif; color: white; font-size: 20px; position: absolute; }
+        .ui { font-family: Arial, sans-serif; color: white; font-size: 16px; position: absolute; pointer-events: none; }
+        #joystick {
+            position: absolute;
+            bottom: 20px;
+            left: 20px;
+            width: 100px;
+            height: 100px;
+            background: rgba(255, 255, 255, 0.2);
+            border-radius: 50%;
+            z-index: 10;
+            display: none; /* Hidden by default */
+        }
+        #joystickKnob {
+            position: absolute;
+            width: 40px;
+            height: 40px;
+            background: rgba(255, 255, 255, 0.5);
+            border-radius: 50%;
+            transform: translate(-50%, -50%);
+            top: 50%;
+            left: 50%;
+        }
+        #shootButton, #reloadButton {
+            display: none; /* Hidden by default */
+        }
+        #shootButton {
+            position: absolute;
+            bottom: 50px;
+            right: 20px;
+            width: 80px;
+            height: 80px;
+            background: rgba(255, 0, 0, 0.7);
+            border-radius: 50%;
+            border: none;
+            color: white;
+            font-size: 20px;
+            z-index: 10;
+        }
+        #reloadButton {
+            position: absolute;
+            bottom: 150px;
+            right: 40px;
+            width: 40px;
+            height: 40px;
+            background: rgba(0, 255, 0, 0.7);
+            border-radius: 50%;
+            border: none;
+            color: white;
+            font-size: 16px;
+            z-index: 10;
+        }
+        #modeSelectModal, #gameOverModal {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            background: rgba(0, 0, 0, 0.8);
+            color: white;
+            padding: 20px;
+            border-radius: 10px;
+            text-align: center;
+            z-index: 20;
+        }
+        #modeSelectModal button, #gameOverModal button {
+            padding: 10px 20px;
+            font-size: 16px;
+            margin: 5px;
+            cursor: pointer;
+        }
+        #gameOverModal { display: none; }
     </style>
 </head>
 <body>
-<!-- 准星 -->
 <div id="crosshair"></div>
-<!-- 受伤闪烁效果 -->
 <div id="damageOverlay" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 0, 0, 0); pointer-events: none;"></div>
-<!-- 游戏结束弹窗 -->
-<div id="gameOverModal" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0, 0, 0, 0.8); color: white; padding: 20px; border-radius: 10px; text-align: center; display: none;">
+<div id="modeSelectModal">
+    <h2>选择游戏模式</h2>
+    <p>请选择您的设备类型：</p>
+    <button id="desktopMode">桌面模式</button>
+    <button id="mobileMode">移动模式</button>
+</div>
+<div id="gameOverModal">
     <h2>游戏结束</h2>
     <p id="finalScore"></p>
-    <button id="restartButton" style="padding: 10px 20px; font-size: 16px; cursor: pointer;">重新开始</button>
+    <button id="restartButton">重新开始</button>
 </div>
+<div id="joystick"><div id="joystickKnob"></div></div>
+<button id="shootButton">射击</button>
+<button id="reloadButton">换弹</button>
+
 <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/simplex-noise/2.4.0/simplex-noise.min.js"></script>
 <script>
-    let isGamePaused = false;
-    // 初始化场景
+    let isGamePaused = true; // Start paused until mode is selected
+    let mode = null; // 'desktop' or 'mobile'
+
+    // Audio Functions
+    function playShootSound() { const audio = new Audio('./audio/手枪开枪.mp3'); audio.play(); }
+    function playReloadSound() { const audio = new Audio('./audio/手枪换弹.mp3'); audio.play(); }
+    function playDamageSound() { const audio = new Audio('./audio/受击.mp3'); audio.play(); }
+
+    // Scene Setup
     const scene = new THREE.Scene();
     const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
-    camera.position.set(0, 1.6, 0); // 玩家高度1.6米
-
+    camera.position.set(0, 1.6, 0);
     const renderer = new THREE.WebGLRenderer({ antialias: true });
     renderer.setSize(window.innerWidth, window.innerHeight);
     document.body.appendChild(renderer.domElement);
 
-    // 添加光照
     const ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
     scene.add(ambientLight);
     const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
     directionalLight.position.set(1, 1, 1);
     scene.add(directionalLight);
 
-    // 视角控制（重新设计）
-    let yaw = 0; // 水平旋转角度（左右）
-    let pitch = 0; // 垂直旋转角度（上下）
-    const sensitivity = 0.002; // 鼠标灵敏度
-    document.addEventListener('click', () => {
-        renderer.domElement.requestPointerLock();
-    });
-    document.addEventListener('mousemove', (event) => {
-        if (document.pointerLockElement === renderer.domElement) {
-            const movementX = event.movementX || 0;
-            const movementY = event.movementY || 0;
-
-            // 水平旋转（向左移动鼠标镜头向左）
-            yaw -= movementX * sensitivity;
-
-            // 垂直旋转（向上移动鼠标镜头向上）
-            pitch -= movementY * sensitivity;
-            pitch = Math.max(-Math.PI / 2, Math.min(Math.PI / 2, pitch)); // 限制垂直角度
-
-            // 更新相机旋转
-            camera.rotation.order = 'YXZ'; // 先Y（水平）后X（垂直）
-            camera.rotation.set(pitch, yaw, 0);
-        }
-    });
-
-
-    // WASD移动控制
+    // Camera Control
+    let yaw = 0, pitch = 0, sensitivity = 0.005;
     const keys = {};
-    document.addEventListener('keydown', (event) => keys[event.key.toLowerCase()] = true);
-    document.addEventListener('keyup', (event) => keys[event.key.toLowerCase()] = false);
 
-    // 子弹管理
-    let bullets = 10;
-    const maxBullets = 10;
+    function setupDesktopControls() {
+        document.addEventListener('click', () => renderer.domElement.requestPointerLock());
+        document.addEventListener('mousemove', (event) => {
+            if (document.pointerLockElement === renderer.domElement) {
+                yaw -= (event.movementX || 0) * sensitivity;
+                pitch -= (event.movementY || 0) * sensitivity;
+                pitch = Math.max(-Math.PI / 2, Math.min(Math.PI / 2, pitch));
+                camera.rotation.order = 'YXZ';
+                camera.rotation.set(pitch, yaw, 0);
+            }
+        });
+        document.addEventListener('keydown', (event) => keys[event.key.toLowerCase()] = true);
+        document.addEventListener('keyup', (event) => keys[event.key.toLowerCase()] = false);
+    }
+
+    let touchStartX = 0, touchStartY = 0, isSwiping = false;
+    function setupMobileControls() {
+        document.addEventListener('touchstart', (e) => {
+            if (e.target.tagName !== 'BUTTON' && e.target.id !== 'joystick' && e.target.id !== 'joystickKnob') {
+                isSwiping = true;
+                touchStartX = e.touches[0].clientX;
+                touchStartY = e.touches[0].clientY;
+            }
+        });
+        document.addEventListener('touchmove', (e) => {
+            if (isSwiping) {
+                const deltaX = e.touches[0].clientX - touchStartX;
+                const deltaY = e.touches[0].clientY - touchStartY;
+                yaw -= deltaX * sensitivity;
+                pitch -= deltaY * sensitivity;
+                pitch = Math.max(-Math.PI / 2, Math.min(Math.PI / 2, pitch));
+                camera.rotation.order = 'YXZ';
+                camera.rotation.set(pitch, yaw, 0);
+                touchStartX = e.touches[0].clientX;
+                touchStartY = e.touches[0].clientY;
+            }
+        });
+        document.addEventListener('touchend', () => { isSwiping = false; });
+    }
+
+    // Joystick Control
+    const joystick = document.getElementById('joystick');
+    const knob = document.getElementById('joystickKnob');
+    let joystickActive = false, joystickX = 0, joystickY = 0, joystickTouchId = null;
+    function setupJoystick() {
+        joystick.style.display = 'block';
+        joystick.addEventListener('touchstart', (e) => {
+            e.preventDefault();
+            const touch = e.touches[0];
+            joystickTouchId = touch.identifier;
+            joystickActive = true;
+            updateJoystick(touch);
+        });
+        document.addEventListener('touchmove', (e) => {
+            if (joystickActive) {
+                for (let touch of e.touches) {
+                    if (touch.identifier === joystickTouchId) {
+                        updateJoystick(touch);
+                        break;
+                    }
+                }
+            }
+        });
+        document.addEventListener('touchend', (e) => {
+            for (let touch of e.changedTouches) {
+                if (touch.identifier === joystickTouchId) {
+                    joystickActive = false;
+                    knob.style.left = '50%';
+                    knob.style.top = '50%';
+                    joystickX = 0;
+                    joystickY = 0;
+                    joystickTouchId = null;
+                    break;
+                }
+            }
+        });
+    }
+    function updateJoystick(touch) {
+        const rect = joystick.getBoundingClientRect();
+        let dx = touch.clientX - (rect.left + rect.width / 2);
+        let dy = touch.clientY - (rect.top + rect.height / 2);
+        const distance = Math.sqrt(dx * dx + dy * dy);
+        const maxDistance = rect.width / 2 - 20;
+        if (distance > maxDistance) {
+            dx = dx * maxDistance / distance;
+            dy = dy * maxDistance / distance;
+        }
+        knob.style.left = `${50 + (dx / maxDistance) * 50}%`;
+        knob.style.top = `${50 + (dy / maxDistance) * 50}%`;
+        joystickX = dx / maxDistance;
+        joystickY = dy / maxDistance;
+    }
+
+    // UI Elements
+    let bullets = 10, maxBullets = 10, health = 100;
     const bulletDisplay = document.createElement('div');
     bulletDisplay.className = 'ui';
     bulletDisplay.style.bottom = '10px';
@@ -92,8 +240,6 @@
     bulletDisplay.innerText = `子弹: ${bullets}`;
     document.body.appendChild(bulletDisplay);
 
-    // 生命值
-    let health = 100;
     const healthDisplay = document.createElement('div');
     healthDisplay.className = 'ui';
     healthDisplay.style.bottom = '10px';
@@ -102,29 +248,17 @@
     document.body.appendChild(healthDisplay);
 
     function deductHealth(amount) {
-        if (isGamePaused) return; // 如果已暂停，不再扣血
+        if (isGamePaused) return;
         health -= amount;
         healthDisplay.innerText = `生命值: ${health}`;
-
-        // 触发红色闪烁效果
+        playDamageSound();
         const damageOverlay = document.getElementById('damageOverlay');
-        gsap.fromTo(
-            damageOverlay,
-            { backgroundColor: 'rgba(255, 0, 0, 0.5)' },
-            {
-                backgroundColor: 'rgba(255, 0, 0, 0)',
-                duration: 0.5,
-                ease: 'power1.out'
-            }
-        );
-
-        if (health <= 0) {
-            endGame();
-        }
+        gsap.fromTo(damageOverlay, { backgroundColor: 'rgba(255, 0, 0, 0.5)' }, { backgroundColor: 'rgba(255, 0, 0, 0)', duration: 0.5, ease: 'power1.out' });
+        if (health <= 0) endGame();
     }
 
-    // 枪械展示
-    const gunTexture = new THREE.TextureLoader().load('./image/gun.png'); // 替换为实际枪械图片URL
+    // Gun
+    const gunTexture = new THREE.TextureLoader().load('./image/gun.png');
     const gunMaterial = new THREE.MeshBasicMaterial({ map: gunTexture, transparent: true });
     const gunGeometry = new THREE.PlaneGeometry(1, 1);
     const gun = new THREE.Mesh(gunGeometry, gunMaterial);
@@ -132,147 +266,111 @@
     camera.add(gun);
     scene.add(camera);
 
-    // 开枪函数
+    // Shoot Function
     function shoot() {
-        if (bullets > 0) {
+        if (bullets > 0 && !isGamePaused) {
             bullets--;
             bulletDisplay.innerText = `子弹: ${bullets}`;
-            gsap.to(gun.position, { z: -1.2, duration: 0.05, yoyo: true, repeat: 1 });
+            playShootSound();
+            const tl = gsap.timeline();
+            tl.to(gun.position, { z: -0.8, duration: 0.02, ease: "power1.in" })
+                .to(gun.position, { z: -1, duration: 0.3, ease: "power2.out" });
 
             const raycaster = new THREE.Raycaster();
             raycaster.setFromCamera(new THREE.Vector2(0, 0), camera);
             const intersects = raycaster.intersectObjects(enemies.map(e => e.sprite));
-
             if (intersects.length > 0) {
                 const enemy = intersects[0].object;
-                const hitDirection = new THREE.Vector3()
-                    .subVectors(enemy.position, camera.position)
-                    .normalize();
-
-                // 添加击飞效果
+                const hitDirection = new THREE.Vector3().subVectors(enemy.position, camera.position).normalize();
                 gsap.to(enemy.position, {
-                    x: enemy.position.x + hitDirection.x * 5,  // 沿射击方向飞5个单位
-                    y: enemy.position.y + 2,                   // 向上飞2个单位
+                    x: enemy.position.x + hitDirection.x * 5,
+                    y: enemy.position.y + 2,
                     z: enemy.position.z + hitDirection.z * 5,
-                    duration: 0.3,                             // 飞行时间0.3秒
-                    ease: "power2.out",                       // 减速效果
-                    onComplete: () => {
-                        scene.remove(enemy);                  // 动画完成后移除敌人
-                        enemies = enemies.filter(e => e.sprite !== enemy);
-                    }
-                });
-
-                // 同时淡出敌人
-                gsap.to(enemy.material, {
-                    opacity: 0,
                     duration: 0.3,
-                    onComplete: () => {
-                        enemy.material.opacity = 1;           // 重置透明度以备复用
-                    }
+                    ease: "power2.out",
+                    onComplete: () => { scene.remove(enemy); enemies = enemies.filter(e => e.sprite !== enemy); }
                 });
-
+                gsap.to(enemy.material, { opacity: 0, duration: 0.3, onComplete: () => { enemy.material.opacity = 1; } });
                 score += 20;
                 timerDisplay.innerText = `时间: ${timeLeft} | 分数: ${score}`;
             }
         }
     }
-    document.addEventListener('click', shoot);
-    document.addEventListener('keydown', (event) => {
-        if (event.key === 'r' && bullets < maxBullets) {
-            bullets = maxBullets;
-            bulletDisplay.innerText = `子弹: ${bullets}`;
-        }
-    });
 
-    // 地形生成
+    // Reload Function
+    function reload() {
+        if (bullets < maxBullets && !isGamePaused) {
+            playReloadSound();
+            setTimeout(() => {
+                bullets = maxBullets;
+                bulletDisplay.innerText = `子弹: ${bullets}`;
+            }, 1500);
+        }
+    }
+
+    // Desktop/Mobile Shoot/Reload Setup
+    function setupControls() {
+        if (mode === 'desktop') {
+            document.addEventListener('click', shoot);
+            document.addEventListener('keydown', (event) => { if (event.key === 'r') reload(); });
+            setupDesktopControls();
+        } else if (mode === 'mobile') {
+            const shootButton = document.getElementById('shootButton');
+            const reloadButton = document.getElementById('reloadButton');
+            shootButton.style.display = 'block';
+            reloadButton.style.display = 'block';
+            shootButton.addEventListener('touchstart', (e) => { e.preventDefault(); shoot(); });
+            reloadButton.addEventListener('touchstart', (e) => { e.preventDefault(); reload(); });
+            setupMobileControls();
+            setupJoystick();
+        }
+    }
+
+    // Terrain
     const noise = new SimplexNoise();
-    const terrainSize = 100;
-    const terrainDetail = 0.1;
-    const terrainHeight = 1; // 平缓地形
+    const terrainSize = 100, terrainDetail = 0.1, terrainHeight = 1;
     const geometry = new THREE.PlaneGeometry(terrainSize, terrainSize, 100, 100);
     geometry.rotateX(-Math.PI / 2);
     const vertices = geometry.attributes.position.array;
     for (let i = 0; i < vertices.length; i += 3) {
-        const x = vertices[i];
-        const z = vertices[i + 2];
-        const y = noise.noise2D(x * terrainDetail, z * terrainDetail) * terrainHeight;
-        vertices[i + 1] = y;
+        const x = vertices[i], z = vertices[i + 2];
+        vertices[i + 1] = noise.noise2D(x * terrainDetail, z * terrainDetail) * terrainHeight;
     }
     geometry.computeVertexNormals();
     const terrainMaterial = new THREE.MeshStandardMaterial({ color: 0x888888 });
     const terrain = new THREE.Mesh(geometry, terrainMaterial);
     scene.add(terrain);
 
-    // 射线投射器
     const raycaster = new THREE.Raycaster();
     raycaster.ray.direction.set(0, -1, 0);
 
-    // 敌人生成（高度贴合地表）
+    // Enemies
     let enemies = [];
     class Enemy {
         constructor() {
-            const enemyTextures = [
-                './image/1.png',
-                './image/2.png',
-            ];
-            const texture = new THREE.TextureLoader().load(enemyTextures[Math.floor(Math.random() * enemyTextures.length)]);
+            const enemyTextures = ['./image/1.png', './image/2.png'];
+            const texture = new THREE.TextureLoader().load(enemyTextures[Math.floor(Math.random() * 2)]);
             const material = new THREE.SpriteMaterial({ map: texture });
             this.sprite = new THREE.Sprite(material);
             this.sprite.scale.set(2, 2, 1);
-
-            // 随机选择地图边缘（0: 上, 1: 下, 2: 左, 3: 右）
-            const edge = Math.floor(Math.random() * 4);
-            const halfSize = terrainSize / 2; // terrainSize = 100, halfSize = 50
-
+            const edge = Math.floor(Math.random() * 4), halfSize = terrainSize / 2;
             switch (edge) {
-                case 0: // 上边缘 (z = 50)
-                    this.sprite.position.set(
-                        Math.random() * terrainSize - halfSize, // x: [-50, 50]
-                        10,                                     // y: 10
-                        halfSize                                // z: 50
-                    );
-                    break;
-                case 1: // 下边缘 (z = -50)
-                    this.sprite.position.set(
-                        Math.random() * terrainSize - halfSize, // x: [-50, 50]
-                        10,                                     // y: 10
-                        -halfSize                               // z: -50
-                    );
-                    break;
-                case 2: // 左边缘 (x = -50)
-                    this.sprite.position.set(
-                        -halfSize,                              // x: -50
-                        10,                                     // y: 10
-                        Math.random() * terrainSize - halfSize  // z: [-50, 50]
-                    );
-                    break;
-                case 3: // 右边缘 (x = 50)
-                    this.sprite.position.set(
-                        halfSize,                               // x: 50
-                        10,                                     // y: 10
-                        Math.random() * terrainSize - halfSize  // z: [-50, 50]
-                    );
-                    break;
+                case 0: this.sprite.position.set(Math.random() * terrainSize - halfSize, 10, halfSize); break;
+                case 1: this.sprite.position.set(Math.random() * terrainSize - halfSize, 10, -halfSize); break;
+                case 2: this.sprite.position.set(-halfSize, 10, Math.random() * terrainSize - halfSize); break;
+                case 3: this.sprite.position.set(halfSize, 10, Math.random() * terrainSize - halfSize); break;
             }
-
             scene.add(this.sprite);
-            this.sprite.material.opacity = 0;
             gsap.to(this.sprite.material, { opacity: 1, duration: 1 });
         }
-
         update() {
             this.sprite.lookAt(camera.position);
             const direction = new THREE.Vector3().subVectors(camera.position, this.sprite.position).normalize();
             this.sprite.position.add(direction.multiplyScalar(0.05));
-
-            // 贴合地表高度
             raycaster.ray.origin.copy(this.sprite.position);
-            raycaster.ray.origin.y = 10; // 从上方检测
+            raycaster.ray.origin.y = 10;
             const intersects = raycaster.intersectObject(terrain);
-            if (intersects.length > 0) {
-                this.sprite.position.y = intersects[0].point.y + 1; // 高度为地表+1
-            }
-
+            if (intersects.length > 0) this.sprite.position.y = intersects[0].point.y + 1;
             if (this.sprite.position.distanceTo(camera.position) < 1) {
                 deductHealth(15);
                 scene.remove(this.sprite);
@@ -280,111 +378,98 @@
             }
         }
     }
+    setInterval(() => { if (enemies.length < 10 && !isGamePaused) enemies.push(new Enemy()); }, 2000);
 
-    setInterval(() => {
-        if (enemies.length < 10) {
-            const newEnemy = new Enemy();
-            enemies.push(newEnemy);
-        }
-    }, 2000); // 每2秒生成一个敌人
-
-    // 计时与得分
-    let timeLeft = 150;
-    let score = 0;
+    // Timer and Score
+    let timeLeft = 150, score = 0;
     const timerDisplay = document.createElement('div');
     timerDisplay.className = 'ui';
     timerDisplay.style.top = '10px';
     timerDisplay.style.left = '10px';
     timerDisplay.innerText = `时间: ${timeLeft} | 分数: ${score}`;
     document.body.appendChild(timerDisplay);
-
     setInterval(() => {
-        if (isGamePaused) return; // 如果暂停，不更新计时器
-        timeLeft--;
-        score++;
-        timerDisplay.innerText = `时间: ${timeLeft} | 分数: ${score}`;
-        if (timeLeft <= 0) {
-            endGame();
+        if (!isGamePaused) {
+            timeLeft--;
+            score++;
+            timerDisplay.innerText = `时间: ${timeLeft} | 分数: ${score}`;
+            if (timeLeft <= 0) endGame();
         }
     }, 1000);
-    // 新增游戏结束函数
+
     function endGame() {
         isGamePaused = true;
-        document.exitPointerLock();
-
-        // 显示弹窗
+        if (mode === 'desktop') document.exitPointerLock();
         const modal = document.getElementById('gameOverModal');
-        const finalScore = document.getElementById('finalScore');
-        finalScore.innerText = `最终得分: ${score}`;
+        document.getElementById('finalScore').innerText = `最终得分: ${score}`;
         modal.style.display = 'block';
     }
-    // 新增重新开始函数
-    function restartGame() {
-        // 重置游戏状态
-        isGamePaused = false;
-        health = 100;
-        bullets = maxBullets;
-        timeLeft = 150;
-        score = 0;
-        enemies.forEach(enemy => scene.remove(enemy.sprite)); // 移除所有敌人
-        enemies = [];
 
-        // 更新UI
+    function restartGame() {
+        isGamePaused = false;
+        health = 100; bullets = maxBullets; timeLeft = 150; score = 0;
+        enemies.forEach(enemy => scene.remove(enemy.sprite));
+        enemies = [];
         healthDisplay.innerText = `生命值: ${health}`;
         bulletDisplay.innerText = `子弹: ${bullets}`;
         timerDisplay.innerText = `时间: ${timeLeft} | 分数: ${score}`;
-
-        // 隐藏弹窗
         document.getElementById('gameOverModal').style.display = 'none';
-
-        // 重新启动动画循环
         animate();
     }
-
-    // 为重新开始按钮添加事件监听
     document.getElementById('restartButton').addEventListener('click', restartGame);
 
-    // 天空贴图
+    // Skybox
     const skyboxLoader = new THREE.CubeTextureLoader();
-    const skyboxTexture = skyboxLoader.load([
+    scene.background = skyboxLoader.load([
         'https://i.imgur.com/px.jpg', 'https://i.imgur.com/nx.jpg',
         'https://i.imgur.com/py.jpg', 'https://i.imgur.com/ny.jpg',
         'https://i.imgur.com/pz.jpg', 'https://i.imgur.com/nz.jpg'
-    ]); // 替换为实际天空贴图URL
-    scene.background = skyboxTexture;
+    ]);
 
-    // 动画循环
+    // Animation Loop
     function animate() {
-        if (isGamePaused) return; // 如果暂停则跳出循环
+        if (isGamePaused) return;
         requestAnimationFrame(animate);
 
-        // WASD移动
         const speed = 0.1;
         const frontVector = new THREE.Vector3(0, 0, -1).applyQuaternion(camera.quaternion);
         const rightVector = new THREE.Vector3(1, 0, 0).applyQuaternion(camera.quaternion);
-        if (keys['w']) camera.position.add(frontVector.multiplyScalar(speed));
-        if (keys['s']) camera.position.add(frontVector.multiplyScalar(-speed));
-        if (keys['a']) camera.position.add(rightVector.multiplyScalar(-speed));
-        if (keys['d']) camera.position.add(rightVector.multiplyScalar(speed));
+        if (mode === 'desktop') {
+            if (keys['w']) camera.position.add(frontVector.multiplyScalar(speed));
+            if (keys['s']) camera.position.add(frontVector.multiplyScalar(-speed));
+            if (keys['a']) camera.position.add(rightVector.multiplyScalar(-speed));
+            if (keys['d']) camera.position.add(rightVector.multiplyScalar(speed));
+        } else if (mode === 'mobile') {
+            camera.position.add(frontVector.multiplyScalar(-joystickY * speed));
+            camera.position.add(rightVector.multiplyScalar(joystickX * speed));
+        }
 
-        // 贴合地形高度
         raycaster.ray.origin.copy(camera.position);
         raycaster.ray.origin.y += 1.6;
         const intersects = raycaster.intersectObject(terrain);
-        if (intersects.length > 0) {
-            camera.position.y = intersects[0].point.y + 1.6;
-        }
-
-        // 更新敌人（仅在游戏未暂停时）
-        if (!isGamePaused) {
-            enemies.forEach(enemy => enemy.update());
-        }
+        if (intersects.length > 0) camera.position.y = intersects[0].point.y + 1.6;
 
+        enemies.forEach(enemy => enemy.update());
         renderer.render(scene, camera);
     }
-    animate();
 
-    // 自适应窗口大小
+    // Mode Selection
+    const modeSelectModal = document.getElementById('modeSelectModal');
+    document.getElementById('desktopMode').addEventListener('click', () => {
+        mode = 'desktop';
+        modeSelectModal.style.display = 'none';
+        isGamePaused = false;
+        setupControls();
+        animate();
+    });
+    document.getElementById('mobileMode').addEventListener('click', () => {
+        mode = 'mobile';
+        modeSelectModal.style.display = 'none';
+        isGamePaused = false;
+        setupControls();
+        animate();
+    });
+
     window.addEventListener('resize', () => {
         camera.aspect = window.innerWidth / window.innerHeight;
         camera.updateProjectionMatrix();
diff --git a/src/components/AccountWorkPiece.vue b/src/components/AccountWorkPiece.vue
index 79d23aa..d4af96e 100644
--- a/src/components/AccountWorkPiece.vue
+++ b/src/components/AccountWorkPiece.vue
@@ -6,6 +6,7 @@ import store from "../store/index.js";
 import {blogImage} from "../utils/imageResource.js";
 import swal from "../utils/sweetalert.js";
 import api from "../utils/axios.js";
+import {formatGMTToLocal} from "../utils/formatTime.js";
 
 const props = defineProps({
   cover: {
@@ -67,7 +68,7 @@ function onPermission() {
     <!-- 左侧：博客封面 + 标题 -->
     <div class="piece-left">
       <!--      <img :src="cover" alt="封面" class="cover-image" />-->
-      <DefaultCover :imageSrc="blogImage(cover)" :text="title" size="60" class="cover-image"/>
+      <DefaultCover :imageSrc="blogImage(cover)" :text="title" size="60px" class="cover-image"/>
       <div class="title-text">{{ title }}</div>
     </div>
 
@@ -75,8 +76,8 @@ function onPermission() {
     <div class="piece-right">
       <!-- 上方时间信息 -->
       <div class="times">
-        <div>创建时间：{{ createdTime }}</div>
-        <div>最后修改：{{ lastModifiedTime }}</div>
+        <div>创建时间：{{ formatGMTToLocal(createdTime) }}</div>
+        <div>最后修改：{{ formatGMTToLocal(lastModifiedTime) }}</div>
       </div>
       <!-- 下方操作 -->
       <div class="actions">
diff --git a/src/components/GeneralRenderer.vue b/src/components/GeneralRenderer.vue
index 7e503f3..952ebf2 100644
--- a/src/components/GeneralRenderer.vue
+++ b/src/components/GeneralRenderer.vue
@@ -30,7 +30,7 @@ function processFormat(text) {
       .replaceAll('/lt', '<')
       .replaceAll('/gt', '>')
       .replaceAll(/(?<!<)\/(\w+)/g, '\\$1')
-      .replaceAll('m\\s', 'm/s')
+      .replaceAll('\\n', '<br>')
       ;
 }
 
@@ -75,8 +75,6 @@ onMounted(async () => {
 
 .renderer-container p {
   margin-bottom: 1rem;
-  display: flex;
-  justify-content: center;
 }
 
 .renderer-container code {
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index 1f4ad36..97d69bf 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -66,6 +66,7 @@ const navItems = [
   // {name: '实例', link: '/demos'},
   {name: '小工具', link: '/tools'},
   {name: '留言板', link: '/demos/board'},
+  {name: '文件共享', link: '/demos/file-sharing'},
   'divider',
   {name: '日志', link: '/about'}
 ]
diff --git a/src/pages/Demos_home.vue b/src/pages/Demos_home.vue
index b9d4431..4bb5f73 100644
--- a/src/pages/Demos_home.vue
+++ b/src/pages/Demos_home.vue
@@ -28,6 +28,14 @@ const demos = ref([
     author: ["Louis Zhou"],
     tags: ['游戏'],
   },
+  {
+    id: 'file-sharing',
+    name: '文件共享',
+    description: '云盘',
+    date: '2025-3-28',
+    author: ["Mike Rong"],
+    tags: ['功能'],
+  },
 ]);
 
 
diff --git a/src/pages/Home.vue b/src/pages/Home.vue
index 70dfed7..cf97481 100644
--- a/src/pages/Home.vue
+++ b/src/pages/Home.vue
@@ -4,7 +4,7 @@ import {TransitionPresets, useTransition} from '@vueuse/core';
 import api from "../utils/axios.js";
 
 const source = ref(0);
-const viewCountDisplay = ref(true);
+const viewCountDisplay = ref(false);
 const outputValue = useTransition(source, {
   duration: 3000,
   transition: TransitionPresets.easeOutExpo,
@@ -15,8 +15,7 @@ onMounted(async () => {
   const response = await api.get('/view');
   if (response.code === 0) {
     source.value = response.views;
-  } else {
-    viewCountDisplay.value = false;
+    viewCountDisplay.value = true;
   }
 
 })
@@ -28,13 +27,32 @@ onMounted(async () => {
     <el-container>
 
       <el-main>
-        <div style="font-size: 50px; font-weight: inherit; padding: 20px">欢迎来到 MVA-CYBER !</div>
+        <div class="left">
+          <div class="sun">
+            <div class="earth">
+              <div class="moon"></div>
+            </div>
+          </div>
+<!--          <div class="ball"/>-->
+        </div>
+        <div class="right">
+          <div class="logo">CYBER</div>
+          <div class="text">CODING YOUTH BOT AND ENGINEERING REVOLUTION</div>
+          <div class="link">
+            <a>ABOUT US</a>
+            <a>ABOUT THIS WEBSITE</a>
+            <a>CONTACT US</a>
+          </div>
+        </div>
+
       </el-main>
       <el-footer>
-<!--        <div class="text-bg"></div>-->
-        <el-col v-if="viewCountDisplay">
-          <el-statistic title="网站累计访问次数" :value="outputValue"/>
-        </el-col>
+        <!--        <div class="text-bg"></div>-->
+        <Transition name="fade">
+          <el-col v-if="viewCountDisplay">
+            <el-statistic title="网站累计访问次数" :value="outputValue"/>
+          </el-col>
+        </Transition>
 
       </el-footer>
     </el-container>
@@ -48,6 +66,7 @@ img {
   width: 100%;
   height: 100%;
 }
+
 .el-container {
   display: flex;
   align-items: center;
@@ -56,15 +75,86 @@ img {
   overflow: hidden;
 
 }
+
 .el-main {
   display: flex;
-  justify-content: center;
+  justify-content: space-between;
+  align-items: center;
   padding: 0;
   width: 100%;
+  height: 100%;
+  overflow: hidden;
 }
+
+.left {
+  height: 100%;
+  width: 100%;
+  flex: 1;
+  position: relative;
+  //overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ball {
+  background: #00a8a8;
+  width: 25vw;
+  height: 25vw;
+  border-radius: 50%;
+  animation: pulse 5s ease infinite;
+}
+.theme-light .ball {
+  background: #ffff3c;
+}
+@keyframes pulse {
+  0% {
+    opacity: 0.7;
+    filter: blur(50px);
+  }
+  50% {
+    opacity: 0.4;
+    filter: blur(70px);
+  }
+  100% {
+    opacity: 0.7;
+    filter: blur(50px);
+  }
+}
+
+.right {
+  margin-right: 5vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding-bottom: 18vh;
+}
+.logo {
+  font-family: 'Netron', sans-serif;
+  font-size: 10vw;
+}
+.right .text {
+  font-family: 'Netron', sans-serif;
+  font-size: 1.27vw;
+}
+.right .link {
+  display: flex;
+  gap: 1.5vw;
+  font-family: sans-serif;
+  padding-top: 5.5vh;
+  font-size: 0.9vw;
+}
+.link a {
+  color: white;
+  cursor: pointer;
+}
+.theme-light a {
+  color: #000;
+}
+
 .el-footer {
   position: relative;
 }
+
 .el-col {
 
   //position: absolute;
@@ -74,9 +164,137 @@ img {
   //align-items: center;
   //justify-content: center;
 }
+
 .el-statistic {
   display: flex;
   flex-direction: column-reverse;
   align-items: center;
 }
+
+@media (max-width: 900px) {
+  .el-main {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    position: relative;
+  }
+  .left {
+    position: absolute;
+    top: 50%;
+    justify-content: flex-start;
+    flex-direction: column;
+    width: 100%;
+    z-index: -1;
+  }
+  .ball {
+    width: 10rem;
+    height: 10rem;
+  }
+  .right {
+    margin: 0;
+    padding-bottom: 0;
+  }
+  .logo {
+    font-size: 5rem;
+  }
+  .right .text {
+    font-size: 0.65rem;
+  }
+  .right .link {
+    display: flex;
+    gap: 0.5rem;
+    padding-top: 1.7rem;
+    font-size: 0.5rem;
+  }
+}
+
+*{
+  /* 初始化 */
+  margin: 0;
+  padding: 0;
+}
+.left{
+  /* 自定义属性，--s为太阳的颜色，--e为地球的颜色，--m为月球的颜色，可通过var函数对其调用 */
+  --s: #f39c12;
+  --e: #3498db;
+  --m: #1abc9c;
+}
+/* 太阳 */
+.sun{
+  /* 绝对定位 */
+  position: absolute;
+  width: 100px;
+  height: 100px;
+  border-radius: 50%;
+  /* 通过var函数调用自定义属性--s，设置太阳的颜色 */
+  background-color: var(--s);
+  /* 通过设置阴影，实现发光的效果 */
+  box-shadow: 0 0 10px var(--s),
+  0 0 20px var(--s),
+  0 0 30px var(--s),
+  0 0 40px var(--s);
+  /* 执行动画：动画名 时长 线性的 无限次播放 */
+  animation: rotate 36.5s linear infinite;
+}
+/* 太阳外圈（地球轨道） */
+.sun::after{
+  content: "";
+  width: 330px;
+  height: 330px;
+  /* 绝对定位 居中 */
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%,-50%);
+  border: 1px solid gray;
+  border-radius: 50%;
+  z-index: -1;
+}
+/* 地球 */
+.earth{
+  position: absolute;
+  left: 200px;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background-color: var(--e);
+  box-shadow: 0 0 10px var(--e),
+  0 0 20px var(--e),
+  0 0 30px var(--e),
+  0 0 40px var(--e);
+  /* 执行动画：动画名 时长 线性的 无限次播放 */
+  animation: rotate 3s linear infinite;
+}
+/* 地球外圈（月球轨道） */
+.earth::after{
+  content: "";
+  width: 84px;
+  height: 84px;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%,-50%);
+  border: 1px solid gray;
+  border-radius: 50%;
+}
+/* 月球 */
+.moon{
+  position: absolute;
+  left: 50px;
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  background-color: var(--m);
+  box-shadow: 0 0 5px var(--m),
+  0 0 10px var(--m),
+  0 0 20px var(--m);
+}
+
+/* 定义动画 */
+@keyframes rotate {
+  to{
+    transform: rotateZ(360deg);
+  }
+}
 </style>
\ No newline at end of file
diff --git a/src/pages/accountPages/Account_admin_uploadLog.vue b/src/pages/accountPages/Account_admin_uploadLog.vue
index f4bdddd..a40c30b 100644
--- a/src/pages/accountPages/Account_admin_uploadLog.vue
+++ b/src/pages/accountPages/Account_admin_uploadLog.vue
@@ -5,6 +5,7 @@ import MarkdownViewer from "../../components/mdRenderer.vue";
 import swal from "../../utils/sweetalert.js";
 import store from "../../store/index.js";
 import api from "../../utils/axios.js";
+import getCurrentTime from "../../utils/getCurrentTime.js";
 
 const mdInput = ref(store.state.editStore.log || '');
 const version = ref(store.state.editStore.logVersion || '');
@@ -66,20 +67,19 @@ const postLog = async () => {
     swal.tip('info', '内容为必填项');
     return;
   }
-  swal.window('info', '提交吗? ', '提交前请检查内容, 确保格式正确', '确定', '取消').then(async (result) => {
-    if (result.isConfirmed) {
-      const response = await api.post('/postweblog', {
-        version: version.value,
-        date: getFormattedTime(),
-        content: mdInput.value
-      });
-      if (response.code === 0) {
-        swal.tip('success', '提交成功');
-        return;
-      }
-      swal.tip('error', '提交失败...')
+  const result = await swal.window('info', '提交吗? ', '提交前请检查内容, 确保格式正确', '确定', '取消');
+  if (result.isConfirmed) {
+    const response = await api.post('/postweblog', {
+      version: version.value,
+      date: getCurrentTime(),
+      content: mdInput.value
+    });
+    if (response.code === 0) {
+      swal.tip('success', '提交成功');
+      return;
     }
-  })
+    swal.tip('error', '提交失败...')
+  }
 }
 
 const shiftNailed = () => {
diff --git a/src/pages/accountPages/Account_setting.vue b/src/pages/accountPages/Account_setting.vue
index 0015863..8aa628f 100644
--- a/src/pages/accountPages/Account_setting.vue
+++ b/src/pages/accountPages/Account_setting.vue
@@ -143,13 +143,13 @@ watch(autoSaveInterval, () => {
           />
 
           <!-- 改名 -->
-          <span
-              v-if="!isEditingUsername"
-              class="edit-emoji"
-              @click="editUsername"
-          >
-            🖊
-          </span>
+<!--          <span-->
+<!--              v-if="!isEditingUsername"-->
+<!--              class="edit-emoji"-->
+<!--              @click="editUsername"-->
+<!--          >-->
+<!--            🖊-->
+<!--          </span>-->
           <div v-if="isEditingUsername">
             <button
                 class="confirm-btn"
diff --git a/src/pages/blogPages/SingleBlog_page.vue b/src/pages/blogPages/SingleBlog_page.vue
index be20e36..b96e6a9 100644
--- a/src/pages/blogPages/SingleBlog_page.vue
+++ b/src/pages/blogPages/SingleBlog_page.vue
@@ -194,7 +194,7 @@ const changeSort = () => {
             </div>
             <el-divider/>
             <div class="blog-content">
-              <div style="padding: 0 56px 40px" v-html="processedContent"/>
+              <div :style="{padding: windowWidth<870 ? '0 5px 40px' : '0 56px 40px'}" v-html="processedContent"/>
               <el-divider v-if="windowWidth<1050"/>
               <Transition name="fade">
                 <div class="interact-bar" v-if="interactInfo.complete" :class="{outside: windowWidth>1050}">
@@ -257,7 +257,7 @@ const changeSort = () => {
                     :sort-mode="sortMode"
                     :blog-author-uid="blog.poster"
                 />
-                <p v-else>不允许评论</p>
+                <div v-else class="loading">不允许评论</div>
               </div>
 
 
diff --git a/src/pages/blogPages/blogEditor.vue b/src/pages/blogPages/blogEditor.vue
index 11a189a..87357c2 100644
--- a/src/pages/blogPages/blogEditor.vue
+++ b/src/pages/blogPages/blogEditor.vue
@@ -47,15 +47,15 @@
         <div class="title">{{ titleInput }}</div>
         <div class="blog-meta">
           <div class="avatar">
-            <img
-                v-if="store.getters.profileImage"
-                :src="userProfile(store.state.userInfo.profile)"
-                alt="Poster Avatar"
-            />
+            <Profile_display v-if="store.getters.profileImage" :id="userProfile(store.state.userInfo.profile)"/>
+          </div>
+          <div class="info-text">
+            <span class="username-text">{{ store.state.userInfo.username || '' }}</span>
+            <span class="date-text">最后更新: {{ getCurrentTime() }}</span>
           </div>
-          <span>{{ store.state.userInfo.username || '' }}</span>
         </div>
-        <div class="viewer" v-html="editorRef.getHtml()"></div>
+        <el-divider/>
+        <div :style="{padding: windowWidth<870 ? '0 5px 40px' : '0 56px 40px'}" class="viewer" v-html="editorRef.getHtml()"></div>
       </el-container>
     </el-container>
   </div>
@@ -73,6 +73,9 @@ import mobileTest from "../../utils/mobileTest.js";
 import {blogImage, userProfile} from "../../utils/imageResource.js";
 import store from "../../store/index.js";
 import router from "../../router/index.js";
+import getCurrentTime from "../../utils/getCurrentTime.js";
+import {formatGMTToLocal} from "../../utils/formatTime.js";
+import Profile_display from "../../components/Profile_display.vue";
 
 
 // 编辑器实例，必须用 shallowRef
@@ -82,11 +85,16 @@ const blogStatus = ref(null);
 const titleInput = ref('');
 
 const viewing = ref(false);
+const windowWidth = ref(0);
 
 // 内容 HTML
 const valueHtml = ref('');
 const imagesCache = ref([]);
 
+const checkWindowSize = () => {
+  windowWidth.value = window.innerWidth;
+};
+
 // 工具栏和编辑器配置
 const toolbarConfig = {};
 const editorConfig = {
@@ -126,12 +134,14 @@ const getImageSize = (file) => {
     const img = new Image();
     img.src = URL.createObjectURL(file);
     img.onload = () => {
-      resolve({width: img.width, height: img.height});
+      resolve({width: img.width, height: img.height})
     };
   });
 };
 
 onMounted(() => {
+  checkWindowSize();
+  window.addEventListener('resize', checkWindowSize);
   const observer = new MutationObserver(() => {
     document.querySelectorAll('[data-menu-key="editImage"]').forEach(btn => {
       btn.remove();
@@ -535,9 +545,9 @@ const disable = () => {
 
 .editor-container {
   max-width: 802px;
-  min-height: 100px;
   width: calc(100% - 5px);
   height: calc(100% - 10px);
+  min-height: 500px;
   margin-top: 5px;
   display: flex;
   word-break: break-word;
@@ -566,17 +576,26 @@ const disable = () => {
 .blog-meta {
   display: flex;
   align-items: center;
-  gap: 10px;
   width: auto;
   padding: 0 10px;
   margin-bottom: 20px;
 }
 
-.avatar, .avatar img {
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  overflow: hidden;
+.info-text {
+  padding-left: 20px;
+  display: flex;
+  flex-direction: column;
+}
+
+.username-text {
+  //cursor: pointer;
+  font-size: 17px;
+  font-weight: 600;
+}
+
+.date-text {
+  font-size: 13px;
+  opacity: 0.6;
 }
 
 .viewer {
@@ -585,7 +604,6 @@ const disable = () => {
   min-height: 100px;
   height: calc(100vh - 213px);
   word-break: break-word;
-  border: 1px solid rgba(93, 93, 93, 0.34);
   padding: 0 10px;
   overflow: auto;
 }
diff --git a/src/pages/blogPages/submitBlogPages/SubmitBlog_page.vue b/src/pages/blogPages/submitBlogPages/SubmitBlog_page.vue
index c513fa8..0d1e2c1 100644
--- a/src/pages/blogPages/submitBlogPages/SubmitBlog_page.vue
+++ b/src/pages/blogPages/submitBlogPages/SubmitBlog_page.vue
@@ -43,8 +43,13 @@ const nonNullKeysCount = computed(() => {
 
 const submit = async () => {
   const formData = new FormData();
-  formData.append("allow_comments", infoForm.value.allowComment);
-  formData.append("category", infoForm.value.tagSelect);
+  if (infoForm.value.allowComment !== null) {
+    formData.append("allow_comments", infoForm.value.allowComment);
+  }
+  if (infoForm.value.tagSelect !== null) {
+    formData.append("category", infoForm.value.tagSelect);
+  }
+
   formData.append("draft", 0);
 
   console.log(Object.fromEntries(formData.entries()));
diff --git a/src/pages/demoPages/fileSharing/Sharing_page.vue b/src/pages/demoPages/fileSharing/Sharing_page.vue
new file mode 100644
index 0000000..e00d3a8
--- /dev/null
+++ b/src/pages/demoPages/fileSharing/Sharing_page.vue
@@ -0,0 +1,249 @@
+<template>
+  <div class="share-page" :class="{ 'theme-light': isLightTheme }">
+    <div v-if="isLoading" class="loading">正在检测文件共享服务...</div>
+
+    <!-- 错误提示 -->
+    <transition name="fade">
+      <div v-if="!isLoading && error" class="error">{{ error }}</div>
+    </transition>
+
+    <!-- 主要内容 -->
+    <transition name="fade">
+      <div v-if="!isLoading && !error" class="content">
+        <div class="card">
+          <div class="title">文件共享</div>
+          <p class="subtitle">
+            <span v-if="isVisitor">（游客模式，使用更多功能请登录）</span>
+            <span v-else-if="!verified">（提示：可以联系管理员进行认证，认证后可使用文件共享账号）</span>
+          </p>
+          <button @click="handleButtonClick" class="share-button">进入文件共享页</button>
+        </div>
+      </div>
+    </transition>
+  </div>
+</template>
+
+<script>
+import { ref, onMounted } from 'vue';
+import store from '../../../store';
+import swal from '../../../utils/sweetalert.js';
+import api from '../../../utils/axios.js';
+
+export default {
+  computed: {
+    store() {
+      return store;
+    },
+  },
+  setup() {
+    const isLoading = ref(true);
+    const error = ref(null);
+    const ip = ref(null);
+    const verified = ref();
+    const account = ref(false);
+    const isVisitor = ref(false);
+    const isLightTheme = ref(false);
+
+    const startLoading = () => {
+      isLoading.value = true;
+    };
+
+    const stopLoading = () => {
+      isLoading.value = false;
+    };
+
+    const fetchIp = async () => {
+      try {
+        const response = await api.get('/share/ip');
+        if (response.code === 0) {
+          const response1 = await api.get('/share/ping');
+          const isIpAlive = response1.code === 0;
+          if (!isIpAlive) {
+            swal.tip('error', '暂时无法连接文件共享服务，请稍后再试');
+            throw new Error('连接失败');
+          }
+          ip.value = response.ip;
+        } else {
+          throw new Error('获取 IP 失败');
+        }
+      } catch (err) {
+        throw err;
+      }
+    };
+
+    const fetchStatus = async () => {
+      try {
+        const response = await api.get('/share/status');
+        if (response.code === 0) {
+          verified.value = response.verified;
+          account.value = response.account;
+        } else if (response.code === 1) {
+          isVisitor.value = true;
+        } else {
+          throw new Error('获取状态失败');
+        }
+      } catch (err) {
+        throw err;
+      }
+    };
+
+    const handleButtonClick = async () => {
+      if (verified.value && !account.value) {
+        store.commit('startLoading', '正在加载...');
+        try {
+          const response = await api.post('/share/signup');
+          if (response.code === 0) {
+            store.commit('stopLoading');
+            window.location.href = `http://${ip.value}:5244`;
+          } else {
+            swal.tip('error', '注册失败');
+          }
+        } catch (err) {
+          swal.tip('error', '注册失败');
+        }
+        store.commit('stopLoading');
+      } else {
+        window.location.href = `http://${ip.value}:5244`;
+      }
+    };
+
+    onMounted(async () => {
+      startLoading();
+      try {
+        await fetchIp();
+        await fetchStatus();
+      } catch (err) {
+        error.value = '加载失败，请稍后重试';
+        swal.tip('error', err);
+      } finally {
+        stopLoading();
+      }
+    });
+
+    return {
+      isLoading,
+      error,
+      verified,
+      account,
+      isVisitor,
+      isLightTheme,
+      handleButtonClick,
+    };
+  },
+};
+</script>
+
+<style scoped>
+.share-page {
+  width: 100%;
+  min-height: calc(100vh - 60px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  background: linear-gradient(45deg, var(--bg-color), var(--accent-color));
+  background-size: 400% 400%;
+  animation: gradientAnimation 15s ease infinite, bgDisplay 0.5s forwards;
+  padding: 2rem 2rem 5rem;
+  box-sizing: border-box;
+}
+
+@keyframes bgDisplay {
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes gradientAnimation {
+  0% {
+    background-position: 0 50%;
+  }
+  50% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0 50%;
+  }
+}
+
+.loading {
+  font-size: 1.5rem;
+  font-weight: bold;
+  animation: pulse 1.5s infinite;
+  padding-bottom: 3rem;
+}
+
+@keyframes pulse {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.error {
+  font-size: 1.2rem;
+  color: #ff4d4f;
+}
+
+.content {
+  text-align: center;
+}
+
+.card {
+  background: var(--card-bg);
+  color: var(--text-color);
+  padding: 2rem;
+  border-radius: 1rem;
+  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+  display: inline-block;
+  min-width: 300px;
+  max-width: 500px;
+}
+
+.title {
+  font-size: 1.8rem;
+  font-weight: bold;
+  margin-bottom: 1rem;
+}
+
+.subtitle {
+  font-size: 1rem;
+  margin-bottom: 1.5rem;
+  color: var(--input-text);
+}
+
+.share-button {
+  padding: 0.8rem 2rem;
+  font-size: 1.1rem;
+  font-weight: 500;
+  background: #4caf50;
+  color: white;
+  border: none;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: background 0.2s ease;
+}
+
+.theme-light .share-button {
+  background: #66bb6a;
+}
+
+.share-button:hover {
+  background: #388e3c;
+}
+
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.5s ease;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+</style>
diff --git a/src/pages/demoPages/messageBoard/Board_page.vue b/src/pages/demoPages/messageBoard/Board_page.vue
index 5c86970..e40e37a 100644
--- a/src/pages/demoPages/messageBoard/Board_page.vue
+++ b/src/pages/demoPages/messageBoard/Board_page.vue
@@ -9,7 +9,7 @@ import AuthService from "../../../../services/auth.js";
 import PagingController from "../../../components/PagingController.vue";
 
 const messages = ref(store.state.demosLocal.board?.messages || []);
-const amount = ref(store.state.demosLocal.board?.amount || 0);
+const amount = ref(store.state.demosLocal.board?.amount || 1);
 const currentPage = ref(store.state.demosLocal.board?.currentPage || 1);
 
 const pageLoading = ref(false);
@@ -30,22 +30,8 @@ async function refreshBoard(page, pageSize) {
       PAGE: page,
       PAGE_SIZE: pageSize
     }).then(res => {
-      res.data = res.data.map((msg)=>{
-        function stringToFloat(str) {
-          // 使用字符串的字符码生成一个基于字符串的唯一数值
-          let hash = 0;
-          for (let i = 0; i < str.length; i++) {
-            hash = (hash << 5) - hash + str.charCodeAt(i); // 位运算来生成哈希
-            hash = hash & hash; // 强制转换为32位整数
-          }
-
-          // 将哈希值映射到0~1之间
-          return Math.abs(hash) / (Math.pow(2, 32) - 1);
-        }
-        msg.likes = Math.round(stringToFloat('random'+ msg.content)*10000);
-        return msg;})
       messages.value = res.data;
-      amount.value = Math.ceil(res.amount / pageSize);
+      amount.value = Math.ceil(res.amount / pageSize) || 1;
       store.commit('setLocalDemoValue', {demo: 'board', value: {messages: messages.value}});
       store.commit('setLocalDemoValue', {demo: 'board', value: {amount: amount.value}});
     })
@@ -79,7 +65,7 @@ async function sendMessage() {
     swal.tip('info', '不得为空')
     return;
   }
-  if (userInput.value.trim().length > 500) {
+  if (userInput.value.trim().length > 400) {
     swal.tip('error', '太长了！')
     return;
   }
@@ -146,7 +132,8 @@ onMounted(async () => {
     <div class="board-body">
       <div class="message-container" :class="{loading: pageLoading}">
         <Message v-for="msg in messages" :message="msg" @refresh-board="refreshBoard"/>
-        <div v-if="messages?.length === 0">正在加载...</div>
+        <div v-if="pageLoading && messages?.length !== 0">正在加载...</div>
+        <div v-else-if="messages?.length === 0">暂无留言</div>
       </div>
       <paging-controller :current-page="currentPage" :amount="amount" :go-page-func="goPage" :loading="pageLoading"/>
     </div>
@@ -204,6 +191,7 @@ onMounted(async () => {
   display: flex;
   flex-direction: column;
   justify-content: center;
+  align-items: center;
   gap: 15px;
   transition: opacity 0.2s ease;
 }
diff --git a/src/pages/demoPages/messageBoard/Message.vue b/src/pages/demoPages/messageBoard/Message.vue
index 6aea556..1e86039 100644
--- a/src/pages/demoPages/messageBoard/Message.vue
+++ b/src/pages/demoPages/messageBoard/Message.vue
@@ -62,6 +62,7 @@ async function deleteMessage(id, message) {
 
 <style scoped>
 .message {
+  width: calc(100% - 25px);
   display: flex;
   background: #333333;
   border-radius: 15px;
diff --git a/src/pages/demoPages/podExercise/Pod_page.vue b/src/pages/demoPages/podExercise/Pod_page.vue
index be60cec..e355de4 100644
--- a/src/pages/demoPages/podExercise/Pod_page.vue
+++ b/src/pages/demoPages/podExercise/Pod_page.vue
@@ -1,28 +1,10 @@
 <script setup>
 
-import {computed, ref} from "vue";
+import {computed, ref, onMounted} from "vue";
+import api from "../../../utils/axios.js";
+import {demoResourceURL} from "../../../utils/demoResource.js";
 
-const podList = ref([
-  {
-    title: 'MCQ 1',
-    categories: 'AP phy 1',
-    file: '250227',
-    describe: '',
-    date: '2025-2-26'
-  },{
-    title: 'MCQ 2',
-    categories: 'AP phy 1',
-    file: '250306',
-    describe: '',
-    date: '2025-2-27'
-  },{
-    title: 'MCQ 3',
-    categories: 'AP phy 1',
-    file: '250313',
-    describe: '',
-    date: '2025-3-6'
-  }
-])
+const podList = ref([])
 
 const uniqueCats = computed(() => {
   const keys = new Set();
@@ -31,22 +13,27 @@ const uniqueCats = computed(() => {
   });
   return Array.from(keys);
 });
+
+onMounted(async () => {
+  const response = await api.get(demoResourceURL('pod', "index.json"));
+  podList.value = response;
+})
 </script>
 
 <template>
-  <div class="container" v-if="/^\/demos\/pod\/?$/.test($route.path)">
+  <div class="container" v-if="/^\/demos\/pod\/?$/.test($route.path)" v-loading="podList.length === 0" element-loading-background="rgba(0, 0, 0, 0.5)">
     <h1>无限制做题大赛</h1>
-    <div class="pod-container" v-for="cat in uniqueCats">
-      <div class="folder">
-        <div class="folder-title">{{ cat }}</div>
-        <div class="pods-display">
-          <router-link class="pods" v-for="pod in podList" :to="`/demos/pod/quiz?cat=${pod.categories.toLowerCase().replaceAll(' ', '')}&id=${pod.file}`">
-            <div class="title">{{ pod.title }}</div>
-            <div class="date">{{ pod.date }}</div>
-          </router-link>
+      <div class="pod-container" v-for="cat in uniqueCats">
+        <div class="folder">
+          <div class="folder-title">{{ cat }}</div>
+          <div class="pods-display">
+            <router-link class="pods" v-for="pod in podList" :to="`/demos/pod/quiz?cat=${pod.categories.toLowerCase().replaceAll(' ', '')}&id=${pod.file}`">
+              <div class="title">{{ pod.title }}</div>
+              <div class="date">{{ pod.date }}</div>
+            </router-link>
+          </div>
         </div>
       </div>
-    </div>
   </div>
   <router-view v-else />
 </template>
diff --git a/src/pages/demoPages/podExercise/Quiz.vue b/src/pages/demoPages/podExercise/Quiz.vue
index fee7244..fba2f00 100644
--- a/src/pages/demoPages/podExercise/Quiz.vue
+++ b/src/pages/demoPages/podExercise/Quiz.vue
@@ -23,9 +23,12 @@
         </div>
       </div>
 
-      <!-- 提交按钮或下一题按钮 -->
+      <!-- 提交或下一题按钮 -->
       <button v-if="!submitted" @click="submitAnswer" class="submit-btn">提交答案</button>
       <button v-else @click="nextQuestion" class="next-btn">下一题</button>
+      <span>　</span>
+        <button v-if="!isLocked" @click="lockQuestion" class="lock-btn">锁定当前题目</button>
+        <button v-else @click="unlockQuestion" class="unlock-btn">解锁题目</button>
 
       <!-- 答题结果和解析 -->
       <div v-if="submitted" class="result">
@@ -47,7 +50,7 @@
             <h4>-- 题目 {{ index + 1 }} --</h4>
             <QuestionText :text="similar.text" :medias="data.medias"/>
             <p>正确答案：
-              <general-renderer :content-input="processMedia(similar.correctAnswer, data.medias)"></general-renderer>
+              <general-renderer :content-input="processMedia(similar.answers, data.medias)"></general-renderer>
             </p>
             <div v-if="similar.explanation" class="explanation">
               <h4>解题思路</h4>
@@ -86,6 +89,9 @@ import {demoResourceURL} from "../../../utils/demoResource.js";
 
 const route = useRoute()
 
+const isLocked = ref(false); // 是否处于锁定模式
+const lockedSimilarQuestions = ref([]); // 锁定时的相似题目列表
+
 // 响应式数据存储 JSON
 const data = reactive({
   itemtypes: [],
@@ -268,17 +274,18 @@ function generateNewExam() {
 function findSimilarQuestions() {
   const currentText = currentQuestion.value.text;
   const similar = [];
-  for (let i = 1; i < data.itemtypes.length; i++) {
+  for (let i = 1; i < data.texts.length; i++) {
     if (
-        calculateStringSimilarity(data.texts[i], currentText) > 50 && // 相似度
-        data.texts[i] !== currentQuestion.value.text// 不是当前题目
-        // similar.length < 2 // 最多选 2 道
+        calculateStringSimilarity(data.texts[i], currentText) > 50 &&
+        data.texts[i] !== currentText // 排除当前题目
     ) {
       const correctIdx = data.answerkeys[i].findIndex((key, idx) => idx > 0 && key === 1) - 1;
       similar.push({
         text: data.texts[i],
-        correctAnswer: data.answers[i][correctIdx + 1],
-        explanation: data.explanations[i]
+        answers: data.answers[i],
+        answerkeys: data.answerkeys[i],
+        explanation: data.explanations[i],
+        type: data.itemtypes[i]
       });
     }
   }
@@ -286,12 +293,44 @@ function findSimilarQuestions() {
 }
 
 function selectCurrentQuestion() {
-  if (questionCount.value <= totalQuestions.value) {
-    currentQuestion.value = examQuestions.value[questionCount.value - 1];
-    userAnswer.value = null;
-    submitted.value = false;
-    similarQuestions.value = [];
+  if (isLocked.value) {
+    // 锁定模式：从相似题目中随机选择
+    if (lockedSimilarQuestions.value.length > 0) {
+      const randomIndex = Math.floor(Math.random() * lockedSimilarQuestions.value.length);
+      currentQuestion.value = lockedSimilarQuestions.value[randomIndex];
+    } else {
+      swal.tip('info', '没有相似的题目可供选择，已自动解锁。');
+      isLocked.value = false;
+      selectCurrentQuestion(); // 递归调用以恢复正常模式
+    }
+  } else {
+    // 正常模式：从试卷题目列表中选择
+    if (questionCount.value <= totalQuestions.value) {
+      currentQuestion.value = examQuestions.value[questionCount.value - 1];
+    }
   }
+  userAnswer.value = null;
+  submitted.value = false;
+  similarQuestions.value = [];
+}
+function lockQuestion() {
+  if (currentQuestion.value) {
+    findSimilarQuestions(); // 获取相似题目
+    if (similarQuestions.value.length > 0) {
+      lockedSimilarQuestions.value = similarQuestions.value;
+      isLocked.value = true;
+      swal.tip('success', '题目已锁定，将显示相似题目。');
+    } else {
+      swal.tip('info', '没有找到相似题目，无法锁定。');
+    }
+  }
+}
+
+function unlockQuestion() {
+  isLocked.value = false;
+  lockedSimilarQuestions.value = [];
+  swal.tip('success', '已解锁，现在将显示正常题目。');
+  selectCurrentQuestion(); // 恢复正常题目
 }
 
 // 提交答案
@@ -322,12 +361,27 @@ function submitAnswer() {
 
 // 下一题
 function nextQuestion() {
-  if (questionCount.value < totalQuestions.value) {
-    questionCount.value++;
-    selectCurrentQuestion();
+  if (isLocked.value) {
+    // 锁定模式：从相似题目中随机选择
+    if (lockedSimilarQuestions.value.length > 0) {
+      const randomIndex = Math.floor(Math.random() * lockedSimilarQuestions.value.length);
+      currentQuestion.value = lockedSimilarQuestions.value[randomIndex];
+      userAnswer.value = null;
+      submitted.value = false;
+      similarQuestions.value = [];
+    } else {
+      swal.tip('info', '没有更多相似的题目，已解锁。');
+      unlockQuestion();
+    }
   } else {
-    swal.tip('success', '所有题目已完成！将生成新试卷。')
-    generateNewExam(); // 完成当前试卷后生成新试卷
+    // 正常模式：继续下一题或生成新试卷
+    if (questionCount.value < totalQuestions.value) {
+      questionCount.value++;
+      selectCurrentQuestion();
+    } else {
+      swal.tip('success', '所有题目已完成！将生成新试卷。');
+      generateNewExam();
+    }
   }
 }
 </script>
@@ -462,4 +516,23 @@ function nextQuestion() {
 .similar-question h4 {
   margin-bottom: 10px;
 }
+
+.lock-controls {
+  margin-top: 20px;
+}
+
+.lock-btn,
+.unlock-btn {
+  padding: 10px 20px;
+  background-color: #28a745;
+  color: white;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+}
+
+.lock-btn:hover,
+.unlock-btn:hover {
+  background-color: #218838;
+}
 </style>
\ No newline at end of file
diff --git a/src/pages/toolPages/RequestTester/requestTester_page.vue b/src/pages/toolPages/RequestTester/requestTester_page.vue
index d58c44f..1b03976 100644
--- a/src/pages/toolPages/RequestTester/requestTester_page.vue
+++ b/src/pages/toolPages/RequestTester/requestTester_page.vue
@@ -49,26 +49,19 @@
       <div class="form-group" v-if="method !== 'GET' && method !== 'DELETE' && bodyType === 'formdata'">
         <label>请求体 (FormData)</label>
         <div v-for="(item, index) in formDataItems" :key="index" class="formdata-item">
-          <!-- 键名 -->
           <input v-model="item.key" placeholder="键名" />
-
-          <!-- 类型选择 -->
           <select v-model="item.type" @change="resetValue(item)">
             <option value="pair">普通键值对</option>
             <option value="array">数组</option>
           </select>
-
-          <!-- 普通键值对输入 -->
           <div v-if="item.type === 'pair'">
             <input v-if="!item.isFile" v-model="item.value" placeholder="值" />
             <input v-else type="file" @change="handleFileChange(item, $event)" />
-            <div style="margin: 10px 0"/>
+            <div style="margin: 10px 0" />
             <button @click="item.isFile = !item.isFile">
               {{ item.isFile ? '切换为文本' : '切换为文件' }}
             </button>
           </div>
-
-          <!-- 数组输入 -->
           <div v-if="item.type === 'array'">
             <div v-for="(val, valIndex) in item.value" :key="valIndex" class="array-item">
               <input v-if="!val.isFile" v-model="val.content" placeholder="数组值" />
@@ -80,8 +73,6 @@
             </div>
             <button @click="addArrayItem(item)">添加数组项</button>
           </div>
-
-          <!-- 删除键值对 -->
           <button @click="removeFormDataItem(index)">删除键值对</button>
         </div>
         <button @click="addFormDataItem">添加键值对</button>
@@ -114,21 +105,29 @@
     <!-- 右侧储存栏 -->
     <div class="storage-area">
       <h3>储存栏</h3>
+      <div class="preset-actions">
+        <input v-model="importPresetString" placeholder="粘贴Base64预设字符串以导入" />
+        <button @click="importPreset" style="width: 100px">导入预设</button>
+      </div>
       <div v-if="!requestTesterPresets || Object.keys(requestTesterPresets).length === 0">暂无预设</div>
       <div v-else v-for="(preset, name) in requestTesterPresets" :key="name" class="preset-item">
         <span @click="loadPreset(name)" class="preset-name">{{ name }}</span>
-        <button @click="deletePreset(name)">删除</button>
+        <div class="preset-buttons">
+          <button @click="exportPreset(name)">导出</button>
+          <button @click="renamePreset(name)">重命名</button>
+          <button @click="deletePreset(name)">删除</button>
+        </div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import { ref, computed } from 'vue';
-import { useStore } from 'vuex';
+import {ref, computed} from 'vue';
+import {useStore} from 'vuex';
 import axios from 'axios';
 import Swal from 'sweetalert2';
-import swal from "../../../utils/sweetalert.js";
+import swal from '../../../utils/sweetalert.js';
 
 export default {
   name: 'RequestTester',
@@ -138,46 +137,43 @@ export default {
     // 数据定义
     const url = ref('');
     const method = ref('GET');
-    const headers = ref([{ key: '', value: '' }]);
-    const bodyType = ref('json'); // 请求体类型：json 或 formdata
-    const body = ref(''); // JSON 文本
-    const formDataItems = ref([]); // FormData 键值对
-    const params = ref([{ key: '', value: '' }]);
+    const headers = ref([{key: '', value: ''}]);
+    const bodyType = ref('json');
+    const body = ref('');
+    const formDataItems = ref([]);
+    const params = ref([{key: '', value: ''}]);
     const response = ref(null);
+    const importPresetString = ref('');
 
-    // 从 Vuex 获取 requestTester 的预设
+    // Vuex 预设数据
     const requestTesterPresets = computed(() => store.state.demosLocal.requestTester || {});
 
     // 请求头操作
-    const addHeader = () => headers.value.push({ key: '', value: '' });
+    const addHeader = () => headers.value.push({key: '', value: ''});
     const removeHeader = (index) => headers.value.splice(index, 1);
 
     // 查询参数操作
-    const addParam = () => params.value.push({ key: '', value: '' });
+    const addParam = () => params.value.push({key: '', value: ''});
     const removeParam = (index) => params.value.splice(index, 1);
 
-    // FormData 键值对操作
+    // FormData 操作
     const addFormDataItem = () => {
-      formDataItems.value.push({ key: '', type: 'pair', value: '', isFile: false });
-    };
-    const removeFormDataItem = (index) => {
-      formDataItems.value.splice(index, 1);
+      formDataItems.value.push({key: '', type: 'pair', value: '', isFile: false});
     };
+    const removeFormDataItem = (index) => formDataItems.value.splice(index, 1);
     const resetValue = (item) => {
       if (item.type === 'pair') {
         item.value = '';
         item.isFile = false;
       } else if (item.type === 'array') {
-        item.value = [{ content: '', isFile: false }];
+        item.value = [{content: '', isFile: false}];
       }
     };
     const addArrayItem = (item) => {
       if (!item.value) item.value = [];
-      item.value.push({ content: '', isFile: false });
-    };
-    const removeArrayItem = (item, index) => {
-      item.value.splice(index, 1);
+      item.value.push({content: '', isFile: false});
     };
+    const removeArrayItem = (item, index) => item.value.splice(index, 1);
     const handleFileChange = (item, event) => {
       item.value = event.target.files[0];
     };
@@ -187,16 +183,13 @@ export default {
 
     // 发送请求
     const sendRequest = async () => {
-      response.value = '等待响应...'; // 发送请求前显示“等待响应”
-
+      response.value = '等待响应...';
       try {
         let finalUrl = url.value;
         const headersObj = headers.value.reduce((acc, h) => {
           if (h.key && h.value) acc[h.key] = h.value;
           return acc;
         }, {});
-
-        // 处理查询参数
         const queryParams = params.value
             .filter((p) => p.key && p.value)
             .reduce((acc, p) => {
@@ -211,7 +204,6 @@ export default {
           params: queryParams,
         };
 
-        // 处理请求体
         if (method.value !== 'GET' && method.value !== 'DELETE') {
           if (bodyType.value === 'json') {
             axiosConfig.data = body.value ? JSON.parse(body.value) : {};
@@ -226,9 +218,7 @@ export default {
                   formData.append(item.key, item.value);
                 } else if (item.type === 'array' && item.value.length) {
                   item.value.forEach((val) => {
-                    if (val.content) {
-                      formData.append(item.key + '[]', val.content);
-                    }
+                    if (val.content) formData.append(item.key + '[]', val.content);
                   });
                 }
               }
@@ -259,7 +249,7 @@ export default {
 
       if (!result.isConfirmed) return;
 
-      const presetName = result.value;
+      let presetName = result.value;
       const preset = {
         url: url.value,
         method: method.value,
@@ -269,15 +259,58 @@ export default {
         formDataItems: formDataItems.value.map((item) => ({
           key: item.key,
           type: item.type,
-          value: item.type === 'pair' ? (item.isFile ? 'File' : item.value) : item.value.map((v) => (v.isFile ? 'File' : v.content)),
-        })), // 仅保存文件名或文本
+          value: item.type === 'pair'
+              ? (item.isFile ? '[[FILE]]' : item.value)
+              : item.value.map((v) => (v.isFile ? '[[FILE]]' : v.content)),
+          isFile: item.type === 'pair' ? item.isFile : undefined,
+        })),
         params: [...params.value],
       };
 
+      // 检查是否已有同名预设
+      if (requestTesterPresets.value[presetName]) {
+        const overwriteResult = await Swal.fire({
+          title: '预设名称已存在',
+          text: `预设 "${presetName}" 已存在，您想覆盖它还是保存为新名称？`,
+          showCancelButton: true,
+          showDenyButton: true,
+          confirmButtonText: '覆盖',
+          denyButtonText: '保存为新名称',
+          cancelButtonText: '取消',
+        });
+
+        if (overwriteResult.isDismissed) return; // 用户取消
+
+        if (overwriteResult.isDenied) {
+          // 保存为新名称
+          const newNameResult = await Swal.fire({
+            title: '请输入新预设名称',
+            input: 'text',
+            inputValue: presetName,
+            inputLabel: '新预设名称',
+            inputPlaceholder: '请输入新的预设名称...',
+            showCancelButton: true,
+            cancelButtonText: '取消',
+            confirmButtonText: '确定',
+            inputValidator: (value) => {
+              if (!value) return '预设名称不能为空！';
+              if (value !== presetName && requestTesterPresets.value[value]) {
+                return '此名称已被使用，请选择其他名称！';
+              }
+            },
+          });
+
+          if (!newNameResult.isConfirmed) return;
+          presetName = newNameResult.value;
+        }
+        // 如果选择覆盖，则直接继续保存，不修改 presetName
+      }
+
       store.commit('setLocalDemoValue', {
         demo: 'requestTester',
-        value: { [presetName]: preset },
+        value: {[presetName]: preset},
       });
+      swal.tip('success', '预设已保存');
     };
 
     // 加载预设
@@ -292,24 +325,158 @@ export default {
         formDataItems.value = preset.formDataItems.map((item) => ({
           key: item.key,
           type: item.type,
-          value: item.type === 'pair' ? '' : [], // 加载时重置文件和数组内容
-          isFile: item.type === 'pair' && item.value === 'File',
+          value: item.type === 'pair'
+              ? (item.value === '[[FILE]]' ? '' : item.value)
+              : item.value.map((v) => ({content: v === '[[FILE]]' ? '' : v, isFile: v === '[[FILE]]'})),
+          isFile: item.type === 'pair' ? item.isFile || item.value === '[[FILE]]' : undefined,
         }));
         params.value = [...preset.params];
         response.value = null;
+        if (preset.formDataItems.some((item) =>
+            (item.type === 'pair' && item.value === '[[FILE]]') ||
+            (item.type === 'array' && item.value.includes('[[FILE]]'))
+        )) {
+          swal.tip('info', '此预设包含文件，请重新选择文件');
+        }
       }
     };
 
     // 删除预设
     const deletePreset = (name) => {
-      swal.window('info', '确定删除?', `删除预设"${name}"`, '确定', '取消').then(result => {
+      swal.window('info', '确定删除?', `删除预设"${name}"`, '确定', '取消').then((result) => {
         if (result.isConfirmed) {
           store.commit('deleteLocalDemoValue', {
             demo: 'requestTester',
             value: name,
           });
+          swal.tip('success', '预设已删除');
         }
-      })
+      });
+    };
+
+    // 导出预设
+    const exportPreset = (name) => {
+      const preset = requestTesterPresets.value[name];
+      if (preset) {
+        const exportData = { [name]: preset };
+        const jsonString = JSON.stringify(exportData);
+        const base64String = btoa(unescape(encodeURIComponent(jsonString)));
+        navigator.clipboard.writeText(base64String).then(() => {
+          Swal.fire({
+            title: '导出成功',
+            html: `<div style="max-height: 300px; overflow: auto; background: #f5f5f5; padding: 10px; border-radius: 4px;">${base64String}</div>`,
+            confirmButtonText: '关闭',
+          }).then(() => {
+            swal.tip('success', '预设已复制到剪切板');
+          });
+        }).catch(() => {
+          Swal.fire({
+            title: '导出成功（复制失败）',
+            html: `<div style="max-height: 300px; overflow: auto; background: #f5f5f5; padding: 10px; border-radius: 4px;">${base64String}</div>`,
+            confirmButtonText: '关闭',
+          });
+        });
+      }
+    };
+
+    // 导入预设
+    const importPreset = async () => {
+      try {
+        const decodedString = decodeURIComponent(escape(atob(importPresetString.value)));
+        const importedData = JSON.parse(decodedString);
+        const presetName = Object.keys(importedData)[0];
+        if (!presetName) throw new Error('无效的预设格式');
+
+        // 检查是否已有同名预设
+        if (requestTesterPresets.value[presetName]) {
+          const overwriteResult = await Swal.fire({
+            title: '预设名称已存在',
+            text: `预设 "${presetName}" 已存在，您想覆盖它还是导入为新名称？`,
+            showCancelButton: true,
+            showDenyButton: true,
+            confirmButtonText: '覆盖',
+            denyButtonText: '导入为新名称',
+            cancelButtonText: '取消',
+          });
+
+          if (overwriteResult.isDismissed) return; // 用户取消
+
+          if (overwriteResult.isDenied) {
+            // 导入为新名称
+            const newNameResult = await Swal.fire({
+              title: '请输入新预设名称',
+              input: 'text',
+              inputValue: presetName,
+              inputLabel: '新预设名称',
+              inputPlaceholder: '请输入新的预设名称...',
+              showCancelButton: true,
+              cancelButtonText: '取消',
+              confirmButtonText: '确定',
+              inputValidator: (value) => {
+                if (!value) return '预设名称不能为空！';
+                if (value !== presetName && requestTesterPresets.value[value]) {
+                  return '此名称已被使用，请选择其他名称！';
+                }
+              },
+            });
+
+            if (!newNameResult.isConfirmed) return;
+            const newPresetName = newNameResult.value;
+            const newImportedData = { [newPresetName]: importedData[presetName] };
+            store.commit('setLocalDemoValue', {
+              demo: 'requestTester',
+              value: newImportedData,
+            });
+          } else if (overwriteResult.isConfirmed) {
+            // 覆盖现有预设
+            store.commit('setLocalDemoValue', {
+              demo: 'requestTester',
+              value: importedData,
+            });
+          }
+        } else {
+          // 无重名，直接导入
+          store.commit('setLocalDemoValue', {
+            demo: 'requestTester',
+            value: importedData,
+          });
+        }
+
+        importPresetString.value = '';
+        swal.tip('success', '预设已导入');
+      } catch (error) {
+        swal.tip('error', '导入失败，请检查Base64预设字符串格式');
+      }
+    };
+
+    // 重命名预设
+    const renamePreset = async (oldName) => {
+      const result = await Swal.fire({
+        title: '重命名预设',
+        input: 'text',
+        inputLabel: '新预设名称',
+        inputValue: oldName,
+        showCancelButton: true,
+        cancelButtonText: '取消',
+        confirmButtonText: '确定',
+        inputValidator: (value) => !value && '预设名称不能为空！',
+      });
+
+      if (!result.isConfirmed) return;
+
+      const newName = result.value;
+      if (newName === oldName) return;
+
+      const preset = requestTesterPresets.value[oldName];
+      store.commit('setLocalDemoValue', {
+        demo: 'requestTester',
+        value: {[newName]: preset},
+      });
+      store.commit('deleteLocalDemoValue', {
+        demo: 'requestTester',
+        value: oldName,
+      });
+      swal.tip('success', '预设已重命名');
     };
 
     return {
@@ -322,6 +489,7 @@ export default {
       params,
       response,
       requestTesterPresets,
+      importPresetString,
       addHeader,
       removeHeader,
       addParam,
@@ -337,13 +505,15 @@ export default {
       savePreset,
       loadPreset,
       deletePreset,
+      exportPreset,
+      importPreset,
+      renamePreset,
     };
   },
 };
 </script>
 
 <style scoped>
-/* 默认深色模式 */
 :root {
   --bg-color: #2c2c2c;
   --text-color: #ffffff;
@@ -353,7 +523,6 @@ export default {
   --button-hover: #357abd;
 }
 
-/* 浅色模式 */
 .theme-light {
   --bg-color: #ffffff;
   --text-color: #333333;
@@ -365,7 +534,6 @@ export default {
 
 .request-tester {
   display: flex;
-
   max-width: 1200px;
   width: 100%;
   height: calc(100vh - 60px);
@@ -401,7 +569,7 @@ textarea {
   width: 100%;
   padding: 8px;
   background-color: var(--input-bg);
-  border: 1px solid var(--border-color);
+  border: 1px solid gray;
   color: var(--text-color);
   border-radius: 4px;
 }
@@ -449,6 +617,7 @@ button {
   border-radius: 4px;
   cursor: pointer;
 }
+
 .theme-light button {
   color: black;
 }
@@ -491,4 +660,15 @@ button:hover {
 .preset-name:hover {
   text-decoration: underline;
 }
+
+.preset-actions {
+  margin-bottom: 15px;
+  display: flex;
+  gap: 10px;
+}
+
+.preset-buttons {
+  display: flex;
+  gap: 5px;
+}
 </style>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 99bc434..ae9f0d1 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,159 +1,153 @@
-import {createRouter, createWebHistory} from 'vue-router';
+import { createRouter, createWebHistory } from 'vue-router';
 import store from '../store';
 import AuthService from "../../services/auth.js";
-import Home from '../pages/Home.vue';
-import Login from "../pages/Login.vue";
-import Blog_home from "../pages/Blog_home.vue";
-
-import Account from "../pages/accountPages/Account.vue";
-import Account_selfpage from "../pages/accountPages/Account_selfpage.vue";
-import Account_worksmanage from "../pages/accountPages/Account_worksmanage.vue";
-import Account_setting from "../pages/accountPages/Account_setting.vue";
-import Account_draft from "../pages/accountPages/Account_draft.vue";
-import Account_userInfo from "../pages/accountPages/Account_userInfo.vue";
-import Account_admin_uploadLog from "../pages/accountPages/Account_admin_uploadLog.vue";
-import Account_admin_userManage from "../pages/accountPages/Account_admin_userManage.vue";
-
-import Projects from "../pages/Projects_home.vue";
-
-import Demos_home from "../pages/Demos_home.vue";
-import Board_page from "../pages/demoPages/messageBoard/Board_page.vue";
-import Pod_page from "../pages/demoPages/podExercise/Pod_page.vue";
-import Pod_quiz from "../pages/demoPages/podExercise/Quiz.vue";
-
-import Tools_home from "../pages/Tools_home.vue";
-import GpaCalculator_page from "../pages/toolPages/gpaCalculator/gpaCalculator_page.vue";
-import PdfEx_page from "../pages/toolPages/pdfExtractor/pdfEx_page.vue";
-import RequestTester_page from "../pages/toolPages/RequestTester/requestTester_page.vue";
-
-import About from "../pages/About.vue";
-import Editor from "../pages/blogPages/blogEditor.vue";
-import NotFound from "../pages/errorPages/notFound.vue";
-
-import Test_page from "../pages/Test_page.vue";
-import SingleBlog_page from "../pages/blogPages/SingleBlog_page.vue";
-import SubmitBlog_page from "../pages/blogPages/submitBlogPages/SubmitBlog_page.vue";
 import swal from "../utils/sweetalert.js";
-import GunGame_page from "../pages/demoPages/gunGame/gunGame_page.vue";
 import api from "../utils/axios.js";
-import EmailVerify from "../pages/EmailVerify.vue";
+
+// 直接引入组件
+import NotFound from '../pages/errorPages/notFound.vue';
+import Home from '../pages/Home.vue';
+import Login from '../pages/Login.vue';
+import EmailVerify from '../pages/EmailVerify.vue';
+import BlogHome from '../pages/Blog_home.vue';
+import SingleBlog from '../pages/blogPages/SingleBlog_page.vue';
+import SubmitBlog from '../pages/blogPages/submitBlogPages/SubmitBlog_page.vue';
+import ProjectsHome from '../pages/Projects_home.vue';
+import DemosHome from '../pages/Demos_home.vue';
+import About from '../pages/About.vue';
+import Account from '../pages/accountPages/Account.vue';
+import AccountSelfPage from '../pages/accountPages/Account_selfpage.vue';
+import AccountWorksManage from '../pages/accountPages/Account_worksmanage.vue';
+import AccountDraft from '../pages/accountPages/Account_draft.vue';
+import AccountSetting from '../pages/accountPages/Account_setting.vue';
+import AccountUserInfo from '../pages/accountPages/Account_userInfo.vue';
+import AccountAdminUploadLog from '../pages/accountPages/Account_admin_uploadLog.vue';
+import AccountAdminUserManage from '../pages/accountPages/Account_admin_userManage.vue';
+import BlogEditor from '../pages/blogPages/blogEditor.vue';
+import TestPage from '../pages/Test_page.vue';
 
 const routes = [
     {
         path: '/404',
         name: '404',
         component: NotFound,
-        meta: {title: '404'}
+        meta: { title: '404' }
     }, {
         path: '/',
         name: 'Home',
         component: Home,
-        meta: {title: '首页'}
+        meta: { title: '首页' }
     }, {
         path: '/login',
         name: 'Login',
         component: Login,
-        meta: {title: '登录'}
+        meta: { title: '登录' }
     }, {
         path: '/verify',
         name: 'EmailVerify',
         component: EmailVerify,
-        meta: {title: '注册成功'}
+        meta: { title: '注册成功' }
     }, {
         path: '/blog',
         name: 'Blog',
-        component: Blog_home,
-        meta: {title: '博客'}
+        component: BlogHome,
+        meta: { title: '博客' }
     }, {
         path: '/blog/:id',
         name: 'Blogs',
-        component: SingleBlog_page,
-        meta: {title: '博客'}
+        component: SingleBlog,
+        meta: { title: '博客' }
     }, {
         path: '/blog/submit',
         name: 'SubmitBlog',
-        component: SubmitBlog_page,
-        meta: {title: '发布博客'}
-    },{
+        component: SubmitBlog,
+        meta: { title: '发布博客' }
+    }, {
         path: '/projects',
         name: 'Projects',
-        component: Projects,
-        meta: {title: '项目'}
+        component: ProjectsHome,
+        meta: { title: '项目' }
     }, {
         path: '/demos',
         name: 'Demos',
-        component: Demos_home,
-        meta: {title: '实例'},
+        component: DemosHome,
+        meta: { title: '实例' },
         children: [
             {
                 path: "board",
-                component: Board_page,
-                meta: {title: '留言板'},
+                component: () => import('../pages/demoPages/messageBoard/Board_page.vue'),
+                meta: { title: '留言板' },
             },
             {
                 path: "pod",
-                component: Pod_page,
-                meta: {title: '做题'},
+                component: () => import('../pages/demoPages/podExercise/Pod_page.vue'),
+                meta: { title: '做题' },
                 children: [
-                    {path: "quiz", component: Pod_quiz}
+                    { path: "quiz", component: () => import('../pages/demoPages/podExercise/Quiz.vue') }
                 ]
             },
             {
                 path: "gungame3d",
-                component: GunGame_page,
-                meta: {title: '打枪   '},
+                component: () => import('../pages/demoPages/gunGame/gunGame_page.vue'),
+                meta: { title: '打枪' },
+            },
+            {
+                path: "file-sharing",
+                component: () => import('../pages/demoPages/fileSharing/Sharing_page.vue'),
+                meta: { title: '文件共享' },
             },
         ]
     }, {
         path: '/tools',
         name: 'Tools',
-        component: Tools_home,
-        meta: {title: '小工具'},
+        component: () => import('../pages/Tools_home.vue'),
+        meta: { title: '小工具' },
         children: [
-            {path: "1", component: GpaCalculator_page},
-            {path: "gpa", component: GpaCalculator_page},
-            {path: "2", component: PdfEx_page},
-            {path: "pdf-extractor", component: PdfEx_page},
-            {path: "3", component: RequestTester_page},
-            {path: "request-tester", component: RequestTester_page},
+            { path: "1", component: () => import('../pages/toolPages/gpaCalculator/gpaCalculator_page.vue') },
+            { path: "gpa", component: () => import('../pages/toolPages/gpaCalculator/gpaCalculator_page.vue') },
+            { path: "2", component: () => import('../pages/toolPages/pdfExtractor/pdfEx_page.vue') },
+            { path: "pdf-extractor", component: () => import('../pages/toolPages/pdfExtractor/pdfEx_page.vue') },
+            { path: "3", component: () => import('../pages/toolPages/RequestTester/requestTester_page.vue') },
+            { path: "request-tester", component: () => import('../pages/toolPages/RequestTester/requestTester_page.vue') },
         ]
     }, {
         path: '/about',
         name: 'About',
         component: About,
-        meta: {title: '关于'},
+        meta: { title: '关于' },
     }, {
         path: '/account',
         component: Account,
-        meta: {title: '账户'},
+        meta: { title: '账户' },
         children: [
-            {path: 'self-page', component: Account_selfpage},
-            {path: 'works-manage', component: Account_worksmanage},
-            {path: 'draft', component: Account_draft},
-            {path: 'setting', component: Account_setting},
-            {path: '', component: Account_userInfo},
-            {path: 'upload-log', component: Account_admin_uploadLog},
-            {path: 'user-management', component: Account_admin_userManage}
+            { path: 'self-page', component: AccountSelfPage },
+            { path: 'works-manage', component: AccountWorksManage },
+            { path: 'draft', component: AccountDraft },
+            { path: 'setting', component: AccountSetting },
+            { path: '', component: AccountUserInfo },
+            { path: 'upload-log', component: AccountAdminUploadLog },
+            { path: 'user-management', component: AccountAdminUserManage }
         ]
     }, {
         path: '/editor',
         name: 'Editor',
-        component: Editor,
-        meta: {title: '编辑器'},
-    },{
+        component: BlogEditor,
+        meta: { title: '编辑器' },
+    }, {
         path: '/test_page',
         name: 'Test',
-        component: Test_page,
-        meta: {title: '测试页'},
+        component: TestPage,
+        meta: { title: '测试页' },
     },
 ];
 
+// 其余代码保持不变
 const router = createRouter({
     history: createWebHistory(),
     routes
 });
 
-let previousRoute = null
+let previousRoute = null;
 router.beforeEach(async (to, from, next) => {
     previousRoute = from;
 
@@ -162,11 +156,6 @@ router.beforeEach(async (to, from, next) => {
         store.state.isViewCounted = true;
     }
 
-
-    if (/^\/demos\/?$/.test(to.path)) {
-        next('/404');
-    }
-
     if (!store.state.userInfo.uid && store.state.token) {
         AuthService.setSelfInfo();
     }
@@ -198,13 +187,14 @@ router.beforeEach(async (to, from, next) => {
 
     const title = to.meta?.title;
     if (title) {
-        document.title = title + ' CYBER'; // 设置页面标题
+        document.title = title + ' CYBER';
     }
 
     next();
 });
+
 export function getPreviousRoute() {
-    return previousRoute
+    return previousRoute;
 }
 
 export default router;
\ No newline at end of file
