@gct-paas/core-web 0.1.6-dev.2 → 0.1.6-dev.20

package/es/components/label-design/header/header.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,232 @@
+import { usePrinter } from "../../../hooks/usePrinter.mjs";
+import { PRINT_ELE_TYPE } from "../constants/CommonPrintElems.mjs";
+import { labelInfo, usePage } from "../hooks/usePage.mjs";
+import { useDesigner } from "../hooks/useDesigner.mjs";
+import test_var_modal_default from "./test-var-modal.vue.mjs";
+import { createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, resolveComponent, toDisplayString, unref, withCtx } from "vue";
+import { cloneDeep, isEmpty } from "lodash-es";
+import { t } from "@gct-paas/core";
+import { message } from "ant-design-vue";
+import { PrinterOutlined } from "@ant-design/icons-vue";
+import domtoimage from "dom-to-image";
+//#region src/components/label-design/header/header.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "designer-header" };
+var _hoisted_2 = { class: "designer-header__actions" };
+var header_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "header",
+	emits: ["toggleLoading"],
+	setup(__props, { emit: __emit }) {
+		const { printLabelKey } = usePrinter();
+		const { project, loadLabelDesignHistoryList } = usePage();
+		const { selectedPage, selectedElements, isModal } = useDesigner();
+		const emit = __emit;
+		const print = async () => {
+			const varMap = isHaveVar();
+			const testVar = {};
+			if (varMap && varMap.length > 0) {
+				const arr = varMap.filter((_) => {
+					return _.valType !== "FIXED";
+				});
+				if (arr.length === 0) varMap.forEach((_) => {
+					testVar[_.key] = _.defaultVal;
+				});
+				else {
+					selectedElements.value = [];
+					const data = cloneDeep(selectedPage.value);
+					if (checkPageError()) return;
+					isModal.value = true;
+					const res = await _gct.openUtil.modal(test_var_modal_default, {
+						fieldConfig: arr,
+						data
+					}, {
+						width: 800,
+						height: 600,
+						title: t("sys.printTest"),
+						okText: t("sys.ok2")
+					});
+					if (res && res.ok && res.data) {
+						console.log("testVar", testVar, res.data);
+						Object.assign(testVar, res.data);
+						isModal.value = false;
+					} else {
+						isModal.value = false;
+						return;
+					}
+				}
+			}
+			if (!await save(false)) return;
+			printLabelKey(labelInfo.value?.key, {}, {
+				testVar,
+				printType: labelInfo.value?.printType
+			});
+		};
+		function checkPageError() {
+			for (const k in project.value.page) {
+				const i = project.value.page[k];
+				if (Object.prototype.hasOwnProperty.call(i, "hasError") && i.hasError) {
+					const errMsg = i.errMsg ? t(i.errMsg) : t("sys.printDesigner.hasErrorConfigTip", { sth: t(i.displayName) });
+					message.warning(errMsg);
+					return true;
+				}
+			}
+			return false;
+		}
+		const save = async (flag) => {
+			if (isHaveEmptyImg()) {
+				message.warning(t("sys.printDesigner.imgNotNull"));
+				return;
+			}
+			if (isTextLength1000()) {
+				message.warning(t("文本最大1000字"));
+				return;
+			}
+			if (checkPageError()) return false;
+			emit("toggleLoading", true);
+			try {
+				for (const k in project.value.page) {
+					const i = project.value.page[k];
+					if (i.type === PRINT_ELE_TYPE.ICON) {
+						const value = await svgToCanvas(i);
+						i.attrs.src = { value };
+					}
+					if (i.type === PRINT_ELE_TYPE.RICH_TEXT) {
+						const value = await richTextToCanvas(i);
+						i.attrs.src = { value };
+					}
+				}
+				await _api.apaas.label.putUpdateDesigner({
+					designerJson: JSON.stringify(project.value),
+					id: labelInfo.value.id
+				});
+				loadLabelDesignHistoryList();
+				if (flag) message.success(t("sys.saveSuccess"));
+				return true;
+			} finally {
+				emit("toggleLoading", false);
+			}
+		};
+		const isHaveVar = () => {
+			const varMap = [];
+			selectedPage.value.forEach((w) => {
+				if (!w.attrs) return;
+				if (w.attrs.content || w.attrs.text) {
+					const { type, value } = w.attrs.content || w.attrs.text;
+					switch (w.type) {
+						case PRINT_ELE_TYPE.TEXT:
+						case PRINT_ELE_TYPE.BAR_CODE:
+						case PRINT_ELE_TYPE.QR_CODE:
+							varMap.push({
+								key: w.id,
+								label: w.displayName,
+								valType: type,
+								defaultVal: type === "FIXED" ? value : ""
+							});
+							break;
+						default:
+					}
+				}
+			});
+			return varMap;
+		};
+		const isHaveEmptyImg = () => {
+			let flag = false;
+			selectedPage.value.forEach((w) => {
+				if (w.type === PRINT_ELE_TYPE.IMAGE && isEmpty(w.attrs.src.value)) flag = true;
+			});
+			return flag;
+		};
+		/** 检测文本大于大于1000字 */
+		const isTextLength1000 = () => {
+			let flag = false;
+			selectedPage.value.forEach((w) => {
+				if (w.type === PRINT_ELE_TYPE.TEXT && w.attrs.text.value.length > 1e3) flag = true;
+			});
+			return flag;
+		};
+		/**svg转png 目录的图标有引用 需要特殊处理 */
+		function svgToCanvas(row) {
+			console.log("row", row);
+			const id = row.id;
+			const iconValue = row.attrs.icon.value;
+			let elDom;
+			if (iconValue.startsWith("icon-platform:")) {
+				const svgId = "icon-" + iconValue.split(":")[1];
+				elDom = document.getElementById(id);
+				elDom?.firstChild?.appendChild(document.getElementById(svgId));
+			} else elDom = document.getElementById(id);
+			return new Promise((res, _rej) => {
+				domtoimage.toPng(elDom).then(async function(pngUrl) {
+					res(await _api.apaas.fileResource.postBase64Upload({
+						type: "LABEL_IMAGE",
+						fileContent: pngUrl,
+						filename: row.id
+					}));
+				});
+			});
+		}
+		/** 富文本特殊处理 */
+		function richTextToCanvas(row) {
+			const timestamp = Date.now();
+			const newDiv = document.createElement("div");
+			const elDom = document.getElementById(row.id);
+			newDiv.id = row.id + timestamp;
+			newDiv.classList.add("copy-main");
+			newDiv.style.borderTop = elDom.style.borderTop;
+			newDiv.style.borderRight = elDom.style.borderRight;
+			newDiv.style.borderBottom = elDom.style.borderBottom;
+			newDiv.style.borderLeft = elDom.style.borderLeft;
+			newDiv.style.fontSize = elDom.style.fontSize;
+			newDiv.style.backgroundColor = elDom.style.backgroundColor;
+			newDiv.style.borderRadius = elDom.style.borderRadius;
+			newDiv.style.transform = elDom.style.transform;
+			if (row.rotate === 270 || row.rotate === 90) {
+				newDiv.style.width = row.height + "px";
+				newDiv.style.height = row.width + "px";
+			} else {
+				newDiv.style.width = row.width + "px";
+				newDiv.style.height = row.height + "px";
+			}
+			newDiv.appendChild(elDom.firstElementChild.cloneNode(true));
+			newDiv.style.transformOrigin = elDom.style.transformOrigin;
+			newDiv.firstElementChild?.classList.remove("is-empty");
+			newDiv.firstElementChild?.classList.add("copy-rich-text");
+			document.body.appendChild(newDiv);
+			return new Promise((res, _rej) => {
+				domtoimage.toPng(newDiv).then(async function(dataUrl) {
+					document.body.removeChild(newDiv);
+					res(await _api.apaas.fileResource.postBase64Upload({
+						type: "LABEL_IMAGE",
+						fileContent: dataUrl,
+						filename: row.id
+					}));
+				});
+			});
+		}
+		return (_ctx, _cache) => {
+			const _component_a_breadcrumb_item = resolveComponent("a-breadcrumb-item");
+			const _component_a_breadcrumb = resolveComponent("a-breadcrumb");
+			const _component_a_button = resolveComponent("a-button");
+			return openBlock(), createElementBlock("div", _hoisted_1, [createVNode(_component_a_breadcrumb, null, {
+				default: withCtx(() => [createVNode(_component_a_breadcrumb_item, null, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(labelInfo)?.categoryName), 1)]),
+					_: 1
+				}), createVNode(_component_a_breadcrumb_item, null, {
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(labelInfo)?.name), 1)]),
+					_: 1
+				})]),
+				_: 1
+			}), createElementVNode("div", _hoisted_2, [createVNode(_component_a_button, { onClick: print }, {
+				default: withCtx(() => [createVNode(unref(PrinterOutlined)), createTextVNode(" " + toDisplayString(unref(t)("sys.printTest")), 1)]),
+				_: 1
+			}), createVNode(_component_a_button, {
+				type: "primary",
+				onClick: _cache[0] || (_cache[0] = ($event) => save(true))
+			}, {
+				default: withCtx(() => [_cache[1] || (_cache[1] = createElementVNode("i", { class: "iconfont icon-baocun1" }, null, -1)), createTextVNode(" " + toDisplayString(unref(t)("sys.saveText")), 1)]),
+				_: 1
+			})])]);
+		};
+	}
+});
+//#endregion
+export { header_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/label-design/header/header.vue_vue_type_style_index_0_scoped_aa2b4235_lang.css

@@ -0,0 +1,39 @@
+.designer-header[data-v-aa2b4235] {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 20px;
+  background-color: #1a1d23;
+}
+.designer-header[data-v-aa2b4235] .ant-breadcrumb .ant-breadcrumb-link {
+  color: #fff;
+}
+.designer-header[data-v-aa2b4235] .ant-breadcrumb .ant-breadcrumb-separator {
+  color: #fff;
+}
+.designer-header__lock-info[data-v-aa2b4235] {
+  margin-left: auto;
+}
+.designer-header__lock-info > span[data-v-aa2b4235] {
+  color: #fff;
+  cursor: pointer;
+}
+.designer-header__divider[data-v-aa2b4235] {
+  height: 24px;
+  margin: 0 15px;
+  border-left: 1px solid #e3e3e3;
+}
+.designer-header__actions .ant-btn[data-v-aa2b4235] {
+  border: 0;
+  background-color: #444;
+  color: #fff;
+}
+.designer-header__actions .ant-btn .iconfont[data-v-aa2b4235] {
+  position: relative;
+  top: 1px;
+  margin-right: 5px;
+  line-height: 1em;
+}
+.designer-header__actions .ant-btn[data-v-aa2b4235]:not(:last-child) {
+  margin-right: 10px;
+}

package/es/components/label-design/header/test-var-modal.vue.d.ts

@@ -0,0 +1,204 @@
+import { IModal } from '@gct-paas/core';
+type __VLS_Props = {
+    modal: IModal;
+    fieldConfig: IObject[];
+    data: IObject[];
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    FormRef: unknown;
+    containerRef: HTMLDivElement;
+    canvasRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
+        schema?: IObject[];
+    }> & Readonly<{
+        onMovingItem?: ((...args: any[]) => any) | undefined;
+        onUpdatePBarcodeWidth?: ((...args: any[]) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        movingItem: (...args: any[]) => void;
+        updatePBarcodeWidth: (...args: any[]) => void;
+    }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        mrContainerRef: ({
+            $: import('vue').ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{
+                activeElements: unknown[];
+                snapTracking: boolean;
+                zoom: number;
+                isDesign: boolean;
+            }> & Omit<{
+                readonly activeElements: unknown[];
+                readonly snapTracking: boolean;
+                readonly zoom: number;
+                readonly isDesign: boolean;
+                readonly onArrows?: ((...args: any[]) => any) | undefined;
+                readonly onClearselection?: ((...args: any[]) => any) | undefined;
+                readonly onCopy?: ((...args: any[]) => any) | undefined;
+                readonly onCut?: ((...args: any[]) => any) | undefined;
+                readonly onDelete?: ((...args: any[]) => any) | undefined;
+                readonly onDrop?: ((...args: any[]) => any) | undefined;
+                readonly onMovestop?: ((...args: any[]) => any) | undefined;
+                readonly onMoving?: ((...args: any[]) => any) | undefined;
+                readonly onMovingItem?: ((...args: any[]) => any) | undefined;
+                readonly onPaste?: ((...args: any[]) => any) | undefined;
+                readonly onRedo?: ((...args: any[]) => any) | undefined;
+                readonly onResizestop?: ((...args: any[]) => any) | undefined;
+                readonly onRotatestop?: ((...args: any[]) => any) | undefined;
+                readonly onRotating?: ((...args: any[]) => any) | undefined;
+                readonly onSelectstop?: ((...args: any[]) => any) | undefined;
+                readonly onUndo?: ((...args: any[]) => any) | undefined;
+            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "activeElements" | "isDesign" | "snapTracking" | "zoom">;
+            $attrs: import('vue').Attrs;
+            $refs: {
+                [x: string]: unknown;
+            } & {
+                elementRef: HTMLDivElement;
+                selectionArea: HTMLDivElement;
+                sublineT: HTMLDivElement;
+                sublineB: HTMLDivElement;
+                sublineY: HTMLDivElement;
+                sublineL: HTMLDivElement;
+                sublineR: HTMLDivElement;
+                sublineX: HTMLDivElement;
+            };
+            $slots: Readonly<{
+                [name: string]: import('vue').Slot<any> | undefined;
+            }>;
+            $root: import('vue').ComponentPublicInstance | null;
+            $parent: import('vue').ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: ((event: "arrows", ...args: any[]) => void) & ((event: "clearselection", ...args: any[]) => void) & ((event: "copy", ...args: any[]) => void) & ((event: "cut", ...args: any[]) => void) & ((event: "delete", ...args: any[]) => void) & ((event: "drop", ...args: any[]) => void) & ((event: "movestop", ...args: any[]) => void) & ((event: "moving", ...args: any[]) => void) & ((event: "movingItem", ...args: any[]) => void) & ((event: "paste", ...args: any[]) => void) & ((event: "redo", ...args: any[]) => void) & ((event: "resizestop", ...args: any[]) => void) & ((event: "rotatestop", ...args: any[]) => void) & ((event: "rotating", ...args: any[]) => void) & ((event: "selectstop", ...args: any[]) => void) & ((event: "undo", ...args: any[]) => void);
+            $el: HTMLDivElement;
+            $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                activeElements: {
+                    type: ArrayConstructor;
+                    default: () => never[];
+                };
+                snapTracking: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                zoom: {
+                    type: NumberConstructor;
+                    default: number;
+                };
+                isDesign: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+            }>> & Readonly<{
+                onArrows?: ((...args: any[]) => any) | undefined;
+                onClearselection?: ((...args: any[]) => any) | undefined;
+                onCopy?: ((...args: any[]) => any) | undefined;
+                onCut?: ((...args: any[]) => any) | undefined;
+                onDelete?: ((...args: any[]) => any) | undefined;
+                onDrop?: ((...args: any[]) => any) | undefined;
+                onMovestop?: ((...args: any[]) => any) | undefined;
+                onMoving?: ((...args: any[]) => any) | undefined;
+                onMovingItem?: ((...args: any[]) => any) | undefined;
+                onPaste?: ((...args: any[]) => any) | undefined;
+                onRedo?: ((...args: any[]) => any) | undefined;
+                onResizestop?: ((...args: any[]) => any) | undefined;
+                onRotatestop?: ((...args: any[]) => any) | undefined;
+                onRotating?: ((...args: any[]) => any) | undefined;
+                onSelectstop?: ((...args: any[]) => any) | undefined;
+                onUndo?: ((...args: any[]) => any) | undefined;
+            }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                arrows: (...args: any[]) => void;
+                clearselection: (...args: any[]) => void;
+                copy: (...args: any[]) => void;
+                cut: (...args: any[]) => void;
+                delete: (...args: any[]) => void;
+                drop: (...args: any[]) => void;
+                movestop: (...args: any[]) => void;
+                moving: (...args: any[]) => void;
+                movingItem: (...args: any[]) => void;
+                paste: (...args: any[]) => void;
+                redo: (...args: any[]) => void;
+                resizestop: (...args: any[]) => void;
+                rotatestop: (...args: any[]) => void;
+                rotating: (...args: any[]) => void;
+                selectstop: (...args: any[]) => void;
+                undo: (...args: any[]) => void;
+            }, string, {
+                activeElements: unknown[];
+                snapTracking: boolean;
+                zoom: number;
+                isDesign: boolean;
+            }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                beforeCreate?: (() => void)[] | (() => void);
+                created?: (() => void)[] | (() => void);
+                beforeMount?: (() => void)[] | (() => void);
+                mounted?: (() => void)[] | (() => void);
+                beforeUpdate?: (() => void)[] | (() => void);
+                updated?: (() => void)[] | (() => void);
+                activated?: (() => void)[] | (() => void);
+                deactivated?: (() => void)[] | (() => void);
+                beforeDestroy?: (() => void)[] | (() => void);
+                beforeUnmount?: (() => void)[] | (() => void);
+                destroyed?: (() => void)[] | (() => void);
+                unmounted?: (() => void)[] | (() => void);
+                renderTracked?: ((e: import('vue').DebuggerEvent) => void)[] | ((e: import('vue').DebuggerEvent) => void);
+                renderTriggered?: ((e: import('vue').DebuggerEvent) => void)[] | ((e: import('vue').DebuggerEvent) => void);
+                errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[] | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void);
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof import('vue').nextTick;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+        } & Readonly<{
+            activeElements: unknown[];
+            snapTracking: boolean;
+            zoom: number;
+            isDesign: boolean;
+        }> & Omit<Readonly<import('vue').ExtractPropTypes<{
+            activeElements: {
+                type: ArrayConstructor;
+                default: () => never[];
+            };
+            snapTracking: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            zoom: {
+                type: NumberConstructor;
+                default: number;
+            };
+            isDesign: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            onArrows?: ((...args: any[]) => any) | undefined;
+            onClearselection?: ((...args: any[]) => any) | undefined;
+            onCopy?: ((...args: any[]) => any) | undefined;
+            onCut?: ((...args: any[]) => any) | undefined;
+            onDelete?: ((...args: any[]) => any) | undefined;
+            onDrop?: ((...args: any[]) => any) | undefined;
+            onMovestop?: ((...args: any[]) => any) | undefined;
+            onMoving?: ((...args: any[]) => any) | undefined;
+            onMovingItem?: ((...args: any[]) => any) | undefined;
+            onPaste?: ((...args: any[]) => any) | undefined;
+            onRedo?: ((...args: any[]) => any) | undefined;
+            onResizestop?: ((...args: any[]) => any) | undefined;
+            onRotatestop?: ((...args: any[]) => any) | undefined;
+            onRotating?: ((...args: any[]) => any) | undefined;
+            onSelectstop?: ((...args: any[]) => any) | undefined;
+            onUndo?: ((...args: any[]) => any) | undefined;
+        }>, "activeElements" | "isDesign" | "snapTracking" | "zoom"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+            $slots: {
+                default?(_: {}): any;
+            };
+        }) | null;
+    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{
+        schema?: IObject[];
+    }> & Readonly<{
+        onMovingItem?: ((...args: any[]) => any) | undefined;
+        onUpdatePBarcodeWidth?: ((...args: any[]) => any) | undefined;
+    }>, {}, {}, {}, {}, {}> | null;
+}, HTMLDivElement>;
+export default _default;

package/es/components/label-design/header/test-var-modal.vue.mjs

@@ -0,0 +1,7 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+import test_var_modal_vue_vue_type_script_setup_true_lang_default from "./test-var-modal.vue_vue_type_script_setup_true_lang.mjs";
+import './test-var-modal.vue_vue_type_style_index_0_scoped_972496bb_lang.css';/* empty css                                                                     */
+//#region src/components/label-design/header/test-var-modal.vue
+var test_var_modal_default = /* @__PURE__ */ _plugin_vue_export_helper_default(test_var_modal_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-972496bb"]]);
+//#endregion
+export { test_var_modal_default as default };

package/es/components/label-design/header/test-var-modal.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,202 @@
+import { useDesigner } from "../hooks/useDesigner.mjs";
+import { GctOverlayScrollbars } from "../../overlay-scrollbars/gct-overlay-scrollbars.mjs";
+import stage_canvas_default from "../stage/stage-canvas.vue.mjs";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, renderList, resolveComponent, toDisplayString, unref, withCtx } from "vue";
+import { cloneDeep } from "lodash-es";
+import { t, useModal } from "@gct-paas/core";
+//#region src/components/label-design/header/test-var-modal.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex h100% w100% print" };
+var _hoisted_2 = { class: "left flex flex-col" };
+var _hoisted_3 = { class: "left-title" };
+var _hoisted_4 = { class: "right" };
+var _hoisted_5 = { class: "right-title" };
+var test_var_modal_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "test-var-modal",
+	props: {
+		modal: {},
+		fieldConfig: {},
+		data: {}
+	},
+	setup(__props) {
+		const { hoveredElements, updateEgglement } = useDesigner();
+		const selectItem = ref([]);
+		const hoverItem = ref([]);
+		const containerRef = ref(null);
+		const canvasRef = ref(null);
+		const canvasSize = ref({
+			width: 0,
+			height: 0
+		});
+		const containerSize = ref({
+			width: 0,
+			height: 0
+		});
+		const FormRef = ref();
+		const varMap = ref({});
+		const defProps = __props;
+		const schema = ref();
+		const handleOk = async () => {
+			try {
+				await FormRef.value?.validate();
+				return {
+					ok: true,
+					data: { ...varMap.value }
+				};
+			} catch (err) {
+				console.warn(err);
+			}
+			return { ok: false };
+		};
+		const changeMap = async (value, id) => {
+			schema.value?.forEach((i) => {
+				if (i.type === "TEXT" && i.id === id) {
+					i.attrs.text.label = value;
+					i.attrs.text.value = value;
+				} else if (i.id === id) i.attrs.content.value = value;
+			});
+		};
+		const updatePBarcodeWidth = (payload) => {
+			const egglement = schema.value?.find((d) => d.id === payload.elId);
+			if (!egglement) return;
+			if (egglement.rotate === 90) if (payload.height !== egglement.height) updateEgglement({
+				egglement,
+				width: payload.rotateWidth,
+				height: payload.width
+			});
+			else console.log("高度不变");
+			else if (payload.width !== egglement.width) updateEgglement({
+				egglement,
+				width: payload.width
+			});
+			else console.log("长度不变");
+		};
+		const updatePQrCodeWidthAndHeight = (payload) => {
+			const egglement = schema.value?.find((d) => d.id === payload.elId);
+			if (!egglement) return;
+			if (egglement.rotate === 90) if (payload.height !== egglement.height || payload.width !== egglement.width) updateEgglement({
+				egglement,
+				width: payload.rotateWidth,
+				height: payload.rotateHeight
+			});
+			else console.log("高度不变");
+			else if (payload.width !== egglement.width || payload.height !== egglement.height) updateEgglement({
+				egglement,
+				width: payload.width,
+				height: payload.height
+			});
+			else console.log("长度不变");
+		};
+		const focus = (id) => {
+			selectItem.value = schema.value?.filter((i) => i.id === id) ?? [];
+			hoveredElements.value = [...selectItem.value, ...hoverItem.value];
+		};
+		const blur = () => {
+			selectItem.value = [];
+			hoveredElements.value = [...hoverItem.value];
+		};
+		const mouseenter = (id) => {
+			hoverItem.value = schema.value?.filter((i) => i.id === id) ?? [];
+			hoveredElements.value = [...selectItem.value, ...hoverItem.value];
+		};
+		const mouseleave = () => {
+			hoverItem.value = [];
+			hoveredElements.value = [...selectItem.value];
+		};
+		useModal(handleOk);
+		const canvasStyle = computed(() => {
+			if (!canvasSize.value.width || !canvasSize.value.height || !containerSize.value.width || !containerSize.value.height) return {};
+			const scaleX = containerSize.value.width / canvasSize.value.width;
+			const scaleY = containerSize.value.height / canvasSize.value.height;
+			const scale = Math.min(scaleX, scaleY);
+			return {
+				transform: `translate(${(containerSize.value.width - canvasSize.value.width * scale) / 2}px, ${(containerSize.value.height - canvasSize.value.height * scale) / 2}px) scale(${scale})`,
+				transformOrigin: "top left",
+				width: `${canvasSize.value.width}px`,
+				height: `${canvasSize.value.height}px`
+			};
+		});
+		onMounted(() => {
+			schema.value = cloneDeep(defProps.data);
+			if (canvasRef.value) canvasSize.value = {
+				width: canvasRef.value.$el?.offsetWidth || 0,
+				height: canvasRef.value.$el?.offsetHeight || 0
+			};
+			const resizeObserver = new ResizeObserver((entries) => {
+				for (const entry of entries) {
+					const { width, height } = entry.contentRect;
+					containerSize.value.width = width;
+					containerSize.value.height = height;
+				}
+			});
+			if (containerRef.value) resizeObserver.observe(containerRef.value);
+			onUnmounted(() => {
+				resizeObserver.disconnect();
+			});
+		});
+		return (_ctx, _cache) => {
+			const _component_a_input = resolveComponent("a-input");
+			const _component_a_form_item = resolveComponent("a-form-item");
+			const _component_a_form = resolveComponent("a-form");
+			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [createElementVNode("div", _hoisted_3, toDisplayString(unref(t)("sys.inputVar")), 1), createVNode(unref(GctOverlayScrollbars), null, {
+				default: withCtx(() => [createVNode(_component_a_form, {
+					ref_key: "FormRef",
+					ref: FormRef,
+					model: varMap.value,
+					autocomplete: "off",
+					layout: "vertical"
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(defProps.fieldConfig, (item) => {
+						return openBlock(), createBlock(_component_a_form_item, {
+							key: item.key,
+							label: unref(t)(item.label),
+							name: item.key,
+							class: normalizeClass(["var-item", { selected: selectItem.value[0]?.id === item.key }]),
+							required: "",
+							onMouseenter: ($event) => mouseenter(item.key),
+							onMouseleave: mouseleave
+						}, {
+							default: withCtx(() => [createVNode(_component_a_input, {
+								value: varMap.value[item.key],
+								"onUpdate:value": ($event) => varMap.value[item.key] = $event,
+								placeholder: unref(t)("sys.inputText"),
+								onFocus: ($event) => focus(item.key),
+								onBlur: blur,
+								onChange: ($event) => changeMap(varMap.value[item.key], item.key)
+							}, null, 8, [
+								"value",
+								"onUpdate:value",
+								"placeholder",
+								"onFocus",
+								"onChange"
+							])]),
+							_: 2
+						}, 1032, [
+							"label",
+							"name",
+							"class",
+							"onMouseenter"
+						]);
+					}), 128))]),
+					_: 1
+				}, 8, ["model"])]),
+				_: 1
+			})]), createElementVNode("div", _hoisted_4, [createElementVNode("div", _hoisted_5, toDisplayString(unref(t)("sys.simulatedPreview")), 1), createElementVNode("div", {
+				ref_key: "containerRef",
+				ref: containerRef,
+				class: "canvas-container"
+			}, [createVNode(stage_canvas_default, {
+				ref_key: "canvasRef",
+				ref: canvasRef,
+				schema: schema.value,
+				style: normalizeStyle([{
+					"pointer-events": "none",
+					"user-select": "none"
+				}, canvasStyle.value]),
+				onUpdatePBarcodeWidth: updatePBarcodeWidth,
+				onUpdatePQrCodeWidthAndHeight: updatePQrCodeWidthAndHeight
+			}, null, 8, ["schema", "style"])], 512)])]);
+		};
+	}
+});
+//#endregion
+export { test_var_modal_vue_vue_type_script_setup_true_lang_default as default };