@aplus-frontend/ui 0.0.1-beta.2 → 0.0.1-beta.21

package/es/src/pro-form/components/form-item.vue2.mjs

@@ -1,4 +1,354 @@
-import f from "./form-item.vue.mjs";
+import { isVNode as ee, defineComponent as te, toRefs as oe, computed as v, unref as n, createVNode as u, createTextVNode as ne, mergeProps as N, withDirectives as se, vShow as le } from "vue";
+import { isComponentFormSchema as re } from "../types/form.mjs";
+import { Col as E, Divider as ae, Form as K } from "ant-design-vue";
+import { componentMap as W } from "../component-map.mjs";
+import { BasicHelp as ce, BasicTitle as ie } from "../../basic/index.mjs";
+import { isFunction as p, isBoolean as I, cloneDeep as de, isNull as fe, upperFirst as me } from "lodash-unified";
+import { getSlot as U } from "../../utils/slot.mjs";
+import { isIncludeSimpleComponents as ue, createPlaceholderMessage as $, NO_AUTO_LINK_COMPONENTS as G, setComponentRuleType as he } from "../helper.mjs";
+import { useItemLabelWidth as pe } from "../hooks/use-label-width.mjs";
+import "../../config-provider/index.mjs";
+import "./style/form-item.css";
+import { useLocale as be } from "../../config-provider/hooks/use-locale.mjs";
+import { useNamespace as ge } from "../../config-provider/hooks/use-namespace.mjs";
+function M(t) {
+  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !ee(t);
+}
+const De = /* @__PURE__ */ te({
+  name: "BasicFormItem",
+  inheritAttrs: !1,
+  props: {
+    schema: {
+      type: Object,
+      default: () => ({})
+    },
+    formProps: {
+      type: Object,
+      default: () => ({})
+    },
+    allDefaultValues: {
+      type: Object,
+      default: () => ({})
+    },
+    formModel: {
+      type: Object,
+      default: () => ({})
+    },
+    setFormModel: {
+      type: Function,
+      default: null
+    },
+    tableAction: {
+      // todo: table Action
+      type: Object
+    },
+    formActionType: {
+      type: Object
+    },
+    isAdvanced: {
+      type: Boolean
+    }
+  },
+  setup(t, {
+    slots: _
+  }) {
+    const {
+      t: L
+    } = be(), {
+      b: A
+    } = ge("form-item"), {
+      schema: V,
+      formProps: D
+    } = oe(t);
+    V.value.component === "CropperAvatar" && typeof D.value.size == "string" && (D.value.size = void 0);
+    const Q = pe(V, D), h = v(() => {
+      const {
+        allDefaultValues: o,
+        formModel: e,
+        schema: a
+      } = t, {
+        mergeDynamicData: l
+      } = t.formProps;
+      return {
+        field: a.field,
+        model: e,
+        values: {
+          ...l,
+          ...o,
+          ...e
+        },
+        schema: a
+      };
+    }), x = v(() => {
+      const {
+        schema: o,
+        tableAction: e,
+        formModel: a,
+        formActionType: l
+      } = t;
+      let {
+        componentProps: s = {}
+      } = o;
+      return p(s) && (s = s({
+        schema: o,
+        tableAction: e,
+        formModel: a,
+        formActionType: l
+      }) ?? {}), ue(o.component) && (s = Object.assign({
+        type: "horizontal"
+      }, {
+        orientation: "left",
+        plain: !0
+      }, s)), s;
+    }), R = v(() => {
+      const {
+        disabled: o
+      } = t.formProps, {
+        dynamicDisabled: e
+      } = t.schema, {
+        disabled: a = !1
+      } = n(x);
+      let l = !!o || a;
+      return I(e) && (l = e), p(e) && (l = e(n(h))), l;
+    }), j = v(() => {
+      const {
+        readonly: o
+      } = t.formProps, {
+        dynamicReadonly: e
+      } = t.schema, {
+        readonly: a = !1
+      } = n(x);
+      let l = o || a;
+      return I(e) && (l = e), p(e) && (l = e(n(h))), l;
+    });
+    function B() {
+      const {
+        show: o,
+        ifShow: e
+      } = t.schema, {
+        showAdvancedButton: a
+      } = t.formProps, l = a && I(t.isAdvanced) ? t.isAdvanced : !0;
+      let s = !0, c = !0;
+      return I(o) && (s = o), I(e) && (c = e), p(o) && (s = o(n(h))), p(e) && (c = e(n(h))), s = s && l, {
+        isShow: s,
+        isIfShow: c
+      };
+    }
+    function z() {
+      var F;
+      const {
+        rules: o = [],
+        component: e,
+        rulesMessageJoinLabel: a,
+        label: l,
+        dynamicRules: s,
+        required: c
+      } = t.schema;
+      if (p(s))
+        return s(n(h));
+      let r = de(o);
+      const {
+        rulesMessageJoinLabel: b
+      } = t.formProps, g = (Reflect.has(t.schema, "rulesMessageJoinLabel") ? a : b) ? p(l) ? "" : l : "", f = e ? $(e, "", L) + g : g;
+      function y(m, i) {
+        const C = m.message || f;
+        return i === void 0 || fe(i) || Array.isArray(i) && i.length === 0 || typeof i == "string" && i.trim() === "" || typeof i == "object" && Reflect.has(i, "checked") && Reflect.has(i, "halfChecked") && Array.isArray(i.checked) && Array.isArray(i.halfChecked) && i.checked.length === 0 && i.halfChecked.length === 0 ? Promise.reject(C) : Promise.resolve();
+      }
+      const d = p(c) ? c(n(h)) : c;
+      if (d)
+        if (!r || r.length === 0) {
+          const m = G.includes(e || "Input") ? "blur" : "change";
+          r = [{
+            required: d,
+            validator: y,
+            trigger: m
+          }];
+        } else
+          r.findIndex((i) => Reflect.has(i, "required")) === -1 && r.push({
+            required: d,
+            validator: y
+          });
+      const k = r.findIndex((m) => Reflect.has(m, "required") && !Reflect.has(m, "validator"));
+      if (k !== -1) {
+        const m = r[k], {
+          isShow: i
+        } = B();
+        if (i || (m.required = !1), e) {
+          m.message = m.message || f, (e.includes("Input") || e.includes("Textarea")) && (m.whitespace = !0);
+          const C = (F = n(x)) == null ? void 0 : F.valueFormat;
+          he(m, e, C);
+        }
+      }
+      const P = r.findIndex((m) => m.max);
+      return P !== -1 && !r[P].validator && (r[P].message = r[P].message || L("ap.form.maxTip", {
+        count: r[P].max
+      })), r;
+    }
+    function X() {
+      var H, J;
+      if (!re(t.schema))
+        return null;
+      const {
+        renderComponentContent: o,
+        component: e,
+        field: a,
+        changeEvent: l = "change",
+        valueField: s,
+        label: c
+      } = t.schema, r = e && ["Switch", "Checkbox"].includes(e), b = `on${me(l)}`, S = {
+        [b]: (...w) => {
+          const [q] = w, T = q ? q.target : null, Z = T ? r ? T.checked : T.value : q;
+          t.setFormModel(a, Z, t.schema), d[b] && d[b](...w);
+        }
+      }, g = W.get(e), {
+        autoSetPlaceHolder: f = !0,
+        size: y
+      } = t.formProps, d = {
+        allowClear: !0,
+        size: y,
+        ...n(x),
+        disabled: n(R),
+        readonly: n(j)
+      }, P = (H = z().find((w) => w.max)) == null ? void 0 : H.max;
+      if (P && (d["show-count"] = d["show-count"] ?? !0, d.maxlength = d.maxlength ?? P), !d.disabled && f && e !== "RangePicker" && e) {
+        const w = typeof c == "string" ? c : "";
+        d.placeholder = ((J = n(x)) == null ? void 0 : J.placeholder) || $(e, w, L);
+      }
+      d.codeField = a, d.formValues = n(h);
+      const m = {
+        [s || (r ? "checked" : "value")]: t.formModel[a]
+      }, i = {
+        ...d,
+        ...S,
+        ...m
+      };
+      if (!o)
+        return u(g, i, null);
+      const C = p(o) ? {
+        ...o(n(h), {
+          disabled: n(R),
+          readonly: n(j)
+        })
+      } : {
+        default: () => o
+      };
+      return u(g, i, M(C) ? C : {
+        default: () => [C]
+      });
+    }
+    function O() {
+      const {
+        label: o,
+        helpMessage: e,
+        helpComponentProps: a,
+        subLabel: l
+      } = t.schema, s = p(o) ? o(n(h)) : o, c = l ? u("span", null, [s, ne(" "), u("span", {
+        class: A("text-secondary")
+      }, [l])]) : s, r = p(e) ? e(n(h)) : e;
+      return !r || Array.isArray(r) && r.length === 0 ? c : u("span", null, [c, u(ce, N({
+        placement: "top",
+        class: A("label-help"),
+        text: r
+      }, a), null)]);
+    }
+    function Y() {
+      const {
+        itemProps: o = {},
+        slot: e,
+        render: a,
+        field: l,
+        suffix: s,
+        component: c
+      } = t.schema, {
+        labelCol: r,
+        wrapperCol: b
+      } = n(Q), {
+        colon: S
+      } = t.formProps, g = {
+        disabled: n(R),
+        readonly: n(j)
+      };
+      if (c === "Divider") {
+        let f;
+        return u(E, {
+          span: 24
+        }, {
+          default: () => [u(ae, n(x), M(f = O()) ? f : {
+            default: () => [f]
+          })]
+        });
+      } else if (c === "BasicTitle") {
+        let f;
+        return u(K.Item, {
+          labelCol: r,
+          wrapperCol: b,
+          name: l,
+          class: {
+            [A("suffix-item")]: !!s
+          }
+        }, {
+          default: () => [u(ie, n(x), M(f = O()) ? f : {
+            default: () => [f]
+          })]
+        });
+      } else {
+        const f = () => e ? U(_, e, n(h), g) : a ? a(n(h), g) : X(), y = !!s, d = p(s) ? s(n(h)) : s;
+        return c && G.includes(c) && t.schema && (t.schema.itemProps = {
+          autoLink: !1,
+          ...t.schema.itemProps
+        }), u(K.Item, N({
+          name: l,
+          colon: S,
+          class: {
+            [A("suffix-item")]: y
+          }
+        }, o, {
+          label: O(),
+          rules: z(),
+          labelCol: r,
+          wrapperCol: b
+        }), {
+          default: () => [u("div", {
+            style: "display:flex"
+          }, [u("div", {
+            style: "flex:1;"
+          }, [f()]), y && u("span", {
+            class: A("suffix")
+          }, [d])])]
+        });
+      }
+    }
+    return () => {
+      let o;
+      const {
+        colProps: e = {},
+        colSlot: a,
+        renderColContent: l,
+        component: s,
+        slot: c
+      } = t.schema;
+      if (!(s && W.has(s) || c))
+        return null;
+      const {
+        baseColProps: r = {}
+      } = t.formProps, b = {
+        ...r,
+        ...e
+      }, {
+        isIfShow: S,
+        isShow: g
+      } = B(), f = n(h), y = {
+        disabled: n(R),
+        readonly: n(j)
+      }, d = () => a ? U(_, a, f, y) : l ? l(f, y) : Y();
+      return S && se(u(E, N(b, {
+        class: A()
+      }), M(o = d()) ? o : {
+        default: () => [o]
+      }), [[le, g]]);
+    };
+  }
+});
 export {
-  f as default
+  De as default
 };

package/es/src/pro-form/components/interface.mjs

@@ -0,0 +1 @@
+

package/es/src/pro-form/hooks/use-break-point.mjs

@@ -1,8 +1,8 @@
-import { Grid as c } from "ant-design-vue";
-import { ref as p, computed as d, unref as l } from "vue";
-import { useEventListener as M } from "@aplus-frontend/hooks";
-const { useBreakpoint: u } = c;
-var h = /* @__PURE__ */ ((t) => (t[t.XS = 320] = "XS", t[t.SM = 640] = "SM", t[t.MD = 768] = "MD", t[t.LG = 960] = "LG", t[t.XL = 1280] = "XL", t[t.XXL = 1536] = "XXL", t))(h || {});
+import { Grid as f } from "ant-design-vue";
+import { ref as c, computed as L, unref as p } from "vue";
+import { useEventListener as l } from "@aplus-frontend/hooks";
+const { useBreakpoint: h } = f;
+var w = /* @__PURE__ */ ((t) => (t.XS = "XS", t.SM = "SM", t.MD = "MD", t.LG = "LG", t.XL = "XL", t.XXL = "XXL", t))(w || {}), v = /* @__PURE__ */ ((t) => (t[t.XS = 320] = "XS", t[t.SM = 640] = "SM", t[t.MD = 768] = "MD", t[t.LG = 960] = "LG", t[t.XL = 1280] = "XL", t[t.XXL = 1536] = "XXL", t))(v || {});
 const e = /* @__PURE__ */ new Map();
 e.set(
   "XS",
@@ -34,7 +34,7 @@ e.set(
   1536
   /* XXL */
 );
-const X = [
+const n = [
   "XS",
   "SM",
   "MD",
@@ -44,35 +44,36 @@ const X = [
   /* XXL */
 ];
 function W() {
-  const t = p(window.innerWidth), L = u(), o = d(() => {
-    const r = l(L);
-    for (let s = X.length - 1; s > 0; s--) {
-      const n = X[s], f = n.toLowerCase();
-      if (r[f])
-        return n;
+  const t = c(window.innerWidth), d = h(), r = L(() => {
+    const o = p(d);
+    for (let s = n.length - 1; s > 0; s--) {
+      const X = n[s], M = X.toLowerCase();
+      if (o[M])
+        return X;
     }
-  }), a = d(() => {
-    if (o.value)
-      return e.get(o.value);
+  }), a = L(() => {
+    if (r.value)
+      return e.get(r.value);
   });
   function i() {
-    const r = document.body.clientWidth;
-    t.value = r;
+    const o = document.body.clientWidth;
+    t.value = o;
   }
-  return M({
+  return l({
     el: window,
     name: "resize",
     listener: () => {
       i();
     }
   }), i(), {
-    screenRef: o,
+    screenRef: r,
     widthRef: a,
     realWidthRef: t
   };
 }
 export {
-  h as ScreenEnum,
+  v as ScreenEnum,
+  w as SizeEnum,
   e as screenMap,
   W as useBreakpoint
 };

package/es/src/pro-form/hooks/use-component-register.d.ts

@@ -0,0 +1,4 @@
+import { ComponentType } from '../types';
+import { Component } from 'vue';
+
+export declare function useComponentRegister<T extends string, R extends Component>(compName: ComponentType | T, comp: R): void;

package/es/src/pro-form/hooks/use-component-register.mjs

@@ -0,0 +1,13 @@
+import { tryOnUnmounted as t } from "@vueuse/core";
+import { add as e, del as n } from "../component-map.mjs";
+import { isPascalCase as i } from "../../utils/index.mjs";
+function f(r, o) {
+  if (!i(r))
+    throw new Error("compName must be in PascalCase");
+  e(r, o), t(() => {
+    n(r);
+  });
+}
+export {
+  f as useComponentRegister
+};

package/es/src/pro-form/hooks/use-form-events.mjs

@@ -1,5 +1,5 @@
-import { unref as o, nextTick as tt, toRaw as H } from "vue";
-import { isFunction as J, get as nt, cloneDeep as I, isString as D, isObject as A, isArray as T, uniqBy as et, isNil as Q, set as Y } from "lodash-unified";
+import { unref as o, nextTick as tt, toRaw as J } from "vue";
+import { set as Y, isFunction as Q, get as nt, cloneDeep as I, isString as D, isObject as A, isArray as T, uniqBy as et, isNil as U } from "lodash-unified";
 import { isDef as W } from "../../utils/index.mjs";
 import { deepMerge as it } from "@aplus-frontend/utils";
 import { handleInputNumberValue as ot, isIncludeSimpleComponents as B, dateItemType as ct, defaultValueComponents as rt } from "../helper.mjs";
@@ -46,12 +46,12 @@ function bt({
 }) {
   async function x() {
     const { resetFunc: t, submitOnReset: n } = o(F);
-    t && J(t) && await t(), o(f) && (Object.keys(u).forEach((e) => {
+    t && Q(t) && await t(), o(f) && (Object.keys(u).forEach((e) => {
       const l = o(s).find((a) => a.field === e), i = l == null ? void 0 : l.defaultValueObj, p = Object.keys(i || {});
       p.length && p.map((a) => {
         u[a] = i[a];
       }), u[e] = ut(l, y, e);
-    }), tt(() => S()), r("reset", H(u)), n && j());
+    }), tt(() => j()), r("reset", J(u)), n && S());
   }
   const C = () => o(s).map((t) => [...t.fields || [], t.field]).flat(1).filter(Boolean);
   async function V(t) {
@@ -65,15 +65,15 @@ function bt({
       let a = nt(t, i);
       const R = Reflect.has(t, i);
       a = ot(p == null ? void 0 : p.component, a);
-      const { componentProps: z } = p || {};
-      let h = z;
-      typeof z == "function" && (h = h({
+      const { componentProps: G } = p || {};
+      let h = G;
+      typeof G == "function" && (h = h({
         formModel: o(u),
         formActionType: k
       }));
-      const G = st(i, t) || lt(i, t);
-      if (R || G) {
-        const d = G || a;
+      const H = st(i, t) || lt(i, t);
+      if (R || H) {
+        const d = H || a;
         if (_(i))
           if (Array.isArray(d)) {
             const b = [];
@@ -157,11 +157,11 @@ function bt({
     A(t) && n.push(t), T(t) && (n = [...t]);
     const c = {}, e = E();
     n.forEach((l) => {
-      !B(l.component) && Reflect.has(l, "field") && l.field && !Q(l.defaultValue) && (!(l.field in e) || Q(e[l.field])) && (c[l.field] = l.defaultValue);
+      !B(l.component) && Reflect.has(l, "field") && l.field && !U(l.defaultValue) && (!(l.field in e) || U(e[l.field])) && (c[l.field] = l.defaultValue);
     }), V(c);
   }
   function E() {
-    return o(f) ? w(H(o(u))) : {};
+    return o(f) ? w(J(o(u))) : {};
   }
   function _(t) {
     return o(s).some((n) => n.field === t && n.component ? ct.includes(n.component) : !1);
@@ -182,18 +182,18 @@ function bt({
     const c = await ((e = o(f)) == null ? void 0 : e.validate(n));
     return w(c);
   }
-  async function S(t) {
+  async function j(t) {
     var n;
     await ((n = o(f)) == null ? void 0 : n.clearValidate(t));
   }
-  async function U(t, n) {
+  async function z(t, n) {
     var c;
     await ((c = o(f)) == null ? void 0 : c.scrollToField(t, n));
   }
-  async function j(t) {
+  async function S(t) {
     t && t.preventDefault();
     const { submitFunc: n } = o(F);
-    if (n && J(n)) {
+    if (n && Q(n)) {
       await n();
       return;
     }
@@ -216,15 +216,15 @@ function bt({
     setProps: K,
     removeSchemaByField: P,
     appendSchemaByField: N,
-    clearValidate: S,
+    clearValidate: j,
     validateFields: O,
     validate: g,
-    submit: j,
-    scrollToField: U
+    submit: S,
+    scrollToField: z
   };
   return {
-    handleSubmit: j,
-    clearValidate: S,
+    handleSubmit: S,
+    clearValidate: j,
     validate: g,
     validateFields: O,
     getFieldsValue: E,
@@ -234,7 +234,7 @@ function bt({
     removeSchemaByField: P,
     resetFields: x,
     setFieldsValue: V,
-    scrollToField: U
+    scrollToField: z
   };
 }
 function ut(r, F, u) {

package/es/src/pro-form/hooks/use-form-values.mjs

@@ -1,6 +1,6 @@
-import { isObject as O, isArray as D, isFunction as x, isString as F, set as T, get as V, unset as g, isNil as b, isEmpty as E, cloneDeep as K } from "lodash-unified";
-import j from "dayjs";
-import { unref as l } from "vue";
+import { set as T, isObject as l, isArray as D, isFunction as x, isString as F, get as V, unset as g, isNil as j, isEmpty as E, cloneDeep as K } from "lodash-unified";
+import b from "dayjs";
+import { unref as O } from "vue";
 function S(y, o, m) {
   const u = /^\[(.+)\]$/;
   if (u.test(y)) {
@@ -19,7 +19,7 @@ function $(y, o, m) {
     const f = y.match(u);
     if (f && f[1]) {
       const h = f[1].split(",");
-      return o = O(o) ? o : {}, h.forEach((p) => {
+      return o = l(o) ? o : {}, h.forEach((p) => {
         T(m, p.trim(), o[p.trim()]);
       }), !0;
     }
@@ -33,7 +33,7 @@ function R({
 }) {
   function f(i) {
     var e, s;
-    if (!O(i))
+    if (!l(i))
       return {};
     const r = {};
     for (const a of Object.entries(i)) {
@@ -41,13 +41,13 @@ function R({
       const [n] = a;
       if (!n || D(t) && t.length === 0 || x(t))
         continue;
-      const c = l(u).transformDateFunc;
-      O(t) && (t = c == null ? void 0 : c(t)), D(t) && ((e = t[0]) != null && e.format) && ((s = t[1]) != null && s.format) && (t = t.map((A) => c == null ? void 0 : c(A))), F(t) && (t = t.trim()), !S(n, t, r) && !$(n, t, r) && T(r, n, t);
+      const c = O(u).transformDateFunc;
+      l(t) && (t = c == null ? void 0 : c(t)), D(t) && ((e = t[0]) != null && e.format) && ((s = t[1]) != null && s.format) && (t = t.map((A) => c == null ? void 0 : c(A))), F(t) && (t = t.trim()), !S(n, t, r) && !$(n, t, r) && T(r, n, t);
     }
     return h(r);
   }
   function h(i) {
-    const r = l(u).fieldMapToTime;
+    const r = O(u).fieldMapToTime;
     if (!r || !Array.isArray(r))
       return i;
     for (const [
@@ -62,20 +62,20 @@ function R({
         continue;
       }
       const [n, c] = V(i, e), [A, Y] = Array.isArray(t) ? t : [t, t];
-      !b(n) && !E(n) && T(i, s, p(n, A)), !b(c) && !E(c) && T(i, a, p(c, Y)), g(i, e);
+      !j(n) && !E(n) && T(i, s, p(n, A)), !j(c) && !E(c) && T(i, a, p(c, Y)), g(i, e);
     }
     return i;
   }
   function p(i, r) {
-    return r === "timestamp" ? j(i).unix() : r === "timestampStartDay" ? j(i).startOf("day").unix() : j(i).format(r);
+    return r === "timestamp" ? b(i).unix() : r === "timestampStartDay" ? b(i).startOf("day").unix() : b(i).format(r);
   }
   function d() {
-    const i = l(o), r = {};
+    const i = O(o), r = {};
     i.forEach((e) => {
       const { defaultValue: s, defaultValueObj: a } = e, t = Object.keys(a || {});
       t.length && t.map((n) => {
         r[n] = a[n], m[n] === void 0 && (m[n] = a[n]);
-      }), b(s) || (r[e.field] = s, m[e.field] === void 0 && (m[e.field] = s));
+      }), j(s) || (r[e.field] = s, m[e.field] === void 0 && (m[e.field] = s));
     }), y.value = K(r);
   }
   return { handleFormValues: f, initDefault: d };

package/es/src/pro-form/hooks/use-form.mjs

@@ -1,4 +1,4 @@
-import { ref as i, onUnmounted as f, unref as o, watch as d, nextTick as u } from "vue";
+import { ref as i, unref as o, nextTick as f, onUnmounted as d, watch as u } from "vue";
 import { isProdMode as c } from "@aplus-frontend/utils";
 import { getDynamicProps as h } from "../../utils/index.mjs";
 function S(n) {
@@ -9,12 +9,12 @@ function S(n) {
       throw new Error(
         "The form instance has not been obtained, please make sure that the form has been rendered when performing the form operation!"
       );
-    return await u(), e;
+    return await f(), e;
   }
   function l(e) {
-    c() && f(() => {
+    c() && d(() => {
       r.value = null, s.value = null;
-    }), !(o(s) && c() && e === o(r)) && (r.value = e, s.value = !0, d(
+    }), !(o(s) && c() && e === o(r)) && (r.value = e, s.value = !0, u(
       () => n,
       () => {
         n && e.setProps(h(n));