Merge pull request '解决了不跟手问题' (#8) from feature/slide-captcha into main

Reviewed-on: #8

src/app/auth/page.tsx

@@ -662,8 +662,6 @@ export default function AuthPage() {
               )}
             </AnimatePresence>
 
-
-
             {/* Submit Button */}
             <motion.div
               initial={{ opacity: 0, y: 20 }}
@@ -770,4 +768,4 @@ export default function AuthPage() {
 
     </div>
   );
-}
+}

src/components/SliderCaptcha.tsx

@@ -409,7 +409,7 @@ export const SliderCaptcha: React.FC<SliderCaptchaProps> = ({ onVerify, onClose
                             {/* 可移动拼图块 */}
                             {puzzleImage && (
                                 <div
-                                    className="absolute transition-all duration-300"
+                                    className={`absolute ${isDragging ? '' : 'transition-all duration-300'}`}
                                     style={{
                                         left: `${sliderPosition}px`, // 滑块x位置（拼图左上角x坐标）
                                         top: `${puzzleY}px`, // 拼图y位置（从后端获取，拼图左上角y坐标）
@@ -435,7 +435,7 @@ export const SliderCaptcha: React.FC<SliderCaptchaProps> = ({ onVerify, onClose
                     <div className="relative bg-gray-100 rounded-full h-12 overflow-hidden select-none" ref={trackRef} style={{ width: `${TRACK_WIDTH}px`, margin: '0 auto' }}>
                         {/* 进度条 */}
                         <div
-                            className={`absolute left-0 top-0 h-full transition-all duration-200 ease-out ${getProgressColor()}`}
+                            className={`absolute left-0 top-0 h-full ${isDragging ? '' : 'transition-all duration-200 ease-out'} ${getProgressColor()}`}
                             style={{
                                 width: `${sliderPosition + SLIDER_WIDTH}px`,
                                 transform: isDragging ? 'scaleY(1.05)' : 'scaleY(1)',
@@ -444,7 +444,7 @@ export const SliderCaptcha: React.FC<SliderCaptchaProps> = ({ onVerify, onClose
                         />
                         {/* 滑块按钮 */}
                         <div
-                            className={`absolute top-1 w-10 h-10 bg-white rounded-full shadow-lg cursor-pointer flex items-center justify-center transition-all duration-200 ease-out select-none ${
+                            className={`absolute top-1 w-10 h-10 bg-white rounded-full shadow-lg cursor-pointer flex items-center justify-center ${isDragging ? '' : 'transition-all duration-200 ease-out'} select-none ${
                                 isDragging ? 'scale-110 shadow-xl' : 'scale-100'
                             } ${isVerified || verifyResult === 'error' ? 'cursor-default' : 'cursor-grab active:cursor-grabbing'}`}
                             style={{ left: `${sliderPosition + 2}px`, zIndex: 10 }}