feat: 更新手机号验证设置UI,优化显示逻辑并添加相关测试

This commit is contained in:
QLHazyCoder
2026-05-04 19:09:37 +08:00
parent b595f5366a
commit f2e6a1ed3e
14 changed files with 1230 additions and 89 deletions
+5
View File
@@ -2271,6 +2271,11 @@ header {
min-height: 33px;
}
.signup-phone-runtime-inline,
.signup-phone-runtime-input {
width: 100%;
}
.hero-sms-price-preview-stack {
width: 100%;
display: flex;
+29 -29
View File
@@ -492,12 +492,6 @@
<button id="btn-fetch-email" class="btn btn-outline btn-sm data-inline-btn" type="button">获取</button>
</div>
</div>
<div class="data-row" id="row-signup-phone" style="display:none;">
<span class="data-label">注册手机号</span>
<div class="data-inline">
<input type="text" id="input-signup-phone" class="data-input" placeholder="步骤 2 自动回填,也可手动填写当前注册手机号" />
</div>
</div>
<div class="data-row module-divider-start" id="row-auto-delay-settings">
<span class="data-label">延迟</span>
<div class="data-inline setting-pair">
@@ -1424,32 +1418,38 @@
</div>
</div>
</div>
<div class="data-row" id="row-hero-sms-runtime-pair" style="display:none;">
<span class="data-label">运行状态</span>
<div class="data-inline hero-sms-runtime-grid">
<div id="row-hero-sms-current-number" class="hero-sms-runtime-cell" style="display:none;">
<span class="hero-sms-runtime-key">当前分配</span>
<span id="display-hero-sms-current-number" class="data-value mono hero-sms-runtime-value">未分配</span>
</div>
<div id="row-hero-sms-current-countdown" class="hero-sms-runtime-cell" style="display:none;">
<span class="hero-sms-runtime-key">倒计时</span>
<span id="display-hero-sms-current-countdown" class="data-value mono hero-sms-runtime-value">未启动</span>
</div>
<div id="row-hero-sms-current-code" class="hero-sms-runtime-cell" style="display:none;">
<span class="hero-sms-runtime-key">验证码</span>
<span id="display-hero-sms-current-code" class="data-value mono hero-sms-runtime-value">未获取</span>
</div>
<div id="row-hero-sms-preferred-activation" class="hero-sms-runtime-cell hero-sms-runtime-cell-span2" style="display:none;">
<span class="hero-sms-runtime-key">优先号码</span>
<select id="select-hero-sms-preferred-activation" class="data-input mono hero-sms-runtime-select">
<option value="">自动(先复用已有可用号,再创建新号)</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="data-row" id="row-hero-sms-runtime-pair" style="display:none;">
<span class="data-label">运行状态</span>
<div class="data-inline hero-sms-runtime-grid">
<div id="row-hero-sms-current-number" class="hero-sms-runtime-cell" style="display:none;">
<span class="hero-sms-runtime-key">当前分配</span>
<span id="display-hero-sms-current-number" class="data-value mono hero-sms-runtime-value">未分配</span>
</div>
<div id="row-hero-sms-current-countdown" class="hero-sms-runtime-cell" style="display:none;">
<span class="hero-sms-runtime-key">倒计时</span>
<span id="display-hero-sms-current-countdown" class="data-value mono hero-sms-runtime-value">未启动</span>
</div>
<div id="row-hero-sms-current-code" class="hero-sms-runtime-cell" style="display:none;">
<span class="hero-sms-runtime-key">验证码</span>
<span id="display-hero-sms-current-code" class="data-value mono hero-sms-runtime-value">未获取</span>
</div>
<div id="row-hero-sms-preferred-activation" class="hero-sms-runtime-cell hero-sms-runtime-cell-span2" style="display:none;">
<span class="hero-sms-runtime-key">优先号码</span>
<select id="select-hero-sms-preferred-activation" class="data-input mono hero-sms-runtime-select">
<option value="">自动(先复用已有可用号,再创建新号)</option>
</select>
</div>
</div>
</div>
<div class="data-row" id="row-signup-phone" style="display:none;">
<span class="data-label">注册手机号</span>
<div class="data-inline signup-phone-runtime-inline">
<input type="text" id="input-signup-phone" class="data-input mono signup-phone-runtime-input" placeholder="完整国际号码,如 +44..." />
</div>
</div>
</div>
<div id="status-bar" class="status-bar">
<div class="status-dot"></div>
+20 -7
View File
@@ -6851,11 +6851,6 @@ function updatePhoneVerificationSettingsUI() {
typeof rowNexSmsServiceCode !== 'undefined' ? rowNexSmsServiceCode : null,
typeof rowHeroSmsMaxPrice !== 'undefined' ? rowHeroSmsMaxPrice : null,
typeof rowFiveSimOperator !== 'undefined' ? rowFiveSimOperator : null,
typeof rowHeroSmsRuntimePair !== 'undefined' ? rowHeroSmsRuntimePair : null,
typeof rowHeroSmsCurrentNumber !== 'undefined' ? rowHeroSmsCurrentNumber : null,
typeof rowHeroSmsCurrentCountdown !== 'undefined' ? rowHeroSmsCurrentCountdown : null,
typeof rowHeroSmsCurrentCode !== 'undefined' ? rowHeroSmsCurrentCode : null,
typeof rowHeroSmsPreferredActivation !== 'undefined' ? rowHeroSmsPreferredActivation : null,
typeof rowPhoneCodeSettingsGroup !== 'undefined' ? rowPhoneCodeSettingsGroup : null,
typeof rowPhoneVerificationResendCount !== 'undefined' ? rowPhoneVerificationResendCount : null,
typeof rowPhoneReplacementLimit !== 'undefined' ? rowPhoneReplacementLimit : null,
@@ -6885,6 +6880,21 @@ function updatePhoneVerificationSettingsUI() {
if (rowFiveSimOperator) {
rowFiveSimOperator.style.display = showSettings && fiveSimProvider ? '' : 'none';
}
const runtimeVisible = enabled;
[
typeof rowHeroSmsRuntimePair !== 'undefined' ? rowHeroSmsRuntimePair : null,
typeof rowHeroSmsCurrentNumber !== 'undefined' ? rowHeroSmsCurrentNumber : null,
typeof rowHeroSmsCurrentCountdown !== 'undefined' ? rowHeroSmsCurrentCountdown : null,
typeof rowHeroSmsCurrentCode !== 'undefined' ? rowHeroSmsCurrentCode : null,
typeof rowHeroSmsPreferredActivation !== 'undefined' ? rowHeroSmsPreferredActivation : null,
].forEach((row) => {
if (row) {
row.style.display = runtimeVisible ? '' : 'none';
}
});
if (typeof syncSignupPhoneInputFromState === 'function') {
syncSignupPhoneInputFromState(latestState);
}
if (!showSettings && typeof rowHeroSmsPriceTiers !== 'undefined' && rowHeroSmsPriceTiers) {
rowHeroSmsPriceTiers.style.display = 'none';
}
@@ -7008,6 +7018,9 @@ function syncSignupPhoneInputFromState(state = latestState) {
inputSignupPhone.value = signupPhone;
}
if (typeof rowSignupPhone !== 'undefined' && rowSignupPhone) {
const phoneVerificationEnabled = typeof inputPhoneVerificationEnabled !== 'undefined' && inputPhoneVerificationEnabled
? Boolean(inputPhoneVerificationEnabled.checked)
: Boolean(state?.phoneVerificationEnabled || latestState?.phoneVerificationEnabled);
const rawSignupMethod = state?.signupMethod || (
typeof getSelectedSignupMethod === 'function'
? getSelectedSignupMethod()
@@ -7016,7 +7029,7 @@ function syncSignupPhoneInputFromState(state = latestState) {
const selectedMethod = typeof normalizeSignupMethod === 'function'
? normalizeSignupMethod(rawSignupMethod)
: (String(rawSignupMethod || '').trim().toLowerCase() === 'phone' ? 'phone' : 'email');
rowSignupPhone.style.display = (selectedMethod === 'phone' || Boolean(signupPhone)) ? '' : 'none';
rowSignupPhone.style.display = phoneVerificationEnabled && (selectedMethod === 'phone' || Boolean(signupPhone)) ? '' : 'none';
}
}
@@ -7044,7 +7057,7 @@ async function openPlusManualConfirmationDialog(options = {}) {
}
const result = await sharedFormDialog.open({
title: String(options.title || '').trim() || 'GPC OTP 验证',
message: String(options.message || '').trim() || '请输入收到的 OTP 验证码。',
message: String(options.message || '').trim() || '请在WhatsApp里面获取验证码(耐心等待三十秒左右)',
fields: [
{
key: 'otp',