@duxweb/dvha-pro 1.0.23 → 1.0.25

package/dist/esm/components/form/pageForm.js

@@ -1,21 +1,12 @@
-import { defineComponent as b, toRef as g, createVNode as i } from "vue";
-import { useI18n as x, useTabStore as y, useExtendForm as S } from "@duxweb/dvha-core";
-import { useMessage as s, NButton as p, NScrollbar as h } from "naive-ui";
+import { defineComponent as f, toRef as b, createVNode as e } from "vue";
+import { useI18n as g, useTabStore as y, useInvalidate as S, useExtendForm as x } from "@duxweb/dvha-core";
+import { useMessage as h, NButton as p, NScrollbar as v } from "naive-ui";
 import { useRouter as E } from "vue-router";
 import "@overlastic/vue";
 import { DuxCard as F } from "../card/card.js";
 import "clsx";
 import "vue-echarts";
 import "@vueuse/core";
-import "vue-cropper";
-import "jinrishici";
-import "lodash-es";
-import "vue-draggable-plus";
-import "aieditor";
-import { DuxFormLayout as v } from "./formLayout.js";
-import "vee-validate";
-import "@iconify-json/tabler/icons.json";
-import "mime";
 import "vue3-ace-editor";
 import "ace-builds/src-noconflict/mode-vue";
 import "ace-builds/src-noconflict/mode-javascript";
@@ -27,6 +18,17 @@ import "ace-builds/src-noconflict/theme-tomorrow";
 import "ace-builds/src-noconflict/ext-searchbox";
 import "ace-builds/src-noconflict/ext-language_tools";
 import "ace-builds/src-noconflict/mode-snippets";
+import "vue-cropper";
+import "jinrishici";
+import "lodash-es";
+import "vue-draggable-plus";
+import "aieditor";
+import { DuxFormLayout as C } from "./formLayout.js";
+import "vee-validate";
+import "@iconify-json/tabler/icons.json";
+import "../image/elements/index.js";
+import "fabric";
+import "mime";
 import "dayjs";
 import "@tanstack/vue-query";
 import "@duxweb/dvha-naiveui";
@@ -41,9 +43,9 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vue-command-palette";
-import { DuxPage as C } from "../../pages/page.js";
+import { DuxPage as D } from "../../pages/page.js";
 import "../../pages/page404.js";
-const xt = /* @__PURE__ */ b({
+const xt = /* @__PURE__ */ f({
   name: "DuxPageForm",
   props: {
     id: {
@@ -73,72 +75,69 @@ const xt = /* @__PURE__ */ b({
     size: {
       type: String,
       default: "medium"
+    },
+    invalidate: {
+      type: String
     }
   },
   setup(t, {
-    slots: r
+    slots: m
   }) {
     const {
       t: o
-    } = x(), d = g(t, "data", {}), u = s(), l = E(), n = y(), m = S({
+    } = g(), s = b(t, "data", {}), a = h(), c = E(), n = y(), {
+      invalidate: l
+    } = S(), r = x({
       id: t.id,
       path: t.path,
-      form: d,
+      form: s,
       action: t.action,
-      onError: (e) => {
-        var a;
-        u.error(e.message || o("components.form.error")), (a = t.onError) == null || a.call(t, e);
+      onError: (i) => {
+        a.error(i.message || o("components.form.error")), t.onError?.(i);
       },
-      onSuccess: (e) => {
-        var a;
-        u.success(o("components.form.success")), (a = t.onSuccess) == null || a.call(t, e), !m.isEdit.value && n.current && n.delTab(n.current, (f) => l.push(f.path || ""));
+      onSuccess: (i) => {
+        a.success(o("components.form.success")), t.onSuccess?.(i), !r.isEdit.value && n.current && n.delTab(n.current, (d) => c.push(d.path || "")), t.invalidate && l(t.invalidate);
       }
-    }), c = n.tabs.find((e) => e.path === n.current);
-    return () => i(C, {
+    }), u = n.tabs.find((i) => i.path === n.current);
+    return () => e(D, {
       card: !1,
       scrollbar: !1
     }, {
-      default: () => [i(F, {
-        title: (t == null ? void 0 : t.title) || (c == null ? void 0 : c.label) || (m.isEdit.value ? o("components.form.edit") : o("components.form.create")),
-        description: t == null ? void 0 : t.description,
+      default: () => [e(F, {
+        title: t?.title || u?.label || (r.isEdit.value ? o("components.form.edit") : o("components.form.create")),
+        description: t?.description,
         class: "h-full flex flex-col",
         contentClass: "flex-1 min-h-0",
         contentSize: "none",
         "header-bordered": !0
       }, {
-        default: () => i(h, null, {
-          default: () => [i(v, {
+        default: () => e(v, null, {
+          default: () => [e(C, {
             "label-placement": "page"
           }, {
-            default: () => {
-              var e;
-              return [(e = r == null ? void 0 : r.default) == null ? void 0 : e.call(r, m)];
-            }
+            default: () => [m?.default?.(r)]
           })]
         }),
-        headerExtra: () => {
-          var e;
-          return i("div", {
-            class: "flex gap-6 items-center"
-          }, [(e = r == null ? void 0 : r.actions) == null ? void 0 : e.call(r, m), i("div", {
-            class: "flex gap-2"
-          }, [i(p, {
-            onClick: () => m.onReset()
-          }, {
-            default: () => o("components.button.reset"),
-            icon: () => i("i", {
-              class: "i-tabler:refresh"
-            }, null)
-          }), i(p, {
-            type: "primary",
-            onClick: () => m.onSubmit()
-          }, {
-            default: () => o("components.button.submit"),
-            icon: () => i("i", {
-              class: "i-tabler:device-floppy"
-            }, null)
-          })])]);
-        }
+        headerExtra: () => e("div", {
+          class: "flex gap-6 items-center"
+        }, [m?.actions?.(r), e("div", {
+          class: "flex gap-2"
+        }, [e(p, {
+          onClick: () => r.onReset()
+        }, {
+          default: () => o("components.button.reset"),
+          icon: () => e("i", {
+            class: "i-tabler:refresh"
+          }, null)
+        }), e(p, {
+          type: "primary",
+          onClick: () => r.onSubmit()
+        }, {
+          default: () => o("components.button.submit"),
+          icon: () => e("i", {
+            class: "i-tabler:device-floppy"
+          }, null)
+        })])])
       })]
     });
   }

package/dist/esm/components/form/settingForm.js

@@ -1,19 +1,11 @@
-import { defineComponent as f, ref as d, toRef as l, computed as g, createVNode as i } from "vue";
-import { useI18n as x, useExtendForm as y } from "@duxweb/dvha-core";
-import { useMessage as S, NTabs as b } from "naive-ui";
+import { defineComponent as s, ref as c, toRef as d, computed as f, createVNode as o } from "vue";
+import { useI18n as g, useInvalidate as x, useExtendForm as y } from "@duxweb/dvha-core";
+import { useMessage as v, NTabs as S } from "naive-ui";
 import "@overlastic/vue";
 import "vue-router";
 import "clsx";
 import "vue-echarts";
 import "@vueuse/core";
-import "vue-cropper";
-import "jinrishici";
-import "lodash-es";
-import "vue-draggable-plus";
-import "aieditor";
-import "vee-validate";
-import "@iconify-json/tabler/icons.json";
-import "mime";
 import "vue3-ace-editor";
 import "ace-builds/src-noconflict/mode-vue";
 import "ace-builds/src-noconflict/mode-javascript";
@@ -25,6 +17,16 @@ import "ace-builds/src-noconflict/theme-tomorrow";
 import "ace-builds/src-noconflict/ext-searchbox";
 import "ace-builds/src-noconflict/ext-language_tools";
 import "ace-builds/src-noconflict/mode-snippets";
+import "vue-cropper";
+import "jinrishici";
+import "lodash-es";
+import "vue-draggable-plus";
+import "aieditor";
+import "vee-validate";
+import "@iconify-json/tabler/icons.json";
+import "../image/elements/index.js";
+import "fabric";
+import "mime";
 import "dayjs";
 import "@tanstack/vue-query";
 import "@duxweb/dvha-naiveui";
@@ -39,9 +41,9 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vue-command-palette";
-import { DuxPage as v } from "../../pages/page.js";
+import { DuxPage as b } from "../../pages/page.js";
 import "../../pages/page404.js";
-const ct = /* @__PURE__ */ f({
+const ct = /* @__PURE__ */ s({
   name: "DuxSettingForm",
   props: {
     id: {
@@ -73,27 +75,30 @@ const ct = /* @__PURE__ */ f({
     size: {
       type: String,
       default: "medium"
+    },
+    invalidate: {
+      type: String
     }
   },
   setup(t, {
-    slots: e
+    slots: i
   }) {
-    const a = d(t.defaultTab), c = l(t, "data", {}), {
-      t: o
-    } = x(), n = S(), u = y({
+    const r = c(t.defaultTab), p = d(t, "data", {}), {
+      t: m
+    } = g(), a = v(), {
+      invalidate: u
+    } = x(), n = y({
       id: t.id,
       path: t.path,
-      form: c,
+      form: p,
       action: t.action,
-      onError: (r) => {
-        var m;
-        n.error(r.message || o("components.form.error")), (m = t.onError) == null || m.call(t, r);
+      onError: (e) => {
+        a.error(e.message || m("components.form.error")), t.onError?.(e);
       },
-      onSuccess: (r) => {
-        var m;
-        n.success(o("components.form.success")), (m = t.onSuccess) == null || m.call(t, r);
+      onSuccess: (e) => {
+        a.success(m("components.form.success")), t.onSuccess?.(e), t.invalidate && u(t.invalidate);
       }
-    }), p = g(() => {
+    }), l = f(() => {
       switch (t.size) {
         case "small":
           return "lg:max-w-lg";
@@ -104,25 +109,19 @@ const ct = /* @__PURE__ */ f({
           return "lg:max-w-2xl";
       }
     });
-    return () => i(v, null, {
-      default: () => {
-        var r;
-        return [i("div", {
-          class: `flex flex-col gap-6 w-full ${p.value} mx-auto py-4`
-        }, [t.tabs ? i(b, {
-          defaultValue: t.defaultTab,
-          value: a.value,
-          onUpdateValue: (m) => {
-            a.value = m;
-          },
-          type: "segment"
-        }, {
-          default: () => {
-            var m;
-            return [(m = e == null ? void 0 : e.default) == null ? void 0 : m.call(e, u)];
-          }
-        }) : (r = e == null ? void 0 : e.default) == null ? void 0 : r.call(e, u)])];
-      }
+    return () => o(b, null, {
+      default: () => [o("div", {
+        class: `flex flex-col gap-6 w-full ${l.value} mx-auto py-4`
+      }, [t.tabs ? o(S, {
+        defaultValue: t.defaultTab,
+        value: r.value,
+        onUpdateValue: (e) => {
+          r.value = e;
+        },
+        type: "segment"
+      }, {
+        default: () => [i?.default?.(n)]
+      }) : i?.default?.(n)])]
     });
   }
 });

package/dist/esm/components/icon/icon.js

@@ -6,6 +6,17 @@ import "vue-router";
 import "@overlastic/vue";
 import "clsx";
 import "vue-echarts";
+import "vue3-ace-editor";
+import "ace-builds/src-noconflict/mode-vue";
+import "ace-builds/src-noconflict/mode-javascript";
+import "ace-builds/src-noconflict/mode-html";
+import "ace-builds/src-noconflict/mode-json";
+import "ace-builds/src-noconflict/mode-json5";
+import "ace-builds/src-noconflict/theme-tomorrow_night";
+import "ace-builds/src-noconflict/theme-tomorrow";
+import "ace-builds/src-noconflict/ext-searchbox";
+import "ace-builds/src-noconflict/ext-language_tools";
+import "ace-builds/src-noconflict/mode-snippets";
 import "vue-cropper";
 import "jinrishici";
 import "lodash-es";
@@ -25,23 +36,14 @@ import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
 import "../../pages/page404.js";
 import "@iconify-json/tabler/icons.json";
+import "../image/elements/index.js";
+import "fabric";
 import "mime";
-import "vue3-ace-editor";
-import "ace-builds/src-noconflict/mode-vue";
-import "ace-builds/src-noconflict/mode-javascript";
-import "ace-builds/src-noconflict/mode-html";
-import "ace-builds/src-noconflict/mode-json";
-import "ace-builds/src-noconflict/mode-json5";
-import "ace-builds/src-noconflict/theme-tomorrow_night";
-import "ace-builds/src-noconflict/theme-tomorrow";
-import "ace-builds/src-noconflict/ext-searchbox";
-import "ace-builds/src-noconflict/ext-language_tools";
-import "ace-builds/src-noconflict/mode-snippets";
 import { useModal as c } from "../../hooks/modal.js";
 import "dayjs";
 import "@tanstack/vue-query";
 import "pinia";
-const to = /* @__PURE__ */ n({
+const ro = /* @__PURE__ */ n({
   name: "DuxIconPicker",
   props: {
     defaultValue: String,
@@ -85,5 +87,5 @@ const to = /* @__PURE__ */ n({
   }
 });
 export {
-  to as DuxIconPicker
+  ro as DuxIconPicker
 };

package/dist/esm/components/icon/iconPicker.js

@@ -1,83 +1,79 @@
-import { defineComponent as h, ref as r, onMounted as C, watch as y, createVNode as a } from "vue";
-import { useI18n as b } from "@duxweb/dvha-core";
-import { icons as f } from "@iconify-json/tabler/icons.json";
-import { useOffsetPagination as k } from "@vueuse/core";
-import { NInput as x, NPagination as z } from "naive-ui";
-const N = /* @__PURE__ */ h({
+import { defineComponent as m, ref as l, onMounted as P, watch as h, createVNode as a } from "vue";
+import { useI18n as C } from "@duxweb/dvha-core";
+import { icons as v } from "@iconify-json/tabler/icons.json";
+import { useOffsetPagination as y } from "@vueuse/core";
+import { NInput as b, NPagination as k } from "naive-ui";
+const I = /* @__PURE__ */ m({
   name: "DuxIconPicker",
   props: {
     onConfirm: Function,
     onClose: Function
   },
-  setup(u) {
-    const c = Object.keys(f), i = r(c), l = r(""), s = r([]), v = r(c.length);
-    function t({
-      currentPage: n,
-      currentPageSize: e
+  setup(d) {
+    const i = Object.keys(v), u = l(i), t = l(""), c = l([]), s = l(i.length);
+    function n({
+      currentPage: e,
+      currentPageSize: r
     }) {
-      s.value = i.value.slice((n - 1) * e, n * e);
+      c.value = u.value.slice((e - 1) * r, e * r);
     }
     const {
       currentPage: o,
-      currentPageSize: d,
-      pageCount: m
-    } = k({
-      total: () => v.value,
+      currentPageSize: p,
+      pageCount: g
+    } = y({
+      total: () => s.value,
       page: 1,
       pageSize: 42,
-      onPageChange: t,
-      onPageSizeChange: t,
-      onPageCountChange: t
+      onPageChange: n,
+      onPageSizeChange: n,
+      onPageCountChange: n
     });
-    C(() => {
-      t({
+    P(() => {
+      n({
         currentPage: o.value,
         currentPageSize: 42
       });
-    }), y(l, () => {
-      i.value = Object.keys(f).filter((n) => n.includes(l.value)), v.value = i.value.length, o.value = 1, t({
+    }), h(t, () => {
+      u.value = Object.keys(v).filter((e) => e.includes(t.value)), s.value = u.value.length, o.value = 1, n({
         currentPage: o.value,
-        currentPageSize: d.value
+        currentPageSize: p.value
       });
     }, {
       immediate: !0
     });
     const {
-      t: p
-    } = b();
-    return () => {
-      var n;
-      return a("div", {
-        class: "p-4 flex flex-col gap-4"
-      }, [a(x, {
-        placeholder: p("common.keyword"),
-        value: l.value,
-        "onUpdate:value": (e) => l.value = e,
-        clearable: !0
-      }, null), a("div", {
-        class: "grid grid-cols-6"
-      }, [(n = s.value) == null ? void 0 : n.map((e, P) => a("div", {
-        key: P,
-        class: "flex justify-center items-center",
-        onClick: () => {
-          var g;
-          (g = u.onConfirm) == null || g.call(u, `i-tabler:${e}`);
-        }
-      }, [a("div", {
-        class: "py-2 px-3 hover:bg-primary/10 border border-transparent hover:border-primary-hover rounded cursor-pointer transition-all"
-      }, [a("div", {
-        class: `i-tabler:${e} size-6`
-      }, null)])]))]), a("div", {
-        class: "flex justify-center"
-      }, [a(z, {
-        page: o.value,
-        pageSize: d.value,
-        pageCount: m.value,
-        onUpdatePage: (e) => o.value = e
-      }, null)])]);
-    };
+      t: f
+    } = C();
+    return () => a("div", {
+      class: "p-4 flex flex-col gap-4"
+    }, [a(b, {
+      placeholder: f("common.keyword"),
+      value: t.value,
+      "onUpdate:value": (e) => t.value = e,
+      clearable: !0
+    }, null), a("div", {
+      class: "grid grid-cols-6"
+    }, [c.value?.map((e, r) => a("div", {
+      key: r,
+      class: "flex justify-center items-center",
+      onClick: () => {
+        d.onConfirm?.(`i-tabler:${e}`);
+      }
+    }, [a("div", {
+      class: "py-2 px-3 hover:bg-primary/10 border border-transparent hover:border-primary-hover rounded cursor-pointer transition-all"
+    }, [a("div", {
+      class: `i-tabler:${e} size-6`
+    }, null)])]))]), a("div", {
+      class: "flex justify-center"
+    }, [a(k, {
+      page: o.value,
+      pageSize: p.value,
+      pageCount: g.value,
+      onUpdatePage: (e) => o.value = e
+    }, null)])]);
   }
 });
 export {
-  N as default
+  I as default
 };

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

@@ -0,0 +1,113 @@
+import { defineComponent as b, computed as s, createVNode as a } from "vue";
+const m = /* @__PURE__ */ b({
+  name: "CanvasRuler",
+  props: {
+    canvasWidth: {
+      type: Number,
+      required: !0
+    },
+    canvasHeight: {
+      type: Number,
+      required: !0
+    },
+    canvasScale: {
+      type: Number,
+      required: !0
+    },
+    rulerSize: {
+      type: Number,
+      default: 20
+    }
+  },
+  setup(e) {
+    const n = (t, l) => {
+      const v = [];
+      let r = 10;
+      l < 0.5 ? r = 50 : l < 1 && (r = 25);
+      for (let i = 0; i <= t; i += r) {
+        const f = i * l, h = i % (r * 5) === 0;
+        v.push({
+          position: f,
+          value: i,
+          isMajor: h
+        });
+      }
+      return v;
+    }, c = s(() => n(e.canvasWidth, e.canvasScale)), d = s(() => n(e.canvasHeight, e.canvasScale)), u = s(() => e.canvasWidth * e.canvasScale), o = s(() => e.canvasHeight * e.canvasScale);
+    return () => a("div", {
+      class: "absolute inset-0 pointer-events-none"
+    }, [a("div", {
+      class: "absolute flex justify-center left-6 top-0 right-0 bg-default",
+      style: {
+        height: `${e.rulerSize}px`
+      }
+    }, [a("div", {
+      class: "absolute top-0 bg-default",
+      style: {
+        left: "50%",
+        transform: "translateX(-50%)",
+        width: `${u.value}px`,
+        height: `${e.rulerSize}px`
+      }
+    }, [a("svg", {
+      width: u.value,
+      height: e.rulerSize,
+      class: "absolute top-0 left-0"
+    }, [c.value.map((t, l) => a("g", {
+      key: l
+    }, [a("line", {
+      x1: t.position,
+      y1: t.isMajor ? 0 : e.rulerSize / 2,
+      x2: t.position,
+      y2: e.rulerSize,
+      stroke: "rgba(0,0,0, 0.1)",
+      "stroke-width": "1"
+    }, null), t.isMajor && a("text", {
+      x: t.position + 2,
+      y: e.rulerSize - 6,
+      "font-size": "10",
+      stroke: "rgba(0,0,0, 0.1)",
+      "font-family": "monospace",
+      fill: "rgb(var(--ui-text-muted))"
+    }, [t.value])]))])])]), a("div", {
+      class: "absolute flex justify-center items-center flex-col top-6 left-0 bottom-0 bg-default border-r border-muted",
+      style: {
+        width: `${e.rulerSize}px`
+      }
+    }, [a("div", {
+      class: "absolute left-0 bg-default",
+      style: {
+        top: "50%",
+        transform: "translateY(-50%)",
+        width: `${e.rulerSize}px`,
+        height: `${o.value}px`
+      }
+    }, [a("svg", {
+      width: e.rulerSize,
+      height: o.value,
+      class: "absolute top-0 left-0"
+    }, [d.value.map((t, l) => a("g", {
+      key: l
+    }, [a("line", {
+      x1: t.isMajor ? 0 : e.rulerSize / 2,
+      y1: t.position,
+      x2: e.rulerSize,
+      y2: t.position,
+      stroke: "rgba(0,0,0, 0.1)",
+      "stroke-width": "1"
+    }, null), t.isMajor && a("text", {
+      x: e.rulerSize - 6,
+      y: t.position - 6,
+      "font-size": "10",
+      fill: "rgb(var(--ui-text-muted))",
+      "font-family": "monospace",
+      "text-anchor": "end",
+      transform: `rotate(-90, ${e.rulerSize - 2}, ${t.position - 2})`
+    }, [t.value])]))])])]), a("div", {
+      class: "absolute size-6 bg-default top-0 left-0"
+    }, null)]);
+  }
+});
+export {
+  m as CanvasRuler
+};