slider-captcha-sdk 1.0.17 → 1.0.19

package/dist/slider-captcha.esm.js

@@ -8,22 +8,22 @@ class PopupSliderCaptcha {
     sliderSize: 38,
     maxRetries: 3,
     timeout: 30000,
-    apiUrl: "/api/captcha",
-    verifyUrl: "/api/captcha/verify",
+    apiUrl: '/api/captcha',
+    verifyUrl: '/api/captcha/verify',
     throttleDelay: 16,
-    clickMaskClose: false
+    clickMaskClose: false,
   }
 
   static CSS_CLASSES = {
-    overlay: "slider-captcha-overlay",
-    modal: "slider-captcha-modal",
-    header: "slider-captcha-header",
-    container: "slider-captcha-container",
-    track: "slider-captcha-track",
-    btn: "slider-captcha-btn",
-    hint: "slider-captcha-hint",
-    loading: "slider-captcha-loading",
-    error: "slider-captcha-error"
+    overlay: 'slider-captcha-overlay',
+    modal: 'slider-captcha-modal',
+    header: 'slider-captcha-header',
+    container: 'slider-captcha-container',
+    track: 'slider-captcha-track',
+    btn: 'slider-captcha-btn',
+    hint: 'slider-captcha-hint',
+    loading: 'slider-captcha-loading',
+    error: 'slider-captcha-error',
   }
 
   // 优化：提取CSS样式为独立方法，减少主体代码长度
@@ -37,29 +37,26 @@ class PopupSliderCaptcha {
     MAX_RETRY_ATTEMPTS: 3,
     DEFAULT_TIMEOUT: 30000,
     FLOATING_TIME_DURATION: 2500,
-    THROTTLE_DELAY: 16
+    THROTTLE_DELAY: 16,
   }
 
-  // 优化：添加错误类型枚举
   static ERROR_TYPES = {
     NETWORK_ERROR: 'NETWORK_ERROR',
     TIMEOUT_ERROR: 'TIMEOUT_ERROR',
     VALIDATION_ERROR: 'VALIDATION_ERROR',
     IMAGE_LOAD_ERROR: 'IMAGE_LOAD_ERROR',
-    CAPTCHA_DATA_ERROR: 'CAPTCHA_DATA_ERROR'
+    CAPTCHA_DATA_ERROR: 'CAPTCHA_DATA_ERROR',
   }
 
   constructor(options = {}) {
-    // 优化：合并默认配置，使用常量
     this.options = {
       ...PopupSliderCaptcha.DEFAULTS,
       ...options,
       timeout: options.timeout || PopupSliderCaptcha.CONSTANTS.DEFAULT_TIMEOUT,
       maxRetries: options.maxRetries || PopupSliderCaptcha.CONSTANTS.MAX_RETRY_ATTEMPTS,
-      throttleDelay: options.throttleDelay || PopupSliderCaptcha.CONSTANTS.THROTTLE_DELAY
+      throttleDelay: options.throttleDelay || PopupSliderCaptcha.CONSTANTS.THROTTLE_DELAY,
     };
 
-    // 优化：初始化所有属性
     this.elements = {};
     this.state = this.createInitialState();
     this.captchaData = null;
@@ -72,10 +69,8 @@ class PopupSliderCaptcha {
     this.imageCache = new Map();
     this.abortController = null;
 
-    // 优化：使用箭头函数绑定this，避免重复bind调用
     this.throttledHandleMove = this.throttle((e) => this.handleMove(e), this.options.throttleDelay);
 
-    // 优化：添加错误处理
     try {
       this.init();
     } catch (error) {
@@ -84,7 +79,6 @@ class PopupSliderCaptcha {
     }
   }
 
-  // 优化：提取初始状态创建为独立方法
   createInitialState() {
     return {
       isVisible: false,
@@ -92,7 +86,7 @@ class PopupSliderCaptcha {
       currentX: 0,
       startX: 0,
       retryCount: 0,
-      isLoading: false
+      isLoading: false,
     }
   }
 
@@ -103,15 +97,14 @@ class PopupSliderCaptcha {
   }
 
   injectStyles() {
-    if (document.querySelector("#slider-captcha-styles")) return
+    if (document.querySelector('#slider-captcha-styles')) return
 
-    const style = document.createElement("style");
-    style.id = "slider-captcha-styles";
+    const style = document.createElement('style');
+    style.id = 'slider-captcha-styles';
     style.textContent = PopupSliderCaptcha.getStyles();
     document.head.appendChild(style);
   }
 
-  // 优化：简化元素创建逻辑
   createElements() {
     const { elements, options } = this;
 
@@ -133,7 +126,7 @@ class PopupSliderCaptcha {
       ['btn', 'div', PopupSliderCaptcha.CSS_CLASSES.btn],
       ['icon', 'div', '', '→'],
       ['hint', 'div', PopupSliderCaptcha.CSS_CLASSES.hint, '向右滑动完成验证'],
-      ['error', 'div', PopupSliderCaptcha.CSS_CLASSES.error]
+      ['error', 'div', PopupSliderCaptcha.CSS_CLASSES.error],
     ];
 
     // 批量创建元素
@@ -151,19 +144,18 @@ class PopupSliderCaptcha {
     this.setInitialState();
   }
 
-  createElement(tag, className = "", textContent = "") {
+  createElement(tag, className = '', textContent = '') {
     const element = document.createElement(tag);
     if (className) element.className = className;
     if (textContent) element.textContent = textContent;
     return element
   }
 
-  // 优化：简化DOM组装逻辑
   assembleDOM() {
     const { elements } = this;
 
     // 组装头部
-    const headerButtons = this.createElement("div", "slider-captcha-header-buttons");
+    const headerButtons = this.createElement('div', 'slider-captcha-header-buttons');
     headerButtons.append(elements.refreshBtn, elements.closeBtn);
     elements.header.append(elements.title, headerButtons);
 
@@ -172,24 +164,15 @@ class PopupSliderCaptcha {
       elements.backgroundImg,
       elements.sliderImg,
       elements.loadingText,
-      elements.floatingTime
+      elements.floatingTime,
     );
 
     // 组装滑块轨道
     elements.btn.appendChild(elements.icon);
-    elements.track.append(
-      elements.fingerAnimation,
-      elements.btn,
-      elements.hint
-    );
+    elements.track.append(elements.fingerAnimation, elements.btn, elements.hint);
 
     // 组装模态框
-    elements.modal.append(
-      elements.header,
-      elements.container,
-      elements.track,
-      elements.error
-    );
+    elements.modal.append(elements.header, elements.container, elements.track, elements.error);
 
     // 组装到覆盖层
     elements.overlay.appendChild(elements.modal);
@@ -198,24 +181,23 @@ class PopupSliderCaptcha {
 
   setInitialState() {
     // 批量设置初始状态
-    Object.assign(this.elements.container.style, { display: "none" });
-    Object.assign(this.elements.track.style, { display: "none" });
+    Object.assign(this.elements.container.style, { display: 'none' });
+    Object.assign(this.elements.track.style, { display: 'none' });
   }
 
-  // 优化：简化事件绑定
   bindEvents() {
     const { elements } = this;
 
     // 基础事件
-    this.addEventListener(elements.closeBtn, "click", () => this.hide());
-    this.addEventListener(elements.refreshBtn, "click", () => this.refresh());
-    this.addEventListener(elements.overlay, "click", (e) => {
+    this.addEventListener(elements.closeBtn, 'click', () => this.hide());
+    this.addEventListener(elements.refreshBtn, 'click', () => this.refresh());
+    this.addEventListener(elements.overlay, 'click', (e) => {
       if (e.target === elements.overlay && this.options.clickMaskClose) this.hide();
     });
-    this.addEventListener(document, "keydown", (e) => {
-      if (e.key === "Escape" && this.state.isVisible) this.hide();
+    this.addEventListener(document, 'keydown', (e) => {
+      if (e.key === 'Escape' && this.state.isVisible) this.hide();
     });
-    this.addEventListener(document, "visibilitychange", () => this.handleVisibilityChange());
+    this.addEventListener(document, 'visibilitychange', () => this.handleVisibilityChange());
 
     this.bindSliderEvents();
   }
@@ -225,21 +207,20 @@ class PopupSliderCaptcha {
     const handlers = {
       start: (e) => this.handleStart(e),
       move: this.throttledHandleMove,
-      end: () => this.handleEnd()
+      end: () => this.handleEnd(),
     };
 
     // 滑块事件
-    this.addEventListener(elements.btn, "mousedown", handlers.start);
-    this.addEventListener(elements.btn, "touchstart", handlers.start);
-    this.addEventListener(elements.sliderImg, "mousedown", handlers.start);
-    this.addEventListener(elements.sliderImg, "touchstart", handlers.start);
-    this.addEventListener(document, "mousemove", handlers.move, { passive: false });
-    this.addEventListener(document, "touchmove", handlers.move, { passive: false });
-    this.addEventListener(document, "mouseup", handlers.end);
-    this.addEventListener(document, "touchend", handlers.end);
+    this.addEventListener(elements.btn, 'mousedown', handlers.start);
+    this.addEventListener(elements.btn, 'touchstart', handlers.start);
+    this.addEventListener(elements.sliderImg, 'mousedown', handlers.start);
+    this.addEventListener(elements.sliderImg, 'touchstart', handlers.start);
+    this.addEventListener(document, 'mousemove', handlers.move, { passive: false });
+    this.addEventListener(document, 'touchmove', handlers.move, { passive: false });
+    this.addEventListener(document, 'mouseup', handlers.end);
+    this.addEventListener(document, 'touchend', handlers.end);
   }
 
-  // 优化：改进事件管理
   addEventListener(element, event, handler, options = {}) {
     if (!element || typeof handler !== 'function') return
 
@@ -258,7 +239,6 @@ class PopupSliderCaptcha {
     this.eventListeners.length = 0;
   }
 
-  // 优化：缓存尺寸计算
   getDimensions() {
     if (!this.cachedDimensions) {
       const trackWidth = this.elements.track.offsetWidth;
@@ -266,7 +246,7 @@ class PopupSliderCaptcha {
       this.cachedDimensions = {
         trackWidth,
         btnWidth,
-        maxX: trackWidth - btnWidth
+        maxX: trackWidth - btnWidth,
       };
     }
     return this.cachedDimensions
@@ -278,7 +258,6 @@ class PopupSliderCaptcha {
     return Math.round(percentage * (this.options.width - this.options.sliderSize))
   }
 
-  // 优化：简化拖拽处理
   handleStart(e) {
     if (!this.captchaData || this.state.isDragging || this.state.isLoading) return
 
@@ -289,7 +268,7 @@ class PopupSliderCaptcha {
     this.times = [{ time: Date.now(), position: this.getPosition() }];
 
     this.setTransition(false);
-    this.updateUIState("dragging");
+    this.updateUIState('dragging');
     this.cachedDimensions = null; // 清除缓存
   }
 
@@ -331,11 +310,11 @@ class PopupSliderCaptcha {
   }
 
   getClientX(e) {
-    return e.type.includes("touch") ? e.touches[0].clientX : e.clientX
+    return e.type.includes('touch') ? e.touches[0].clientX : e.clientX
   }
 
   setTransition(enabled) {
-    const transition = enabled ? "all 0.3s ease" : "none";
+    const transition = enabled ? 'all 0.3s ease' : 'none';
     requestAnimationFrame(() => {
       this.elements.btn.style.transition = transition;
       this.elements.sliderImg.style.transition = transition;
@@ -347,38 +326,38 @@ class PopupSliderCaptcha {
     const { elements } = this;
     const updates = {
       dragging: () => {
-        elements.hint.style.opacity = "0";
-        elements.fingerAnimation.style.display = "none";
+        elements.hint.style.opacity = '0';
+        elements.fingerAnimation.style.display = 'none';
       },
       success: () => {
-        Object.assign(elements.btn.style, { background: "var(--sc-success)" });
-        Object.assign(elements.icon.style, { innerHTML: "✓", color: "white" });
-        elements.icon.innerHTML = "✓";
+        Object.assign(elements.btn.style, { background: 'var(--sc-success)' });
+        Object.assign(elements.icon.style, { innerHTML: '✓', color: 'white' });
+        elements.icon.innerHTML = '✓';
       },
       fail: () => {
-        Object.assign(elements.btn.style, { background: "var(--sc-danger)" });
-        Object.assign(elements.icon.style, { innerHTML: "✗", color: "white" });
-        elements.icon.innerHTML = "✗";
+        Object.assign(elements.btn.style, { background: 'var(--sc-danger)' });
+        Object.assign(elements.icon.style, { innerHTML: '✗', color: 'white' });
+        elements.icon.innerHTML = '✗';
       },
       reset: () => {
-        Object.assign(elements.btn.style, { background: "white" });
-        Object.assign(elements.icon.style, { color: "#666" });
-        elements.icon.innerHTML = "→";
-        elements.fingerAnimation.style.display = "block";
-        this.updateHintText("向右滑动完成验证", "var(--sc-text-light)");
+        Object.assign(elements.btn.style, { background: 'white' });
+        Object.assign(elements.icon.style, { color: '#666' });
+        elements.icon.innerHTML = '→';
+        elements.fingerAnimation.style.display = 'block';
+        this.updateHintText('向右滑动完成验证', 'var(--sc-text-light)');
       },
       loading: () => {
-        elements.hint.style.opacity = "0";
-        elements.fingerAnimation.style.display = "none";
-        Object.assign(elements.track.style, { pointerEvents: "none", opacity: "0.6" });
-      }
+        elements.hint.style.opacity = '0';
+        elements.fingerAnimation.style.display = 'none';
+        Object.assign(elements.track.style, { pointerEvents: 'none', opacity: '0.6' });
+      },
     };
 
     if (updates[state]) {
       requestAnimationFrame(() => {
         updates[state]();
-        if (state !== "loading") {
-          Object.assign(elements.track.style, { pointerEvents: "auto", opacity: "1" });
+        if (state !== 'loading') {
+          Object.assign(elements.track.style, { pointerEvents: 'auto', opacity: '1' });
         }
       });
     }
@@ -387,7 +366,7 @@ class PopupSliderCaptcha {
   updateHintText(text, color) {
     requestAnimationFrame(() => {
       Object.assign(this.elements.hint, { textContent: text });
-      Object.assign(this.elements.hint.style, { color, opacity: "1" });
+      Object.assign(this.elements.hint.style, { color, opacity: '1' });
     });
   }
 
@@ -400,18 +379,18 @@ class PopupSliderCaptcha {
     requestAnimationFrame(() => {
       elements.btn.style.transform = `translateX(${state.currentX}px)`;
       elements.sliderImg.style.transform = `translateX(${pieceX}px)`;
-      elements.fingerAnimation.style.opacity = progress >= 0.8 ? "0" : "0.6";
+      elements.fingerAnimation.style.opacity = progress >= 0.8 ? '0' : '0.6';
     });
   }
 
   // 优化：简化显示/隐藏逻辑
   show() {
     this.state.isVisible = true;
-    this.elements.overlay.style.display = "flex";
+    this.elements.overlay.style.display = 'flex';
 
     requestAnimationFrame(() => {
-      this.elements.overlay.classList.add("show");
-      this.elements.modal.classList.add("show");
+      this.elements.overlay.classList.add('show');
+      this.elements.modal.classList.add('show');
     });
 
     this.loadCaptcha();
@@ -419,11 +398,11 @@ class PopupSliderCaptcha {
 
   hide() {
     this.state.isVisible = false;
-    this.elements.overlay.classList.remove("show");
-    this.elements.modal.classList.remove("show");
+    this.elements.overlay.classList.remove('show');
+    this.elements.modal.classList.remove('show');
 
     this.safeSetTimeout(() => {
-      this.elements.overlay.style.display = "none";
+      this.elements.overlay.style.display = 'none';
       document.body.removeChild(this.elements.overlay);
       this.reset();
       this.options.onClose?.();
@@ -438,7 +417,7 @@ class PopupSliderCaptcha {
       [PopupSliderCaptcha.ERROR_TYPES.TIMEOUT_ERROR]: '请求超时，请重试',
       [PopupSliderCaptcha.ERROR_TYPES.VALIDATION_ERROR]: '验证失败，请重试',
       [PopupSliderCaptcha.ERROR_TYPES.IMAGE_LOAD_ERROR]: '图片加载失败，请刷新重试',
-      [PopupSliderCaptcha.ERROR_TYPES.CAPTCHA_DATA_ERROR]: '验证码数据错误，请刷新重试'
+      [PopupSliderCaptcha.ERROR_TYPES.CAPTCHA_DATA_ERROR]: '验证码数据错误，请刷新重试',
     };
 
     const errorMessage = errorMessages[errorType] || message || '未知错误';
@@ -448,7 +427,7 @@ class PopupSliderCaptcha {
       this.options.onError({
         type: errorType,
         message: errorMessage,
-        originalError
+        originalError,
       });
     }
 
@@ -469,16 +448,16 @@ class PopupSliderCaptcha {
       this.abortController = new AbortController();
 
       const response = await fetch(this.options.apiUrl, {
-        method: "POST",
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
-          ...this.options.headers
+          'Content-Type': 'application/json',
+          ...this.options.headers,
         },
         body: JSON.stringify({
           timestamp: Date.now(),
-          ...this.options.requestData
+          ...this.options.requestData,
         }),
-        signal: this.abortController.signal
+        signal: this.abortController.signal,
       });
 
       if (!response.ok) {
@@ -489,7 +468,7 @@ class PopupSliderCaptcha {
 
       // 优化：更严格的数据验证
       if (!this.validateCaptchaData(data)) {
-        throw new Error("验证码数据格式错误")
+        throw new Error('验证码数据格式错误')
       }
 
       this.captchaData = data.data;
@@ -498,7 +477,10 @@ class PopupSliderCaptcha {
     } catch (error) {
       if (error.name === 'AbortError') {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.TIMEOUT_ERROR, '请求被取消');
-      } else if (error.message.includes('Failed to fetch') || error.message.includes('NetworkError')) {
+      } else if (
+        error.message.includes('Failed to fetch') ||
+        error.message.includes('NetworkError')
+      ) {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.NETWORK_ERROR, '网络连接失败');
       } else {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.CAPTCHA_DATA_ERROR, error.message, error);
@@ -510,10 +492,19 @@ class PopupSliderCaptcha {
   validateCaptchaData(data) {
     if (!data || typeof data !== 'object') return false
 
-    const requiredFields = ['canvasSrc', 'blockSrc', 'canvasWidth', 'canvasHeight', 'blockWidth', 'blockHeight', 'blockY', 'nonceStr'];
+    const requiredFields = [
+      'canvasSrc',
+      'blockSrc',
+      'canvasWidth',
+      'canvasHeight',
+      'blockWidth',
+      'blockHeight',
+      'blockY',
+      'nonceStr',
+    ];
     const dataObj = data.data || data;
 
-    return requiredFields.every(field => {
+    return requiredFields.every((field) => {
       const value = dataObj[field];
       return value !== null && value !== undefined && value !== ''
     })
@@ -527,13 +518,13 @@ class PopupSliderCaptcha {
       const loadPromises = [
         this.loadImageAsync(this.elements.backgroundImg, this.captchaData.canvasSrc, {
           width: this.captchaData.canvasWidth,
-          height: this.captchaData.canvasHeight
+          height: this.captchaData.canvasHeight,
         }),
         this.loadImageAsync(this.elements.sliderImg, this.captchaData.blockSrc, {
           width: this.captchaData.blockWidth,
           height: this.captchaData.blockHeight,
-          top: this.captchaData.blockY
-        })
+          top: this.captchaData.blockY,
+        }),
       ];
 
       Promise.all(loadPromises)
@@ -588,7 +579,7 @@ class PopupSliderCaptcha {
   // 优化：提取样式应用逻辑
   applyStyles(element, styles) {
     Object.entries(styles).forEach(([key, value]) => {
-      element.style[key] = typeof value === "number" ? value + "px" : value;
+      element.style[key] = typeof value === 'number' ? value + 'px' : value;
     });
   }
 
@@ -596,31 +587,31 @@ class PopupSliderCaptcha {
   showLoading() {
     this.state.isLoading = true;
     this.batchUpdateStyles({
-      container: { display: "block" },
-      loadingText: { display: "flex" },
-      error: { display: "none" }
+      container: { display: 'block' },
+      loadingText: { display: 'flex' },
+      error: { display: 'none' },
     });
-    this.updateUIState("loading");
+    this.updateUIState('loading');
   }
 
   hideLoading() {
     this.state.isLoading = false;
-    this.batchUpdateStyles({ loadingText: { display: "none" } });
-    this.updateUIState("reset");
+    this.batchUpdateStyles({ loadingText: { display: 'none' } });
+    this.updateUIState('reset');
   }
 
   showCaptcha() {
     this.batchUpdateStyles({
-      container: { display: "block" },
-      track: { display: "block" },
-      error: { display: "none" }
+      container: { display: 'block' },
+      track: { display: 'block' },
+      error: { display: 'none' },
     });
   }
 
   showError(message) {
     this.hideLoading();
     this.batchUpdateStyles({
-      error: { display: "block", textContent: message }
+      error: { display: 'block', textContent: message },
     });
   }
 
@@ -644,7 +635,7 @@ class PopupSliderCaptcha {
 
   async verify() {
     if (!this.captchaData) {
-      this.onVerifyFail("验证码数据丢失");
+      this.onVerifyFail('验证码数据丢失');
       return
     }
 
@@ -656,20 +647,20 @@ class PopupSliderCaptcha {
       this.abortController = new AbortController();
 
       const response = await fetch(this.options.verifyUrl, {
-        method: "POST",
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
-          ...this.options.headers
+          'Content-Type': 'application/json',
+          ...this.options.headers,
         },
         body: JSON.stringify({
           loginVo: {
             nonceStr: this.captchaData.nonceStr,
-            value: this.getPosition()
+            value: this.getPosition(),
           },
           dragEventList: [...this.times],
-          ...this.options.verifyData
+          ...this.options.verifyData,
         }),
-        signal: this.abortController.signal
+        signal: this.abortController.signal,
       });
 
       if (!response.ok) {
@@ -682,12 +673,15 @@ class PopupSliderCaptcha {
       if (this.isVerifySuccess(data)) {
         this.onVerifySuccess(data.data || data.result);
       } else {
-        this.onVerifyFail(data.message || data.msg || "验证失败，请重试！");
+        this.onVerifyFail(data.message || data.msg || '验证失败，请重试！');
       }
     } catch (error) {
       if (error.name === 'AbortError') {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.TIMEOUT_ERROR, '验证请求被取消');
-      } else if (error.message.includes('Failed to fetch') || error.message.includes('NetworkError')) {
+      } else if (
+        error.message.includes('Failed to fetch') ||
+        error.message.includes('NetworkError')
+      ) {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.NETWORK_ERROR, '网络连接失败');
       } else {
         this.handleError(PopupSliderCaptcha.ERROR_TYPES.VALIDATION_ERROR, error.message, error);
@@ -701,48 +695,50 @@ class PopupSliderCaptcha {
 
     // 支持多种成功标识
     const successIndicators = [
-      data.code === "0",
+      data.code === '0',
       data.code === 0,
       data.success === true,
       data.status === 'success',
-      data.result === true
+      data.result === true,
     ];
 
-    return successIndicators.some(indicator => indicator === true)
+    return successIndicators.some((indicator) => indicator === true)
   }
 
   onVerifySuccess(ticket) {
-    const duration = this.dragStartTime ? Date.now() - this.dragStartTime : (Date.now() - this.startTime);
+    const duration = this.dragStartTime
+      ? Date.now() - this.dragStartTime
+      : Date.now() - this.startTime;
     const durationText = `验证成功！耗时：${(duration / 1000).toFixed(2)}s`;
 
-    this.updateUIState("success");
-    this.showFloatingTime(durationText, "success");
+    this.updateUIState('success');
+    this.showFloatingTime(durationText, 'success');
 
     this.safeSetTimeout(() => {
       this.options.onSuccess?.({
         ticket: ticket,
         timestamp: Date.now(),
-        duration
+        duration,
       });
       this.hide();
     }, 2000);
   }
 
-  showFloatingTime(text, type = "success") {
+  showFloatingTime(text, type = 'success') {
     const { elements } = this;
     elements.floatingTime.textContent = text;
     elements.floatingTime.className = `slider-captcha-floating-time ${type}`;
 
-    this.safeSetTimeout(() => elements.floatingTime.classList.add("show"), 100);
+    this.safeSetTimeout(() => elements.floatingTime.classList.add('show'), 100);
     this.safeSetTimeout(() => {
-      elements.floatingTime.className = "slider-captcha-floating-time";
+      elements.floatingTime.className = 'slider-captcha-floating-time';
     }, 2500); // 优化：延长显示时间，避免被reset清除
   }
 
   onVerifyFail(message) {
     this.state.retryCount++;
-    this.updateUIState("fail");
-    this.showFloatingTime(message, "fail");
+    this.updateUIState('fail');
+    this.showFloatingTime(message, 'fail');
 
     this.safeSetTimeout(() => {
       if (this.state.retryCount >= this.options.maxRetries) {
@@ -761,7 +757,7 @@ class PopupSliderCaptcha {
       isDragging: false,
       currentX: 0,
       startX: 0,
-      isLoading: false
+      isLoading: false,
     });
 
     this.times = [];
@@ -772,10 +768,10 @@ class PopupSliderCaptcha {
     // 重置UI
     requestAnimationFrame(() => {
       this.setTransition(true);
-      this.elements.btn.style.transform = "translateX(0px)";
-      this.elements.sliderImg.style.transform = "translateX(0px)";
-      this.updateUIState("reset");
-      this.elements.error.style.display = "none";
+      this.elements.btn.style.transform = 'translateX(0px)';
+      this.elements.sliderImg.style.transform = 'translateX(0px)';
+      this.updateUIState('reset');
+      this.elements.error.style.display = 'none';
     });
   }
 
@@ -803,7 +799,7 @@ class PopupSliderCaptcha {
   }
 
   clearAllTimers() {
-    this.timers.forEach(timer => {
+    this.timers.forEach((timer) => {
       clearTimeout(timer);
       clearInterval(timer);
     });
@@ -852,8 +848,8 @@ class PopupSliderCaptcha {
 
       // 恢复body样式
       if (document.body) {
-        document.body.style.userSelect = "";
-        document.body.style.cursor = "";
+        document.body.style.userSelect = '';
+        document.body.style.cursor = '';
       }
 
       // 清理所有定时器
@@ -881,7 +877,7 @@ class PopupSliderCaptcha {
       this.cachedDimensions = null;
 
       // 清空所有属性
-      Object.keys(this).forEach(key => {
+      Object.keys(this).forEach((key) => {
         if (key !== 'constructor') {
           this[key] = null;
         }
@@ -908,12 +904,12 @@ class PopupSliderCaptcha {
 }
 
 // 模块导出
-if (typeof module !== "undefined" && module.exports) {
+if (typeof module !== 'undefined' && module.exports) {
   module.exports = PopupSliderCaptcha;
   module.exports.default = PopupSliderCaptcha;
-} else if (typeof define === "function" && define.amd) {
+} else if (typeof define === 'function' && define.amd) {
   define([], () => PopupSliderCaptcha);
-} else if (typeof window !== "undefined") {
+} else if (typeof window !== 'undefined') {
   window.PopupSliderCaptcha = PopupSliderCaptcha;
   window.SliderCaptcha = PopupSliderCaptcha;
 }