@aplus-frontend/ui 0.1.38 → 0.1.40

package/es/src/ap-form/modal-form/drawer.vue.mjs

@@ -0,0 +1,288 @@
+import { isVNode as H, defineComponent as J, useSlots as K, ref as h, computed as O, watch as R, unref as s, cloneVNode as Q, createVNode as d, mergeProps as v, openBlock as b, createElementBlock as P, Fragment as Y, withCtx as g, renderSlot as M, createTextVNode as Z, toDisplayString as ee, createBlock as N, resolveDynamicComponent as S, normalizeClass as te, withModifiers as ie, createCommentVNode as _ } from "vue";
+import { Button as V, Flex as ne, Space as oe, Drawer as le } from "ant-design-vue";
+import "../ap-form.vue.mjs";
+import "../../hooks/index.mjs";
+import { getSingleVNode as ae } from "../../utils/slot.mjs";
+import "../../config-provider/index.mjs";
+import { isBoolean as se, isUndefined as re, omit as ue } from "lodash-unified";
+import "../style/drawer-form.css";
+import { convertReactiveToRaw as de } from "../../utils/index.mjs";
+import { useControllableValue as ce } from "../../hooks/useControllableValue.mjs";
+import { useLocale as me } from "../../config-provider/hooks/use-locale.mjs";
+import { useNamespace as fe } from "../../config-provider/hooks/use-namespace.mjs";
+import pe from "../ap-form.vue2.mjs";
+function L(c) {
+  return typeof c == "function" || Object.prototype.toString.call(c) === "[object Object]" && !H(c);
+}
+const je = /* @__PURE__ */ J({
+  __name: "drawer",
+  props: {
+    layout: {
+      default: "horizontal"
+    },
+    labelCol: {},
+    wrapperCol: {},
+    colon: {
+      type: Boolean,
+      default: !0
+    },
+    labelAlign: {
+      default: "right"
+    },
+    labelWrap: {
+      type: Boolean
+    },
+    prefixCls: {},
+    requiredMark: {},
+    hideRequiredMark: {
+      type: Boolean,
+      default: !1
+    },
+    rules: {},
+    validateMessages: {},
+    validateOnRuleChange: {
+      type: Boolean,
+      default: !0
+    },
+    scrollToFirstError: {},
+    onSubmit: {},
+    name: {},
+    validateTrigger: {
+      default: "change"
+    },
+    size: {},
+    disabled: {
+      type: Boolean
+    },
+    onValuesChange: {},
+    onFieldsChange: {},
+    onFinishFailed: {},
+    onValidate: {},
+    initialValues: {},
+    open: {
+      type: Boolean,
+      default: void 0
+    },
+    "onUpdate:open": {},
+    drawerProps: {
+      default: () => ({})
+    },
+    title: {},
+    width: {
+      default: 378
+    },
+    onFinish: {},
+    submitter: {
+      type: [Boolean, Object],
+      default: () => ({
+        resetButtonProps: !1
+      })
+    },
+    showCancel: {
+      type: Boolean,
+      default: !0
+    },
+    submitTimeout: {},
+    resize: {
+      type: [Object, Boolean],
+      default: !1
+    }
+  },
+  emits: ["update:open"],
+  setup(c, {
+    expose: j,
+    emit: E
+  }) {
+    const n = c, F = K(), U = E, l = h(), m = h(), u = h(!1), {
+      value: z,
+      updateValue: f
+    } = ce(n, U, {
+      valuePropName: "open",
+      defaultValue: !1
+    }), p = O(() => {
+      var t, i, a, r;
+      const e = {
+        onResize: () => {
+        },
+        minWidth: 300,
+        maxWidth: window.innerWidth * 0.8,
+        resizeOnOpen: !0
+      };
+      return se(n.resize) ? n.resize ? e : {} : {
+        minWidth: ((t = n.resize) == null ? void 0 : t.minWidth) ?? e.minWidth,
+        maxWidth: ((i = n.resize) == null ? void 0 : i.maxWidth) ?? e.maxWidth,
+        onResize: ((a = n.resize) == null ? void 0 : a.onResize) ?? e.onResize,
+        resizeOnOpen: re((r = n.resize) == null ? void 0 : r.resizeOnOpen) ? e.onResize : n.resize.resizeOnOpen
+      };
+    }), y = h(C()), {
+      t: w
+    } = me(), {
+      e: D
+    } = fe("ap-form-drawer-form");
+    R(() => l.value, (e) => {
+      var t;
+      e && m.value && ((t = e.setFieldsValue) == null || t.call(e, m.value), m.value = void 0);
+    }), R(() => s(z), (e) => {
+      var t;
+      e && (t = s(p)) != null && t.resizeOnOpen && (y.value = C());
+    });
+    function C() {
+      var t;
+      const e = (t = s(p)) == null ? void 0 : t.minWidth;
+      return !e || e && e < n.width ? n.width : e;
+    }
+    const W = ae(F.trigger), B = W ? Q(W, {
+      onClick: () => {
+        f(!0);
+      }
+    }) : null, $ = O(() => {
+      var t, i, a, r;
+      const e = [];
+      if (n.submitter === !1)
+        return null;
+      if (n.showCancel) {
+        let o;
+        e.push(d(V, {
+          onClick: x,
+          disabled: u.value
+        }, L(o = w("ap.common.cancelText")) ? o : {
+          default: () => [o]
+        }));
+      }
+      return ((t = n.submitter) == null ? void 0 : t.resetButtonProps) !== !1 && e.push(d(V, v(((i = n.submitter) == null ? void 0 : i.resetButtonProps) || {}, {
+        key: "submit",
+        disabled: u.value,
+        onClick: I
+      }), {
+        default: () => {
+          var o;
+          return [((o = n.submitter) == null ? void 0 : o.resetText) || w("ap.common.resetText")];
+        }
+      })), ((a = n.submitter) == null ? void 0 : a.submitButtonProps) !== !1 && e.push(d(V, v({
+        type: "primary",
+        key: "submit"
+      }, ((r = n.submitter) == null ? void 0 : r.submitButtonProps) || {}, {
+        loading: u.value,
+        onClick: A
+      }), {
+        default: () => {
+          var o;
+          return [((o = n.submitter) == null ? void 0 : o.submitText) || w("ap.common.okText")];
+        }
+      })), d(ne, {
+        justify: "flex-end"
+      }, {
+        default: () => [F.submitter ? F.submitter(e) : d(oe, null, L(e) ? e : {
+          default: () => [e]
+        })]
+      });
+    });
+    function q() {
+      var e, t;
+      (t = (e = p.value) == null ? void 0 : e.onResize) == null || t.call(e), document.addEventListener("mousemove", k), document.addEventListener("mouseup", T);
+    }
+    function k(e) {
+      const t = s(p), i = (document.body.offsetWidth || 1e3) - (e.clientX - document.body.offsetLeft), a = (t == null ? void 0 : t.minWidth) ?? (n.width || 800), r = (t == null ? void 0 : t.maxWidth) ?? window.innerWidth * 0.8;
+      let o = i;
+      i < a && (o = a), i > r && (o = r), y.value = o;
+    }
+    function T() {
+      document.removeEventListener("mousemove", k), document.removeEventListener("mouseup", T);
+    }
+    function I() {
+      var e, t, i;
+      n.submitter !== !1 && ((e = l.value) == null || e.resetFields(), (i = (t = n.submitter) == null ? void 0 : t.onReset) == null || i.call(t));
+    }
+    async function A() {
+      var e, t, i, a;
+      if (n.submitter !== !1)
+        try {
+          const r = await ((e = l.value) == null ? void 0 : e.validateFields());
+          (i = (t = n.submitter) == null ? void 0 : t.onSubmit) == null || i.call(t), u.value = !0;
+          const o = (a = n.onFinish) == null ? void 0 : a.call(n, de(r));
+          if (n.submitTimeout && o instanceof Promise) {
+            const G = setTimeout(() => u.value = !1, n.submitTimeout);
+            o.finally(() => {
+              clearTimeout(G), u.value = !1;
+            });
+          }
+          await o && f(!1);
+        } finally {
+          u.value = !1;
+        }
+    }
+    function x() {
+      s(u) || f(!1);
+    }
+    function X(e) {
+      !e && s(u) || f(e);
+    }
+    return j({
+      resetFields: () => {
+        var e;
+        (e = l.value) == null || e.resetFields();
+      },
+      clearValidate: (e) => {
+        var t;
+        (t = l.value) == null || t.clearValidate(e);
+      },
+      validateFields: (e, t) => {
+        var i;
+        return (i = l.value) == null ? void 0 : i.validateFields(e, t);
+      },
+      getFieldsValue: (e) => {
+        var t;
+        return (t = l.value) == null ? void 0 : t.getFieldsValue(e);
+      },
+      validate: (e, t) => {
+        var i;
+        return (i = l.value) == null ? void 0 : i.validate(e, t);
+      },
+      scrollToField: (e, t = {}) => {
+        var i;
+        (i = l.value) == null || i.scrollToField(e, t);
+      },
+      setFieldValue: (e, t) => {
+        var i, a;
+        (a = (i = l.value) == null ? void 0 : i.setFieldValue) == null || a.call(i, e, t);
+      },
+      setFieldsValue: (e) => {
+        var t, i;
+        if (!l.value) {
+          m.value = e;
+          return;
+        }
+        (i = (t = l.value) == null ? void 0 : t.setFieldsValue) == null || i.call(t, e);
+      },
+      getInternalInstance: (e) => {
+        var t;
+        return (t = l.value) == null ? void 0 : t.getInternalInstance(e);
+      }
+    }), (e, t) => (b(), P(Y, null, [d(s(le), v(e.drawerProps, {
+      open: s(z),
+      "onUpdate:open": X,
+      onCancel: x,
+      width: y.value
+    }), {
+      title: g(() => [M(e.$slots, "title", {}, () => [Z(ee(n.title), 1)])]),
+      footer: g(() => [(b(), N(S($.value)))]),
+      default: g(() => [d(pe, v({
+        ref_key: "formRef",
+        ref: l
+      }, s(ue)(n, ["drawerProps", "open", "onUpdate:open", "title", "width", "onFinish", "submitter"])), {
+        default: g(() => [M(e.$slots, "default")]),
+        _: 3
+      }, 16), e.resize ? (b(), P("div", {
+        key: 0,
+        class: te(s(D)("resize-bar")),
+        onMousedown: ie(q, ["stop", "prevent"])
+      }, null, 34)) : _("", !0)]),
+      _: 3
+    }, 16, ["open", "width"]), s(B) ? (b(), N(S(s(B)), {
+      key: 0
+    })) : _("", !0)], 64));
+  }
+});
+export {
+  je as default
+};

package/es/src/ap-form/modal-form/drawer.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./drawer.vue.mjs";
+export {
+  f as default
+};

package/es/src/ap-form/modal-form/index.vue.mjs

@@ -1,21 +1,21 @@
-import { isVNode as $, defineComponent as q, useSlots as D, ref as h, watch as L, cloneVNode as A, computed as G, createVNode as u, mergeProps as p, unref as n, openBlock as F, createElementBlock as I, Fragment as W, withCtx as y, renderSlot as x, createTextVNode as H, toDisplayString as J, createElementVNode as K, normalizeClass as Q, createBlock as T, resolveDynamicComponent as N, createCommentVNode as X } from "vue";
-import { Button as V, Flex as Y, Space as Z, Modal as ee } from "ant-design-vue";
+import { isVNode as q, defineComponent as D, useSlots as L, ref as h, watch as A, cloneVNode as G, computed as I, createVNode as u, mergeProps as p, unref as n, openBlock as F, createElementBlock as W, Fragment as H, withCtx as y, renderSlot as w, createTextVNode as J, toDisplayString as K, createElementVNode as Q, normalizeClass as X, createBlock as x, resolveDynamicComponent as N, createCommentVNode as Y } from "vue";
+import { Button as V, Flex as Z, Space as ee, Modal as te } from "ant-design-vue";
 import "../ap-form.vue.mjs";
 import "../../hooks/index.mjs";
-import { getSingleVNode as te } from "../../utils/slot.mjs";
+import { getSingleVNode as le } from "../../utils/slot.mjs";
 import "../../config-provider/index.mjs";
-import { omit as le } from "lodash-unified";
+import { omit as ae } from "lodash-unified";
 import "../style/modal-form.css";
-import { convertReactiveToRaw as ae } from "../../utils/index.mjs";
-import { useControllableValue as oe } from "../../hooks/useControllableValue.mjs";
+import { convertReactiveToRaw as oe } from "../../utils/index.mjs";
+import { useControllableValue as ie } from "../../hooks/useControllableValue.mjs";
 import { useLocale as ne } from "../../config-provider/hooks/use-locale.mjs";
-import { useGlobalConfig as ie } from "../../config-provider/hooks/use-global-config.mjs";
-import { useNamespace as se } from "../../config-provider/hooks/use-namespace.mjs";
-import re from "../ap-form.vue2.mjs";
+import { useGlobalConfig as se } from "../../config-provider/hooks/use-global-config.mjs";
+import { useNamespace as re } from "../../config-provider/hooks/use-namespace.mjs";
+import ue from "../ap-form.vue2.mjs";
 function P(d) {
-  return typeof d == "function" || Object.prototype.toString.call(d) === "[object Object]" && !$(d);
+  return typeof d == "function" || Object.prototype.toString.call(d) === "[object Object]" && !q(d);
 }
-const Re = /* @__PURE__ */ q({
+const je = /* @__PURE__ */ D({
   __name: "index",
   props: {
     layout: {
@@ -82,72 +82,73 @@ const Re = /* @__PURE__ */ q({
     showCancel: {
       type: Boolean,
       default: !0
-    }
+    },
+    submitTimeout: {}
   },
   emits: ["update:open"],
   setup(d, {
     expose: S,
     emit: _
   }) {
-    const a = d, b = D(), R = _, o = h(), c = h(), r = h(!1), {
+    const a = d, b = L(), R = _, o = h(), c = h(), s = h(!1), {
       value: M,
       updateValue: m
-    } = oe(a, R, {
+    } = ie(a, R, {
       valuePropName: "open",
       defaultValue: !1
     }), {
       t: v
-    } = ne(), g = ie("uiMode", "aplus"), {
+    } = ne(), g = se("uiMode", "aplus"), {
       b: j,
       e: C
-    } = se("ap-form-modal-form");
-    L(() => o.value, (e) => {
+    } = re("ap-form-modal-form");
+    A(() => o.value, (e) => {
       var t;
       e && c.value && ((t = e.setFieldsValue) == null || t.call(e, c.value), c.value = void 0);
     });
-    const B = te(b.trigger), k = B ? A(B, {
+    const B = le(b.trigger), T = B ? G(B, {
       onClick: () => {
         m(!0);
       }
-    }) : null, O = G(() => {
-      var t, l, s, f;
+    }) : null, O = I(() => {
+      var t, l, r, f;
       const e = [];
       if (a.submitter === !1)
         return null;
       if (a.showCancel) {
         let i;
         e.push(u(V, {
-          onClick: w,
-          disabled: r.value
+          onClick: k,
+          disabled: s.value
         }, P(i = v("ap.common.cancelText")) ? i : {
           default: () => [i]
         }));
       }
       return ((t = a.submitter) == null ? void 0 : t.resetButtonProps) !== !1 && e.push(u(V, p(((l = a.submitter) == null ? void 0 : l.resetButtonProps) || {}, {
         key: "submit",
-        disabled: r.value,
+        disabled: s.value,
         onClick: z
       }), {
         default: () => {
           var i;
           return [((i = a.submitter) == null ? void 0 : i.resetText) || v("ap.common.resetText")];
         }
-      })), ((s = a.submitter) == null ? void 0 : s.submitButtonProps) !== !1 && e.push(u(V, p({
+      })), ((r = a.submitter) == null ? void 0 : r.submitButtonProps) !== !1 && e.push(u(V, p({
         type: "primary",
         key: "submit"
       }, ((f = a.submitter) == null ? void 0 : f.submitButtonProps) || {}, {
-        loading: r.value,
+        loading: s.value,
         onClick: E
       }), {
         default: () => {
           var i;
           return [((i = a.submitter) == null ? void 0 : i.submitText) || v("ap.common.okText")];
         }
-      })), u(Y, {
+      })), u(Z, {
         justify: "flex-end",
         class: C(n(g) === "admin" ? "footer-admin" : "footer")
       }, {
-        default: () => [b.submitter ? b.submitter(e) : u(Z, null, P(e) ? e : {
+        default: () => [b.submitter ? b.submitter(e) : u(ee, null, P(e) ? e : {
           default: () => [e]
         })]
       });
@@ -157,20 +158,28 @@ const Re = /* @__PURE__ */ q({
       a.submitter !== !1 && ((e = o.value) == null || e.resetFields(), (l = (t = a.submitter) == null ? void 0 : t.onReset) == null || l.call(t));
     }
     async function E() {
-      var e, t, l, s;
+      var e, t, l, r;
       if (a.submitter !== !1)
         try {
           const f = await ((e = o.value) == null ? void 0 : e.validateFields());
-          (l = (t = a.submitter) == null ? void 0 : t.onSubmit) == null || l.call(t), r.value = !0, await ((s = a.onFinish) == null ? void 0 : s.call(a, ae(f))) && m(!1);
+          (l = (t = a.submitter) == null ? void 0 : t.onSubmit) == null || l.call(t), s.value = !0;
+          const i = (r = a.onFinish) == null ? void 0 : r.call(a, oe(f));
+          if (a.submitTimeout && i instanceof Promise) {
+            const $ = setTimeout(() => s.value = !1, a.submitTimeout);
+            i.finally(() => {
+              clearTimeout($), s.value = !1;
+            });
+          }
+          await i && m(!1);
         } finally {
-          r.value = !1;
+          s.value = !1;
         }
     }
-    function w() {
-      n(r) || m(!1);
+    function k() {
+      n(s) || m(!1);
     }
     function U(e) {
-      !e && n(r) || m(e);
+      !e && n(s) || m(e);
     }
     return S({
       resetFields: () => {
@@ -198,8 +207,8 @@ const Re = /* @__PURE__ */ q({
         (l = o.value) == null || l.scrollToField(e, t);
       },
       setFieldValue: (e, t) => {
-        var l, s;
-        (s = (l = o.value) == null ? void 0 : l.setFieldValue) == null || s.call(l, e, t);
+        var l, r;
+        (r = (l = o.value) == null ? void 0 : l.setFieldValue) == null || r.call(l, e, t);
       },
       setFieldsValue: (e) => {
         var t, l;
@@ -213,10 +222,10 @@ const Re = /* @__PURE__ */ q({
         var t;
         return (t = o.value) == null ? void 0 : t.getInternalInstance(e);
       }
-    }), (e, t) => (F(), I(W, null, [u(n(ee), p(e.modalProps, {
+    }), (e, t) => (F(), W(H, null, [u(n(te), p(e.modalProps, {
       open: n(M),
       "onUpdate:open": U,
-      onCancel: w,
+      onCancel: k,
       footer: null,
       width: e.width,
       class: n(j)(),
@@ -226,22 +235,22 @@ const Re = /* @__PURE__ */ q({
         // 使用ModalForm你可能无法再自定义body的样式
       }
     }), {
-      title: y(() => [x(e.$slots, "title", {}, () => [H(J(a.title), 1)])]),
-      default: y(() => [K("div", {
-        class: Q(n(C)(n(g) === "admin" ? "content-admin" : "content"))
-      }, [u(re, p({
+      title: y(() => [w(e.$slots, "title", {}, () => [J(K(a.title), 1)])]),
+      default: y(() => [Q("div", {
+        class: X(n(C)(n(g) === "admin" ? "content-admin" : "content"))
+      }, [u(ue, p({
         ref_key: "formRef",
         ref: o
-      }, n(le)(a, ["modalProps", "open", "onUpdate:open", "title", "width", "onFinish", "submitter"])), {
-        default: y(() => [x(e.$slots, "default")]),
+      }, n(ae)(a, ["modalProps", "open", "onUpdate:open", "title", "width", "onFinish", "submitter"])), {
+        default: y(() => [w(e.$slots, "default")]),
         _: 3
-      }, 16)], 2), (F(), T(N(O.value)))]),
+      }, 16)], 2), (F(), x(N(O.value)))]),
       _: 3
-    }, 16, ["open", "width", "class", "body-style"]), n(k) ? (F(), T(N(n(k)), {
+    }, 16, ["open", "width", "class", "body-style"]), n(T) ? (F(), x(N(n(T)), {
       key: 0
-    })) : X("", !0)], 64));
+    })) : Y("", !0)], 64));
   }
 });
 export {
-  Re as default
+  je as default
 };

package/es/src/ap-form/style/drawer-form.css

@@ -0,0 +1,10 @@
+.aplus-ap-form-drawer-form__resize-bar {
+  width: 4px;
+  cursor: ew-resize;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  z-index: 100;
+  background-color: transparent;
+}