fix(web): 本地优先保存与 design 页体验修复

- 保存先写本地缓存，登录后可选云端同步；退出登录不再因文件操作跳转登录

- 修复 Layui 遮罩残留、design2 保存后线条、toast 被 finally 提前关闭

- 保存过程恢复 loading spinner；成功提示 2.5 秒

- 云端 payload 瘦身与体积超限提示；后端 schema 迁移与 FileService 容错

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend-web/js/design2/core.js

@@ -552,10 +552,6 @@ function relayoutDesign2Canvas() {
     if (typeof window.soonDesign2ScaleBgSources === 'function') {
         window.soonDesign2ScaleBgSources();
     }
-    if (window.is_bgi_add) {
-        canvas1.requestRenderAll();
-        canvas2.requestRenderAll();
-    }
 }
 
 function soonDesign2ScaleBgSources() {
@@ -572,16 +568,6 @@ function soonDesign2ScaleBgSources() {
     }
 }
 
-function soonDesign2BgOverlayMetrics(imgEl) {
-    if (!imgEl || !imgEl.complete || imgEl.naturalWidth <= 0) return null;
-    var z = zoom || window.zoom || 0.5;
-    var w = parseFloat(imgEl.style.width);
-    if (!w || w <= 0) w = imgEl.naturalWidth * z;
-    var h = parseFloat(imgEl.style.height);
-    if (!h || h <= 0) h = imgEl.naturalHeight * z;
-    return { w: w, h: h };
-}
-
 function soonDesign2PrepareBgSources(done) {
     var sf = document.getElementById('source_front');
     var sb = document.getElementById('source_back');
@@ -634,7 +620,6 @@ function soonDesign2Kickoff() {
 
 window.soonDesign2ScaleBgSources = soonDesign2ScaleBgSources;
 window.soonDesign2PrepareBgSources = soonDesign2PrepareBgSources;
-window.soonDesign2BgOverlayMetrics = soonDesign2BgOverlayMetrics;
 window.soonDesign2Kickoff = soonDesign2Kickoff;
 
 initRulers();
@@ -2037,10 +2022,10 @@ function applyFontList(data) {
         $('#count_font_family').append("<option value='" + item + "'>" + item + '</option>')
     }
 }
-if (typeof ipcRenderer !== 'undefined' && ipcRenderer) {
-    ipcRenderer.on('font-list', function(event, data) { applyFontList(data); })
-} else if (typeof window !== 'undefined' && window.platformBridge && window.platformBridge.getSystemFonts) {
+if (typeof window !== 'undefined' && window.platformBridge && window.platformBridge.getSystemFonts) {
     window.platformBridge.getSystemFonts().then(applyFontList)
+} else if (typeof ipcRenderer !== 'undefined' && ipcRenderer) {
+    ipcRenderer.on('font-list', function(event, data) { applyFontList(data); })
 }
 function applySysLan(data) {
     let lang = localStorage.getItem('lang')

frontend-web/js/design2/output.js

@@ -1096,6 +1096,8 @@ function soonPageDesignType() {
 }
 
 function onCloudWriteDone(res, fallback, callback) {
+  if (typeof window.soonFinishSaveUi === 'function') window.soonFinishSaveUi();
+  else if (typeof window.soonCleanupLayerMask === 'function') window.soonCleanupLayerMask();
   applyCloudWriteResult(res, fallback);
   if (res && res.fileKey && typeof window.soonClearPendingImport === 'function') {
     window.soonClearPendingImport();
@@ -1103,7 +1105,12 @@ function onCloudWriteDone(res, fallback, callback) {
   if (typeof window.soonRecentOnCloudSave === 'function') {
     window.soonRecentOnCloudSave(res, fallback, soonPageDesignType());
   }
-  layer.msg(language_str('saveSucc') + cloudSaveSuccessLabel(res, fallback));
+  var msg = language_str('saveSucc') + cloudSaveSuccessLabel(res, fallback);
+  if (res && res.syncFailed) {
+    msg = '已保存到本地，云端同步失败';
+  }
+  if (typeof window.soonToast === 'function') window.soonToast(msg, res && res.syncFailed ? 'warn' : 'success');
+  else layer.msg(msg, { shade: 0, time: 2500 });
   if (callback && typeof callback === 'function') callback();
 }
 
@@ -1147,6 +1154,7 @@ function saveAs(op1, callback) {
     if (!guardWebSave()) return;
     var prevOpenKey = openAs.name || '';
     if (typeof window.soonApplySavePreview === 'function') window.soonApplySavePreview(con_o, canvas1);
+    if (typeof window.soonRefreshDesignCanvases === 'function') window.soonRefreshDesignCanvases();
     con_o.soonType = 2;
     var dialogApi = (typeof dialog !== 'undefined' && dialog) ? dialog : (window.platformBridge && window.platformBridge.showSaveDialog ? { showSaveDialog: function(opts) { return window.platformBridge.showSaveDialog(opts); } } : null);
     if (!dialogApi) return;
@@ -1166,7 +1174,8 @@ function saveAs(op1, callback) {
             if (fs) {
                 fs.writeFileSync(fp, content, 'utf8');
                 openAs.name = fp;
-                layer.msg(language_str('saveSucc') + openAs.name);
+                if (typeof window.soonToast === 'function') window.soonToast(language_str('saveSucc') + openAs.name, 'success');
+                else layer.msg(language_str('saveSucc') + openAs.name, { shade: 0 });
                 saveHistory();
                 if (callback && typeof callback === 'function') callback();
             }
@@ -1212,6 +1221,7 @@ function save(op1, callback) {
     if (!guardWebSave()) return;
     var prevOpenKey = openAs.name || '';
     if (typeof window.soonApplySavePreview === 'function') window.soonApplySavePreview(con_o, canvas1);
+    if (typeof window.soonRefreshDesignCanvases === 'function') window.soonRefreshDesignCanvases();
     con_o.soonType = 2;
     var content = JSON.stringify(con_o);
     var needsDialog = typeof window.soonNeedsSaveDialog === 'function'
@@ -1225,7 +1235,8 @@ function save(op1, callback) {
         var fs = typeof require !== 'undefined' ? require('fs') : null;
         if (fs) {
             fs.writeFileSync(openAs.name, content, 'utf8');
-            layer.msg(language_str('saveSucc') + openAs.name);
+            if (typeof window.soonToast === 'function') window.soonToast(language_str('saveSucc') + openAs.name, 'success');
+            else layer.msg(language_str('saveSucc') + openAs.name, { shade: 0 });
             saveHistory();
             if (callback && typeof callback === 'function') callback();
         }
@@ -1248,7 +1259,8 @@ function save(op1, callback) {
             if (fs) {
                 fs.writeFileSync(fp, content, 'utf8');
                 openAs.name = fp;
-                layer.msg(language_str('saveSucc') + openAs.name);
+                if (typeof window.soonToast === 'function') window.soonToast(language_str('saveSucc') + openAs.name, 'success');
+                else layer.msg(language_str('saveSucc') + openAs.name, { shade: 0 });
                 saveHistory();
                 if (callback && typeof callback === 'function') callback();
             }
@@ -1529,6 +1541,9 @@ window.openFile = function open(file, jAlready) {
         }).catch(function () {
             if (typeof window.soonReportOpenLoadError === 'function') window.soonReportOpenLoadError('模板/文件加载失败');
             else if (typeof window.soonHideOpenFileLoading === 'function') window.soonHideOpenFileLoading();
+        }).finally(function () {
+            if (typeof window.soonHideOpenFileLoading === 'function') window.soonHideOpenFileLoading();
+            if (typeof window.soonCleanupLayerMask === 'function') window.soonCleanupLayerMask();
         });
     }
     try {

frontend-web/js/design2/ui.js

@@ -365,8 +365,6 @@ $('#version_change').click(function () {
         if (typeof window.soonDesign2ScaleBgSources === 'function') {
             window.soonDesign2ScaleBgSources()
         }
-        canvas1.requestRenderAll()
-        canvas2.requestRenderAll()
     }
     sf.onerror = sf.onload
     sf.src = soonAsset('front_bg' + bg_version + '_2.png')
@@ -2703,42 +2701,10 @@ if (typeof window._design2CanvasEventsInitialized === 'undefined') {
     // - mouse:up (已在 core.js 中处理)
     // 如果需要 canvas1 特定的处理逻辑，请修改 core.js 中的相应函数
 
-    // 保留 canvas1 特定的 after:render 处理
-    canvas1.on('after:render', function () {
-        if (!window.is_bgi_add) return
-        var image = document.getElementById('source_front')
-        var metrics = typeof window.soonDesign2BgOverlayMetrics === 'function'
-            ? window.soonDesign2BgOverlayMetrics(image)
-            : null
-        if (!metrics) return
-        ctx1.drawImage(
-            image,
-            (canvas1.width - metrics.w) / 2,
-            (canvas1.height - metrics.h) / 2,
-            metrics.w,
-            metrics.h
-        )
-    })
     // 保留 canvas1 特定的 text:changed 处理
     canvas1.on('text:changed', (e) => {
         $('#text_text').val(e.target.get('text'))
     })
-    // 保留 canvas2 特定的 after:render 处理
-    canvas2.on('after:render', function () {
-        if (!window.is_bgi_add) return
-        var image = document.getElementById('source_back')
-        var metrics = typeof window.soonDesign2BgOverlayMetrics === 'function'
-            ? window.soonDesign2BgOverlayMetrics(image)
-            : null
-        if (!metrics) return
-        ctx2.drawImage(
-            image,
-            (canvas2.width - metrics.w) / 2,
-            (canvas2.height - metrics.h) / 2,
-            metrics.w,
-            metrics.h
-        )
-    })
     requestAnimationFrame(function () {
         requestAnimationFrame(function () {
             if (typeof window.soonDesign2Kickoff === 'function') {