feat(widgets): shared tab JS + main posts ajax load_mode

Move category/forum/product tab lazy load into widget-set.js with
skeletons; MainPosts gains load_mode=ajax first-paint placeholders.
This commit is contained in:
kate522 committed 2026-07-21 12:42:58 +08:00
1 parent 6a78b553d6
commit aed056152c
5 files changed
+344 -154

No files matched your search

+1 -45
View File
@@ -50,7 +50,7 @@ class WidgetForumTabTopics extends \WP_Widget {
echo $args['before_title'] . esc_html($title) . $args['after_title']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
echo '<div class="aksrt-ftab widget-tab-posts" id="' . $uid . '" data-aksrt-tabs="1" data-rest="' . esc_url($rest) . '" data-count="' . esc_attr((string) $count) . '" data-style="' . esc_attr($style) . '" data-plate="' . esc_attr((string) $plate) . '">';
echo '<div class="aksrt-ftab widget-tab-posts" id="' . $uid . '" data-aksrt-tabs="1" data-aksrt-ftab="1" data-rest="' . esc_url($rest) . '" data-count="' . esc_attr((string) $count) . '" data-style="' . esc_attr($style) . '" data-plate="' . esc_attr((string) $plate) . '">';
echo '<ul class="aksrt-ftab__nav widget-tab-posts__nav" role="tablist">';
foreach ($tabs as $i => $tab) {
$cls = $i === 0 ? ' is-active' : '';
@@ -78,50 +78,6 @@ class WidgetForumTabTopics extends \WP_Widget {
echo '</div>';
}
echo '</div>';
?>
<script>
(function(){
var root=document.getElementById(<?php echo wp_json_encode($uid); ?>);
if(!root||root._aksrtFtab)return; root._aksrtFtab=1;
var rest=root.getAttribute('data-rest')||'';
var count=root.getAttribute('data-count')||'6';
var style=root.getAttribute('data-style')||'mini';
var plate=root.getAttribute('data-plate')||'0';
var btns=[].slice.call(root.querySelectorAll('.aksrt-ftab__btn'));
var panels=[].slice.call(root.querySelectorAll('.aksrt-ftab__panel'));
function load(panel, orderby){
if(!panel||panel.getAttribute('data-loaded')==='1'||!rest)return;
var qs=new URLSearchParams({page:'1',count:count,orderby:orderby||'date',style:style,plate:plate,period:'all',paginate:'none'});
var url=rest+(rest.indexOf('?')>-1?'&':'?')+qs.toString();
panel.classList.add('is-ajax-loading');
fetch(url,{credentials:'same-origin',headers:{Accept:'application/json','X-WP-Nonce':(window.aksrtData&&aksrtData.restNonce)||''}})
.then(function(r){return r.json()}).then(function(j){
var d=(j&&j.data)||j||{};
var html=d.html||'';
panel.innerHTML=html||'<div class="ajax-item aksrt-ftab__empty muted-2-color">暂无内容</div>';
panel.setAttribute('data-loaded','1');
panel.classList.remove('is-ajax-loading');
}).catch(function(){panel.classList.remove('is-ajax-loading');});
}
function go(i){
btns.forEach(function(b,idx){
var on=idx===i;
b.classList.toggle('is-active',on);
b.setAttribute('aria-selected',on?'true':'false');
});
panels.forEach(function(p,idx){
var on=idx===i;
p.classList.toggle('is-active',on);
if(on){p.removeAttribute('hidden');}else{p.setAttribute('hidden','');}
});
var btn=btns[i], panel=panels[i];
if(btn&&panel) load(panel, btn.getAttribute('data-orderby')||'date');
}
btns.forEach(function(b){ b.addEventListener('click', function(){ go(parseInt(b.getAttribute('data-index')||'0',10)); }); });
})();
</script>
<?php
echo $args['after_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}