feat(comments): 评论区按 Zibll 1:1 全量复刻
- 评论项/表单/工具栏/筛选/分页/空状态 DOM 全部替换为 zibll 原始类名 (li.comment、comt-main、comt-meta、list-inline、dropup 工具栏、 theme-pagination/pagenav、post_ajax_loader 骨架等) - 移植 zibll main.css L9412–9751 桌面 + 移动端评论样式, 缺失基础组件(title-theme/dropdown-menu/line-form/tab-nav-theme 等) 以 #comments 作用域补齐 - 删除全部 aksrt-comment__* 旧类名与旧样式,无兼容层 - JS 选择器对齐 zibll DOM:片段整块替换 #postcomments、骨架加载、 跳页输入、prepend 插入、addComment onclick 剥离, 移除 WP comment-reply enqueue 避免双 moveForm - 表情资源替换为 zibll 全套 gif(内容逐字节一致,git 无差异) - REST 后端 (CommentActions) 不变 验证:php -l 全部通过;5 个改动 JS 语法校验通过; node --test tests/widget-system/post-visual-contract.test.cjs 12/12 通过
This commit is contained in:
1 parent
251fe86527
commit
e1f176429b
15 files changed
+1286
-1439
No files matched your search
+23
-25
@@ -5,11 +5,11 @@
|
||||
* Edit uses moveForm (#respond) via comment-move-form.js — not inline textarea.
|
||||
* Submit owned by assets/js/core/comments.js (single submit contract).
|
||||
*
|
||||
* Markup (aksrt_comment_callback):
|
||||
* li.aksrt-comment[data-comment-id]
|
||||
* .comment-header .aksrt-comment__like[data-comment-action=like]
|
||||
* Markup (aksrt_comment_callback, zibll DOM):
|
||||
* li.comment#comment-{id}
|
||||
* .comment-header .action-comment-like[data-comment-action=like] > count
|
||||
* .comment-content#comment-content-{id}
|
||||
* .comt-meta [data-comment-action=pin|approve|hold|spam|delete]
|
||||
* .comt-meta [data-comment-action=pin|approve|hold|delete]
|
||||
*
|
||||
* @package AKSRT
|
||||
*/
|
||||
@@ -19,8 +19,8 @@
|
||||
|
||||
if (!window.aksrtData) return;
|
||||
|
||||
var COMMENT_SELECTOR = '.aksrt-comment, .comment';
|
||||
var CONTENT_SELECTOR = '.aksrt-comment__text, .comment-content';
|
||||
var COMMENT_SELECTOR = 'li.comment';
|
||||
var CONTENT_SELECTOR = '.comment-content';
|
||||
|
||||
var REST_BASE = (aksrtData.siteUrl || '').replace(/\/$/, '') + '/wp-json/aksrt/v1';
|
||||
var REST_NONCE = aksrtData.restNonce || '';
|
||||
@@ -48,6 +48,10 @@
|
||||
var commentEl = actionBtn.closest(COMMENT_SELECTOR);
|
||||
if (!commentEl) return;
|
||||
|
||||
// 操作后收起 ⋮ 菜单
|
||||
var openMenu = actionBtn.closest('span.dropdown.open');
|
||||
if (openMenu) openMenu.classList.remove('open');
|
||||
|
||||
var commentId = getCommentId(commentEl);
|
||||
if (!commentId) return;
|
||||
|
||||
@@ -75,14 +79,9 @@
|
||||
var count = (result.data && result.data.count) || 0;
|
||||
btn.setAttribute('data-active', active ? '1' : '0');
|
||||
btn.setAttribute('aria-pressed', active ? 'true' : 'false');
|
||||
btn.classList.toggle('is-active', active);
|
||||
var icon = btn.querySelector('i');
|
||||
if (icon) { icon.classList.toggle('fa', active); icon.classList.toggle('fa', !active); }
|
||||
var countEl = btn.querySelector('.aksrt-comment__like-count');
|
||||
if (countEl) {
|
||||
countEl.textContent = String(count);
|
||||
if (count > 0) { countEl.removeAttribute('hidden'); } else { countEl.setAttribute('hidden', ''); }
|
||||
}
|
||||
btn.classList.toggle('actived', active);
|
||||
var countEl = btn.querySelector('count');
|
||||
if (countEl) countEl.textContent = String(count);
|
||||
})
|
||||
.catch(function () { notyf('网络错误', 'danger'); })
|
||||
.finally(function () { btn.dataset.busy = ''; });
|
||||
@@ -103,7 +102,7 @@
|
||||
});
|
||||
setTimeout(function () {
|
||||
commentEl.remove();
|
||||
var countEl = document.querySelector('.comments-count');
|
||||
var countEl = document.querySelector('#comments .title-theme small');
|
||||
if (countEl) {
|
||||
var m = (countEl.textContent || '').match(/(\d+)/);
|
||||
if (m) {
|
||||
@@ -134,8 +133,7 @@
|
||||
if (!result.success) { notyf((result.data && result.data.message) || result.message || '操作失败', 'danger'); return; }
|
||||
var pinned = !!(result.data && result.data.pinned);
|
||||
btn.setAttribute('data-pinned', pinned ? '1' : '0');
|
||||
btn.innerHTML = '<i class="fa fas fa-thumbtack" aria-hidden="true"></i> ' + (pinned ? '取消置顶' : '置顶');
|
||||
commentEl.classList.toggle('aksrt-comment--pinned', pinned);
|
||||
btn.innerHTML = '<i class="fa fa-thumbtack mr10 fa-fw" aria-hidden="true"></i>' + (pinned ? '取消置顶' : '设置置顶');
|
||||
syncPinnedBadge(commentEl, pinned);
|
||||
notyf(result.message || (pinned ? '评论已置顶。' : '已取消置顶。'), 'success');
|
||||
})
|
||||
@@ -143,15 +141,15 @@
|
||||
}
|
||||
|
||||
function syncPinnedBadge(commentEl, pinned) {
|
||||
var header = commentEl.querySelector('.aksrt-comment__header, .comment-header');
|
||||
if (!header) return;
|
||||
var badge = header.querySelector('.aksrt-comment__badge--pinned');
|
||||
var name = commentEl.querySelector('.comment-header name');
|
||||
if (!name) return;
|
||||
var badge = name.querySelector('badge.badge-topping');
|
||||
if (pinned && !badge) {
|
||||
badge = document.createElement('span');
|
||||
badge.className = 'aksrt-comment__badge aksrt-comment__badge--pinned';
|
||||
badge.innerHTML = '<i class="fa fas fa-thumbtack" aria-hidden="true"></i> 置顶';
|
||||
var time = header.querySelector('.aksrt-comment__time');
|
||||
header.insertBefore(badge, time || null);
|
||||
badge = document.createElement('badge');
|
||||
badge.className = 'badge-topping jb-blue mr6 flex0';
|
||||
badge.title = '置顶评论';
|
||||
badge.innerHTML = '<i class="fa fa-thumbtack" aria-hidden="true"></i>';
|
||||
name.insertBefore(badge, name.firstChild);
|
||||
} else if (!pinned && badge) {
|
||||
badge.remove();
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user