@aplus-frontend/ui 7.13.1 → 7.13.3

package/es/src/ap-field/select/index.vue.mjs

@@ -1,15 +1,15 @@
-import { defineComponent as Y, ref as N, shallowRef as G, computed as u, onMounted as J, watch as Q, unref as a, createElementBlock as O, createBlock as X, openBlock as C, toDisplayString as S, mergeProps as Z, h as ee, createSlots as oe, withCtx as v, createVNode as x, normalizeClass as w, createElementVNode as te, createCommentVNode as le, withModifiers as ae, renderList as ne, renderSlot as re, normalizeProps as se, guardReactiveProps as ie } from "vue";
-import { Select as ue, Flex as pe, Spin as de } from "@aplus-frontend/antdv";
-import { debounce as ce, isFunction as V, isArray as fe, isNil as me, omit as ve } from "lodash-unified";
+import { defineComponent as Z, ref as V, shallowRef as ee, computed as s, onMounted as oe, watch as te, unref as n, createElementBlock as I, createBlock as k, openBlock as p, toDisplayString as w, mergeProps as le, h as ne, createSlots as ae, withCtx as d, createVNode as C, normalizeClass as f, createCommentVNode as _, createElementVNode as F, withModifiers as re, renderList as se, renderSlot as ue, normalizeProps as ie, guardReactiveProps as de, resolveDynamicComponent as ce } from "vue";
+import { Select as pe, Flex as fe, Space as me, Checkbox as M, Spin as ve } from "@aplus-frontend/antdv";
+import { debounce as he, isFunction as P, isArray as ye, isNil as ge, omit as we, isNumber as Ce } from "lodash-unified";
 import "../../config-provider/index.mjs";
 import "../../hooks/index.mjs";
-import { useDefaultPlaceholder as he } from "../hooks/use-default-placeholder.mjs";
-import ye from "../style/index.mjs";
-import { useSelectOptions as ge, SELECT_ALL_VALUE_KEY as h } from "./use-select-options.mjs";
-import { useNamespace as Ce } from "../../config-provider/hooks/use-namespace.mjs";
-import { useLocale as Se } from "../../config-provider/hooks/use-locale.mjs";
-import { useControllableValue as we } from "../../hooks/useControllableValue.mjs";
-const be = { key: 0 }, Be = ["onClick"], Pe = /* @__PURE__ */ Y({
+import { useDefaultPlaceholder as Se } from "../hooks/use-default-placeholder.mjs";
+import be from "../style/index.mjs";
+import { useSelectOptions as Be } from "./use-select-options.mjs";
+import { useNamespace as ke } from "../../config-provider/hooks/use-namespace.mjs";
+import { useLocale as Fe } from "../../config-provider/hooks/use-locale.mjs";
+import { useControllableValue as Ne } from "../../hooks/useControllableValue.mjs";
+const Oe = { key: 0 }, xe = ["onClick"], ze = /* @__PURE__ */ Z({
   name: "ApFieldSelect",
   __name: "index",
   props: {
@@ -100,80 +100,81 @@ const be = { key: 0 }, Be = ["onClick"], Pe = /* @__PURE__ */ Y({
     searchMode: { default: "filter" },
     refetchOnFocus: { type: Boolean, default: !1 },
     lazy: { type: Boolean, default: !1 },
-    addAll: { type: [Boolean, Number] },
+    addAll: { type: [Boolean, Number], default: 5 },
     params: {},
-    searchDelay: { default: 300 }
+    searchDelay: { default: 300 },
+    allowOnlySelect: { type: Boolean, default: !0 }
   },
   emits: ["update:value"],
-  setup(I, { expose: k, emit: A }) {
+  setup(T, { expose: q, emit: D }) {
     let r = 0;
-    const o = I, { b: p } = Ce("field-select"), _ = ye("field"), b = N(!1), { t: L } = Se(), M = ce((e) => {
-      if (!V(o.request))
+    const e = T, { b: u } = ke("field-select"), R = be("field"), N = V(!1), { t: O } = Fe(), L = he((o) => {
+      if (!P(e.request))
         return;
       r += 1;
-      const t = r;
-      d([]), n.value = !0, o.request(e).then((l) => {
-        r === t && (d(l), n.value = !1);
+      const l = r;
+      v([]), a.value = !0, e.request(o).then((t) => {
+        r === l && (v(t), a.value = !1);
       });
-    }, o.searchDelay), P = (e, t) => {
-      const l = o.fieldNames?.label || "label";
-      return typeof t?.[l] == "string" && t[l].toLowerCase().indexOf(e.toLowerCase()) > -1;
-    }, { options: s, updateOptions: d } = ge(o), y = G(), n = N(o?.loading || !1), T = A, q = u(() => {
-      if (o.multiple)
-        return o.tokenSeparators ? "tags" : "multiple";
+    }, e.searchDelay), z = (o, l) => {
+      const t = e.fieldNames?.label || "label";
+      return typeof l?.[t] == "string" && l[t].toLowerCase().indexOf(o.toLowerCase()) > -1;
+    }, { options: m, updateOptions: v } = Be(e), S = ee(), a = V(e?.loading || !1), U = D, $ = s(() => {
+      if (e.multiple)
+        return e.tokenSeparators ? "tags" : "multiple";
     });
-    async function c(e = !0) {
-      if (!V(o.request))
+    async function h(o = !0) {
+      if (!P(e.request))
         return;
-      n.value = !0, r += 1;
-      const t = r;
+      a.value = !0, r += 1;
+      const l = r;
       try {
-        e && d([]);
-        const l = await o.request(void 0, o.params);
-        if (t !== r)
+        o && v([]);
+        const t = await e.request(void 0, e.params);
+        if (l !== r)
           return;
-        d(l);
+        v(t);
       } finally {
-        n.value = !1;
+        a.value = !1;
       }
     }
-    function D(e) {
-      o.onFocus?.(e), o.refetchOnFocus && r > 0 && !n.value && c(!0);
+    function K(o) {
+      e.onFocus?.(o), e.refetchOnFocus && r > 0 && !a.value && h(!0);
     }
-    J(() => {
-      o.lazy || c();
-    }), Q(
-      () => o.params,
+    oe(() => {
+      e.lazy || h();
+    }), te(
+      () => e.params,
       () => {
-        c();
+        h();
       },
       {
         deep: !0
       }
     );
-    const { value: f, updateValue: m } = we(o, T), R = he("Select", o), z = u(() => {
-      const e = a(f);
-      if (!e)
-        return o.emptyText;
-      const t = o.fieldNames?.label || "label", l = o.fieldNames?.value || "value";
-      return fe(e) ? e.map(
-        (i) => a(s).find((W) => W[l] === i)?.[t]
-      ).filter(Boolean).join("、") || o.emptyText : a(s).find(
-        (i) => i[l] === e
-      )?.[t] || o.emptyText;
-    }), E = u(() => {
-      const e = !!o?.showSearch, t = o.searchMode;
-      let l = {};
-      return e && (l = t === "request" ? {
+    const { value: i, updateValue: y } = Ne(e, U), j = Se("Select", e), E = s(() => {
+      const o = n(i);
+      if (!o)
+        return e.emptyText;
+      const l = e.fieldNames?.label || "label", t = e.fieldNames?.value || "value";
+      return ye(o) ? o.map(
+        (c) => n(m).find((Y) => Y[t] === c)?.[l]
+      ).filter(Boolean).join("、") || e.emptyText : n(m).find(
+        (c) => c[t] === o
+      )?.[l] || e.emptyText;
+    }), H = s(() => {
+      const o = !!e?.showSearch, l = e.searchMode;
+      let t = {};
+      return o && (t = l === "request" ? {
         defaultActiveFirstOption: !1,
-        onSearch: M,
-        notFoundContent: n.value ? void 0 : null,
+        onSearch: L,
+        notFoundContent: a.value ? void 0 : null,
         filterOption: !1,
         suffixIcon: null
       } : {
-        filterOption: me(o?.filterOption) ? P : o?.filterOption
+        filterOption: ge(e?.filterOption) ? z : e?.filterOption
       }), {
-        ...ve(o, [
+        ...we(e, [
           "mode",
           "value",
           "onUpdate:value",
@@ -183,99 +184,124 @@ const be = { key: 0 }, Be = ["onClick"], Pe = /* @__PURE__ */ Y({
           "onFocus",
           "onBeforeSelect"
         ]),
-        placeholder: a(R),
-        ...l
+        placeholder: n(j),
+        ...t
       };
-    }), B = u(
-      () => s.value.map((e) => e[o.fieldNames?.value || "value"]).filter((e) => e !== h)
-    ), U = u(() => {
-      if (!o.multiple || !o.addAll)
-        return a(f);
-      if (s.value.some(
-        (e) => e[o.fieldNames?.value || "value"] === h
-      )) {
-        const e = a(B), t = a(f) || [];
-        if (e.length && e.every((l) => t?.includes(l)))
-          return [h];
-      }
-      return a(f);
-    });
-    function K(e) {
-      return o.multiple && e.includes(h) ? m(a(B)) : m(e);
+    }), g = s(
+      () => m.value.map((o) => o[e.fieldNames?.value || "value"])
+    ), x = s(() => e.multiple ? Ce(e.addAll) ? g.value.length >= e.addAll : !!e.addAll : !1);
+    function W() {
+      S.value?.focus();
     }
-    function $() {
-      y.value?.focus();
+    function G() {
+      S.value?.blur();
     }
-    function j() {
-      y.value?.blur();
+    function b(o, l) {
+      const t = e.fieldNames?.[l] ?? l;
+      return o[t];
     }
-    function F(e, t) {
-      const l = o.fieldNames?.[t] ?? t;
-      return e[l];
+    function J(o) {
+      const l = b(o, "value");
+      y(e.multiple ? [l] : l);
     }
-    function H(e) {
-      const t = F(e, "value");
-      m(o.multiple ? [t] : t);
+    const A = s(() => {
+      const o = n(i) || [], l = g.value;
+      return l.length > 0 && l.every((t) => o.includes(t));
+    }), Q = s(() => (n(i) || []).length > 0 && !A.value);
+    function X() {
+      console.log("123");
+      const o = n(i) || [], l = g.value;
+      l.length && l.every((t) => o?.includes(t)) ? y([]) : y(g.value);
     }
-    return k({
-      focus: $,
-      blur: j,
-      request: c
-    }), (e, t) => e.mode === "read" ? (C(), O("span", be, S(z.value), 1)) : (C(), X(a(ue), Z({
+    return q({
+      focus: W,
+      blur: G,
+      request: h
+    }), (o, l) => o.mode === "read" ? (p(), I("span", Oe, w(E.value), 1)) : (p(), k(n(pe), le({
       key: 1,
       ref_key: "selectRef",
-      ref: y,
+      ref: S,
       "allow-clear": ""
-    }, E.value, {
-      mode: q.value,
-      value: U.value,
-      options: a(s),
-      loading: n.value,
-      "menu-item-selected-icon": ee("span"),
-      "popup-class-name": `${a(p)("popup")} ${a(_)}`,
-      open: b.value,
-      "onUpdate:value": K,
-      onFocus: D,
-      onDropdownVisibleChange: t[0] || (t[0] = (l) => b.value = l)
-    }), oe({
-      option: v((l) => [
-        x(a(pe), {
+    }, H.value, {
+      mode: $.value,
+      value: n(i),
+      options: n(m),
+      loading: a.value,
+      "menu-item-selected-icon": ne("span"),
+      "popup-class-name": `${n(u)("popup")} ${n(R)}`,
+      open: N.value,
+      "onUpdate:value": n(y),
+      onFocus: K,
+      onDropdownVisibleChange: l[0] || (l[0] = (t) => N.value = t)
+    }), ae({
+      option: d((t) => [
+        C(n(fe), {
           justify: "space-between",
           align: "center",
-          class: w(a(p)("popup-option-wrapper")),
+          class: f(n(u)("popup-option-wrapper")),
           gap: 8
         }, {
-          default: v(() => [
-            te("span", {
-              class: w(a(p)("popup-option-label"))
-            }, S(F(l, "label")), 3),
-            e.multiple ? (C(), O("span", {
+          default: d(() => [
+            C(n(me), null, {
+              default: d(() => [
+                x.value ? (p(), k(n(M), {
+                  key: 0,
+                  checked: n(i)?.includes(
+                    b(t, "value")
+                  )
+                }, null, 8, ["checked"])) : _("", !0),
+                F("span", {
+                  class: f(n(u)("popup-option-label"))
+                }, w(b(t, "label")), 3)
+              ]),
+              _: 2
+            }, 1024),
+            o.multiple && o.allowOnlySelect ? (p(), I("span", {
               key: 0,
-              class: w(a(p)("popup-option-action")),
-              onClick: ae(() => H(l), ["stop"])
-            }, S(a(L)("ap.field.chooseOnly")), 11, Be)) : le("", !0)
+              class: f(n(u)("popup-option-action")),
+              onClick: re(() => J(t), ["stop"])
+            }, w(n(O)("ap.field.chooseOnly")), 11, xe)) : _("", !0)
           ]),
           _: 2
         }, 1032, ["class"])
       ]),
       _: 2
     }, [
-      ne(e.$slots, (l, g) => ({
-        name: g,
-        fn: v((i) => [
-          re(e.$slots, g, se(ie(i || {})))
+      se(o.$slots, (t, B) => ({
+        name: B,
+        fn: d((c) => [
+          ue(o.$slots, B, ie(de(c || {})))
         ])
       })),
-      n.value ? {
+      a.value ? {
         name: "notFoundContent",
-        fn: v(() => [
-          x(a(de), { size: "small" })
+        fn: d(() => [
+          C(n(ve), { size: "small" })
         ]),
         key: "0"
+      } : void 0,
+      x.value ? {
+        name: "dropdownRender",
+        fn: d(({ menuNode: t }) => [
+          F("button", {
+            class: f(n(u)("popup-all-option")),
+            onClick: X
+          }, [
+            C(n(M), {
+              checked: A.value,
+              indeterminate: Q.value
+            }, null, 8, ["checked", "indeterminate"]),
+            F("span", {
+              class: f(n(u)("popup-all-option-label"))
+            }, w(n(O)("ap.field.selectAll")), 3)
+          ], 2),
+          (p(), k(ce(t)))
+        ]),
+        key: "1"
       } : void 0
-    ]), 1040, ["mode", "value", "options", "loading", "menu-item-selected-icon", "popup-class-name", "open"]));
+    ]), 1040, ["mode", "value", "options", "loading", "menu-item-selected-icon", "popup-class-name", "open", "onUpdate:value"]));
   }
 });
 export {
-  Pe as default
+  ze as default
 };

package/es/src/ap-field/select/read.vue2.mjs

@@ -93,7 +93,8 @@ const f = { key: 0 }, C = /* @__PURE__ */ i({
     lazy: { type: Boolean },
     addAll: { type: [Boolean, Number] },
     params: {},
-    searchDelay: {}
+    searchDelay: {},
+    allowOnlySelect: { type: Boolean }
   },
   setup(l) {
     const e = l, r = s(() => {

package/es/src/ap-field/select/use-select-options.mjs

@@ -1,42 +1,24 @@
-import { ref as r, watch as c } from "vue";
-import "../../config-provider/index.mjs";
-import { useLocale as f } from "../../config-provider/hooks/use-locale.mjs";
-const m = "SELECTABLE_ALL_VALUE_KEY", E = (l) => {
-  const e = r(l?.options || []), { t: n } = f(), u = {
-    [l.fieldNames?.label || "label"]: n("ap.common.all"),
-    [l.fieldNames?.value || "value"]: m
-  };
-  function i(t) {
-    const a = l.addAll;
-    if (!l.multiple || !a)
-      return !1;
-    const d = Math.min(0, a === !0 ? 0 : a);
-    return t.length > d;
-  }
-  function o(t) {
-    if (t) {
-      if (!i(t)) {
-        e.value = t;
-        return;
-      }
-      e.value = [u, ...t];
-    }
+import { ref as E, watch as L } from "vue";
+const s = "SELECTABLE_ALL_VALUE_KEY", u = (o) => {
+  const e = E(o?.options || []);
+  function n(t) {
+    t && (e.value = [...t]);
   }
-  return c(
-    () => l.options,
+  return L(
+    () => o.options,
     (t) => {
-      o(t);
+      n(t);
     },
     {
       deep: !0
     }
   ), {
     options: e,
-    updateOptions: o
+    updateOptions: n
   };
 };
 export {
-  m as SELECT_ALL_VALUE_KEY,
-  E as default,
-  E as useSelectOptions
+  s as SELECT_ALL_VALUE_KEY,
+  u as default,
+  u as useSelectOptions
 };

package/es/src/ap-field/style/select.mjs

@@ -1,43 +1,54 @@
-import { singleRow as p } from "../../style/index.mjs";
-const r = (o) => {
-  const { componentCls: e } = o, i = `${e}-select-popup`;
+import { singleRow as l } from "../../style/index.mjs";
+const n = (i) => {
+  const { componentCls: p } = i, o = `${p}-select-popup`;
   return {
-    [`${i}`]: {
-      [`${i}-option-wrapper`]: {
+    [`${o}`]: {
+      padding: i.space,
+      [`${o}-all-option`]: {
+        width: "100%",
+        display: "inline-flex",
+        cursor: "pointer",
+        paddingInline: i.space,
+        paddingBlock: i.spaceSM,
+        [`${o}-all-option-label`]: {
+          paddingInline: i.space
+        }
+      },
+      [`${o}-option-wrapper`]: {
         height: "22px"
       },
-      [`${i}-option-label`]: {
-        ...p(o),
+      [`${o}-option-label`]: {
+        ...l(i),
         color: "inherit"
       },
-      [`${i}-option-action`]: {
+      [`${o}-option-action`]: {
         display: "none",
-        color: o.colorPrimary,
-        paddingInline: o.spaceSM,
-        paddingBlock: o.spaceXXS,
+        color: i.colorPrimary,
+        paddingInline: i.spaceSM,
+        paddingBlock: i.spaceXXS,
         "&:hover": {
-          background: o.colorPrimary,
+          background: i.colorPrimary,
           color: "#fff",
           borderRadius: "2px"
         }
       },
-      "div.ant-select-item": {
-        paddingInline: o.space,
-        paddingBlock: o.spaceXS,
+      "div.ant-select-item:not(:last-child)": {
+        paddingInline: i.space,
+        paddingBlock: i.spaceXS,
         fontWeight: "normal !important",
-        marginBottom: o.spaceXS,
+        marginBottom: i.spaceXS,
         "&:hover": {
-          [`${i}-option-action`]: {
+          [`${o}-option-action`]: {
             display: "inline"
           }
         },
         "&.ant-select-item-option-selected:not(.ant-select-item-option-disabled)": {
-          color: o.colorPrimary
+          color: i.colorPrimary
         }
       }
     }
   };
 };
 export {
-  r as genSelectStyle
+  n as genSelectStyle
 };

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

@@ -138,6 +138,7 @@ declare function __VLS_template(): {
                 readonly addAll?: boolean | number | undefined;
                 readonly params?: Recordable | undefined;
                 readonly searchDelay?: number | undefined;
+                readonly allowOnlySelect?: boolean | undefined;
             } & VNodeProps & AllowedComponentProps & ComponentCustomProps;
             $attrs: {
                 [x: string]: unknown;
@@ -606,7 +607,9 @@ declare function __VLS_template(): {
                 emptyText: string;
                 searchMode: "filter" | "request";
                 refetchOnFocus: boolean;
+                addAll: boolean | number;
                 searchDelay: number;
+                allowOnlySelect: boolean;
             }, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & {
                 beforeCreate?: (() => void) | (() => void)[];
                 created?: (() => void) | (() => void)[];
@@ -647,10 +650,12 @@ declare function __VLS_template(): {
             emptyText: string;
             searchMode: "filter" | "request";
             refetchOnFocus: boolean;
+            addAll: boolean | number;
             searchDelay: number;
+            allowOnlySelect: boolean;
         }> & Omit<Readonly< ApFieldSelectProps> & Readonly<{
             "onUpdate:value"?: ((...args: any[]) => any) | undefined;
-        }>, "blur" | "focus" | "request" | ("mode" | "open" | "multiple" | "disabled" | "virtual" | "autofocus" | "lazy" | "loading" | "bordered" | "allowClear" | "showArrow" | "autoClearSearchValue" | "defaultActiveFirstOption" | "labelInValue" | "showSearch" | "defaultOpen" | "emptyText" | "searchMode" | "refetchOnFocus" | "searchDelay")> & ShallowUnwrapRef<{
+        }>, "blur" | "focus" | "request" | ("mode" | "open" | "multiple" | "disabled" | "virtual" | "autofocus" | "lazy" | "loading" | "bordered" | "allowClear" | "showArrow" | "autoClearSearchValue" | "defaultActiveFirstOption" | "labelInValue" | "showSearch" | "defaultOpen" | "emptyText" | "searchMode" | "refetchOnFocus" | "addAll" | "searchDelay" | "allowOnlySelect")> & ShallowUnwrapRef<{
             focus: () => void;
             blur: () => void;
             request: (clear?: boolean) => Promise<void>;
@@ -794,6 +799,7 @@ declare const __VLS_component: DefineComponent<ApFormItemSelectProps, {
             readonly addAll?: boolean | number | undefined;
             readonly params?: Recordable | undefined;
             readonly searchDelay?: number | undefined;
+            readonly allowOnlySelect?: boolean | undefined;
         } & VNodeProps & AllowedComponentProps & ComponentCustomProps;
         $attrs: {
             [x: string]: unknown;
@@ -1262,7 +1268,9 @@ declare const __VLS_component: DefineComponent<ApFormItemSelectProps, {
             emptyText: string;
             searchMode: "filter" | "request";
             refetchOnFocus: boolean;
+            addAll: boolean | number;
             searchDelay: number;
+            allowOnlySelect: boolean;
         }, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -1303,10 +1311,12 @@ declare const __VLS_component: DefineComponent<ApFormItemSelectProps, {
         emptyText: string;
         searchMode: "filter" | "request";
         refetchOnFocus: boolean;
+        addAll: boolean | number;
         searchDelay: number;
+        allowOnlySelect: boolean;
     }> & Omit<Readonly< ApFieldSelectProps> & Readonly<{
         "onUpdate:value"?: ((...args: any[]) => any) | undefined;
-    }>, "blur" | "focus" | "request" | ("mode" | "open" | "multiple" | "disabled" | "virtual" | "autofocus" | "lazy" | "loading" | "bordered" | "allowClear" | "showArrow" | "autoClearSearchValue" | "defaultActiveFirstOption" | "labelInValue" | "showSearch" | "defaultOpen" | "emptyText" | "searchMode" | "refetchOnFocus" | "searchDelay")> & ShallowUnwrapRef<{
+    }>, "blur" | "focus" | "request" | ("mode" | "open" | "multiple" | "disabled" | "virtual" | "autofocus" | "lazy" | "loading" | "bordered" | "allowClear" | "showArrow" | "autoClearSearchValue" | "defaultActiveFirstOption" | "labelInValue" | "showSearch" | "defaultOpen" | "emptyText" | "searchMode" | "refetchOnFocus" | "addAll" | "searchDelay" | "allowOnlySelect")> & ShallowUnwrapRef<{
         focus: () => void;
         blur: () => void;
         request: (clear?: boolean) => Promise<void>;