From cb2136fcdc3b8ce7b75d49dbe0a938f8626da050 Mon Sep 17 00:00:00 2001 From: chenxing Date: Thu, 3 Sep 2026 14:19:23 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=94=B9=E7=99=BB=E5=BD=95=E9=A1=B5?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../resources/templates/casLoginView.html | 12 +++-- src/main/webapp/front/css/login.css | 46 ++++++++++++++++++- src/main/webapp/front/image/eye-close.svg | 6 +++ src/main/webapp/front/image/eye-open.svg | 7 +++ src/main/webapp/front/js/native-login.js | 32 +++++++++++++ 5 files changed, 98 insertions(+), 5 deletions(-) create mode 100644 src/main/webapp/front/image/eye-close.svg create mode 100644 src/main/webapp/front/image/eye-open.svg diff --git a/src/main/resources/templates/casLoginView.html b/src/main/resources/templates/casLoginView.html index 2fcedff..ef4d59b 100644 --- a/src/main/resources/templates/casLoginView.html +++ b/src/main/resources/templates/casLoginView.html @@ -8,12 +8,12 @@ 云海教育 · 统一身份认证平台 - + - + @@ -52,9 +52,13 @@ -
+
+
@@ -63,7 +67,7 @@ diff --git a/src/main/webapp/front/css/login.css b/src/main/webapp/front/css/login.css index 4c7a110..46197db 100644 --- a/src/main/webapp/front/css/login.css +++ b/src/main/webapp/front/css/login.css @@ -228,10 +228,54 @@ body { } .captcha-row img { - height: 46px; + flex: 0 0 120px; + width: 120px; + height: 54px; cursor: pointer; border-radius: var(--radius-input); border: 1px solid var(--border); + background: var(--input-bg); +} + +/* 密码框：右侧白底眼睛按钮，明文/密文切换 */ +.pwd-item { + position: relative; +} + +.pwd-item input { + padding-right: 76px; +} + +.eye-btn { + position: absolute; + top: 50%; + right: 5px; + transform: translateY(-50%); + width: 60px; + height: 44px; + display: flex; + align-items: center; + justify-content: center; + padding: 0; + background: #fff; + border: 1px solid var(--border); + border-radius: var(--radius-input); + cursor: pointer; + transition: border-color 0.18s; +} + +.eye-btn:hover { + border-color: var(--accent); +} + +.eye-btn img { + width: 22px; + height: 22px; + display: block; +} + +#js_open_eye { + display: none; } .btn-submit { diff --git a/src/main/webapp/front/image/eye-close.svg b/src/main/webapp/front/image/eye-close.svg new file mode 100644 index 0000000..e82dc53 --- /dev/null +++ b/src/main/webapp/front/image/eye-close.svg @@ -0,0 +1,6 @@ + + + + diff --git a/src/main/webapp/front/image/eye-open.svg b/src/main/webapp/front/image/eye-open.svg new file mode 100644 index 0000000..c526ac1 --- /dev/null +++ b/src/main/webapp/front/image/eye-open.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/src/main/webapp/front/js/native-login.js b/src/main/webapp/front/js/native-login.js index b81a00a..ded582d 100644 --- a/src/main/webapp/front/js/native-login.js +++ b/src/main/webapp/front/js/native-login.js @@ -32,10 +32,40 @@ } } + var captchaRetryTimer = null; + var captchaRetryCount = 0; + function refreshCaptcha() { + clearTimeout(captchaRetryTimer); document.getElementById("captchaImg").src = bschLogin.captchaSrc(); } + // 验证码偶发加载失败：图片固定尺寸兜底占位，失败后自动重试 3 次，之后仍可点击手动刷新 + function watchCaptchaImg() { + var img = document.getElementById("captchaImg"); + img.addEventListener("load", function () { + captchaRetryCount = 0; + }); + img.addEventListener("error", function () { + if (captchaRetryCount >= 3) return; + captchaRetryCount += 1; + captchaRetryTimer = setTimeout(refreshCaptcha, 600 * captchaRetryCount); + }); + } + + function bindEyeToggle() { + var pwd = document.getElementById("password_input"); + var openEye = document.getElementById("js_open_eye"); + var closeEye = document.getElementById("js_close_eye"); + document.getElementById("eyeBtn").addEventListener("click", function () { + var visible = pwd.type === "password"; + pwd.type = visible ? "text" : "password"; + openEye.style.display = visible ? "block" : "none"; + closeEye.style.display = visible ? "none" : "block"; + this.setAttribute("aria-label", visible ? "隐藏密码" : "显示密码"); + }); + } + function initLoginForm() { bschLogin.getPublicKey(); bschLogin.isNeedCaptcha(setCaptcha); @@ -142,6 +172,8 @@ document.addEventListener("DOMContentLoaded", function () { bschLogin = new BschLogin(window.ssoServerHost); + watchCaptchaImg(); + bindEyeToggle(); document.getElementById("user_input").addEventListener("keydown", function (e) { if (e.key === "Enter") document.getElementById("password_input").focus(); });