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
|
// 完成/删除/催促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() {
|
$(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;
|
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")) {
|
} 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({
|
if (window.mobileTodoConfig.needCaptcha) {
|
||||||
url: window.mobileTodoConfig.ajaxUrl,
|
var captchaContainer = $(".mobile-todo-captcha-container");
|
||||||
type: "POST",
|
if (captchaContainer.length > 0) {
|
||||||
data: {
|
captchaContainer.slideDown(200);
|
||||||
action: "argon_urge_todo",
|
mobilePendingUrgeBtn = btn;
|
||||||
nonce: window.mobileTodoConfig.nonce,
|
|
||||||
id: id,
|
if (window.mobileTodoConfig.captchaType === 'geetest') {
|
||||||
comment_captcha: ""
|
// 极验验证码
|
||||||
},
|
if (!mobileGeetestCaptchaObj && typeof initGeetest4 === 'function') {
|
||||||
success: function(res) {
|
initGeetest4({
|
||||||
if (res.success) {
|
captchaId: window.mobileTodoConfig.geetestId,
|
||||||
btn.addClass("urged").html('<i class="fa fa-check"></i>');
|
product: 'bind'
|
||||||
syncTodoToDesktop(id, "", "urge");
|
}, 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 {
|
} 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操作到桌面端
|
// 同步TODO操作到桌面端
|
||||||
function syncTodoToDesktop(id, content, action) {
|
function syncTodoToDesktop(id, content, action) {
|
||||||
var desktopList = $("#todo-list");
|
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 endforeach; ?>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</ul>
|
</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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -225,10 +244,16 @@ $author_desc = get_option('argon_sidebar_author_description');
|
|||||||
var mobileNonce = '<?php echo $mobile_todo_nonce; ?>';
|
var mobileNonce = '<?php echo $mobile_todo_nonce; ?>';
|
||||||
var mobileAjaxUrl = '<?php echo admin_url('admin-ajax.php'); ?>';
|
var mobileAjaxUrl = '<?php echo admin_url('admin-ajax.php'); ?>';
|
||||||
var mobileIsAuthor = <?php echo $mobile_is_author ? 'true' : 'false'; ?>;
|
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 = {
|
window.mobileTodoConfig = {
|
||||||
nonce: mobileNonce,
|
nonce: mobileNonce,
|
||||||
ajaxUrl: mobileAjaxUrl,
|
ajaxUrl: mobileAjaxUrl,
|
||||||
isAuthor: mobileIsAuthor
|
isAuthor: mobileIsAuthor,
|
||||||
|
needCaptcha: mobileNeedCaptcha,
|
||||||
|
captchaType: mobileCaptchaType,
|
||||||
|
geetestId: mobileGeetestId
|
||||||
};
|
};
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user