修改功能，现已测试注册登录忘记密码

html/reg.html

@@ -25,16 +25,16 @@
         </div>
         <div class="auth-body">
           <form id="registerForm" autocomplete="off">
-            <div class="form-group" id="nicknameContainer">
-              <label for="nickname">昵称</label>
+            <div class="form-group" id="nickNameContainer">
+              <label for="nickName">昵称</label>
               <input
                 type="text"
-                id="nickname"
+                id="nickName"
                 class="form-input"
-                placeholder="请输入昵称（2-20个字符）"
-                maxlength="20"
+                placeholder="请输入昵称（2-6个汉字或2-12个英文）"
+                maxlength="12"
               />
-              <div class="error-message" id="nicknameError"></div>
+              <div class="error-message" id="nickNameError"></div>
             </div>
 
             <div class="form-group" id="phoneContainer">
@@ -146,10 +146,10 @@
       let layerInstance = null;
       let currentCaptchaId = "";
       let currentVerifyType = "captcha";
-      let currentSlideToken = "";
       let currentSlideUuid = "";
       let currentSlideX = 0;
       let pendingSmsAfterVerify = false;
+      let smsCodeIssuedPhone = "";
       let referralPreviewData = null;
 
       function showError(field, message) {
@@ -172,19 +172,27 @@
 
       function loadVerifyConfig() {
         return AuthPageUtil.loadVerifyType().then(function (type) {
-          currentVerifyType = type;
+          currentVerifyType = type === "none" ? "captcha" : type;
         });
       }
 
       function refreshCaptcha() {
+        if (currentVerifyType === "none") {
+          currentCaptchaId = "";
+          currentSlideUuid = "";
+          currentSlideX = 0;
+          $("#captchaGroup").hide();
+          $("#captchaRefreshLink").hide();
+          return;
+        }
+
+        $("#captchaGroup").show();
         currentCaptchaId = "";
-        currentSlideToken = "";
         currentSlideUuid = "";
         currentSlideX = 0;
         $("#captchaId").val("");
         $("#captchaInput").val("");
         $("#captchaGroup").removeClass("is-slide-mode");
-        $("#sendSmsBtn").prop("disabled", currentVerifyType === "slide");
         if (currentVerifyType === "slide") {
           renderSlideCaptchaEntry();
           return;
@@ -220,9 +228,6 @@
       function completeSlideCaptcha(result) {
         const data = result || {};
         const nested = data.data || {};
-        currentSlideToken =
-          data.slideToken || data.token || data.verifyToken ||
-          nested.slideToken || nested.token || nested.verifyToken || "";
         currentSlideUuid =
           data.slideUuid || data.uuid || nested.slideUuid || nested.uuid || "";
         currentSlideX =
@@ -235,7 +240,7 @@
         $("#captchaContainer").html(
           '<div class="slide-verify-card is-success"><div class="slide-verify-mark">✓</div><div class="slide-verify-main"><div class="slide-verify-title">验证已通过</div><div class="slide-verify-desc">可以获取短信或注册</div></div><div class="slide-verify-action">完成</div></div>',
         );
-        $("#sendSmsBtn").prop("disabled", false);
+        checkSmsWaitAfterVerify();
         if (pendingSmsAfterVerify) {
           pendingSmsAfterVerify = false;
           sendSmsCode();
@@ -254,7 +259,6 @@
               onSuccess: completeSlideCaptcha,
               onCancel: function () {
                 currentSlideUuid = "";
-                currentSlideToken = "";
                 currentSlideX = 0;
               },
               onError: function (error) {
@@ -277,7 +281,6 @@
         $("#captchaInput").hide();
         $("#captchaRefreshLink").hide();
         $("#captchaGroup").addClass("is-slide-mode");
-        $("#sendSmsBtn").prop("disabled", true);
         $("#captchaContainer")
           .removeAttr("onclick")
           .html(
@@ -295,12 +298,19 @@
       }
 
       function validateNickname(show) {
-        const value = $("#nickname").val().trim();
-        if (value.length < 2 || value.length > 20) {
-          if (show) showError("nickname", "昵称长度应为2-20个字符");
+        const value = $("#nickName").val().trim();
+        if (!value) {
+          if (show) showError("nickName", "请输入昵称");
           return false;
         }
-        clearError("nickname");
+        const nicknameWidth = Array.from(value).reduce(function (total, char) {
+          return total + (/[\u4e00-\u9fa5\uff00-\uffef]/.test(char) ? 2 : 1);
+        }, 0);
+        if (value.length < 2 || nicknameWidth > 12) {
+          if (show) showError("nickName", "昵称长度应为2-6个汉字或2-12个英文");
+          return false;
+        }
+        clearError("nickName");
         return true;
       }
 
@@ -342,72 +352,276 @@
         return true;
       }
 
-      function getVerifyParams(show) {
+      function hasIssuedSmsCodeForCurrentPhone() {
+        const phone = $("#phone").val().trim();
+        return !!phone && smsCodeIssuedPhone === phone;
+      }
+
+      function handlePhoneInput() {
+        const phone = $("#phone").val().trim();
+        if (smsCodeIssuedPhone && smsCodeIssuedPhone !== phone) {
+          $("#smsCode").val("");
+          clearError("smsCode");
+        }
+      }
+
+      function validateSmsCodePhone(show) {
+        const phone = $("#phone").val().trim();
+        if (smsCodeIssuedPhone && smsCodeIssuedPhone !== phone) {
+          if (show) showError("smsCode", "手机号已修改，请重新获取短信验证码");
+          return false;
+        }
+        return true;
+      }
+
+      function getOptionalGraphVerifyParams() {
+        if (hasIssuedSmsCodeForCurrentPhone()) return {};
+        if (currentVerifyType === "slide" && currentSlideUuid) {
+          return {
+            verifyType: "slide",
+            slideUuid: currentSlideUuid,
+            slideX: currentSlideX,
+          };
+        }
+        if (currentVerifyType === "captcha") {
+          const code = $("#captchaInput").val().trim();
+          if (code && currentCaptchaId) {
+            return { verifyType: "captcha", code: code, uuid: currentCaptchaId };
+          }
+        }
+        return {};
+      }
+
+      function getGraphVerifyParams(show) {
         if (currentVerifyType === "slide") {
           if (!currentSlideUuid) {
-            if (show) layerInstance.msg("请先完成滑动验证", { icon: 2 });
+            if (show) {
+              layerInstance.msg("请先完成滑动验证后获取短信验证码", {
+                icon: 2,
+              });
+            }
             return null;
           }
           return {
             verifyType: "slide",
-            slideToken: currentSlideToken,
             slideUuid: currentSlideUuid,
             slideX: currentSlideX,
           };
         }
         const code = $("#captchaInput").val().trim();
-        if (!code || !currentCaptchaId) {
-          if (show) showError("captcha", "请填写有效验证码");
+        if (!code) {
+          if (show) {
+            layerInstance.msg("请先完成图片验证码后获取短信验证码", {
+              icon: 2,
+            });
+          }
+          return null;
+        }
+        if (!currentCaptchaId) {
+          if (show) {
+            layerInstance.msg("验证码已失效，请换一张", { icon: 2 });
+            refreshCaptcha();
+          }
           return null;
         }
         clearError("captcha");
         return { verifyType: "captcha", code, uuid: currentCaptchaId };
       }
 
-      function sendSmsCode() {
-        if (!validatePhone(true)) return;
-        if (currentVerifyType === "slide" && !currentSlideUuid) {
-          layerInstance.msg("请先完成滑动验证后获取短信验证码", { icon: 2 });
-          return;
-        }
-        const verifyParams = getVerifyParams(true);
-        if (!verifyParams) return;
-        $("#sendSmsBtn").prop("disabled", true);
-        AuthPageUtil.sendSmsCode(
-          Object.assign(
-            { phoneNumber: $("#phone").val().trim() },
-            verifyParams,
-          ),
+      function getSmsWaitSeconds() {
+        const smsCountdownApi = ApiClient.API["authSmsCountdown"];
+        if (!smsCountdownApi) return Promise.resolve(0);
+        return ApiClient.get(
+          smsCountdownApi,
+          { phoneNumber: $("#phone").val().trim(), scene: "auth" },
+          { publicRequest: true },
         )
           .then(function (res) {
-            if (ApiClient.isSuccess(res)) {
-              layerInstance.msg("短信验证码已发送", { icon: 1 });
-              AuthPageUtil.startSmsCountdown("#sendSmsBtn");
-              return;
-            }
-            $("#sendSmsBtn").prop("disabled", false);
-            layerInstance.msg((res && res.msg) || "短信验证码发送失败", {
-              icon: 2,
-            });
-            refreshCaptcha();
+            if (!ApiClient.isSuccess(res)) return 0;
+            const data = res.data || {};
+            return (
+              Number(
+                data.seconds ||
+                  data.waitSeconds ||
+                  data.remainingSeconds ||
+                  data.countdown ||
+                  0,
+              ) || 0
+            );
           })
           .catch(function () {
-            $("#sendSmsBtn").prop("disabled", false);
-            layerInstance.msg("网络异常，短信发送失败", { icon: 2 });
-            refreshCaptcha();
+            return 0;
           });
       }
 
+      function checkSmsWaitAfterVerify() {
+        if (!validatePhone(false)) return;
+        getSmsWaitSeconds().then(function (waitSeconds) {
+          if (waitSeconds > 0) {
+            layerInstance.msg("请 " + waitSeconds + " 秒后再获取短信验证码", {
+              icon: 0,
+            });
+            AuthPageUtil.startSmsCountdown("#sendSmsBtn", waitSeconds);
+          }
+        });
+      }
+
+      function refreshDialogCaptcha() {
+        currentCaptchaId = "";
+        $("#captchaInput").val("");
+        $("#captchaId").val("");
+        $("#captchaDialogInput").val("");
+        $("#captchaDialogImage").attr("src", "");
+
+        return ApiClient.get(
+          ApiClient.API.authCode,
+          {},
+          { publicRequest: true },
+        )
+          .then(function (res) {
+            if (ApiClient.isSuccess(res) && res.data) {
+              currentCaptchaId = res.data.uuid || res.data.id || "";
+              $("#captchaId").val(currentCaptchaId);
+              $("#captchaDialogImage").attr(
+                "src",
+                res.data.img || res.data.image || "",
+              );
+              return;
+            }
+            layerInstance.msg("获取验证码失败，请重试", { icon: 2 });
+          })
+          .catch(function () {
+            layerInstance.msg("网络错误，无法获取验证码", { icon: 2 });
+          });
+      }
+
+      function openImageCaptchaDialog() {
+        const dialogHtml = `
+          <div class="captcha-dialog">
+            <div class="captcha-dialog-title">完成图片验证码</div>
+            <div class="captcha-dialog-desc">请输入右侧图片中的验证码，通过后将自动发送短信验证码。</div>
+            <div class="captcha-dialog-row">
+              <input type="text" class="captcha-dialog-input" id="captchaDialogInput" maxlength="6" placeholder="请输入验证码" />
+              <div class="captcha-dialog-img-box" id="captchaDialogRefresh">
+                <img class="captcha-dialog-img" id="captchaDialogImage" src="" alt="验证码" />
+              </div>
+            </div>
+            <div class="captcha-dialog-tip">看不清？<span id="captchaDialogRefreshText">换一张</span></div>
+            <div class="captcha-dialog-actions">
+              <button type="button" class="captcha-dialog-btn" id="captchaDialogCancel">取消</button>
+              <button type="button" class="captcha-dialog-btn primary" id="captchaDialogConfirm">确认发送</button>
+            </div>
+          </div>
+        `;
+
+        const dialogIndex = layerInstance.open({
+          type: 1,
+          title: false,
+          area: ["420px", "auto"],
+          shadeClose: true,
+          closeBtn: 1,
+          content: dialogHtml,
+          success: function () {
+            refreshDialogCaptcha();
+            $("#captchaDialogRefresh, #captchaDialogRefreshText").on(
+              "click",
+              refreshDialogCaptcha,
+            );
+            $("#captchaDialogCancel").on("click", function () {
+              layerInstance.close(dialogIndex);
+            });
+            $("#captchaDialogInput").on("keydown", function (event) {
+              if (event.key === "Enter") {
+                event.preventDefault();
+                $("#captchaDialogConfirm").trigger("click");
+              }
+            });
+            $("#captchaDialogConfirm").on("click", function () {
+              const code = $("#captchaDialogInput").val().trim();
+              if (!code) {
+                layerInstance.msg("请输入验证码", { icon: 2 });
+                return;
+              }
+              $("#captchaInput").val(code);
+              layerInstance.close(dialogIndex);
+              sendSmsCode();
+            });
+            setTimeout(function () {
+              $("#captchaDialogInput").focus();
+            }, 80);
+          },
+          end: function () {
+            $("#sendSmsBtn").prop("disabled", false);
+          },
+        });
+      }
+
+      function sendSmsCode() {
+        if (!validatePhone(true)) return;
+
+        if (currentVerifyType === "slide" && !currentSlideUuid) {
+          pendingSmsAfterVerify = true;
+          openSlideCaptcha();
+          return;
+        }
+
+        if (
+          currentVerifyType === "captcha" &&
+          !$("#captchaInput").val().trim()
+        ) {
+          $("#sendSmsBtn").prop("disabled", true);
+          openImageCaptchaDialog();
+          return;
+        }
+
+        const verifyParams = getGraphVerifyParams(true);
+        if (!verifyParams) return;
+        $("#sendSmsBtn").prop("disabled", true);
+        getSmsWaitSeconds().then(function (waitSeconds) {
+          if (waitSeconds > 0) {
+            layerInstance.msg("请 " + waitSeconds + " 秒后再获取短信验证码", {
+              icon: 0,
+            });
+            AuthPageUtil.startSmsCountdown("#sendSmsBtn", waitSeconds);
+            return;
+          }
+          AuthPageUtil.sendSmsCode(
+            Object.assign(
+              { phoneNumber: $("#phone").val().trim() },
+              verifyParams,
+            ),
+          )
+            .then(function (res) {
+              if (ApiClient.isSuccess(res)) {
+                smsCodeIssuedPhone = $("#phone").val().trim();
+                layerInstance.msg("短信验证码已发送", { icon: 1 });
+                AuthPageUtil.startSmsCountdown("#sendSmsBtn");
+                return;
+              }
+              $("#sendSmsBtn").prop("disabled", false);
+              layerInstance.msg((res && res.msg) || "短信验证码发送失败", {
+                icon: 2,
+              });
+              refreshCaptcha();
+            })
+            .catch(function () {
+              $("#sendSmsBtn").prop("disabled", false);
+              layerInstance.msg("网络异常，短信发送失败", { icon: 2 });
+              refreshCaptcha();
+            });
+        });
+      }
+
       function validateForm() {
         if (
           !validateNickname(true) ||
           !validatePhone(true) ||
           !validateSmsCode(true) ||
+          !validateSmsCodePhone(true) ||
           !validatePassword(true) ||
           !validateConfirmPassword(true)
         )
           return false;
-        if (!getVerifyParams(true)) return false;
         if (!$("#agreementCheckbox").prop("checked")) {
           layerInstance.msg("请阅读并同意用户协议和隐私政策", { icon: 2 });
           return false;
@@ -417,8 +631,6 @@
 
       function buildRegisterData() {
         const params = new URLSearchParams(window.location.search);
-        const inviteCode =
-          params.get("inviteCode") || params.get("referralCode") || "";
         const referrerId =
           (referralPreviewData &&
             (referralPreviewData.referrerId ||
@@ -427,46 +639,58 @@
           params.get("referrerId") ||
           params.get("pid") ||
           0;
-        const invitePayload = inviteCode ? { inviteCode: inviteCode } : {};
+
         return Object.assign(
           {
             phoneNumber: $("#phone").val().trim(),
             password: hex_md5($("#password").val()),
             smsCode: $("#smsCode").val().trim(),
-            nickname: $("#nickname").val().trim(),
+            nickName: $("#nickName").val().trim(),
             referrerId: referrerId,
           },
-          invitePayload,
-          getVerifyParams(false) || {},
+          getOptionalGraphVerifyParams(),
         );
       }
 
-      function loadReferralBindPreview() {
+      function getInviteCodeFromQuery() {
         const params = new URLSearchParams(window.location.search);
-        const inviteCode =
-          params.get("inviteCode") || params.get("referralCode") || "";
-        if (!inviteCode) return;
-        ApiClient.get(
+        return params.get("inviteCode") || params.get("referralCode") || "";
+      }
+
+      function loadReferralBindPreview() {
+        const inviteCode = getInviteCodeFromQuery();
+        if (!inviteCode) return Promise.resolve();
+
+        return ApiClient.get(
           ApiClient.API.referralBindPreview,
           { inviteCode: inviteCode },
           { publicRequest: true },
         )
           .then(function (res) {
-            if (!ApiClient.isSuccess(res)) return;
+            if (!ApiClient.isSuccess(res)) {
+              throw new Error((res && res.msg) || "推荐人信息无效");
+            }
+
             referralPreviewData = ApiClient.pickData(res, {}) || {};
             const name =
-              referralPreviewData.nickname ||
               referralPreviewData.nickName ||
+              referralPreviewData.nickname ||
               referralPreviewData.userName ||
+              referralPreviewData.phoneNumber ||
               "";
-            if (name)
+            if (name) {
               layerInstance.msg("已识别推荐人：" + name, {
                 icon: 1,
                 time: 1500,
               });
+            }
           })
-          .catch(function () {
+          .catch(function (error) {
             referralPreviewData = null;
+            layerInstance.msg(
+              (error && error.message) || "推荐人信息无效",
+              { icon: 2 },
+            );
           });
       }
 
@@ -509,12 +733,14 @@
           event.preventDefault();
           if (validateForm()) register();
         });
-        $("#nickname").on("blur", function () {
+        $("#nickName").on("blur", function () {
           validateNickname(true);
         });
-        $("#phone").on("blur", function () {
-          validatePhone(true);
-        });
+        $("#phone")
+          .on("input", handlePhoneInput)
+          .on("blur", function () {
+            validatePhone(true);
+          });
         $("#smsCode").on("blur", function () {
           validateSmsCode(true);
         });