docs(phone-image): 产出排版功能架构文档

fix(phone-image): 修复分页标记丢失bug,消除双数据源问题

- 新增 getContentHtml() 和 updateConfig() 引擎API
- 保存逻辑改用引擎内部 content_html,不再从DOM读取
- doRender 改用 updateConfig,配置变更不重置内容
- loadFromHistory 改用 init+render 全量初始化
- PHP/JS 配置字段对齐(移除template/font,新增pageAlignments)
This commit is contained in:
augushong
2026-05-11 21:17:37 +08:00
parent ba543040fa
commit e9d839ae8a
3 changed files with 359 additions and 25 deletions

View File

@@ -227,15 +227,16 @@
clearTimeout(renderTimer);
renderTimer = setTimeout(function() {
var fontSize = parseInt($('[name="fontSize"]').val()) || 14;
var initConfig = {
var newConfig = {
size: $('[name="size"]').val(),
fontSize: fontSize,
watermark: $('[name="watermark"]').val()
};
if (extraConfig) {
$.extend(initConfig, extraConfig);
$.extend(newConfig, extraConfig);
}
PhoneImageEngine.init(postData, initConfig);
// 关键修改:用 updateConfig 替代 init不重置 postData
PhoneImageEngine.updateConfig(newConfig);
var loadIdx = layer.load();
PhoneImageEngine.render().then(function(pages) {
layer.close(loadIdx);
@@ -264,9 +265,10 @@
size: $('[name="size"]').val(),
fontSize: parseInt($('[name="fontSize"]').val()) || 14,
watermark: $('[name="watermark"]').val(),
content_html: $('#post-content-html').html()
content_html: PhoneImageEngine.getContentHtml()
}, saveConfigUrl).then(function (data) {
if (data.output_id) lastOutputId = data.output_id;
$('#post-content-html').html(PhoneImageEngine.getContentHtml());
layer.msg('保存成功');
}).catch(function (err) {
layer.msg('保存失败: ' + err);
@@ -285,11 +287,12 @@
size: $('[name="size"]').val(),
fontSize: parseInt($('[name="fontSize"]').val()) || 14,
watermark: $('[name="watermark"]').val(),
content_html: $('#post-content-html').html()
content_html: PhoneImageEngine.getContentHtml()
}).then(function (data) {
if (data.output_id) {
lastOutputId = data.output_id;
}
$('#post-content-html').html(PhoneImageEngine.getContentHtml());
layer.msg('保存成功!');
btn.prop('disabled', false).html('<i class="layui-icon layui-icon-picture"></i> 生成并保存');
}).catch(function (err) {
@@ -378,37 +381,45 @@
}
var cfg = res.data.config || {};
// 更新表单控件
// 更新 postData 中的 contentHtml
if (res.data.content_html) {
postData.contentHtml = res.data.content_html;
}
// 构建历史配置
var historyConfig = {};
if (cfg.size) historyConfig.size = cfg.size;
if (cfg.fontSize || cfg.font_size) historyConfig.fontSize = cfg.fontSize || cfg.font_size;
if (cfg.watermark !== undefined) historyConfig.watermark = cfg.watermark;
if (cfg.pageAlignments) historyConfig.pageAlignments = cfg.pageAlignments;
// 同步表单控件
if (cfg.size) {
$('[name="size"]').val(cfg.size);
form.render('select');
}
if (cfg.fontSize || cfg.font_size) {
var fs = cfg.fontSize || cfg.font_size;
$('[name="fontSize"]').val(fs);
$('#fontSizeValue').text(fs + 'px');
if (historyConfig.fontSize) {
$('[name="fontSize"]').val(historyConfig.fontSize);
$('#fontSizeValue').text(historyConfig.fontSize + 'px');
}
if (cfg.watermark !== undefined) {
$('[name="watermark"]').val(cfg.watermark);
}
// 更新内容HTML如果有保存
if (res.data.content_html) {
postData.contentHtml = res.data.content_html;
$('#post-content-html').html(res.data.content_html);
}
// 关闭历史弹窗
lastOutputId = outputId;
layer.closeAll();
// 重新初始化引擎并渲染恢复pageAlignments
lastOutputId = outputId;
var renderConfig = {};
if (cfg.pageAlignments) {
renderConfig.pageAlignments = cfg.pageAlignments;
}
doRender(renderConfig);
layer.msg('已加载历史配置');
// 全量初始化引擎(加载历史是新内容,需要完整初始化
PhoneImageEngine.init(postData, historyConfig);
var loadIdx3 = layer.load();
PhoneImageEngine.render().then(function(pages) {
layer.close(loadIdx3);
layer.msg('已加载历史配置,共 ' + pages.length + ' 页');
}).catch(function(err) {
layer.close(loadIdx3);
if (err !== 'rendering') layer.msg('渲染失败: ' + err);
});
}).fail(function () {
layer.close(loadIdx2);
layer.msg('加载历史配置失败');