@duxweb/dvha-pro 1.0.24 → 1.0.26

package/dist/esm/components/data/dynamicSelect.js

@@ -6,12 +6,21 @@ 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";
 import { DuxDynamicData as S } from "./dynamicData.js";
-import "aieditor";
-import "vee-validate";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
@@ -21,28 +30,22 @@ import "@unocss/preset-typography";
 import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
+import "vee-validate";
 import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
 import "../../pages/page404.js";
-import "@iconify-json/tabler/icons.json";
-import "mime";
 import "vue-draggable-plus";
-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 "short-unique-id";
+import "aieditor";
 import { useModal as w } from "../../hooks/modal.js";
+import "@iconify-json/tabler/icons.json";
+import "../posterEditor/elements/index.js";
+import "fabric";
+import "mime";
 import "dayjs";
 import "@tanstack/vue-query";
 import "pinia";
-const ct = /* @__PURE__ */ f({
+const vt = /* @__PURE__ */ f({
   name: "DuxDynamicSelect",
   props: {
     rowKey: {
@@ -115,5 +118,5 @@ const ct = /* @__PURE__ */ f({
   }
 });
 export {
-  ct as DuxDynamicSelect
+  vt as DuxDynamicSelect
 };

package/dist/esm/components/data/selectModal.js

@@ -1,4 +1,4 @@
-import { defineComponent as y, computed as h, ref as n, watch as C, createVNode as o, Fragment as b, h as x, mergeProps as w, isVNode as z } from "vue";
+import { defineComponent as y, computed as h, ref as m, watch as C, createVNode as o, Fragment as b, h as x, mergeProps as w, isVNode as z } from "vue";
 import { useI18n as P, useJsonSchema as j } from "@duxweb/dvha-core";
 import { NButton as l, NDataTable as k } from "naive-ui";
 import "vue-router";
@@ -6,13 +6,22 @@ import "@overlastic/vue";
 import "clsx";
 import "vue-echarts";
 import "@vueuse/core";
+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 K from "../modal/modalPage.js";
 import "jinrishici";
 import "lodash-es";
 import "vue-draggable-plus";
-import "aieditor";
-import "vee-validate";
 import "@vee-validate/i18n";
 import "colorizr";
 import "echarts";
@@ -22,22 +31,16 @@ import "@unocss/preset-typography";
 import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
+import "vee-validate";
 import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
 import "../../pages/page404.js";
+import "short-unique-id";
+import "aieditor";
 import "@iconify-json/tabler/icons.json";
+import "../posterEditor/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 "dayjs";
 import "@tanstack/vue-query";
 import { useTable as N } from "../../hooks/table.js";
@@ -45,7 +48,7 @@ import "pinia";
 function c(t) {
   return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !z(t);
 }
-const Ct = /* @__PURE__ */ y({
+const wt = /* @__PURE__ */ y({
   name: "Select",
   props: {
     path: String,
@@ -66,7 +69,7 @@ const Ct = /* @__PURE__ */ y({
     } = P(), u = h(() => [{
       type: "selection",
       fixed: "left"
-    }, ...t.columns || []]), m = n({}), i = n({
+    }, ...t.columns || []]), n = m({}), i = m({
       page: 1,
       pageSize: 10
     }), {
@@ -78,16 +81,16 @@ const Ct = /* @__PURE__ */ y({
     } = N({
       path: t.path || "",
       columns: u.value || [],
-      filters: m,
+      filters: n,
       pagination: i.value
-    }), p = n([]);
+    }), p = m([]);
     C(S, (e) => {
       p.value = f.value?.filter((r) => e.includes(r[t.rowKey]));
     });
     const v = j({
       data: t.filterSchema || [],
       context: {
-        filter: m
+        filter: n
       }
     });
     return () => o(K, {
@@ -139,5 +142,5 @@ const Ct = /* @__PURE__ */ y({
   }
 });
 export {
-  Ct as default
+  wt as default
 };

package/dist/esm/components/designEditor/components/grid.js

@@ -0,0 +1,175 @@
+import { createVNode as n, defineComponent as u, computed as m, isVNode as g } from "vue";
+import { useI18n as f } from "@duxweb/dvha-core";
+import { useVModel as h } from "@vueuse/core";
+import v from "clsx";
+import { NFormItem as a, NInputNumber as c } from "naive-ui";
+import { DuxGrid as b } from "../../layout/grid.js";
+import "vue-router";
+import "@overlastic/vue";
+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";
+import "vue-draggable-plus";
+import { DuxWidgetEditorPreview as E } from "../editor/preview.js";
+import { WidgetEditorSettingCard as y } from "../editor/setting.js";
+import "short-unique-id";
+import "aieditor";
+import "vee-validate";
+import "@vee-validate/i18n";
+import "colorizr";
+import "echarts";
+import "@ant-design/colors";
+import "@unocss/preset-icons/browser";
+import "@unocss/preset-typography";
+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 "@duxweb/dvha-naiveui";
+import "../../../pages/page404.js";
+import "@iconify-json/tabler/icons.json";
+import "../../posterEditor/elements/index.js";
+import "fabric";
+import "mime";
+import "dayjs";
+import "@tanstack/vue-query";
+import "pinia";
+function x(o) {
+  return typeof o == "function" || Object.prototype.toString.call(o) === "[object Object]" && !g(o);
+}
+const C = /* @__PURE__ */ u({
+  name: "WidgetEditorGrid",
+  props: {
+    options: Object,
+    children: {
+      type: Array,
+      default: []
+    },
+    onChildren: Function
+  },
+  setup(o) {
+    const r = m(() => o.options?.col || 2), e = m(() => {
+      const t = [...o.children || []], i = r.value;
+      for (; t.length < i; )
+        t.push([]);
+      for (let l = 0; l < i; l++)
+        Array.isArray(t[l]) || (t[l] = []);
+      return t;
+    });
+    return () => {
+      let t;
+      return n(b, {
+        cols: r.value,
+        spac: o.options?.spac
+      }, x(t = e.value.map((i, l) => {
+        const d = i;
+        return n("div", {
+          key: l,
+          class: v({
+            "rounded border border-dashed border-accented": !d?.length
+          })
+        }, [n(E, {
+          modelValue: d,
+          onUpdate: (s) => {
+            const p = [...e.value];
+            p[l] = s, o.onChildren?.(p);
+          }
+        }, null)]);
+      })) ? t : {
+        default: () => [t]
+      });
+    };
+  }
+}), G = /* @__PURE__ */ u({
+  name: "WidgetEditorGridSetting",
+  props: {
+    value: {
+      type: Object,
+      default: () => ({
+        col: 2,
+        spac: 2
+      })
+    }
+  },
+  setup(o, {
+    emit: r
+  }) {
+    const {
+      t: e
+    } = f(), t = h(o, "value", r);
+    return () => n(y, {
+      title: e("components.designEditor.grid.title"),
+      icon: "i-tabler:grid-4x4"
+    }, {
+      default: () => [n(a, {
+        label: e("components.designEditor.grid.columns"),
+        path: "col"
+      }, {
+        default: () => [n(c, {
+          value: t.value.col,
+          "onUpdate:value": (i) => t.value.col = i,
+          min: 1,
+          max: 12,
+          placeholder: e("components.designEditor.grid.columnsPlaceholder")
+        }, null)]
+      }), n(a, {
+        label: e("components.designEditor.grid.spacing"),
+        path: "spac"
+      }, {
+        default: () => [n(c, {
+          value: t.value.spac,
+          "onUpdate:value": (i) => t.value.spac = i,
+          min: 0,
+          max: 100,
+          placeholder: e("components.designEditor.grid.spacingPlaceholder")
+        }, null)]
+      })]
+    });
+  }
+});
+function j(o) {
+  const {
+    children: r,
+    convertToJsonSchema: e
+  } = o || {};
+  let t = [];
+  return r?.length && e && (t = r.flatMap((i) => Array.isArray(i) ? e(i) : [])), {
+    tag: "dux-grid",
+    attrs: {
+      cols: o?.options?.col || 2,
+      spac: o?.options?.spac || 2
+    },
+    children: t
+  };
+}
+function Et(o) {
+  return {
+    name: "dux-grid",
+    icon: "i-tabler:grid-4x4",
+    label: o("components.designEditor.grid.label"),
+    group: "layout",
+    nested: !0,
+    component: (r) => n(C, r, null),
+    setting: (r) => n(G, r, null),
+    settingDefault: {
+      col: 2,
+      spac: 2
+    },
+    json: j
+  };
+}
+export {
+  Et as duxFormEditorGrid
+};

package/dist/esm/components/designEditor/editor/hook.js

@@ -0,0 +1,87 @@
+import I from "short-unique-id";
+import { ref as s, computed as x } from "vue";
+function C({ settingPage: f }) {
+  const c = s([]), i = s([]), p = s(), a = s({
+    config: f?.default || {},
+    data: []
+  }), y = () => {
+    c.value = [];
+  }, m = () => {
+    i.value = [];
+  }, A = (e) => {
+    c.value.findIndex((t) => t.name === e.name) === -1 && c.value.push(e);
+  }, g = (e) => {
+    i.value.findIndex((t) => t.name === e.name) === -1 && i.value.push(e);
+  }, D = x(() => i.value.map((e) => ({
+    name: e.name,
+    label: e.label,
+    icon: e.icon,
+    children: c.value.filter((n) => n.group === e.name)
+  }))), u = (e, n) => {
+    for (const t of n)
+      if (t) {
+        if (Array.isArray(t)) {
+          const r = u(e, t);
+          if (r)
+            return r;
+          continue;
+        }
+        if (t.key === e)
+          return t;
+        if (t.children && t.children.length) {
+          const r = u(e, t.children);
+          if (r)
+            return r;
+        }
+      }
+  }, h = (e) => {
+    if (e)
+      return u(e, a.value.data);
+  }, { randomUUID: v } = new I({ length: 10 }), d = (e) => e?.map((n) => {
+    if (n)
+      return Array.isArray(n) ? d(n) : (n.key = v(), n.children && n.children.length > 0 && (n.children = d(n.children)), n);
+  }).filter((n) => n !== void 0), l = (e, n, t) => {
+    for (const r of e)
+      if (r) {
+        if (Array.isArray(r)) {
+          const o = l(r, n, r);
+          if (o)
+            return o;
+          continue;
+        }
+        if (r.key === n)
+          return t;
+        if (r.children && r.children.length) {
+          const o = l(r.children, n, r);
+          if (o)
+            return o;
+        }
+      }
+  };
+  return {
+    clearGroup: m,
+    clearComponent: y,
+    addComponent: A,
+    addGroup: g,
+    tree: D,
+    components: c,
+    group: i,
+    getData: h,
+    selected: p,
+    value: a,
+    copyData: (e, n) => {
+      const t = h(e), r = JSON.parse(JSON.stringify(t));
+      r.key = v(), r.children && r.children.length > 0 && (r.children = d(r.children));
+      const o = l(a.value.data, e);
+      o ? Array.isArray(o) ? o.splice(n + 1, 0, r) : o.children?.splice(n + 1, 0, r) : a.value.data?.splice(n + 1, 0, r);
+    },
+    deleteData: (e, n) => {
+      const t = l(a.value.data, e);
+      t ? Array.isArray(t) ? t.splice(n, 1) : t.children?.splice(n, 1) : a.value.data?.splice(n, 1), p.value = void 0;
+    },
+    settingPage: f
+  };
+}
+export {
+  C as useEditor
+};

package/dist/esm/components/designEditor/editor/preview.js

@@ -0,0 +1,65 @@
+import { defineComponent as c, inject as u, createVNode as l, Fragment as i, mergeProps as p } from "vue";
+import s from "clsx";
+import { VueDraggable as v } from "vue-draggable-plus";
+const f = /* @__PURE__ */ c({
+  name: "DuxWidgetEditorPreview",
+  props: {
+    class: String,
+    select: String,
+    modelValue: Array,
+    onUpdate: Function,
+    onSelect: Function
+  },
+  setup(r) {
+    const o = u("editor.use");
+    return () => l(i, null, [l(v, p({
+      modelValue: r.modelValue || [],
+      animation: 150,
+      group: "widget",
+      handle: ".editor-handle",
+      class: r.class || s(["h-full flex flex-col gap-2", !r.modelValue || r.modelValue?.length === 0 ? "p-2" : ""])
+    }, {
+      "onUpdate:modelValue": (e) => {
+        r.onUpdate?.(e);
+      }
+    }), {
+      default: () => [r.modelValue?.map((e, d) => {
+        const a = o?.components?.value?.find((t) => t.name === e.name), n = {
+          options: e.options
+        };
+        return a?.nested && (n.children = e.children || [], n.onChildren = (t) => {
+          e.children = t;
+        }), l("div", {
+          class: s(["border p-2 rounded-sm relative w-full", o?.selected.value === e.key ? "bg-primary/10 border-primary border-solid" : "border-accented border-dashed"]),
+          key: e.key,
+          onClick: (t) => {
+            t.stopPropagation(), o?.selected && (o.selected.value = e.key);
+          }
+        }, [l("div", null, [a?.component(n)]), o?.selected.value === e.key && l(i, null, [l("div", {
+          class: "absolute right-0 bottom-0  bg-primary flex px-1 rounded-tl z-1"
+        }, [l("div", {
+          class: "p-1 text-inverted cursor-pointer  hover:text-inverted/80",
+          onClick: () => {
+            o.copyData(e.key, d);
+          }
+        }, [l("div", {
+          class: "i-tabler:copy"
+        }, null)]), l("div", {
+          class: "p-1 text-inverted  cursor-pointer hover:text-inverted/80"
+        }, [l("div", {
+          class: "i-tabler:trash-x",
+          onClick: () => {
+            o?.deleteData(e.key, d);
+          }
+        }, null)])]), l("div", {
+          class: "absolute left-0 top-0  bg-primary p-1 text-inverted rounded-br z-1 editor-handle"
+        }, [l("div", {
+          class: "i-tabler:arrows-move "
+        }, null)])])]);
+      })]
+    })]);
+  }
+});
+export {
+  f as DuxWidgetEditorPreview
+};

package/dist/esm/components/designEditor/editor/setting.js

@@ -0,0 +1,98 @@
+import { defineComponent as m, inject as l, computed as p, createVNode as e } from "vue";
+import "clsx";
+import "naive-ui";
+import "vue-echarts";
+import "@duxweb/dvha-core";
+import "vue-router";
+import "@overlastic/vue";
+import "dayjs";
+import "mime";
+import "lodash-es";
+import "@tanstack/vue-query";
+import "@duxweb/dvha-naiveui";
+import "@vueuse/core";
+import "pinia";
+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 "vue-draggable-plus";
+import "@vee-validate/i18n";
+import "colorizr";
+import "echarts";
+import "@ant-design/colors";
+import "@unocss/preset-icons/browser";
+import "@unocss/preset-typography";
+import "unocss/preset-wind4";
+import "@vee-validate/i18n/dist/locale/en.json";
+import "@vee-validate/i18n/dist/locale/zh_CN.json";
+import "vee-validate";
+import "vue-command-palette";
+import "../../../pages/page404.js";
+import "short-unique-id";
+import "aieditor";
+import { DuxFormLayout as a } from "../../form/formLayout.js";
+import "@iconify-json/tabler/icons.json";
+import "../../posterEditor/elements/index.js";
+import "fabric";
+const ot = /* @__PURE__ */ m({
+  name: "WidgetEditorSetting",
+  props: {
+    actionRender: Function
+  },
+  setup(r) {
+    const t = l("editor.use"), o = p(() => t?.getData(t.selected.value)), n = p(() => t?.components.value?.find((i) => i.name === o.value?.name));
+    return () => e("div", {
+      class: "flex-none  p-2 max-w-full w-220px overflow-y-auto bg-default",
+      key: o.value?.key
+    }, [n.value?.setting?.({
+      value: o.value?.options,
+      "update:modelValue": (i) => {
+        o?.value && (o.value.options = i);
+      }
+    }) || e("div", {
+      class: "flex flex-col gap-2 h-full"
+    }, [e("div", {
+      class: "flex-1 min-h-0"
+    }, [t?.settingPage?.component?.({
+      value: t.value.value.config,
+      "update:modelValue": (i) => {
+        t.value.value.config = i;
+      }
+    })]), r?.actionRender?.(t)])]);
+  }
+}), it = /* @__PURE__ */ m({
+  name: "WidgetEditorSettingCard",
+  props: {
+    title: String,
+    icon: String
+  },
+  setup(r, {
+    slots: t
+  }) {
+    return () => e("div", {
+      class: "flex flex-col"
+    }, [e("div", {
+      class: "bg-elevated rounded py-2 px-4 flex justify-center items-center gap-2"
+    }, [e("div", null, [r.title])]), e("div", {
+      class: "py-4 flex-1"
+    }, [e(a, {
+      labelPlacement: "top"
+    }, {
+      default: () => [t.default?.()]
+    })])]);
+  }
+});
+export {
+  ot as WidgetEditorSetting,
+  it as WidgetEditorSettingCard
+};