@duxweb/dvha-pro 1.0.31 → 1.0.33

package/dist/esm/components/posterEditor/pages/RightPanel.js

@@ -1,5 +1,5 @@
-import { defineComponent as v, createVNode as e, Fragment as u, createTextVNode as c, isVNode as s } from "vue";
-import { NButton as l, NTooltip as n, NInputNumber as o, NColorPicker as f } from "naive-ui";
+import { defineComponent as v, createVNode as e, Fragment as o, createTextVNode as c, isVNode as s } from "vue";
+import { NButton as l, NTooltip as n, NInputNumber as u, NColorPicker as f } from "naive-ui";
 import "@duxweb/dvha-core";
 import "@vueuse/core";
 import "mime";
@@ -25,6 +25,20 @@ import "vue-draggable-plus";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
+import "highlight.js/lib/core";
+import "highlight.js/lib/languages/bash";
+import "highlight.js/lib/languages/css";
+import "highlight.js/lib/languages/go";
+import "highlight.js/lib/languages/java";
+import "highlight.js/lib/languages/javascript";
+import "highlight.js/lib/languages/json";
+import "highlight.js/lib/languages/markdown";
+import "highlight.js/lib/languages/php";
+import "highlight.js/lib/languages/python";
+import "highlight.js/lib/languages/shell";
+import "highlight.js/lib/languages/sql";
+import "highlight.js/lib/languages/typescript";
+import "highlight.js/lib/languages/xml";
 import "@ant-design/colors";
 import "@unocss/preset-icons/browser";
 import "@unocss/preset-typography";
@@ -41,7 +55,7 @@ import "@iconify-json/tabler/icons.json";
 import "../elements/index.js";
 import "fabric";
 import { Panel as m } from "./Panel.js";
-import { PanelItem as a } from "./PanelItem.js";
+import { PanelItem as i } from "./PanelItem.js";
 import "dayjs";
 import "@tanstack/vue-query";
 import "pinia";
@@ -49,7 +63,7 @@ import { DuxImageUpload as b } from "../../upload/image.js";
 function C(t) {
   return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !s(t);
 }
-const ge = /* @__PURE__ */ v({
+const Ie = /* @__PURE__ */ v({
   name: "RightPanel",
   props: {
     hasMultipleSelection: {
@@ -148,7 +162,7 @@ const ge = /* @__PURE__ */ v({
         return e(m, {
           title: "多选操作"
         }, {
-          default: () => e(u, null, [e(a, {
+          default: () => e(o, null, [e(i, {
             title: "对齐"
           }, {
             default: () => [e("div", {
@@ -186,7 +200,7 @@ const ge = /* @__PURE__ */ v({
               }, null),
               default: () => "底部对齐"
             })])]
-          }), e(a, {
+          }), e(i, {
             title: "居中"
           }, {
             default: () => [e("div", {
@@ -225,7 +239,7 @@ const ge = /* @__PURE__ */ v({
               default: () => "垂直分布"
             })])]
           })]),
-          footer: () => e(u, null, [e(l, {
+          footer: () => e(o, null, [e(l, {
             block: !0,
             onClick: t.onDeleteSelectedElements,
             type: "error"
@@ -241,38 +255,38 @@ const ge = /* @__PURE__ */ v({
         return e(m, {
           title: "元素设置"
         }, {
-          default: () => e(u, null, [r.map((i) => {
+          default: () => e(o, null, [r.map((a) => {
             let d;
-            return e(a, {
-              key: i.key,
-              title: i.label
-            }, C(d = t.onRenderToolbarControl(i)) ? d : {
+            return e(i, {
+              key: a.key,
+              title: a.label
+            }, C(d = t.onRenderToolbarControl(a)) ? d : {
               default: () => [d]
             });
-          }), e(a, {
+          }), e(i, {
             title: "X"
           }, {
-            default: () => [e(o, {
+            default: () => [e(u, {
               value: t.currentElementData?.left,
-              "onUpdate:value": (i) => t.onUpdateElementProperty(t.currentElementData.id, "left", i || 0)
+              "onUpdate:value": (a) => t.onUpdateElementProperty(t.currentElementData.id, "left", a || 0)
             }, null)]
-          }), e(a, {
+          }), e(i, {
             title: "Y"
           }, {
-            default: () => [e(o, {
+            default: () => [e(u, {
               value: t.currentElementData?.top,
-              "onUpdate:value": (i) => t.onUpdateElementProperty(t.currentElementData.id, "top", i || 0)
+              "onUpdate:value": (a) => t.onUpdateElementProperty(t.currentElementData.id, "top", a || 0)
             }, null)]
-          }), e(a, {
+          }), e(i, {
             title: "角度"
           }, {
-            default: () => [e(o, {
+            default: () => [e(u, {
               value: t.currentElementData?.angle,
               min: -180,
               max: 180,
-              "onUpdate:value": (i) => t.onUpdateElementProperty(t.currentElementData.id, "angle", i || 0)
+              "onUpdate:value": (a) => t.onUpdateElementProperty(t.currentElementData.id, "angle", a || 0)
             }, null)]
-          }), e(a, {
+          }), e(i, {
             title: "对齐"
           }, {
             default: () => [e("div", {
@@ -302,7 +316,7 @@ const ge = /* @__PURE__ */ v({
               }, null),
               default: () => "居中"
             })])]
-          }), e(a, {
+          }), e(i, {
             title: "层级"
           }, {
             default: () => [e("div", {
@@ -345,7 +359,7 @@ const ge = /* @__PURE__ */ v({
               default: () => "移到最后"
             })])]
           })]),
-          footer: () => e(u, null, [e(l, {
+          footer: () => e(o, null, [e(l, {
             block: !0,
             onClick: t.onDeleteSelectedElements,
             type: "error"
@@ -360,32 +374,32 @@ const ge = /* @__PURE__ */ v({
         return e(m, {
           title: "画布设置"
         }, {
-          default: () => e(u, null, [e(a, {
+          default: () => e(o, null, [e(i, {
             title: "宽度"
           }, {
-            default: () => [e(o, {
+            default: () => [e(u, {
               value: t.canvasWidth,
               min: 100,
               max: 2e3,
               "onUpdate:value": (r) => t.onUpdateCanvasSize(r || 800, t.canvasHeight)
             }, null)]
-          }), e(a, {
+          }), e(i, {
             title: "高度"
           }, {
-            default: () => [e(o, {
+            default: () => [e(u, {
               value: t.canvasHeight,
               min: 100,
               max: 2e3,
               "onUpdate:value": (r) => t.onUpdateCanvasSize(t.canvasWidth, r || 600)
             }, null)]
-          }), e(a, {
+          }), e(i, {
             title: "背景颜色"
           }, {
             default: () => [e(f, {
               value: t.canvasBackgroundColor,
               "onUpdate:value": (r) => t.onUpdateCanvasBackground(r)
             }, null)]
-          }), e(a, {
+          }), e(i, {
             title: "背景图片"
           }, {
             default: () => [e(b, {
@@ -393,7 +407,7 @@ const ge = /* @__PURE__ */ v({
               onUpdateValue: (r) => t.onUpdateCanvasBackgroundImage(typeof r == "string" ? r : Array.isArray(r) && r[0] || "")
             }, null)]
           })]),
-          footer: () => e(u, null, [e(l, {
+          footer: () => e(o, null, [e(l, {
             type: "primary",
             block: !0,
             onClick: t.onSaveData
@@ -418,5 +432,5 @@ const ge = /* @__PURE__ */ v({
   }
 });
 export {
-  ge as RightPanel
+  Ie as RightPanel
 };

package/dist/esm/components/posterEditor/posterEditor.js

@@ -1,4 +1,4 @@
-import { defineComponent as T, ref as m, watch as F, onMounted as H, onUnmounted as R, createVNode as a } from "vue";
+import { defineComponent as T, ref as d, watch as F, onMounted as H, onUnmounted as R, createVNode as a } from "vue";
 import { NSlider as V, NSwitch as W, NSelect as z, NColorPicker as A, NInputNumber as J, NInput as j } from "naive-ui";
 import { DuxCard as L } from "../card/card.js";
 import "clsx";
@@ -26,6 +26,20 @@ import "vue-draggable-plus";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
+import "highlight.js/lib/core";
+import "highlight.js/lib/languages/bash";
+import "highlight.js/lib/languages/css";
+import "highlight.js/lib/languages/go";
+import "highlight.js/lib/languages/java";
+import "highlight.js/lib/languages/javascript";
+import "highlight.js/lib/languages/json";
+import "highlight.js/lib/languages/markdown";
+import "highlight.js/lib/languages/php";
+import "highlight.js/lib/languages/python";
+import "highlight.js/lib/languages/shell";
+import "highlight.js/lib/languages/sql";
+import "highlight.js/lib/languages/typescript";
+import "highlight.js/lib/languages/xml";
 import "@ant-design/colors";
 import "@unocss/preset-icons/browser";
 import "@unocss/preset-typography";
@@ -48,7 +62,7 @@ import "dayjs";
 import "@tanstack/vue-query";
 import "pinia";
 import { DuxImageUpload as Q } from "../upload/image.js";
-const Ge = /* @__PURE__ */ T({
+const ra = /* @__PURE__ */ T({
   name: "DuxPosterEditor",
   props: {
     data: {
@@ -75,7 +89,7 @@ const Ge = /* @__PURE__ */ T({
     onSave: Function
   },
   setup(n) {
-    const r = m(), l = m(), {
+    const r = d(), i = d(), {
       initCanvas: s,
       destroy: v,
       setCallbacks: c,
@@ -91,8 +105,8 @@ const Ge = /* @__PURE__ */ T({
       loadData: p,
       canvasData: o,
       selectedElements: S,
-      canvasScale: d,
-      currentElementData: i,
+      canvasScale: m,
+      currentElementData: l,
       currentElementConfig: U,
       hasMultipleSelection: w,
       updateCanvasSettings: y,
@@ -111,7 +125,7 @@ const Ge = /* @__PURE__ */ T({
     });
     const B = (e) => {
       const t = (P) => {
-        i.value && u(i.value.id, e.key, P);
+        l.value && u(l.value.id, e.key, P);
       };
       switch (e.type) {
         case "text":
@@ -166,7 +180,7 @@ const Ge = /* @__PURE__ */ T({
     }, {
       immediate: !1
     }), H(() => {
-      r.value && l.value && (s(r.value, l.value), p(n.data));
+      r.value && i.value && (s(r.value, i.value), p(n.data));
     }), R(() => {
       v();
     }), () => a(L, {
@@ -180,11 +194,11 @@ const Ge = /* @__PURE__ */ T({
         canvasWidth: o.value.width,
         canvasHeight: o.value.height
       }, null), a("div", {
-        ref: l,
+        ref: i,
         class: "flex-1 p-6  pl-12 pt-12 flex items-center justify-center overflow-hidden relative",
         style: "background: linear-gradient(45deg, rgba(0,0,0, 0.1) 25%, transparent 25%), linear-gradient(-45deg, rgba(0,0,0, 0.1) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(0,0,0, 0.1) 75%), linear-gradient(-45deg, transparent 75%, rgba(0,0,0, 0.1) 75%); background-size: 20px 20px; background-position: 0 0, 0 10px, 10px -10px, -10px 0px;"
       }, [a(G, {
-        canvasScale: d.value,
+        canvasScale: m.value,
         canvasWidth: o.value.width,
         canvasHeight: o.value.height
       }, null), a("div", {
@@ -197,7 +211,7 @@ const Ge = /* @__PURE__ */ T({
         onClearCanvas: E,
         hasMultipleSelection: w.value,
         selectedElementsCount: S.value.length,
-        currentElementData: i.value || void 0,
+        currentElementData: l.value || void 0,
         currentElementConfig: U.value || void 0,
         canMoveUp: C.value,
         canMoveDown: b.value,
@@ -218,11 +232,11 @@ const Ge = /* @__PURE__ */ T({
         },
         onExportJson: N,
         onRenderToolbarControl: B,
-        canvasScale: d.value
+        canvasScale: m.value
       }, null)])]
     });
   }
 });
 export {
-  Ge as DuxPosterEditor
+  ra as DuxPosterEditor
 };

package/dist/esm/components/table/table.js

@@ -1,7 +1,7 @@
-import { defineComponent as u, computed as f, toRef as d, createVNode as i, mergeProps as e } from "vue";
+import { defineComponent as u, computed as f, toRef as d, createVNode as i, mergeProps as m } from "vue";
 import { useI18n as c } from "@duxweb/dvha-core";
 import { useWindowSize as b } from "@vueuse/core";
-import { NDataTable as m, NPagination as g } from "naive-ui";
+import { NDataTable as e, NPagination as g } from "naive-ui";
 import "vue-router";
 import "@overlastic/vue";
 import "clsx";
@@ -25,6 +25,20 @@ import { DuxListEmpty as x } from "../status/listEmpty.js";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
+import "highlight.js/lib/core";
+import "highlight.js/lib/languages/bash";
+import "highlight.js/lib/languages/css";
+import "highlight.js/lib/languages/go";
+import "highlight.js/lib/languages/java";
+import "highlight.js/lib/languages/javascript";
+import "highlight.js/lib/languages/json";
+import "highlight.js/lib/languages/markdown";
+import "highlight.js/lib/languages/php";
+import "highlight.js/lib/languages/python";
+import "highlight.js/lib/languages/shell";
+import "highlight.js/lib/languages/sql";
+import "highlight.js/lib/languages/typescript";
+import "highlight.js/lib/languages/xml";
 import "@ant-design/colors";
 import "@unocss/preset-icons/browser";
 import "@unocss/preset-typography";
@@ -45,7 +59,7 @@ import "dayjs";
 import "@tanstack/vue-query";
 import { useTable as y } from "../../hooks/table.js";
 import "pinia";
-const bt = /* @__PURE__ */ u({
+const Lt = /* @__PURE__ */ u({
   name: "DuxTable",
   props: {
     path: {
@@ -63,7 +77,7 @@ const bt = /* @__PURE__ */ u({
       default: !0
     }
   },
-  extends: m,
+  extends: e,
   setup(o) {
     const p = f(() => {
       const {
@@ -86,7 +100,7 @@ const bt = /* @__PURE__ */ u({
     } = c();
     return () => i("div", {
       class: "flex flex-col gap-2"
-    }, [i(m, e(p.value, r.table.value, {
+    }, [i(e, m(p.value, r.table.value, {
       class: "flex-1 min-h-0",
       minHeight: 200,
       tableLayout: "fixed",
@@ -100,7 +114,7 @@ const bt = /* @__PURE__ */ u({
       }, null)
     }), o.pagination && i("div", {
       class: "flex justify-end"
-    }, [i(g, e(r.tablePagination.value, {
+    }, [i(g, m(r.tablePagination.value, {
       simple: l.value < 768
     }), {
       prefix: () => i("div", null, [a("components.list.total", {
@@ -110,5 +124,5 @@ const bt = /* @__PURE__ */ u({
   }
 });
 export {
-  bt as DuxTable
+  Lt as DuxTable
 };

package/dist/esm/components/upload/file.js

@@ -26,6 +26,20 @@ import "vue-draggable-plus";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
+import "highlight.js/lib/core";
+import "highlight.js/lib/languages/bash";
+import "highlight.js/lib/languages/css";
+import "highlight.js/lib/languages/go";
+import "highlight.js/lib/languages/java";
+import "highlight.js/lib/languages/javascript";
+import "highlight.js/lib/languages/json";
+import "highlight.js/lib/languages/markdown";
+import "highlight.js/lib/languages/php";
+import "highlight.js/lib/languages/python";
+import "highlight.js/lib/languages/shell";
+import "highlight.js/lib/languages/sql";
+import "highlight.js/lib/languages/typescript";
+import "highlight.js/lib/languages/xml";
 import "@ant-design/colors";
 import "@unocss/preset-icons/browser";
 import "@unocss/preset-typography";
@@ -80,7 +94,7 @@ const m = {
     empty: "flex items-center justify-center h-full text-muted",
     actions: "flex gap-2"
   }
-}, Ee = /* @__PURE__ */ M({
+}, $e = /* @__PURE__ */ M({
   name: "DuxFileUpload",
   props: {
     path: {
@@ -241,7 +255,9 @@ const m = {
         key: "status",
         title: a("components.upload.file.status"),
         width: 120,
-        render: (e) => e.status === "uploading" ? o(T, {
+        render: (e) => e.status === "uploading" ? o("div", {
+          class: "flex items-center"
+        }, [o(T, {
           type: "line",
           style: {
             width: "24px",
@@ -252,7 +268,7 @@ const m = {
           percentage: e.progress?.percent,
           showIndicator: !1,
           height: 14
-        }, null) : V.value[e.status]
+        }, null)]) : V.value[e.status]
       }, {
         key: "actions",
         title: a("components.upload.actions"),
@@ -288,5 +304,5 @@ const m = {
   }
 });
 export {
-  Ee as DuxFileUpload
+  $e as DuxFileUpload
 };

package/dist/esm/components/upload/image.js

@@ -1,4 +1,4 @@
-import { defineComponent as S, computed as n, watch as p, ref as U, createVNode as a } from "vue";
+import { defineComponent as S, computed as m, watch as p, ref as U, createVNode as a } from "vue";
 import { useI18n as k, useUpload as w } from "@duxweb/dvha-core";
 import { useVModel as I } from "@vueuse/core";
 import V from "clsx";
@@ -24,6 +24,20 @@ import "lodash-es";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
+import "highlight.js/lib/core";
+import "highlight.js/lib/languages/bash";
+import "highlight.js/lib/languages/css";
+import "highlight.js/lib/languages/go";
+import "highlight.js/lib/languages/java";
+import "highlight.js/lib/languages/javascript";
+import "highlight.js/lib/languages/json";
+import "highlight.js/lib/languages/markdown";
+import "highlight.js/lib/languages/php";
+import "highlight.js/lib/languages/python";
+import "highlight.js/lib/languages/shell";
+import "highlight.js/lib/languages/sql";
+import "highlight.js/lib/languages/typescript";
+import "highlight.js/lib/languages/xml";
 import "@ant-design/colors";
 import "@unocss/preset-icons/browser";
 import "@unocss/preset-typography";
@@ -46,7 +60,7 @@ import "dayjs";
 import { useImagePreview as O } from "../../hooks/image.js";
 import "@tanstack/vue-query";
 import "pinia";
-const Ae = /* @__PURE__ */ S({
+const Te = /* @__PURE__ */ S({
   name: "DuxImageUpload",
   props: {
     path: {
@@ -80,13 +94,13 @@ const Ae = /* @__PURE__ */ S({
   setup(t, {
     emit: g
   }) {
-    const u = I(t, "value", g, {
+    const n = I(t, "value", g, {
       passive: !0,
       deep: !0,
       defaultValue: t.defaultValue
     }), v = j(), f = O(), {
-      t: m
-    } = k(), o = {
+      t: u
+    } = k(), l = {
       container: "flex gap-2",
       imageItem: "size-80px rounded border border-muted relative group draggable flex items-center",
       imageOverlay: "z-1 size-full inset-0 absolute flex items-center justify-center bg-default/80 transition-all opacity-0 group-hover:opacity-100 rounded",
@@ -94,7 +108,7 @@ const Ae = /* @__PURE__ */ S({
       uploadContent: "flex-1 flex flex-col justify-center items-center gap-1 relative",
       progressContainer: "size-80px flex items-center justify-center rounded",
       progressBar: "absolute left-2 right-2 bottom-2"
-    }, h = n(() => t.maxSize), {
+    }, h = m(() => t.maxSize), {
       uploadPath: s,
       managePath: b,
       driver: x
@@ -112,23 +126,23 @@ const Ae = /* @__PURE__ */ S({
       autoUpload: !0,
       accept: "image/*",
       onError: (e) => {
-        v.error(e.message || m("components.upload.error"));
+        v.error(e.message || u("components.upload.error"));
       },
       driver: x.value
     });
     p(r.dataFiles, (e) => {
-      const l = t.multiple ? e?.map((i) => i.url) : e?.[0]?.url;
-      u.value = l, t.onUpdateValue?.(l);
+      const o = t.multiple ? e?.map((i) => i.url) : e?.[0]?.url;
+      n.value = o, t.onUpdateValue?.(o);
     });
-    const y = n(() => r.progress.value.totalPercent), z = n(() => r.isUploading.value), F = async () => {
+    const y = m(() => r.progress.value.totalPercent), z = m(() => r.isUploading.value), F = async () => {
       r.open();
-    }, P = n(() => t.multiple ? t.maxNum && r.uploadFiles.value.length >= t.maxNum : !0), C = n(() => r.dataFiles.value?.map((e) => e.url)), N = M(), d = U(!1);
-    return p(u, (e) => {
+    }, P = m(() => t.multiple ? t.maxNum && r.uploadFiles.value.length >= t.maxNum : !0), C = m(() => r.dataFiles.value?.map((e) => e.url)), N = M(), d = U(!1);
+    return p(n, (e) => {
       if (!e || !e?.length || d.value)
         return;
       d.value = !0;
-      const l = typeof e == "string" ? [e] : Array.isArray(e) ? e : [];
-      r.addDataFiles(l.map((i) => ({
+      const o = typeof e == "string" ? [e] : Array.isArray(e) ? e : [];
+      r.addDataFiles(o.map((i) => ({
         url: i
       })));
     }, {
@@ -136,14 +150,14 @@ const Ae = /* @__PURE__ */ S({
     }), () => a("div", null, [a(B, {
       modelValue: r.uploadFiles.value,
       "onUpdate:modelValue": (e) => r.uploadFiles.value = e,
-      class: o.container,
+      class: l.container,
       draggable: ".draggable"
     }, {
-      default: () => [r.uploadFiles.value?.map((e, l) => {
+      default: () => [r.uploadFiles.value?.map((e, o) => {
         const i = e.url || URL.createObjectURL(e.file);
         return a("div", {
-          key: l,
-          class: V(o.imageItem)
+          key: o,
+          class: V(l.imageItem)
         }, [a(A, {
           class: "z-0 rounded",
           objectFit: "scale-down",
@@ -152,7 +166,7 @@ const Ae = /* @__PURE__ */ S({
           previewDisabled: !0,
           src: i
         }, null), a("div", {
-          class: o.imageOverlay
+          class: l.imageOverlay
         }, [e.status === "success" && a(c, {
           quaternary: !0,
           circle: !0,
@@ -160,7 +174,7 @@ const Ae = /* @__PURE__ */ S({
           renderIcon: () => a("div", {
             class: "n-icon i-tabler:eye"
           }, null),
-          onClick: () => f.show(C.value, l)
+          onClick: () => f.show(C.value, o)
         }, null), a(c, {
           quaternary: !0,
           circle: !0,
@@ -173,7 +187,7 @@ const Ae = /* @__PURE__ */ S({
           }
         }, null)])]);
       }), (r.uploadFiles.value.length === 0 || !P.value) && a("div", {
-        class: o.uploadArea,
+        class: l.uploadArea,
         onClick: () => {
           F();
         }
@@ -181,7 +195,7 @@ const Ae = /* @__PURE__ */ S({
         class: " py-1 text-xs bg-muted border-b border-dashed border-accented flex items-center justify-center",
         onClick: (e) => {
           e.stopPropagation(), N.show({
-            title: m("components.upload.title"),
+            title: u("components.upload.title"),
             width: "800px",
             component: () => import("./manager.js"),
             componentProps: {
@@ -195,20 +209,20 @@ const Ae = /* @__PURE__ */ S({
                 maxSize: t.maxSize
               }
             }
-          }).then((l) => {
-            r.addDataFiles(l);
+          }).then((o) => {
+            r.addDataFiles(o);
           });
         }
       }, [a("div", {
         class: "i-tabler:folder size-4"
       }, null)]), a("div", {
-        class: o.uploadContent
+        class: l.uploadContent
       }, [z.value ? a("div", {
-        class: o.progressContainer
+        class: l.progressContainer
       }, [a("div", {
         class: "i-tabler:photo size-6"
       }, null), a("div", {
-        class: o.progressBar
+        class: l.progressBar
       }, [a(D, {
         type: "line",
         percentage: y.value,
@@ -221,5 +235,5 @@ const Ae = /* @__PURE__ */ S({
   }
 });
 export {
-  Ae as DuxImageUpload
+  Te as DuxImageUpload
 };