56 lines
6.3 KiB
Markdown
56 lines
6.3 KiB
Markdown
# 多栏目文章新版源码复核
|
||
|
||
参考目录：`C:\Users\Xing\Desktop\zibll`。本次只对照新版 `zib_widget_ui_tab_post`，没有引入旧版模块、兼容分支或配置迁移，也没有进行浏览器截图或真实视觉效果验收。
|
||
|
||
## 参考依据
|
||
|
||
- `inc/widgets/widget-posts.php`：`zib_widget_ui_tab_post()`、`zib_widget_ui_tab_post_ajax()` 及新版字段声明。默认 mini、6 篇文章，支持 list/card/mini，首栏目直出、其他栏目按需加载，各栏目保存自己的内容。
|
||
- `inc/functions/zib-posts-list.php`：`zib_posts_mini_while()`、`zib_posts_mian_list_list()`、`zib_posts_mian_list_card()`。mini 独立输出紧凑行，list 禁用多图/无图变体；文章作者使用带主页链接及角标的头像框。
|
||
- `inc/csf-framework/classes/widget-options.class.php`：统一布局外壳、`widget-container`、模块间距、日夜背景和入场动画。
|
||
- `css/main.css`：mini 两栏/全宽三栏/侧栏与移动端单栏、栏目导航、文章与分页间距；标题沿用 Bootstrap 默认 500 字重，显式加粗配置另行生效。
|
||
- `inc/functions/functions.php`：追加分页的末页边界，以及数字分页的首尾、相邻页、省略号、上一页/下一页和跳转。
|
||
|
||
## 修复内容
|
||
|
||
- 将外壳、骨架和内容的样式选择统一到 `PostRenderer::style()`，缺省多栏目文章始终使用 mini，后续 AJAX 页面沿用相同规则。
|
||
- 新版多栏目文章走统一参考外壳，补回全宽区域的居中限宽容器，并应用 PC/移动端额外间距、日夜背景和动画。
|
||
- 小工具显式关闭页面上下文及无间距布局。修正共享渲染器对显式 `no_margin=false` 的处理，避免首页的无间距设置改写小工具；普通页面未显式指定时仍继承站点设置。
|
||
- 修正公共标题排版对小工具的覆盖，恢复默认标题字重、mini 文本颜色、行高及紧凑行的对齐方式，同时保留显式加粗。
|
||
- 作者信息改用现有统一头像框，恢复主页链接与角标。清理不再消费的裸头像 URL 字段；mini 日期按参考主题使用列表排序的时间来源。
|
||
- 数字分页补回首尾、上一页/下一页、省略号、桌面/移动端不同的窗口及跳页；恢复参考分页尺寸，避免公共分页样式将按钮和跳转框撑大。
|
||
- 追加分页到末页不再生成下一页按钮；请求失败重试保留失败页及追加方式，避免覆盖已有文章。
|
||
- 栏目切换保留已加载内容和页码；溢出导航按实际元素矩形居中，支持键盘切换；AJAX 成功后初始化新文章的图片和公共交互。
|
||
- 移除重复的 Bootstrap Tab 触发属性、失效的旧栏目选择器及未使用的 `widget_style` 配置字段。新版栏目只有一个交互处理入口。
|
||
|
||
## 验证方式
|
||
|
||
- `tab-posts-render-harness.php` 加载实际文章数据收集、配置和 markup 模块，生成有文章的 default/mini/list/card、分页、移动端及完整前端外壳输出。没有使用空查询或假文章渲染器代替真实内容。
|
||
- `tab-posts-render-behavior.test.cjs` 检查上述输出、未归一化参数、页面上下文隔离、分页边界、头像及时间来源。
|
||
- `tab-posts-runtime.test.cjs` 在 Node VM 中运行实际前端脚本，验证栏目缓存、键盘焦点、导航滚动、追加重试、跳页及与旧运行时事件隔离。
|
||
- `tab-posts-style-contract.test.cjs` 检查覆盖公共排版/分页样式所需的局部选择器及桌面、移动端样式契约。
|
||
- 验证范围为源码、渲染输出、脚本行为和构建检查；不将这些检查描述为像素级视觉验收。
|
||
|
||
上一轮结果：仓库全部 Node 测试 785/785 通过（包含本次新增 24 项）；小工具 PHP 测试 139 条断言通过；修改的 7 个 PHP 文件语法检查、前端 JS 语法检查、CSS 解析、后台 SPA 构建及差异空白检查通过。
|
||
|
||
## mini 付费标签补充复核
|
||
|
||
对照 `zib_get_posts_list_pay_badge()`、`zibpay_get_pay_type_icon()`、`zibpay_get_points_mark()`、`zibpay_get_vip_icon()` 及对应 CSS，修正以下差异：
|
||
|
||
- compact 标签直接从标准付费元数据读取公开价格，独立渲染类型图标、`em09` 货币/积分符号和金额；不复用大列表的整段价格文案或当前用户折扣价。
|
||
- 免费内容先于购买等级限制判断，显示类型图标与“免费”，提示文字使用对应免费类型；会员专属只在会员功能启用时使用相应等级的 VIP 标签。
|
||
- VIP 图片恢复 `img-icon mr3`、通用图片懒加载及会员名称提示，删除证书字形替代与强制 1em 正方形图片规则，保持图文同行和图片原有比例。
|
||
- 在小工具样式中固定付费标签的 4px 水平内边距，消除公共按钮样式在不同页面覆盖造成的差别；非链接标签恢复普通光标。
|
||
- `mini-pay-badge-reference.test.cjs` 检查真实 mini 渲染输出的四种付费类型、现金、积分、免费、两级 VIP、会员开关、标签位置和样式规则。
|
||
|
||
补充验证结果：新增 6 项付费标签测试通过，仓库全部 Node 测试 791/791 通过；139 条 PHP 断言、修改文件的 PHP 语法检查、CSS 解析、公共资源构建、后台 SPA 构建和差异空白检查通过。未进行真实视觉效果验收。
|
||
|
||
## 分页骨架加载时机修复
|
||
|
||
对照参考主题 `js/main.js` 中 `post_ajax()` 的 `beforeSend`：替换分页需要在发出请求前移除旧文章，骨架才会占据新页内容的位置。原实现直到响应成功才移除旧文章，导致数字分页和跳页期间骨架仍追加在旧页下方。
|
||
|
||
- 替换请求先暂存并移除旧页内容和分页控件，保留同一个骨架节点；成功时插入新页，失败时恢复原节点，并允许重试目标页。
|
||
- 追加请求继续保留已有文章，在末尾展示骨架。合并响应成功后的内容插入逻辑，删除延迟清空旧页的重复分支。
|
||
- 新增 4 项请求尚未完成时的行为测试，覆盖数字分页、连续切页、失败恢复与重试、加载更多、跳页和栏目隔离；修复测试 DOM 对后代选择器的匹配，确保栏目隔离断言定位到正确栏目。
|
||
|
||
验证结果：全部 Node 测试 795/795 通过，139 条 PHP 断言通过，前端脚本语法、公共资源构建、后台 SPA 构建和差异空白检查通过。未进行真实视觉效果验收。
|