@aplus-frontend/ui 0.5.37 → 0.6.0-beta.0

package/es/src/ap-form/search-form/index.vue.d.ts

@@ -1,10 +1,10 @@
 import { ApFormExpose, ApFormSearchFormProps } from '../interface';
 import { ComponentInternalInstance, ExtractPropTypes, PropType, HTMLAttributes, VNodeProps, AllowedComponentProps, ComponentCustomProps, CreateComponentPublicInstanceWithMixins, ComponentOptionsMixin, PublicProps, GlobalComponents, GlobalDirectives, ComponentProvideOptions, Slot, ComponentPublicInstance, ComponentOptionsBase, DebuggerEvent, nextTick, WatchOptions, WatchStopHandle, ShallowUnwrapRef, ComponentCustomProperties, DefineComponent, ComputedRef } from 'vue';
 import { ButtonSize, SizeType } from '@aplus-frontend/antdv/es/button';
-import { ValidateMessages, FormLabelAlign, FieldData, ValidateErrorEntity, NamePath, ValidateOptions, InternalNamePath } from '@aplus-frontend/antdv/es/form/interface';
-import { RequiredMark } from '@aplus-frontend/antdv/es/form/Form';
 import { ColSize } from '@aplus-frontend/antdv/es/grid';
+import { FormLabelAlign, ValidateMessages, FieldData, ValidateErrorEntity, NamePath, ValidateOptions, InternalNamePath } from '@aplus-frontend/antdv/es/form/interface';
 import { RuleObject } from '@aplus-frontend/antdv/es/form';
+import { RequiredMark } from '@aplus-frontend/antdv/es/form/Form';
 import { Options } from '../../../node_modules/scroll-into-view-if-needed';
 import { Recordable } from '../../type';
 import { VueTypeDef, VueTypeValidableDef } from '../../../node_modules/vue-types';
@@ -30,10 +30,6 @@ declare function __VLS_template(): {
                 readonly layout?: string | undefined;
                 readonly disabled?: boolean | undefined;
                 readonly prefixCls?: string | undefined;
-                readonly name?: string | undefined;
-                readonly validateMessages?: ValidateMessages | undefined;
-                readonly requiredMark?: "" | RequiredMark | undefined;
-                readonly colon?: boolean | undefined;
                 readonly labelCol?: (Partial< ExtractPropTypes<{
                     span: (StringConstructor | NumberConstructor)[];
                     order: (StringConstructor | NumberConstructor)[];
@@ -100,13 +96,17 @@ declare function __VLS_template(): {
                     prefixCls: StringConstructor;
                     flex: (StringConstructor | NumberConstructor)[];
                 }>> & HTMLAttributes) | undefined;
+                readonly colon?: boolean | undefined;
                 readonly labelAlign?: FormLabelAlign | undefined;
+                readonly name?: string | undefined;
                 readonly rules?: {
                     [k: string]: RuleObject | RuleObject[];
                 } | undefined;
                 readonly validateTrigger?: string | string[] | undefined;
                 readonly labelWrap?: boolean | undefined;
+                readonly requiredMark?: "" | RequiredMark | undefined;
                 readonly hideRequiredMark?: boolean | undefined;
+                readonly validateMessages?: ValidateMessages | undefined;
                 readonly validateOnRuleChange?: boolean | undefined;
                 readonly scrollToFirstError?: boolean | Options<any> | undefined;
                 readonly onFieldsChange?: ((changedFields: FieldData[], allFields: FieldData[]) => void) | undefined;
@@ -840,11 +840,7 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: DefineComponent<ApFormSearchFormProps, {
     apForm: ComputedRef<ApFormExpose | undefined>;
-}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    "update:collapse": (...args: any[]) => void;
-}, string, PublicProps, Readonly<ApFormSearchFormProps> & Readonly<{
-    "onUpdate:collapse"?: ((...args: any[]) => any) | undefined;
-}>, {
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ApFormSearchFormProps> & Readonly<{}>, {
     collapse: boolean;
     layout: string;
     colon: boolean;
@@ -852,11 +848,13 @@ declare const __VLS_component: DefineComponent<ApFormSearchFormProps, {
     validateTrigger: string | string[];
     hideRequiredMark: boolean;
     validateOnRuleChange: boolean;
-    countPerRow: number;
+    countPerRow: 1 | 2 | 3 | 4 | 6 | 8 | 12 | 24;
     defaultCollapse: boolean;
     customReset: boolean;
     extraInAction: boolean;
     forceExpand: boolean;
+    maxRows: number;
+    sortable: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {
     apForm: ({
         $: ComponentInternalInstance;
@@ -867,10 +865,6 @@ declare const __VLS_component: DefineComponent<ApFormSearchFormProps, {
             readonly layout?: string | undefined;
             readonly disabled?: boolean | undefined;
             readonly prefixCls?: string | undefined;
-            readonly name?: string | undefined;
-            readonly validateMessages?: ValidateMessages | undefined;
-            readonly requiredMark?: "" | RequiredMark | undefined;
-            readonly colon?: boolean | undefined;
             readonly labelCol?: (Partial< ExtractPropTypes<{
                 span: (StringConstructor | NumberConstructor)[];
                 order: (StringConstructor | NumberConstructor)[];
@@ -937,13 +931,17 @@ declare const __VLS_component: DefineComponent<ApFormSearchFormProps, {
                 prefixCls: StringConstructor;
                 flex: (StringConstructor | NumberConstructor)[];
             }>> & HTMLAttributes) | undefined;
+            readonly colon?: boolean | undefined;
             readonly labelAlign?: FormLabelAlign | undefined;
+            readonly name?: string | undefined;
             readonly rules?: {
                 [k: string]: RuleObject | RuleObject[];
             } | undefined;
             readonly validateTrigger?: string | string[] | undefined;
             readonly labelWrap?: boolean | undefined;
+            readonly requiredMark?: "" | RequiredMark | undefined;
             readonly hideRequiredMark?: boolean | undefined;
+            readonly validateMessages?: ValidateMessages | undefined;
             readonly validateOnRuleChange?: boolean | undefined;
             readonly scrollToFirstError?: boolean | Options<any> | undefined;
             readonly onFieldsChange?: ((changedFields: FieldData[], allFields: FieldData[]) => void) | undefined;

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

@@ -1,24 +1,25 @@
-import { isVNode as se, defineComponent as ie, useSlots as ue, ref as ce, unref as o, shallowRef as M, computed as S, watch as D, cloneVNode as pe, createVNode as a, Fragment as F, createBlock as C, openBlock as m, mergeProps as de, withCtx as E, resolveDynamicComponent as b, createElementBlock as fe, renderList as me } from "vue";
-import { Col as B, Flex as $, Space as he, Button as v, Row as xe } from "@aplus-frontend/antdv";
+import { isVNode as ee, defineComponent as te, useSlots as oe, ref as ae, shallowRef as j, computed as _, unref as n, watch as L, createVNode as t, Fragment as w, createBlock as x, openBlock as d, mergeProps as ne, withCtx as F, resolveDynamicComponent as A, createElementBlock as le, renderList as re } from "vue";
+import { Col as R, Flex as B, Button as U, Row as se } from "@aplus-frontend/antdv";
 import "../ap-form.vue.mjs";
 import "../item/index.vue2.mjs";
-import "../../hooks/index.mjs";
-import { genRealChildren as L } from "../item-group/helper.mjs";
-import { DoubleRightOutlined as ye } from "@ant-design/icons-vue";
+import { genRealChildren as V } from "../item-group/helper.mjs";
 import "../../config-provider/index.mjs";
-import { isArray as Ce, isBoolean as ge, omit as _e } from "lodash-unified";
-import { isDef as U } from "../../utils/index.mjs";
-import { execFunc as W, diffFormItem as Se } from "./utils.mjs";
-import { useControllableValue as Fe } from "../../hooks/useControllableValue.mjs";
-import { useNamespace as Be } from "../../config-provider/hooks/use-namespace.mjs";
-import { useGlobalConfig as Re } from "../../config-provider/hooks/use-global-config.mjs";
-import { useLocale as Ae } from "../../config-provider/hooks/use-locale.mjs";
-import q from "../item/index.vue.mjs";
-import Ee from "../ap-form.vue2.mjs";
-function be(h) {
-  return typeof h == "function" || Object.prototype.toString.call(h) === "[object Object]" && !se(h);
+import { isArray as ie, isBoolean as ce, omit as ue } from "lodash-unified";
+import { isDef as M } from "../../utils/index.mjs";
+import { execFunc as W, diffFormItem as pe } from "./utils.mjs";
+import "./components/popover-filter.vue.mjs";
+import { useCountPerRow as de } from "./hooks/use-count-per-row.mjs";
+import "./components/popover-sorter/index.vue.mjs";
+import { useNamespace as fe } from "../../config-provider/hooks/use-namespace.mjs";
+import { useLocale as me } from "../../config-provider/hooks/use-locale.mjs";
+import D from "../item/index.vue.mjs";
+import he from "./components/popover-filter.vue2.mjs";
+import xe from "./components/popover-sorter/index.vue2.mjs";
+import ye from "../ap-form.vue2.mjs";
+function ge(f) {
+  return typeof f == "function" || Object.prototype.toString.call(f) === "[object Object]" && !ee(f);
 }
-const r = 24, ze = /* @__PURE__ */ ie({
+const s = 24, Le = /* @__PURE__ */ te({
   name: "ApFormSearchForm",
   __name: "index",
   props: {
@@ -100,149 +101,148 @@ const r = 24, ze = /* @__PURE__ */ ie({
     },
     submitLoading: {
       type: Boolean
+    },
+    maxRows: {
+      default: 2
+    },
+    sortable: {
+      type: Boolean,
+      default: !0
     }
   },
-  emits: ["update:collapse"],
-  setup(h, {
-    expose: z,
-    emit: H
+  setup(f, {
+    expose: q
   }) {
-    var I;
-    const u = ue(), n = h, G = H, {
-      value: c,
-      updateValue: J
-    } = Fe(n, G, {
-      valuePropName: "collapse",
-      defaultValuePropName: "defaultCollapse"
-    }), {
-      b: K
-    } = Be("ap-form-search-form"), Q = Re("uiMode"), {
-      t: w
-    } = Ae(), g = ce();
-    function X() {
-      J(!o(c));
+    var P;
+    const i = oe(), o = f, {
+      b: m
+    } = fe("ap-form-search-form"), {
+      t: N
+    } = me(), z = de(o), y = ae();
+    function k() {
+      var e, a;
+      (a = (e = y.value) == null ? void 0 : e.validateFields()) == null || a.then((l) => W(o.onSubmit, l));
     }
-    function Y() {
-      var e, t;
-      (t = (e = g.value) == null ? void 0 : e.validateFields()) == null || t.then((s) => W(n.onSubmit, s));
+    function H() {
+      var e, a;
+      o.customReset || (a = (e = y.value) == null ? void 0 : e.resetFields) == null || a.call(e), W(o.onReset);
     }
-    function Z() {
-      var e, t;
-      n.customReset || (t = (e = g.value) == null ? void 0 : e.resetFields) == null || t.call(e), W(n.onReset);
-    }
-    let N = [];
-    const R = M(L(u.default())), d = M((I = u.extra) == null ? void 0 : I.call(u)), k = S(() => Math.floor(r / n.countPerRow));
-    D(() => u.default(), (e) => {
-      N = R.value, R.value = Se(N, L(e));
-    }), D(() => {
+    const G = (e) => M(e) ? (ie(e) ? e : [e]).join("") : Date.now();
+    let I = [];
+    const c = j(V(i.default())), u = j((P = i.extra) == null ? void 0 : P.call(i)), E = _(() => Math.floor(s / n(z)));
+    L(() => i.default(), (e) => {
+      I = c.value, c.value = pe(I, V(e));
+    }), L(() => {
       var e;
-      return (e = u.extra) == null ? void 0 : e.call(u);
+      return (e = i.extra) == null ? void 0 : e.call(i);
     }, (e) => {
-      d.value = e;
+      u.value = e;
     });
-    const ee = (e) => U(e) ? (Ce(e) ? e : [e]).join("") : Date.now(), A = S(() => {
-      const e = R.value, t = [], s = [], l = o(k);
-      let i = 0;
-      e.forEach((p) => {
-        const f = p.props;
-        if (ge(f.hidden) ? !!f.hidden : U(f.hidden))
-          t.push(p);
+    const r = _(() => {
+      const e = c.value, a = [], l = [], g = [], h = n(E);
+      let v = 0, b = 0;
+      const Q = s * o.maxRows - h * (n(u) && !o.extraInAction ? 2 : 1);
+      e.forEach((S, Z) => {
+        const p = S.props;
+        if (ce(p.hidden) ? !!p.hidden : M(p.hidden))
+          a.push(S);
         else {
-          const y = r - i % r, _ = f.span || l;
-          y >= _ ? i += _ : i += _ + y, s.push(p);
+          let C = p.span || h;
+          const O = {
+            node: S,
+            span: C,
+            key: `ApFormSearchFormItem-${Z}-${G(p.name)}-${p._signal}`
+          }, $ = s - v % s;
+          $ < C && (C += $), v += C, v > Q ? l.push(O) : (b = v, g.push(O));
         }
       });
-      const P = r - i % r;
-      P < l && (i += P);
-      const T = r - (i + l) % r, oe = i % r < l, ae = T < l ? r : T, O = r - l * (o(d) && !n.extraInAction ? 2 : 1), ne = !n.forceExpand && i > O;
-      let V = 0, j = 0;
-      const le = s.map((p, f) => {
-        const x = p.props, y = x.span || l;
-        if (V += y, !n.forceExpand && o(c) && V > O) {
-          t.push(pe(p, {
-            hidden: !0
-          }));
-          return;
-        }
-        return j += y, {
-          node: p,
-          span: x.span || l,
-          key: `ApFormSearchFormItem-${f}-${ee(x.name)}-${x._signal}`
-        };
-      }).filter(Boolean), re = r - j - l;
+      const T = s - (b + h) % s, X = b % s < h, Y = T < h ? s : T;
       return {
-        hideNode: a(F, null, [t]),
-        nodes: le,
-        defaultExtraSpan: ae,
-        actualExtraSpan: re,
-        showCollapse: ne,
-        lastRowOnlyIncludeActionAndExtra: oe
+        hideNode: t(w, null, [a]),
+        nodes: g,
+        collapseNodes: l,
+        extraSpan: Y,
+        lastRowOnlyIncludeActionAndExtra: X
       };
-    }), te = S(() => {
+    });
+    function J(e) {
+      c.value = [...e];
+    }
+    const K = _(() => {
       let e;
-      const t = o(A), s = a(B, {
-        span: o(k),
+      const a = t(R, {
+        span: n(E),
         key: "actionWrapper"
       }, {
-        default: () => [a(q, null, {
-          default: () => [a($, {
-            justify: !o(c) && t.lastRowOnlyIncludeActionAndExtra && !(o(d) && n.extraInAction) ? "flex-end" : "space-between"
+        default: () => [t(D, null, {
+          default: () => [t(B, {
+            wrap: "wrap",
+            justify: r.value.lastRowOnlyIncludeActionAndExtra && !(n(u) && o.extraInAction) ? "flex-end" : "space-between"
           }, {
-            default: () => [a(he, null, {
-              default: () => [a(v, {
+            default: () => [t(B, {
+              gap: 8,
+              wrap: "wrap"
+            }, {
+              default: () => [t("div", {
+                class: m("column-setting-trigger-wrapper")
+              }, [r.value.collapseNodes.length ? t(he, {
+                onSubmit: k,
+                config: r.value.collapseNodes,
+                submitLoading: o.submitLoading
+              }, null) : null, o.sortable && c.value.length ? t(xe, {
+                children: c.value,
+                onClickConfirm: J
+              }, null) : null]), t(U, {
                 type: "primary",
-                onClick: Y,
-                loading: n.submitLoading,
-                htmlType: "submit"
+                onClick: k,
+                loading: o.submitLoading,
+                htmlType: "submit",
+                class: m("action-btn")
               }, {
-                default: () => [n.searchText || w("ap.apForm.search.search")]
-              }), a(v, {
-                onClick: Z
+                default: () => [o.searchText || N("ap.apForm.search.search")]
+              }), t(U, {
+                onClick: H,
+                type: "text",
+                class: [m("action-btn"), m("action-btn-reset")]
               }, {
-                default: () => [n.resetText || w("ap.apForm.search.reset")]
-              }), t.showCollapse ? a(v, {
-                onClick: X,
-                icon: a(ye, {
-                  style: Q.value === "aplus" ? "color:#B8C3D1" : "color:#BFBFBF",
-                  rotate: o(c) ? 90 : -90
-                }, null)
-              }, null) : null]
-            }), n.extraInAction ? o(d) : null]
+                default: () => [o.resetText || N("ap.apForm.search.reset")]
+              })]
+            }), o.extraInAction ? n(u) : null]
           })]
         })]
-      }), l = !n.extraInAction && o(d) ? a(B, {
-        span: o(c) ? t.actualExtraSpan : t.defaultExtraSpan,
+      }), l = !o.extraInAction && n(u) ? t(R, {
+        span: r.value.extraSpan,
         key: "extraNode"
       }, {
-        default: () => [a(q, null, {
-          default: () => [a($, {
-            justify: !o(c) && (t.defaultExtraSpan === r || t.lastRowOnlyIncludeActionAndExtra) ? "start" : "flex-end"
-          }, be(e = o(d)) ? e : {
+        default: () => [t(D, null, {
+          default: () => [t(B, {
+            justify: r.value.extraSpan === s || r.value.lastRowOnlyIncludeActionAndExtra ? "start" : "flex-end"
+          }, ge(e = n(u)) ? e : {
             default: () => [e]
           })]
         })]
-      }) : null, i = a(B, {
-        span: t.defaultExtraSpan
+      }) : null, g = t(R, {
+        span: r.value.extraSpan
       }, null);
-      return !o(c) && t.lastRowOnlyIncludeActionAndExtra ? a(F, null, [l || i, s]) : a(F, null, [s, l]);
+      return r.value.lastRowOnlyIncludeActionAndExtra ? t(w, null, [l || g, a]) : t(w, null, [a, l]);
     });
-    return z({
-      apForm: S(() => o(g))
-    }), (e, t) => (m(), C(Ee, de({
+    return q({
+      apForm: _(() => n(y))
+    }), (e, a) => (d(), x(ye, ne({
       ref_key: "apForm",
-      ref: g,
-      class: o(K)()
-    }, o(_e)(n, ["collapse", "defaultCollapse", "onUpdate:collapse", "searchText", "resetText", "onSubmit", "onReset", "extraInAction", "forceExpand", "countPerRow"])), {
-      default: E(() => [(m(), C(b(A.value.hideNode))), a(o(xe), {
+      ref: y,
+      class: n(m)()
+    }, n(ue)(o, ["collapse", "defaultCollapse", "onUpdate:collapse", "searchText", "resetText", "onSubmit", "onReset", "extraInAction", "forceExpand", "countPerRow"])), {
+      default: F(() => [(d(), x(A(r.value.hideNode))), t(n(se), {
         gutter: 16
       }, {
-        default: E(() => [(m(!0), fe(F, null, me(A.value.nodes, (s) => (m(), C(o(B), {
-          key: s.key,
-          span: s.span
+        default: F(() => [(d(!0), le(w, null, re(r.value.nodes, (l) => (d(), x(n(R), {
+          key: l.key,
+          span: l.span
         }, {
-          default: E(() => [(m(), C(b(s.node)))]),
+          default: F(() => [(d(), x(A(l.node)))]),
           _: 2
-        }, 1032, ["span"]))), 128)), (m(), C(b(te.value)))]),
+        }, 1032, ["span"]))), 128)), (d(), x(A(K.value)))]),
         _: 1
       })]),
       _: 1
@@ -250,5 +250,5 @@ const r = 24, ze = /* @__PURE__ */ ie({
   }
 });
 export {
-  ze as default
+  Le as default
 };