fix: 修复移动端 TODO 催促功能无法调出验证码
- 在移动端 TODO 容器中添加验证码输入区域 - 为 mobileTodoConfig 添加验证码相关配置项 - 实现移动端数学验证码输入和提交逻辑 - 实现移动端极验验证码支持 - 添加催促成功/失败的 Toast 提示 - 验证码错误时自动刷新并聚焦输入框 - 催促成功后同步状态到桌面端
This commit is contained in:
177
argontheme.js
177
argontheme.js
@@ -2669,6 +2669,10 @@ $(document).on("click" , "#blog_categories .tag" , function(){
|
||||
});
|
||||
}
|
||||
|
||||
// 移动端 TODO 验证码相关变量
|
||||
var mobilePendingUrgeBtn = null;
|
||||
var mobileGeetestCaptchaObj = null;
|
||||
|
||||
// 完成/删除/催促TODO
|
||||
$(document).on("click", "#mobile-todo-list .mobile-todo-complete-btn, #mobile-todo-list .mobile-todo-delete-btn, #mobile-todo-list .mobile-todo-urge-btn", function() {
|
||||
if (!window.mobileTodoConfig) return;
|
||||
@@ -2723,28 +2727,169 @@ $(document).on("click" , "#blog_categories .tag" , function(){
|
||||
}
|
||||
});
|
||||
} else if (btn.hasClass("mobile-todo-urge-btn") && !btn.hasClass("urged")) {
|
||||
btn.prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i>');
|
||||
$.ajax({
|
||||
url: window.mobileTodoConfig.ajaxUrl,
|
||||
type: "POST",
|
||||
data: {
|
||||
action: "argon_urge_todo",
|
||||
nonce: window.mobileTodoConfig.nonce,
|
||||
id: id,
|
||||
comment_captcha: ""
|
||||
},
|
||||
success: function(res) {
|
||||
if (res.success) {
|
||||
btn.addClass("urged").html('<i class="fa fa-check"></i>');
|
||||
syncTodoToDesktop(id, "", "urge");
|
||||
// 检查是否需要验证码
|
||||
if (window.mobileTodoConfig.needCaptcha) {
|
||||
var captchaContainer = $(".mobile-todo-captcha-container");
|
||||
if (captchaContainer.length > 0) {
|
||||
captchaContainer.slideDown(200);
|
||||
mobilePendingUrgeBtn = btn;
|
||||
|
||||
if (window.mobileTodoConfig.captchaType === 'geetest') {
|
||||
// 极验验证码
|
||||
if (!mobileGeetestCaptchaObj && typeof initGeetest4 === 'function') {
|
||||
initGeetest4({
|
||||
captchaId: window.mobileTodoConfig.geetestId,
|
||||
product: 'bind'
|
||||
}, function(captcha) {
|
||||
mobileGeetestCaptchaObj = captcha;
|
||||
captcha.onReady(function() {
|
||||
captcha.showCaptcha();
|
||||
}).onSuccess(function() {
|
||||
var result = captcha.getValidate();
|
||||
if (result && mobilePendingUrgeBtn) {
|
||||
var urgeId = mobilePendingUrgeBtn.closest(".mobile-todo-item").data("id");
|
||||
doMobileUrgeGeetest(mobilePendingUrgeBtn, urgeId, result);
|
||||
}
|
||||
}).onError(function() {
|
||||
captchaContainer.slideUp(200);
|
||||
mobilePendingUrgeBtn = null;
|
||||
});
|
||||
});
|
||||
} else if (mobileGeetestCaptchaObj) {
|
||||
mobileGeetestCaptchaObj.showCaptcha();
|
||||
}
|
||||
} else {
|
||||
btn.prop("disabled", false).html('<i class="fa fa-bell"></i>');
|
||||
// 数学验证码
|
||||
$("#mobile-todo-captcha-input").val("").focus();
|
||||
}
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 不需要验证码，直接催促
|
||||
doMobileUrge(btn, id, "");
|
||||
}
|
||||
});
|
||||
|
||||
// 移动端数学验证码提交
|
||||
$(document).on("click", "#mobile-todo-captcha-submit", function() {
|
||||
if (!mobilePendingUrgeBtn) return;
|
||||
|
||||
var captchaInput = $("#mobile-todo-captcha-input");
|
||||
var captchaValue = captchaInput.val().trim();
|
||||
|
||||
if (!captchaValue) {
|
||||
captchaInput.focus();
|
||||
return;
|
||||
}
|
||||
|
||||
var id = mobilePendingUrgeBtn.closest(".mobile-todo-item").data("id");
|
||||
doMobileUrge(mobilePendingUrgeBtn, id, captchaValue);
|
||||
});
|
||||
|
||||
// 移动端验证码回车提交
|
||||
$(document).on("keypress", "#mobile-todo-captcha-input", function(e) {
|
||||
if (e.key === "Enter") {
|
||||
$("#mobile-todo-captcha-submit").click();
|
||||
}
|
||||
});
|
||||
|
||||
// 执行移动端催促
|
||||
function doMobileUrge(btn, id, captcha) {
|
||||
btn.prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i>');
|
||||
|
||||
$.ajax({
|
||||
url: window.mobileTodoConfig.ajaxUrl,
|
||||
type: "POST",
|
||||
data: {
|
||||
action: "argon_urge_todo",
|
||||
nonce: window.mobileTodoConfig.nonce,
|
||||
id: id,
|
||||
comment_captcha: captcha
|
||||
},
|
||||
success: function(res) {
|
||||
handleMobileUrgeResponse(btn, res);
|
||||
},
|
||||
error: function() {
|
||||
btn.prop("disabled", false).html('<i class="fa fa-bell"></i>');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 极验验证码催促
|
||||
function doMobileUrgeGeetest(btn, id, geetestResult) {
|
||||
btn.prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i>');
|
||||
|
||||
$.ajax({
|
||||
url: window.mobileTodoConfig.ajaxUrl,
|
||||
type: "POST",
|
||||
data: {
|
||||
action: "argon_urge_todo",
|
||||
nonce: window.mobileTodoConfig.nonce,
|
||||
id: id,
|
||||
lot_number: geetestResult.lot_number,
|
||||
captcha_output: geetestResult.captcha_output,
|
||||
pass_token: geetestResult.pass_token,
|
||||
gen_time: geetestResult.gen_time
|
||||
},
|
||||
success: function(res) {
|
||||
handleMobileUrgeResponse(btn, res);
|
||||
if (mobileGeetestCaptchaObj) mobileGeetestCaptchaObj.reset();
|
||||
},
|
||||
error: function() {
|
||||
btn.prop("disabled", false).html('<i class="fa fa-bell"></i>');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 处理移动端催促响应
|
||||
function handleMobileUrgeResponse(btn, res) {
|
||||
var captchaContainer = $(".mobile-todo-captcha-container");
|
||||
|
||||
if (res.success) {
|
||||
btn.addClass("urged").html('<i class="fa fa-check"></i>');
|
||||
captchaContainer.slideUp(200);
|
||||
mobilePendingUrgeBtn = null;
|
||||
|
||||
// 更新验证码文本
|
||||
if (res.data && res.data.captcha) {
|
||||
$(".mobile-todo-captcha-text").text(res.data.captcha);
|
||||
}
|
||||
|
||||
// 同步到桌面端
|
||||
var id = btn.closest(".mobile-todo-item").data("id");
|
||||
syncTodoToDesktop(id, "", "urge");
|
||||
|
||||
// 显示成功提示
|
||||
if (typeof iziToast !== 'undefined') {
|
||||
iziToast.success({
|
||||
title: '',
|
||||
message: res.data && res.data.message ? res.data.message : '已提醒',
|
||||
position: 'topRight',
|
||||
timeout: 3000
|
||||
});
|
||||
}
|
||||
} else {
|
||||
btn.prop("disabled", false).html('<i class="fa fa-bell"></i>');
|
||||
|
||||
// 显示错误提示
|
||||
if (typeof iziToast !== 'undefined') {
|
||||
iziToast.error({
|
||||
title: '',
|
||||
message: res.data || '操作失败',
|
||||
position: 'topRight',
|
||||
timeout: 3000
|
||||
});
|
||||
}
|
||||
|
||||
// 刷新验证码
|
||||
if (res.data && res.data.captcha) {
|
||||
$(".mobile-todo-captcha-text").text(res.data.captcha);
|
||||
}
|
||||
$("#mobile-todo-captcha-input").val("").focus();
|
||||
}
|
||||
}
|
||||
|
||||
// 同步TODO操作到桌面端
|
||||
function syncTodoToDesktop(id, content, action) {
|
||||
var desktopList = $("#todo-list");
|
||||
|
||||
27
sidebar.php
27
sidebar.php
@@ -217,6 +217,25 @@ $author_desc = get_option('argon_sidebar_author_description');
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</ul>
|
||||
<?php
|
||||
// 移动端验证码容器
|
||||
if (!$mobile_is_author && argon_is_todo_captcha_enabled()) :
|
||||
$mobile_captcha_type = get_option('argon_captcha_type', 'math');
|
||||
?>
|
||||
<div class="mobile-todo-captcha-container" style="display:none; margin-top: 10px; padding: 10px; background: var(--color-foreground); border-radius: 10px;">
|
||||
<?php if ($mobile_captcha_type == 'geetest') : ?>
|
||||
<p style="font-size: 12px; color: #666; margin: 0 0 8px;"><?php _e('请完成验证', 'argon'); ?></p>
|
||||
<?php else : ?>
|
||||
<div style="display: flex; align-items: center; gap: 8px;">
|
||||
<span class="mobile-todo-captcha-text" style="font-family: monospace; font-size: 14px; background: #f0f0f0; padding: 6px 10px; border-radius: 6px; letter-spacing: 2px;"><?php echo argon_generate_captcha(); ?></span>
|
||||
<input type="text" id="mobile-todo-captcha-input" placeholder="<?php _e('验证码', 'argon'); ?>" maxlength="10" style="flex: 1; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 13px; background: var(--color-background);">
|
||||
<button type="button" id="mobile-todo-captcha-submit" style="padding: 8px 12px; background: var(--themecolor); color: #fff; border: none; border-radius: 8px; font-size: 12px; cursor: pointer;">
|
||||
<?php _e('确认', 'argon'); ?>
|
||||
</button>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -225,10 +244,16 @@ $author_desc = get_option('argon_sidebar_author_description');
|
||||
var mobileNonce = '<?php echo $mobile_todo_nonce; ?>';
|
||||
var mobileAjaxUrl = '<?php echo admin_url('admin-ajax.php'); ?>';
|
||||
var mobileIsAuthor = <?php echo $mobile_is_author ? 'true' : 'false'; ?>;
|
||||
var mobileNeedCaptcha = <?php echo (!$mobile_is_author && argon_is_todo_captcha_enabled()) ? 'true' : 'false'; ?>;
|
||||
var mobileCaptchaType = '<?php echo get_option('argon_captcha_type', 'math'); ?>';
|
||||
var mobileGeetestId = '<?php echo get_option('argon_geetest_captcha_id', ''); ?>';
|
||||
window.mobileTodoConfig = {
|
||||
nonce: mobileNonce,
|
||||
ajaxUrl: mobileAjaxUrl,
|
||||
isAuthor: mobileIsAuthor
|
||||
isAuthor: mobileIsAuthor,
|
||||
needCaptcha: mobileNeedCaptcha,
|
||||
captchaType: mobileCaptchaType,
|
||||
geetestId: mobileGeetestId
|
||||
};
|
||||
})();
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user