print-design-myprint 1.0.13 → 1.0.15

package/dist/index.full.js

@@ -1,6 +1,6 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('pinia'), require('vue-cropper/dist/index.css'), require('/Users/miro/Desktop/project/myprint/packages/design/src/components/design/image/image.vue?vue&type=style&index=0&scoped=923ed041&lang.css'), require('/Users/miro/Desktop/project/myprint/packages/design/src/components/preview/preview-panel.vue?vue&type=style&index=0&scoped=f905598e&lang.css'), require('vue3-colorpicker/style.css')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'vue', 'pinia', 'vue-cropper/dist/index.css', '/Users/miro/Desktop/project/myprint/packages/design/src/components/design/image/image.vue?vue&type=style&index=0&scoped=923ed041&lang.css', '/Users/miro/Desktop/project/myprint/packages/design/src/components/preview/preview-panel.vue?vue&type=style&index=0&scoped=f905598e&lang.css', 'vue3-colorpicker/style.css'], factory) :
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('pinia'), require('vue-cropper/dist/index.css'), require('/Users/miro/Desktop/project/myprint/packages/design/src/components/design/image/image.vue?vue&type=style&index=0&scoped=923ed041&lang.css'), require('vue3-colorpicker/style.css')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'vue', 'pinia', 'vue-cropper/dist/index.css', '/Users/miro/Desktop/project/myprint/packages/design/src/components/design/image/image.vue?vue&type=style&index=0&scoped=923ed041&lang.css', 'vue3-colorpicker/style.css'], factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.MyPrinterDesign = {}, global.Vue, global.pinia));
 })(this, (function (exports, vue, pinia) { 'use strict';
 
@@ -25787,6 +25787,7 @@
       panel.elementList = snapshot.panel.elementList;
       panel.pageHeader = snapshot.panel.pageHeader;
       panel.pageFooter = snapshot.panel.pageFooter;
+      normalizePanelStructure(panel);
       installPanelParentElement(panel);
       updatePanel();
     }
@@ -25801,6 +25802,7 @@
       panel.elementList = snapshot.panel.elementList;
       panel.pageHeader = snapshot.panel.pageHeader;
       panel.pageFooter = snapshot.panel.pageFooter;
+      normalizePanelStructure(panel);
       installPanelParentElement(panel);
       updatePanel();
     }
@@ -34100,11 +34102,103 @@
       return element.runtimeOption.previewIs;
     }
     function setCurrentPanel(panel) {
+      normalizePanelStructure(panel);
       useAppStoreHook().currentPanel = panel;
       useAppStoreHook().lastPageUnit = panel.pageUnit;
     }
+    function clonePanelForPreview(source) {
+      const cloned = parse$4(
+        stringify$1(source, "target", "parent", "cellParent"),
+        vue.reactive({})
+      );
+      if (cloned.runtimeOption == null) {
+        cloned.runtimeOption = {};
+      } else {
+        const { printRealHeight: _printRealHeight, ...runtimeRest } = source.runtimeOption;
+        cloned.runtimeOption = runtimeRest;
+      }
+      normalizePanelStructure(cloned);
+      cloned.width == null && (cloned.width = _defaultNum(0, 210));
+      cloned.height == null && (cloned.height = _defaultNum(0, 297));
+      if (cloned.pageUnit == null) {
+        cloned.pageUnit = "mm";
+      }
+      if (cloned.pageSize == null) {
+        cloned.pageSize = "A4";
+      }
+      installPanelParentElement(cloned);
+      for (let i = 0; i < cloned.elementList.length; i++) {
+        parentInitElement(cloned, cloned, cloned.elementList[i], i);
+      }
+      cloned.pageHeader && parentInitElement(cloned, cloned, cloned.pageHeader, 0);
+      cloned.pageFooter && parentInitElement(cloned, cloned, cloned.pageFooter, 0);
+      return cloned;
+    }
+    function clearPanelPreviewRuntimeFlags(panel) {
+      var _a, _b;
+      if (panel == null) {
+        return;
+      }
+      const walk = (el) => {
+        var _a2, _b2, _c, _d;
+        if (el == null) {
+          return;
+        }
+        if (el.runtimeOption) {
+          el.runtimeOption.previewIs = false;
+          el.runtimeOption.target = void 0;
+        }
+        if ((_a2 = el.elementList) == null ? void 0 : _a2.length) {
+          for (const child of el.elementList) {
+            walk(child);
+          }
+        }
+        if (el.type === "DataTable") {
+          for (const row of (_b2 = el.tableHeadList) != null ? _b2 : []) {
+            for (const cell of row != null ? row : []) {
+              walk(cell != null ? cell : void 0);
+            }
+          }
+          for (const row of (_c = el.tableBodyList) != null ? _c : []) {
+            for (const cell of row != null ? row : []) {
+              walk(cell != null ? cell : void 0);
+            }
+          }
+          for (const row of (_d = el.statisticsList) != null ? _d : []) {
+            for (const cell of row != null ? row : []) {
+              walk(cell != null ? cell : void 0);
+            }
+          }
+        }
+      };
+      walk(panel.pageHeader);
+      walk(panel.pageFooter);
+      for (const el of (_a = panel.elementList) != null ? _a : []) {
+        walk(el);
+      }
+      if (((_b = panel.runtimeOption) == null ? void 0 : _b.printRealHeight) != null && panel.pageSize !== "AutoHeight") {
+        const { printRealHeight: _printRealHeight, ...runtimeRest } = panel.runtimeOption;
+        panel.runtimeOption = runtimeRest;
+      }
+    }
+    function normalizePanelStructure(panel) {
+      if (panel == null) {
+        return;
+      }
+      if (!Array.isArray(panel.elementList)) {
+        panel.elementList = [];
+      }
+      if (!Array.isArray(panel.groupList)) {
+        panel.groupList = [];
+      }
+      if (!Array.isArray(panel.auxiliaryLineList)) {
+        panel.auxiliaryLineList = [];
+      }
+    }
     function getCurrentPanel(panel) {
-      return panel != null ? panel : useAppStoreHook().currentPanel;
+      const current = panel != null ? panel : useAppStoreHook().currentPanel;
+      normalizePanelStructure(current);
+      return current;
     }
     function setPreviewData(previewData) {
       useAppStoreHook().previewData = previewData == null ? [] : previewData;
@@ -34157,9 +34251,7 @@
       panel.pageUnit == null && (panel.pageUnit = _defaultVal(provider.value.pageUnit, "mm"));
       panel.dragSnapPanelIs == null && (panel.dragSnapPanelIs = provider.value.dragSnapPanelIs);
       panel.dragSnapIs == null && (panel.dragSnapIs = provider.value.dragSnapIs);
-      panel.elementList == void 0 && (panel.elementList = []);
-      panel.groupList == null && (panel.groupList = []);
-      panel.auxiliaryLineList == null && (panel.auxiliaryLineList = []);
+      normalizePanelStructure(panel);
     }
     function none$1(element) {
       if (element == null) {
@@ -34534,16 +34626,20 @@
       return -1;
     }
     function element2PreviewWrapper(element) {
+      var _a;
       const previewWrapper = parse$4(stringify$1(element, "parent", "target", "elementList", "previewWrapperList", "nestColumnList"), vue.reactive({}));
       previewWrapper.id = generateUUID();
       previewWrapper.heightIs = true;
       if (previewWrapper.runtimeOption == null) {
         previewWrapper.runtimeOption = {};
       }
-      if (element.runtimeOption != null) {
+      if (((_a = element.runtimeOption) == null ? void 0 : _a.parent) != null) {
         previewWrapper.runtimeOption.parent = element.runtimeOption.parent;
       }
       previewWrapper.runtimeOption.previewIs = true;
+      if (previewWrapper.data == null && element.data != null) {
+        previewWrapper.data = element.data;
+      }
       if (previewWrapper.option == null) {
         previewWrapper.option = {};
       }
@@ -35395,6 +35491,7 @@
           clearEventBubble(ev);
           dragNewElement(element.runtimeOption.target, ev);
           function mouseMove(evMove) {
+            var _a;
             let diffXNum = -evMove.clientX + appStore.panelPosition.x;
             let diffYNum = -evMove.clientY + appStore.panelPosition.y;
             if (diffXNum < 0) {
@@ -35430,7 +35527,8 @@
                   panel.pageFooter.runtimeOption.dragInIs = true;
                   parentElement = panel.pageFooter;
                 } else {
-                  for (let elementOf of panel.elementList) {
+                  const canvasList = (_a = getCurrentPanel().elementList) != null ? _a : [];
+                  for (const elementOf of canvasList) {
                     if (elementOf.type == "Container" && innerElementIs(point, element, elementOf)) {
                       elementOf.runtimeOption.dragInIs = true;
                       parentElement = elementOf;
@@ -76534,10 +76632,30 @@
         const style = vue.computed(() => {
           return elementCommonStyle(props.element);
         });
+        function syncTextContent() {
+          const raw = props.element.data;
+          if (raw != null && raw !== "") {
+            data.content = n2br(raw);
+            data.innerContent = raw;
+            return;
+          }
+          if (displayPreview(props.element)) {
+            const elementData = formatter(props.element);
+            if (elementData != null) {
+              props.element.data = elementData;
+              data.content = n2br(elementData);
+              data.innerContent = elementData;
+            }
+          }
+        }
+        vue.watchEffect(() => {
+          if (displayPreview(props.element)) {
+            syncTextContent();
+          }
+        });
         vue.onMounted(() => {
-          data.content = n2br(props.element.data);
-          data.innerContent = data.content;
-          if (props.element.data == null) {
+          syncTextContent();
+          if (!displayPreview(props.element) && props.element.data == null) {
             const elementData = formatter(props.element);
             if (elementData != null) {
               props.element.data = elementData;
@@ -78396,13 +78514,13 @@
       class: "choose-img_wrapper"
     };
     const _hoisted_6$1 = { style: { "width": "640px", "height": "640px" } };
-    const _hoisted_7$1 = { class: "image-handle-wrapper" };
-    const _hoisted_8$1 = { class: "choose-image-type-dialog-header display-flex" };
-    const _hoisted_9$1 = {
+    const _hoisted_7 = { class: "image-handle-wrapper" };
+    const _hoisted_8 = { class: "choose-image-type-dialog-header display-flex" };
+    const _hoisted_9 = {
       key: 0,
       class: "choose-image-localFile-panel display-flex"
     };
-    const _hoisted_10$1 = {
+    const _hoisted_10 = {
       key: 1,
       class: "choose-image-url-panel display-flex display-flex-column"
     };
@@ -78694,7 +78812,7 @@
                     onImgLoad: imgLoad
                   }, null, 8, ["img", "outputSize", "outputType", "info", "canScale", "autoCrop", "autoCropWidth", "autoCropHeight", "fixed", "fixedNumber", "full", "fixedBox", "canMove", "canMoveBox", "original", "centerBox", "height", "infoTrue", "maxImgSize", "enlarge", "mode"])
                 ]),
-                vue.createElementVNode("div", _hoisted_7$1, [
+                vue.createElementVNode("div", _hoisted_7, [
                   vue.createVNode(MyIcon, {
                     class: "image-handle-icon",
                     onClick: imageZoomIn
@@ -78759,7 +78877,7 @@
               width: "520px"
             }, {
               default: vue.withCtx(() => [
-                vue.createElementVNode("div", _hoisted_8$1, [
+                vue.createElementVNode("div", _hoisted_8, [
                   vue.createCommentVNode('        <div class="choose-image-type-dialog-header_tab">'),
                   vue.createCommentVNode('          <div class="choose-image-type-dialog-header-title">\u672C\u5730\u4E0A\u4F20</div>'),
                   vue.createCommentVNode('          <div class="choose-image-type-dialog-header-title">\u56FE\u7247\u94FE\u63A5</div>'),
@@ -78783,13 +78901,13 @@
                     /* STABLE */
                   })
                 ]),
-                vue.unref(data).chooseImageType == "localFile" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9$1, [
+                vue.unref(data).chooseImageType == "localFile" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9, [
                   vue.createElementVNode("div", {
                     class: "choose-image-localFile-btn",
                     onClick: chooseImage
                   }, "\u4E0A\u4F20\u672C\u5730\u56FE\u7247")
                 ])) : vue.createCommentVNode("v-if", true),
-                vue.unref(data).chooseImageType == "url" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$1, [
+                vue.unref(data).chooseImageType == "url" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, [
                   vue.createVNode(MyInput, {
                     class: "choose-image-url-input",
                     placeholder: "\u8BF7\u8F93\u5165\u7F51\u7EDC\u5730\u5740http/https",
@@ -81504,17 +81622,20 @@
       },
       setup(__props) {
         const style = vue.computed(() => {
+          var _a, _b;
           const _style = {
             width: valueUnit(props.preview.width, getRecursionParentPanel(props.preview)),
             left: valueUnit(props.preview.x, getRecursionParentPanel(props.preview)),
             top: valueUnit(props.preview.y, getRecursionParentPanel(props.preview)),
-            zIndex: props.preview.runtimeOption.index
+            zIndex: (_a = props.preview.runtimeOption) == null ? void 0 : _a.index
           };
-          if (props.preview.option.rotate != null) {
+          if (((_b = props.preview.option) == null ? void 0 : _b.rotate) != null) {
             _style.transform = `rotate(${props.preview.option.rotate}deg)`;
           }
           if (props.preview.heightIs) {
             _style.height = valueUnit(props.preview.height, getRecursionParentPanel(props.preview));
+          } else if (props.preview.height != null && (props.preview.type === "Text" || props.preview.type === "TextTime" || props.preview.type === "PageNum")) {
+            _style.minHeight = valueUnit(props.preview.height, getRecursionParentPanel(props.preview));
           }
           return _style;
         });
@@ -81667,7 +81788,10 @@
     }
     function normalizePreviewRecords(panel, previewDataList) {
       var _a;
-      if (!panelHasDataTable(panel) || previewDataList.length === 0) {
+      if (previewDataList.length === 0) {
+        previewDataList = [{}];
+      }
+      if (!panelHasDataTable(panel)) {
         return { records: previewDataList, tableBodyRows: null };
       }
       if (previewDataList.length > 1) {
@@ -81700,9 +81824,9 @@
       }
       return [{}];
     }
-    async function autoPage(previewEl, pageList, panel, previewDataList, measurePageList) {
-      var _a, _b;
-      const measureList = measurePageList != null ? measurePageList : pageList;
+    async function autoPage(previewEl, pageList, panel, previewDataList) {
+      var _a, _b, _c;
+      normalizePanelStructure(panel);
       if (previewDataList == null) {
         previewDataList = [{}];
       } else if (!Array.isArray(previewDataList)) {
@@ -81712,7 +81836,6 @@
         previewDataList = [{}];
       }
       const { records: previewRecords, tableBodyRows } = normalizePreviewRecords(panel, previewDataList);
-      const pagesBuffer = [];
       const variable = {
         pageIndex: 0,
         pageSize: 0,
@@ -81734,7 +81857,7 @@
         pagingRepetition: true,
         tableBodyRows
       };
-      for (let myElement of previewContext.panel.elementList) {
+      for (let myElement of (_a = previewContext.panel.elementList) != null ? _a : []) {
         handleElement(myElement);
       }
       if (previewContext.panel.pageHeader) {
@@ -81793,31 +81916,23 @@
         }
       }
       previewContext.autoPageIs = false;
-      variable.pageSize = pagesBuffer.length;
-      for (let i = 0; i < pagesBuffer.length; i++) {
-        previewContext.currentPage = pagesBuffer[i];
+      variable.pageSize = pageList.length;
+      for (let i = 0; i < pageList.length; i++) {
+        previewContext.currentPage = pageList[i];
         variable.pageIndex = i + 1;
-        if (measureList !== pageList) {
-          measureList.splice(0, measureList.length, pagesBuffer[i]);
-          await vue.nextTick();
-        }
         await installPreviewElement(fixedPreviewElementList);
       }
       if (panel.pageSize == "AutoHeight") {
         await vue.nextTick();
-        const lastElementChild = (_b = (_a = previewEl.value) == null ? void 0 : _a[0]) == null ? void 0 : _b.lastElementChild;
+        const lastElementChild = (_c = (_b = previewEl.value) == null ? void 0 : _b[0]) == null ? void 0 : _c.lastElementChild;
         if (lastElementChild) {
           const rect = lastElementChild.getBoundingClientRect();
-          pagesBuffer[0].height = px2unit(rect.bottom, panel);
-          panel.runtimeOption.printRealHeight = pagesBuffer[0].height;
+          pageList[0].height = px2unit(rect.bottom, panel);
+          panel.runtimeOption.printRealHeight = pageList[0].height;
         }
       }
-      pageList.splice(0, pageList.length, ...pagesBuffer);
-      if (measureList !== pageList) {
-        measureList.length = 0;
-      }
       async function installPreviewElement(previewElementList2) {
-        var _a2, _b2, _c;
+        var _a2, _b2, _c2, _d, _e, _f;
         for (let i = 0; i < previewElementList2.length; i++) {
           const oldPreviewWrapper = previewElementList2[i];
           let previewWrapper = element2PreviewWrapper(previewElementList2[i]);
@@ -81863,13 +81978,13 @@
           previewContext.currentPreview = previewWrapper;
           let previewDataTmp;
           if (previewWrapper.field) {
-            previewDataTmp = previewContext.previewData[previewWrapper.field];
+            previewDataTmp = (_c2 = previewContext.previewData) == null ? void 0 : _c2[previewWrapper.field];
           }
-          if (!previewDataTmp) {
+          if (previewDataTmp == null) {
             previewDataTmp = formatter(previewWrapper, variable);
           }
-          if (!previewDataTmp) {
-            previewDataTmp = previewWrapper.data;
+          if (previewDataTmp == null) {
+            previewDataTmp = (_d = previewWrapper.data) != null ? _d : oldPreviewWrapper.data;
           }
           if (previewWrapper.type == "Image") {
             previewWrapper.data = previewDataTmp;
@@ -81893,11 +82008,13 @@
             }
             previewWrapper.data = previewDataTmp;
             if (previewWrapper.contentType === "Text") {
-              if (previewDataTmp) {
-                previewDataTmp = replaceSpacesOutsideHTMLTags(previewDataTmp);
-                previewWrapper.data = previewDataTmp;
+              const textPayload = previewDataTmp != null ? String(previewDataTmp) : (_e = previewWrapper.data) != null ? _e : "";
+              if (textPayload) {
+                previewWrapper.data = replaceSpacesOutsideHTMLTags(textPayload);
+              } else {
+                previewWrapper.data = textPayload;
               }
-              await autoTextElement(previewDataTmp, true);
+              await autoTextElement(previewWrapper.data, true);
             } else if (previewWrapper.contentType === "QrCode" || previewWrapper.contentType === "Barcode") {
               previewContext.currentPage.previewWrapperList.push(previewWrapper);
               await vue.nextTick();
@@ -81907,7 +82024,7 @@
             }
           } else if (previewWrapper.type == "DataTable") {
             const source = previewElementList2[i];
-            const tableRowIndex = (_c = source.previewTableRowIndex) != null ? _c : 0;
+            const tableRowIndex = (_f = source.previewTableRowIndex) != null ? _f : 0;
             const tableRows = resolveTableBodyRows(previewContext, previewWrapper, previewDataTmp);
             await autoTableRow(previewContext, tableRows, tableRowIndex, source);
             if (!previewContext.pagingRepetition) {
@@ -81938,7 +82055,10 @@
             previewContext.currentPage.previewWrapperList.push(previewWrapper);
           }
           if (!previewContext.currentPreview.heightIs) {
-            previewContext.currentPage.offsetTop = await computeBottom(previewContext.currentPreview);
+            const bottom = await computeBottom(previewContext.currentPreview);
+            if (bottom != null) {
+              previewContext.currentPage.offsetTop = bottom;
+            }
           }
           previewContext.currentPreview = previewWrapper;
         }
@@ -81946,16 +82066,19 @@
       async function autoTextElement(previewData, first) {
         var _a2, _b2;
         let previewWrapper = previewContext.currentPreview;
-        previewWrapper.data = previewData;
-        previewWrapper.heightIs = false;
+        const textData = (_a2 = previewData != null ? previewData : previewWrapper.data) != null ? _a2 : "";
+        previewWrapper.data = textData;
+        const measureAutoHeight = ((_b2 = previewWrapper.option) == null ? void 0 : _b2.autoTextHeight) === true;
+        previewWrapper.heightIs = !measureAutoHeight;
         previewContext.currentPage.previewWrapperList.push(previewWrapper);
         await vue.nextTick();
+        await vue.nextTick();
         if (!previewWrapper.target) {
           previewWrapper.heightIs = true;
           return false;
         }
         const height = previewWrapper.target.clientHeight;
-        if (((_a2 = previewWrapper.option) == null ? void 0 : _a2.autoTextHeight) == null || !((_b2 = previewWrapper.option) == null ? void 0 : _b2.autoTextHeight)) {
+        if (!measureAutoHeight) {
           previewWrapper.heightIs = true;
           return false;
         }
@@ -81966,20 +82089,20 @@
         if (previewWrapper.y + px2unit(height, panel) < previewContext.bottom) {
           return false;
         }
-        let mid = await binary_search(previewWrapper, previewData, 1, previewData.length);
-        if (mid > 0 && mid < previewData.length) {
+        let mid = await binary_search(previewWrapper, textData, 1, textData.length);
+        if (mid > 0 && mid < textData.length) {
           if (previewContext.autoPageIs) {
             await newPage();
             previewContext.currentPreview = element2PreviewWrapper(previewWrapper);
             previewContext.currentPreview.y = previewContext.top;
-            await autoTextElement(previewData.substring(mid + 1, previewData.length), false);
+            await autoTextElement(textData.substring(mid + 1, textData.length), false);
             return true;
           }
         }
         return false;
       }
       async function autoTableRow(previewContext2, previewDataList2, index, tableSource, recursionDepth = 0) {
-        var _a2, _b2, _c;
+        var _a2, _b2, _c2;
         const MAX_TABLE_RECURSION = 100;
         if (recursionDepth > MAX_TABLE_RECURSION) {
           console.error("[MyPrint] \u8868\u683C\u5206\u9875\u9012\u5F52\u8FC7\u6DF1\uFF0C\u5DF2\u4E2D\u6B62");
@@ -82092,7 +82215,7 @@
             statisticsData(previewDataTmpList, statisticsListWrapper);
             previewContext2.currentPreview = element2PreviewWrapper(previewWrapper);
             previewWrapper = previewContext2.currentPreview;
-            if (!((_c = previewWrapper.option) == null ? void 0 : _c.tablePageHeadIs)) {
+            if (!((_c2 = previewWrapper.option) == null ? void 0 : _c2.tablePageHeadIs)) {
               previewWrapper.tableHeadHiddenIs = true;
             }
             previewWrapper.tableHeadList = [...tableHeadList];
@@ -82140,18 +82263,23 @@
         });
         previewContext.pageList.push(previewContext.currentPage);
         previewContext.autoPageIs = true;
-        pagesBuffer.push(previewContext.currentPage);
-        measureList.splice(0, measureList.length, previewContext.currentPage);
+        pageList.push(previewContext.currentPage);
         await vue.nextTick();
         if (previewContext.panel.pageHeader) {
           const preview = element2PreviewWrapper(previewContext.panel.pageHeader);
           previewContext.currentPage.previewWrapperList.push(preview);
-          previewContext.top = await computeBottom(preview);
+          const top = await computeBottom(preview);
+          if (top != null) {
+            previewContext.top = top;
+          }
         }
         if (previewContext.panel.pageFooter) {
           const preview = element2PreviewWrapper(previewContext.panel.pageFooter);
           previewContext.currentPage.previewWrapperList.push(preview);
-          previewContext.bottom = await computeTop(preview);
+          const bottom = await computeTop(preview);
+          if (bottom != null) {
+            previewContext.bottom = bottom;
+          }
         }
       }
       async function computeBottom(previewWrapper) {
@@ -82653,73 +82781,37 @@
       }
     }
 
-    const _hoisted_1$a = {
-      class: "my-print-print_hidden",
-      "aria-hidden": "true"
-    };
+    const _hoisted_1$a = { class: "preview-panel" };
     const _hoisted_2$9 = { class: "my-print-preview-panel__wrap" };
     const _hoisted_3$8 = { class: "preview-panel__model" };
     const _hoisted_4$3 = { class: "my-print-preview-panel__content" };
-    const _hoisted_5$2 = {
-      key: 0,
-      class: "preview-panel"
-    };
-    const _hoisted_6 = { class: "my-print-preview-panel__wrap" };
-    const _hoisted_7 = { class: "preview-panel__model" };
-    const _hoisted_8 = { class: "my-print-preview-panel__content" };
-    const _hoisted_9 = { class: "preview-panel__tool display-flex-column display-flex-wrap" };
-    const _hoisted_10 = { key: 1 };
-    const _hoisted_11 = {
-      key: 1,
-      class: "preview-panel preview-panel--loading"
-    };
+    const _hoisted_5$2 = { class: "preview-panel__tool display-flex-column display-flex-wrap" };
+    const _hoisted_6 = { key: 1 };
     var _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
       __name: "preview-panel",
       setup(__props, { expose: __expose }) {
         __expose({ handleChromePreview });
+        vue.onMounted(() => {
+          registerPreviewPanel(handleChromePreview);
+        });
+        vue.onUnmounted(() => {
+          registerPreviewPanel(null);
+        });
         const clientConnectIs = vue.computed(() => myPrintClientService.connectIs());
         const configStore = useConfigStore();
         const data = vue.reactive({
           dialogVisible: false,
           printer: configStore.defaultPrinter,
           pageList: [],
-          measurePages: [],
           resolveMap: {},
           previewTimeOutMap: {},
           taskId: null
         });
-        const measureContentRef = vue.ref([]);
-        const previewContentRef = vue.ref([]);
+        const previewContentRef = vue.ref();
+        const scrollbarRef = vue.ref();
         const panel = vue.ref({});
+        let designPanelSnapshot = null;
         let itemRefs = {};
-        function pageStyle(page) {
-          return {
-            width: valueUnit(page.width, panel.value),
-            minHeight: valueUnit(page.height, panel.value)
-          };
-        }
-        function setMeasurePageRef(el, index) {
-          if (!measureContentRef.value) {
-            measureContentRef.value = [];
-          }
-          if (el) {
-            measureContentRef.value[index] = el;
-          }
-        }
-        function setPreviewPageRef(el, index) {
-          if (!previewContentRef.value) {
-            previewContentRef.value = [];
-          }
-          if (el) {
-            previewContentRef.value[index] = el;
-          }
-        }
-        function clearMeasureRefs() {
-          measureContentRef.value = [];
-        }
-        function clearPreviewPageRefs() {
-          previewContentRef.value = [];
-        }
         const printList = vue.computed(() => {
           var _a;
           const list = (_a = myPrintClientService.getPrinterList()) != null ? _a : [];
@@ -82799,35 +82891,30 @@
           }
         }
         function handleChromePreview(printProps) {
-          var _a;
+          var _a, _b;
           data.pageList = [];
-          data.measurePages = [];
-          clearMeasureRefs();
-          clearPreviewPageRefs();
           data.dialogVisible = true;
-          panel.value = printProps.panel;
-          data.taskId = (_a = printProps.taskId) != null ? _a : null;
+          designPanelSnapshot = (_a = printProps.panel) != null ? _a : getCurrentPanel();
+          panel.value = clonePanelForPreview(designPanelSnapshot);
+          data.taskId = (_b = printProps.taskId) != null ? _b : null;
           handleTimeOut(printProps, data.previewTimeOutMap, data.resolveMap);
           return new Promise((resolve, reject) => {
             data.resolveMap[printProps.taskId] = resolve;
-            vue.nextTick().then(() => vue.nextTick()).then(() => autoPage(
-              measureContentRef,
-              data.pageList,
-              panel.value,
-              printProps.previewDataList,
-              data.measurePages
-            )).then(() => {
-              if (data.pageList.length === 0) {
-                throw new Error("[MyPrint] \u9884\u89C8\u5206\u9875\u7ED3\u679C\u4E3A\u7A7A");
-              }
-              data.measurePages = [];
-              clearMeasureRefs();
-              return vue.nextTick();
-            }).then(() => vue.nextTick()).catch((e) => {
+            (async () => {
+              var _a2, _b2, _c;
+              await vue.nextTick();
+              await vue.nextTick();
+              await autoPage(
+                previewContentRef,
+                data.pageList,
+                panel.value,
+                printProps.previewDataList
+              );
+              await vue.nextTick();
+              (_c = (_b2 = (_a2 = scrollbarRef.value) == null ? void 0 : _a2.ps) == null ? void 0 : _b2.update) == null ? void 0 : _c.call(_b2);
+            })().catch((e) => {
               var _a2;
-              data.pageList = [];
-              data.measurePages = [];
-              clearMeasureRefs();
+              console.error("[MyPrint] \u9884\u89C8\u5931\u8D25", e);
               printResult(printProps.taskId, {
                 status: "ERROR",
                 msg: (_a2 = e == null ? void 0 : e.message) != null ? _a2 : String(e),
@@ -82839,234 +82926,194 @@
         }
         function closePreviewPanel() {
           data.pageList = [];
-          data.measurePages = [];
-          clearMeasureRefs();
-          clearPreviewPageRefs();
+          if (designPanelSnapshot) {
+            clearPanelPreviewRuntimeFlags(designPanelSnapshot);
+            designPanelSnapshot = null;
+          }
+          panel.value = {};
+          mitt.emit("updatePanel");
+          mitt.emit("changePageSize");
           printResult(data.taskId, {
             status: "CLOSE",
             type: "CLOSE"
           }, data.previewTimeOutMap, data.resolveMap);
         }
         return (_ctx, _cache) => {
-          return vue.openBlock(), vue.createElementBlock(
-            vue.Fragment,
-            null,
-            [
-              vue.createCommentVNode(" \u79BB\u5C4F\u5206\u9875\u6D4B\u91CF\uFF08\u4E0E print.vue \u4E00\u81F4\uFF0C\u4E0D\u53C2\u4E0E\u5F39\u7A97\u5E03\u5C40\uFF09 "),
+          return vue.openBlock(), vue.createBlock(MyDialog, {
+            modelValue: vue.unref(data).dialogVisible,
+            "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => vue.unref(data).dialogVisible = $event),
+            class: "preview-dialog",
+            fullscreen: "",
+            showHeader: false,
+            onClose: closePreviewPanel
+          }, {
+            default: vue.withCtx(() => [
               vue.createElementVNode("div", _hoisted_1$a, [
-                vue.createElementVNode("div", _hoisted_2$9, [
-                  vue.createElementVNode("div", _hoisted_3$8, [
-                    vue.createElementVNode("div", _hoisted_4$3, [
-                      (vue.openBlock(true), vue.createElementBlock(
-                        vue.Fragment,
-                        null,
-                        vue.renderList(vue.unref(data).measurePages, (page, index) => {
-                          var _a;
-                          return vue.openBlock(), vue.createElementBlock(
-                            "div",
-                            {
-                              key: "m-" + ((_a = page.id) != null ? _a : index),
-                              ref_for: true,
-                              ref: (el) => setMeasurePageRef(el, index),
-                              class: "my-print-preview-panel__content_page preview-page-top",
-                              style: vue.normalizeStyle(pageStyle(page))
-                            },
-                            [
-                              (vue.openBlock(true), vue.createElementBlock(
-                                vue.Fragment,
-                                null,
-                                vue.renderList(page.previewWrapperList, (element, elIndex) => {
-                                  var _a2;
-                                  return vue.openBlock(), vue.createBlock(Preview, {
-                                    key: (_a2 = element.id) != null ? _a2 : elIndex,
-                                    preview: element
-                                  }, null, 8, ["preview"]);
-                                }),
-                                128
-                                /* KEYED_FRAGMENT */
-                              ))
-                            ],
-                            4
-                            /* STYLE */
-                          );
-                        }),
-                        128
-                        /* KEYED_FRAGMENT */
-                      ))
-                    ])
-                  ])
-                ])
-              ]),
-              vue.createVNode(MyDialog, {
-                modelValue: vue.unref(data).dialogVisible,
-                "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => vue.unref(data).dialogVisible = $event),
-                class: "preview-dialog",
-                fullscreen: "",
-                showHeader: false,
-                onClose: closePreviewPanel
-              }, {
-                default: vue.withCtx(() => [
-                  vue.unref(data).pageList.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$2, [
-                    vue.createVNode(MyScrollbar, {
-                      height: "100%",
-                      class: "preview-panel__scrollbar",
-                      style: vue.normalizeStyle({ minWidth: vue.unref(valueUnit)(vue.unref(panel).width, vue.unref(panel)) })
-                    }, {
-                      default: vue.withCtx(() => [
-                        vue.createElementVNode("div", _hoisted_6, [
-                          vue.createElementVNode("div", _hoisted_7, [
-                            vue.createElementVNode("div", _hoisted_8, [
-                              (vue.openBlock(true), vue.createElementBlock(
-                                vue.Fragment,
-                                null,
-                                vue.renderList(vue.unref(data).pageList, (page, index) => {
-                                  var _a;
-                                  return vue.openBlock(), vue.createElementBlock(
-                                    "div",
-                                    {
-                                      key: "v-" + ((_a = page.id) != null ? _a : index),
-                                      ref_for: true,
-                                      ref: (el) => setPreviewPageRef(el, index),
-                                      class: "my-print-preview-panel__content_page preview-page-top",
-                                      style: vue.normalizeStyle(pageStyle(page))
-                                    },
-                                    [
-                                      (vue.openBlock(true), vue.createElementBlock(
-                                        vue.Fragment,
-                                        null,
-                                        vue.renderList(page.previewWrapperList, (element, elIndex) => {
-                                          var _a2;
-                                          return vue.openBlock(), vue.createBlock(Preview, {
-                                            ref_for: true,
-                                            ref: (el) => setItemRef(el, element),
-                                            key: (_a2 = element.id) != null ? _a2 : elIndex,
-                                            preview: element
-                                          }, null, 8, ["preview"]);
-                                        }),
-                                        128
-                                        /* KEYED_FRAGMENT */
-                                      ))
-                                    ],
-                                    4
-                                    /* STYLE */
-                                  );
-                                }),
-                                128
-                                /* KEYED_FRAGMENT */
-                              ))
-                            ])
-                          ])
+                vue.createVNode(MyScrollbar, {
+                  ref_key: "scrollbarRef",
+                  ref: scrollbarRef,
+                  height: "100%",
+                  class: "preview-panel__scrollbar",
+                  style: vue.normalizeStyle({ minWidth: vue.unref(valueUnit)(vue.unref(panel).width, vue.unref(panel)) })
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createElementVNode("div", _hoisted_2$9, [
+                      vue.createElementVNode("div", _hoisted_3$8, [
+                        vue.createElementVNode("div", _hoisted_4$3, [
+                          (vue.openBlock(true), vue.createElementBlock(
+                            vue.Fragment,
+                            null,
+                            vue.renderList(vue.unref(data).pageList, (page, index) => {
+                              var _a, _b;
+                              return vue.openBlock(), vue.createElementBlock(
+                                "div",
+                                {
+                                  key: (_a = page.id) != null ? _a : index,
+                                  ref_for: true,
+                                  ref_key: "previewContentRef",
+                                  ref: previewContentRef,
+                                  class: "my-print-preview-panel__content_page preview-page-top",
+                                  style: vue.normalizeStyle({
+                                    width: vue.unref(valueUnit)(page.width, vue.unref(panel)),
+                                    minHeight: vue.unref(valueUnit)(page.height, vue.unref(panel))
+                                  })
+                                },
+                                [
+                                  (vue.openBlock(true), vue.createElementBlock(
+                                    vue.Fragment,
+                                    null,
+                                    vue.renderList((_b = page.previewWrapperList) != null ? _b : [], (element, elIndex) => {
+                                      var _a2;
+                                      return vue.openBlock(), vue.createBlock(Preview, {
+                                        ref_for: true,
+                                        ref: (el) => setItemRef(el, element),
+                                        key: (_a2 = element.id) != null ? _a2 : elIndex,
+                                        preview: element
+                                      }, null, 8, ["preview"]);
+                                    }),
+                                    128
+                                    /* KEYED_FRAGMENT */
+                                  ))
+                                ],
+                                4
+                                /* STYLE */
+                              );
+                            }),
+                            128
+                            /* KEYED_FRAGMENT */
+                          ))
                         ])
+                      ])
+                    ])
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["style"]),
+                vue.createElementVNode("div", _hoisted_5$2, [
+                  vue.createElementVNode(
+                    "div",
+                    null,
+                    "\u540D\u79F0\uFF1A" + vue.toDisplayString(vue.unref(panel).name),
+                    1
+                    /* TEXT */
+                  ),
+                  vue.unref(clientConnectIs) ? (vue.openBlock(), vue.createElementBlock(
+                    vue.Fragment,
+                    { key: 0 },
+                    [
+                      vue.createElementVNode("div", null, [
+                        vue.createTextVNode(
+                          vue.toDisplayString(vue.unref(i18n)("toolbar.printer")) + "\uFF1A ",
+                          1
+                          /* TEXT */
+                        ),
+                        vue.createVNode(MySelect, {
+                          modelValue: vue.unref(data).printer,
+                          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.unref(data).printer = $event),
+                          placeholder: "\u8BF7\u9009\u62E9",
+                          size: "middle",
+                          "data-list": vue.unref(printList)
+                        }, null, 8, ["modelValue", "data-list"])
                       ]),
-                      _: 1
-                      /* STABLE */
-                    }, 8, ["style"]),
-                    vue.createElementVNode("div", _hoisted_9, [
-                      vue.createElementVNode(
-                        "div",
-                        null,
-                        "\u540D\u79F0\uFF1A" + vue.toDisplayString(vue.unref(panel).name),
-                        1
-                        /* TEXT */
-                      ),
-                      vue.unref(clientConnectIs) ? (vue.openBlock(), vue.createElementBlock(
-                        vue.Fragment,
-                        { key: 0 },
-                        [
-                          vue.createElementVNode("div", null, [
-                            vue.createTextVNode(
-                              vue.toDisplayString(vue.unref(i18n)("toolbar.printer")) + "\uFF1A ",
-                              1
-                              /* TEXT */
-                            ),
-                            vue.createVNode(MySelect, {
-                              modelValue: vue.unref(data).printer,
-                              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.unref(data).printer = $event),
-                              placeholder: "\u8BF7\u9009\u62E9",
-                              size: "middle",
-                              "data-list": vue.unref(printList)
-                            }, null, 8, ["modelValue", "data-list"])
-                          ]),
-                          vue.createVNode(MyButton, {
-                            style: { "margin-top": "40px" },
-                            disabled: !vue.unref(data).printer,
-                            onClick: print
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createTextVNode(
-                                vue.toDisplayString(vue.unref(i18n)("toolbar.print")),
-                                1
-                                /* TEXT */
-                              )
-                            ]),
-                            _: 1
-                            /* STABLE */
-                          }, 8, ["disabled"])
-                        ],
-                        64
-                        /* STABLE_FRAGMENT */
-                      )) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, "\u5BA2\u6237\u7AEF\u672A\u8FDE\u63A5\uFF0C\u65E0\u6CD5\u4F7F\u7528\u76F4\u63A5\u6253\u5370\u529F\u80FD\uFF0C\u53BB\u4E0B\u8F7D")),
-                      vue.createVNode(MyButton, {
-                        class: "preview-panel__tool_button",
-                        onClick: printChromePdf
-                      }, {
-                        default: vue.withCtx(() => [
-                          vue.createTextVNode(
-                            vue.toDisplayString(vue.unref(i18n)("toolbar.chrome.print")),
-                            1
-                            /* TEXT */
-                          )
-                        ]),
-                        _: 1
-                        /* STABLE */
-                      }),
-                      vue.createVNode(MyButton, {
-                        class: "preview-panel__tool_button",
-                        onClick: downloadPdf
-                      }, {
-                        default: vue.withCtx(() => [
-                          vue.createTextVNode(
-                            vue.toDisplayString(vue.unref(i18n)("preview.download.pdf")),
-                            1
-                            /* TEXT */
-                          )
-                        ]),
-                        _: 1
-                        /* STABLE */
-                      }),
                       vue.createVNode(MyButton, {
-                        class: "preview-panel__tool_button",
-                        onClick: _cache[1] || (_cache[1] = () => vue.unref(data).dialogVisible = false)
+                        style: { "margin-top": "40px" },
+                        disabled: !vue.unref(data).printer,
+                        onClick: print
                       }, {
                         default: vue.withCtx(() => [
                           vue.createTextVNode(
-                            vue.toDisplayString(vue.unref(i18n)("common.close")),
+                            vue.toDisplayString(vue.unref(i18n)("toolbar.print")),
                             1
                             /* TEXT */
                           )
                         ]),
                         _: 1
                         /* STABLE */
-                      })
-                    ])
-                  ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_11, " \u6B63\u5728\u751F\u6210\u9884\u89C8\u2026 "))
-                ]),
-                _: 1
-                /* STABLE */
-              }, 8, ["modelValue"])
-            ],
-            64
-            /* STABLE_FRAGMENT */
-          );
+                      }, 8, ["disabled"])
+                    ],
+                    64
+                    /* STABLE_FRAGMENT */
+                  )) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, "\u5BA2\u6237\u7AEF\u672A\u8FDE\u63A5\uFF0C\u65E0\u6CD5\u4F7F\u7528\u76F4\u63A5\u6253\u5370\u529F\u80FD\uFF0C\u53BB\u4E0B\u8F7D")),
+                  vue.createVNode(MyButton, {
+                    class: "preview-panel__tool_button",
+                    onClick: printChromePdf
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.createTextVNode(
+                        vue.toDisplayString(vue.unref(i18n)("toolbar.chrome.print")),
+                        1
+                        /* TEXT */
+                      )
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  }),
+                  vue.createVNode(MyButton, {
+                    class: "preview-panel__tool_button",
+                    onClick: downloadPdf
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.createTextVNode(
+                        vue.toDisplayString(vue.unref(i18n)("preview.download.pdf")),
+                        1
+                        /* TEXT */
+                      )
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  }),
+                  vue.createVNode(MyButton, {
+                    class: "preview-panel__tool_button",
+                    onClick: _cache[1] || (_cache[1] = () => vue.unref(data).dialogVisible = false)
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.createTextVNode(
+                        vue.toDisplayString(vue.unref(i18n)("common.close")),
+                        1
+                        /* TEXT */
+                      )
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  })
+                ])
+              ])
+            ]),
+            _: 1
+            /* STABLE */
+          }, 8, ["modelValue"]);
         };
       }
     });
 
-    var previewPanelView = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-f905598e"], ["__file", "preview-panel.vue"]]);
+    var previewPanelView = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__file", "preview-panel.vue"]]);
 
     let previewNode = null;
     let handleChromePreview = null;
-    function bindPreviewHandler() {
+    function registerPreviewPanel(handler) {
+      handleChromePreview = handler != null ? handler : null;
+    }
+    function bindPreviewHandlerFromNode() {
       var _a, _b;
       const handler = (_b = (_a = previewNode == null ? void 0 : previewNode.component) == null ? void 0 : _a.exposed) == null ? void 0 : _b.handleChromePreview;
       if (handler) {
@@ -83102,6 +83149,7 @@
         if (panelReady.runtimeOption == null) {
           panelReady.runtimeOption = {};
         }
+        normalizePanelStructure(panelReady);
         installPanelParentElement(panelReady);
         for (let i = 0; i < panelReady.elementList.length; i++) {
           parentInitElement(panelReady, panelReady, panelReady.elementList[i], i);
@@ -83126,10 +83174,10 @@
       previewNode.appContext = app._context;
       vue.render(previewNode, container);
       document.body.appendChild(container);
-      vue.nextTick(() => bindPreviewHandler());
+      bindPreviewHandlerFromNode();
     }
     function openPreview(printProps) {
-      if (!bindPreviewHandler()) {
+      if (!bindPreviewHandlerFromNode() && !handleChromePreview) {
         return Promise.reject(new Error("[MyPrint] \u9884\u89C8\u672A\u521D\u59CB\u5316\uFF0C\u8BF7\u5148\u6267\u884C app.use(createPrint)"));
       }
       return convertPreviewProps(printProps != null ? printProps : {}).then((props) => handleChromePreview(props));
@@ -93936,14 +93984,9 @@ ${$$g(r2)}`), n2;
             return;
           }
           to$2(JSON.parse(props.template.content), panel);
+          normalizePanelStructure(panel);
           setCurrentPanel(panel);
           if (!panel.watermarkContent) ;
-          if (!panel.groupList) {
-            panel.groupList = [];
-          }
-          if (!panel.auxiliaryLineList) {
-            panel.auxiliaryLineList = [];
-          }
           for (let myAuxiliaryLine of panel.auxiliaryLineList) {
             myAuxiliaryLine.runtimeOption = { x: 0, y: 0, auxiliaryLineStatus: "SHOW" };
           }
@@ -94050,7 +94093,7 @@ ${$$g(r2)}`), n2;
       }
     }
 
-    const version$1 = "1.0.13";
+    const version$1 = "1.0.15";
 
     function isDataTableWidget(d) {
       return d.type === "DataTable";