@king-one/form-design 0.0.16 → 0.0.18

package/dist/es/src/components/form-material.vue.mjs

@@ -1,79 +1,85 @@
-import { defineComponent as B, ref as I, openBlock as r, createElementBlock as l, normalizeClass as u, unref as s, createElementVNode as i, createVNode as d, withCtx as c, createTextVNode as v, Fragment as V, renderList as j, toDisplayString as _, createBlock as E, createCommentVNode as w } from "vue";
+import { defineComponent as O, ref as b, openBlock as l, createElementBlock as d, normalizeClass as c, unref as o, createElementVNode as n, createVNode as a, withCtx as r, createTextVNode as x, Fragment as z, renderList as F, toDisplayString as v, createBlock as J, createCommentVNode as u } from "vue";
 import "../internal.mjs";
-import { RadioGroup as O, RadioButton as k } from "ant-design-vue";
-import z from "vuedraggable";
-import { uid as F } from "@king-one/utils";
-import { useInjectDragContext as J, useInjectDesignContext as R } from "../context/design.mjs";
+import { RadioGroup as T, RadioButton as w } from "ant-design-vue";
+import N from "vuedraggable";
+import { uid as W } from "@king-one/utils";
+import { useInjectDragContext as G, useInjectDesignContext as K } from "../context/design.mjs";
+import "./base/Carousel.vue2.mjs";
 import h from "./base/widget-icon.mjs";
-import { useNamespace as m } from "../hooks/use-namespace/index.mjs";
-const G = { class: "widget-group-name" }, K = { class: "widget-col" }, L = { class: "widget-item" }, M = {
+import { useNamespace as p } from "../hooks/use-namespace/index.mjs";
+import L from "./base/Carousel.vue.mjs";
+const M = { class: "widget-group-name" }, U = { class: "widget-col" }, q = { class: "widget-item" }, A = {
   key: 0,
   class: "widget-item-icon"
-}, T = { class: "widget-item-title" }, Y = /* @__PURE__ */ B({
+}, H = { class: "widget-item-title" }, P = { class: "template-item" }, Q = {
+  key: 0,
+  class: "template-item-icon"
+}, X = { class: "template-item-name" }, de = /* @__PURE__ */ O({
   name: "FormMaterial",
   __name: "form-material",
-  setup(U) {
-    const { updateDrag: p } = J(), { b: y } = m("material"), { b } = m("toolbar"), { b: x } = m("widget"), g = R(), { schema: C } = g, f = I("1");
-    function N(n) {
-      const { icon: t, ...e } = n, o = JSON.parse(JSON.stringify(e)), a = F();
-      return {
-        ...o,
-        name: a,
-        id: a,
-        "k-design-props": Object.assign({
+  setup(Y) {
+    const _ = b(), { updateDrag: m } = G(), { b: S } = p("material"), { b: D } = p("toolbar"), { b: $ } = p("widget"), { b: B } = p("temp"), g = K(), { schema: E, tempSchema: I } = g, y = b("1");
+    function R(i) {
+      const { icon: e, ...t } = i, s = JSON.parse(JSON.stringify(t)), k = W(), f = {
+        ...s,
+        name: k,
+        id: k,
+        "x-design-props": Object.assign({
           validate: {
             status: "",
             message: ""
           }
-        }, n["k-design-props"] || {})
-      };
+        }, i["x-design-props"] || {})
+      }, { shared: C } = g;
+      return C.draggedContext.field = f, C.draggedContext.key = f.key, f;
+    }
+    function V(i) {
+      const { schema: e } = i, { shared: t } = g;
+      return t.draggedContext.field = e, t.draggedContext.key = e.key, e;
     }
-    function S(n, t) {
-      const { oldIndex: e } = t, { widget: o = [] } = n, a = o[e];
-      if (a) {
-        const { shared: D } = g;
-        D.draggedContext.key = a.key;
-      }
-      p(!0);
+    function j(i) {
+      var e;
+      (e = _.value) == null || e.goTo(Number(i.target.value) - 1);
     }
-    return (n, t) => (r(), l(
+    return (i, e) => (l(), d(
       "div",
       {
-        class: u(s(y)())
+        class: c(o(S)())
       },
       [
-        i(
+        n(
           "div",
           {
-            class: u(s(b)())
+            class: c(o(D)())
           },
           [
-            d(s(O), {
-              value: f.value,
-              "onUpdate:value": t[0] || (t[0] = (e) => f.value = e),
+            a(o(T), {
+              value: y.value,
+              "onUpdate:value": e[0] || (e[0] = (t) => y.value = t),
               "button-style": "solid",
-              size: "default"
+              size: "default",
+              onChange: j
             }, {
-              default: c(() => [
-                d(s(k), {
+              default: r(() => [
+                a(o(w), {
                   class: "toolbar-button",
                   value: "1"
                 }, {
-                  default: c(() => t[2] || (t[2] = [
-                    v(" 组件库 ")
+                  default: r(() => e[5] || (e[5] = [
+                    x(" 组件库 ")
                   ])),
                   _: 1,
-                  __: [2]
+                  __: [5]
                 }),
-                d(s(k), {
+                a(o(w), {
                   class: "toolbar-button",
                   value: "2"
                 }, {
-                  default: c(() => t[3] || (t[3] = [
-                    v(" 组件模版 ")
+                  default: r(() => e[6] || (e[6] = [
+                    x(" 业务套件 ")
                   ])),
                   _: 1,
-                  __: [3]
+                  __: [6]
                 })
               ]),
               _: 1
@@ -83,66 +89,132 @@ const G = { class: "widget-group-name" }, K = { class: "widget-col" }, L = { cla
           2
           /* CLASS */
         ),
-        i(
-          "div",
+        a(
+          L,
           {
-            class: u(s(x)())
+            ref_key: "carouselRef",
+            ref: _,
+            "model-value": 0
           },
-          [
-            (r(!0), l(
-              V,
-              null,
-              j(s(C), (e) => (r(), l("div", {
-                key: e.key,
-                class: "widget-group"
-              }, [
-                i(
-                  "div",
-                  G,
-                  _(e.name),
-                  1
-                  /* TEXT */
-                ),
-                e.widget ? (r(), E(s(z), {
-                  key: 0,
-                  list: e.widget,
-                  class: "widget-list-drag",
-                  "item-key": "key",
-                  group: { name: "form", pull: "clone", put: !1 },
-                  sort: !1,
-                  options: { animation: 150 },
-                  clone: N,
-                  onStart: (o) => S(e, o),
-                  onEnd: t[1] || (t[1] = (o) => s(p)(!1))
-                }, {
-                  item: c(({ element: o }) => [
-                    i("div", K, [
-                      i("div", L, [
-                        o.icon ? (r(), l("div", M, [
-                          d(s(h), {
-                            icon: o.icon
+          {
+            default: r(() => [
+              n(
+                "div",
+                {
+                  class: c(o($)())
+                },
+                [
+                  (l(!0), d(
+                    z,
+                    null,
+                    F(o(E), (t) => (l(), d("div", {
+                      key: t.key,
+                      class: "widget-group"
+                    }, [
+                      n(
+                        "div",
+                        M,
+                        v(t.name),
+                        1
+                        /* TEXT */
+                      ),
+                      t.widget ? (l(), J(o(N), {
+                        key: 0,
+                        list: t.widget,
+                        class: "widget-list-drag",
+                        "item-key": "key",
+                        group: { name: "form", pull: "clone", put: !1 },
+                        sort: !1,
+                        options: { animation: 150 },
+                        clone: R,
+                        onStart: e[1] || (e[1] = (s) => o(m)(!0)),
+                        onEnd: e[2] || (e[2] = (s) => o(m)(!1))
+                      }, {
+                        item: r(({ element: s }) => [
+                          n("div", U, [
+                            n("div", q, [
+                              s.icon ? (l(), d("div", A, [
+                                a(o(h), {
+                                  icon: s.icon
+                                }, null, 8, ["icon"])
+                              ])) : u("v-if", !0),
+                              n(
+                                "div",
+                                H,
+                                v(s.title),
+                                1
+                                /* TEXT */
+                              )
+                            ])
+                          ])
+                        ]),
+                        _: 2
+                        /* DYNAMIC */
+                      }, 1032, ["list"])) : u("v-if", !0)
+                    ]))),
+                    128
+                    /* KEYED_FRAGMENT */
+                  ))
+                ],
+                2
+                /* CLASS */
+              ),
+              n(
+                "div",
+                {
+                  class: c(o(B)())
+                },
+                [
+                  a(o(N), {
+                    list: o(I),
+                    class: "template-list-drag",
+                    "item-key": "key",
+                    group: { name: "form", pull: "clone", put: !1 },
+                    sort: !1,
+                    options: { animation: 150 },
+                    clone: V,
+                    onStart: e[3] || (e[3] = (t) => o(m)(!0)),
+                    onEnd: e[4] || (e[4] = (t) => o(m)(!1))
+                  }, {
+                    item: r(({ element: t }) => [
+                      n("div", P, [
+                        t.icon ? (l(), d("div", Q, [
+                          a(o(h), {
+                            icon: t.icon
                           }, null, 8, ["icon"])
-                        ])) : w("v-if", !0),
-                        i(
+                        ])) : u("v-if", !0),
+                        n(
                           "div",
-                          T,
-                          _(o.title),
+                          X,
+                          v(t.name),
                           1
                           /* TEXT */
                         )
                       ])
-                    ])
-                  ]),
-                  _: 2
-                  /* DYNAMIC */
-                }, 1032, ["list", "onStart"])) : w("v-if", !0)
-              ]))),
-              128
-              /* KEYED_FRAGMENT */
-            ))
-          ],
-          2
-          /* CLASS */
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  }, 8, ["list"]),
+                  u(` <div class="template-list">
+          <div v-for="g in tempSchema" :key="g.key" class="template-item">
+            <div v-if="g.icon" class="template-item-icon">
+              <WidgetIcon :icon="g.icon" />
+            </div>
+            <div class="template-item-name">
+              {{ g.name }}
+            </div>
+          </div>
+        </div> `)
+                ],
+                2
+                /* CLASS */
+              )
+            ]),
+            _: 1
+            /* STABLE */
+          },
+          512
+          /* NEED_PATCH */
         )
       ],
       2
@@ -151,5 +223,5 @@ const G = { class: "widget-group-name" }, K = { class: "widget-col" }, L = { cla
   }
 });
 export {
-  Y as default
+  de as default
 };

package/dist/es/src/components/form-panel.vue.mjs

@@ -1,57 +1,63 @@
-import { defineComponent as z, ref as g, nextTick as E, toRaw as R, openBlock as v, createElementBlock as h, normalizeClass as i, unref as e, createElementVNode as o, createVNode as n, withCtx as l, createCommentVNode as d, renderSlot as k, withDirectives as C, vShow as b } from "vue";
+import { defineComponent as E, ref as h, nextTick as R, toRaw as T, openBlock as v, createElementBlock as k, normalizeClass as r, unref as e, createElementVNode as n, createVNode as s, withCtx as i, createCommentVNode as f, renderSlot as C, withDirectives as b, vShow as x } from "vue";
 import "../internal.mjs";
-import { Tooltip as x, Form as T } from "ant-design-vue";
-import j from "vuedraggable";
-import { useInjectDragContext as B, useInjectDesignContext as J } from "../context/design.mjs";
+import { Tooltip as S, Form as j } from "ant-design-vue";
+import B from "vuedraggable";
+import { useInjectDragContext as J, useInjectDesignContext as P } from "../context/design.mjs";
+import "../utils/index.mjs";
 import "./panel/panel-item.vue2.mjs";
 import O from "./base/json-preview.vue.mjs";
 import "./index.mjs";
-import { useNamespace as P } from "../hooks/use-namespace/index.mjs";
-import S from "./form-icon.vue2.mjs";
-import q from "./panel/panel-item.vue.mjs";
-const A = { class: "left" }, G = { class: "right" }, H = { class: "content-panel" }, K = {
+import { useNamespace as q } from "../hooks/use-namespace/index.mjs";
+import { debounce as A } from "../utils/debounce.mjs";
+import w from "./form-icon.vue2.mjs";
+import G from "./panel/panel-item.vue.mjs";
+const H = { class: "left" }, K = { class: "right" }, L = { class: "content-panel" }, M = {
   key: 0,
   class: "prompt"
-}, L = { class: "form-item" }, M = { class: "content-editor" }, le = /* @__PURE__ */ z({
+}, Q = { class: "form-item" }, U = { class: "content-editor" }, me = /* @__PURE__ */ E({
   name: "FormPanel",
   __name: "form-panel",
-  setup(Q) {
-    const f = g({}), { isDrag: w } = B(), r = g(!1), c = J(), { fields: m } = c;
-    function D() {
-      r.value = !r.value, E(() => {
-        f.value = c.getFormSchema();
+  setup(W) {
+    const p = h({}), { isDrag: D } = J(), c = h(!1), a = P(), { fields: m } = a;
+    function F() {
+      c.value = !c.value, R(() => {
+        p.value = a.getFormSchema();
       });
     }
     function y() {
     }
-    const { b: $, e: p, em: u } = P("panel");
-    function F() {
-      const { shared: s } = c, { key: t } = s.draggedContext;
-      return t !== "";
+    const { b: $, e: u, em: g } = q("panel"), I = A(N, 200);
+    function N() {
+      const { shared: l } = a, { key: t, field: o } = l.draggedContext, d = a.hooks.dragPut.call({
+        key: t,
+        field: o,
+        region: "form-panel"
+      });
+      return a.setCheckedField(o), d;
     }
-    function I(s, t) {
-      const a = R(s), { oldIndex: N } = t, _ = a[N];
+    function V(l, t) {
+      const o = T(l), { oldIndex: d } = t, _ = o[d];
       if (_) {
-        const { shared: V } = c;
-        V.draggedContext.key = _.key;
+        const { shared: z } = a;
+        z.draggedContext.key = _.key;
       }
     }
-    return (s, t) => (v(), h(
+    return (l, t) => (v(), k(
       "div",
       {
-        class: i(e($)())
+        class: r(e($)())
       },
       [
-        o(
+        n(
           "div",
           {
-            class: i(e(p)("toolbar"))
+            class: r(e(u)("toolbar"))
           },
           [
-            o("div", A, [
-              n(e(x), { placement: "bottom" }, {
-                title: l(() => t[1] || (t[1] = [
-                  o(
+            n("div", H, [
+              s(e(S), { placement: "bottom" }, {
+                title: i(() => t[1] || (t[1] = [
+                  n(
                     "span",
                     null,
                     "全部删除",
@@ -59,10 +65,10 @@ const A = { class: "left" }, G = { class: "right" }, H = { class: "content-panel
                     /* CACHED */
                   )
                 ])),
-                default: l(() => [
-                  n(e(S), {
+                default: i(() => [
+                  s(e(w), {
                     name: "delete1",
-                    class: i(e(u)("toolbar", "icon")),
+                    class: r(e(g)("toolbar", "icon")),
                     size: 18,
                     onClick: y
                   }, null, 8, ["class"])
@@ -70,9 +76,9 @@ const A = { class: "left" }, G = { class: "right" }, H = { class: "content-panel
                 _: 1
                 /* STABLE */
               }),
-              n(e(x), { placement: "bottom" }, {
-                title: l(() => t[2] || (t[2] = [
-                  o(
+              s(e(S), { placement: "bottom" }, {
+                title: i(() => t[2] || (t[2] = [
+                  n(
                     "span",
                     null,
                     "查看JSON Schema",
@@ -80,60 +86,60 @@ const A = { class: "left" }, G = { class: "right" }, H = { class: "content-panel
                     /* CACHED */
                   )
                 ])),
-                default: l(() => [
-                  n(e(S), {
+                default: i(() => [
+                  s(e(w), {
                     name: "code",
-                    class: i(e(u)("toolbar", "icon")),
+                    class: r(e(g)("toolbar", "icon")),
                     size: 18,
-                    onClick: D
+                    onClick: F
                   }, null, 8, ["class"])
                 ]),
                 _: 1
                 /* STABLE */
               }),
-              d(` <FormIcon name="desktop" />
+              f(` <FormIcon name="desktop" />
         <FormIcon name="mobile" /> `)
             ]),
-            o("div", G, [
-              k(s.$slots, "toolbar")
+            n("div", K, [
+              C(l.$slots, "toolbar")
             ])
           ],
           2
           /* CLASS */
         ),
-        d(' ref="contentTelRef" '),
-        o(
+        f(' ref="contentTelRef" '),
+        n(
           "div",
           {
-            class: i(e(p)("content"))
+            class: r(e(u)("content"))
           },
           [
-            C(o(
+            b(n(
               "div",
-              H,
+              L,
               [
-                !e(w) && e(m).length === 0 ? (v(), h("div", K, " 👈 请在左侧选择控件并拖至此处 ")) : d("v-if", !0),
-                n(e(T), {
+                !e(D) && e(m).length === 0 ? (v(), k("div", M, " 👈 请在左侧选择控件并拖至此处 ")) : f("v-if", !0),
+                s(e(j), {
                   autocomplete: "off",
                   class: "design-from",
                   "label-align": "left"
                 }, {
-                  default: l(() => [
-                    n(e(j), {
+                  default: i(() => [
+                    s(e(B), {
                       class: "drag-from",
                       list: e(m),
-                      group: { name: "form", put: F },
+                      group: { name: "form", put: e(I) },
                       animation: 300,
                       sort: !0,
                       "item-key": "id",
                       "chosen-class": "choose",
-                      onStart: t[0] || (t[0] = (a) => I(e(m), a))
+                      onStart: t[0] || (t[0] = (o) => V(e(m), o))
                     }, {
-                      item: l(({ element: a }) => [
-                        o("div", L, [
-                          k(s.$slots, `panel-${a.key}`, {}, () => [
-                            n(q, {
-                              field: a,
+                      item: i(({ element: o }) => [
+                        n("div", Q, [
+                          C(l.$slots, `panel-${o.key}`, {}, () => [
+                            s(G, {
+                              field: o,
                               space: e(m)
                             }, null, 8, ["field", "space"])
                           ])
@@ -150,18 +156,18 @@ const A = { class: "left" }, G = { class: "right" }, H = { class: "content-panel
               512
               /* NEED_PATCH */
             ), [
-              [b, !r.value]
+              [x, !c.value]
             ]),
-            C(o(
+            b(n(
               "div",
-              M,
+              U,
               [
-                n(O, { data: f.value }, null, 8, ["data"])
+                s(O, { data: p.value }, null, 8, ["data"])
               ],
               512
               /* NEED_PATCH */
             ), [
-              [b, r.value]
+              [x, c.value]
             ])
           ],
           2
@@ -174,5 +180,5 @@ const A = { class: "left" }, G = { class: "right" }, H = { class: "content-panel
   }
 });
 export {
-  le as default
+  me as default
 };

package/dist/es/src/components/panel/index.mjs

@@ -1,19 +1,29 @@
-import { Input as r, Textarea as m, InputNumber as o } from "ant-design-vue";
+import { Input as m, Textarea as o, InputNumber as e } from "ant-design-vue";
 import "./widget/object.vue.mjs";
-import { panelWarpper as t } from "./panel-wrapper.mjs";
+import { panelWarpper as r } from "./panel-wrapper.mjs";
 import "./widget/select.vue.mjs";
 import "./widget/array-card.vue.mjs";
-import p from "./widget/select.vue2.mjs";
-import e from "./widget/object.vue2.mjs";
-import n from "./widget/array-card.vue2.mjs";
-const a = t(r), i = t(m), c = t(o), l = {
-  "k-input": a,
-  "k-textarea": i,
-  "k-input-number": c,
-  "k-select": p,
-  "k-object": e,
-  "k-array-card": n
+import "./widget/date-range.vue.mjs";
+import "./widget/date-single.vue.mjs";
+import "./widget/kit.vue.mjs";
+import i from "./widget/select.vue2.mjs";
+import p from "./widget/object.vue2.mjs";
+import a from "./widget/date-range.vue2.mjs";
+import n from "./widget/date-single.vue2.mjs";
+import f from "./widget/array-card.vue2.mjs";
+import t from "./widget/kit.vue2.mjs";
+const c = r(m), s = r(o), _ = r(e), w = {
+  "k-input": c,
+  "k-textarea": s,
+  "k-input-number": _,
+  "k-select": i,
+  "k-object": p,
+  "k-date-range": a,
+  "k-date-single": n,
+  "k-array-card": f,
+  "k-overtime": t,
+  "k-leave": t
 };
 export {
-  l as widgetPanels
+  w as widgetPanels
 };