@aplus-frontend/ui 7.17.3 → 7.18.0

package/es/src/ap-field/date-range/read.vue2.mjs

@@ -4,7 +4,7 @@ import c from "dayjs";
 import { isNil as g } from "lodash-unified";
 import { ApFieldDatePresetFormats as w, PRESET_FORMAT_MAP as C } from "../date/constant.mjs";
 import { useDateTimezone as O } from "../hooks/use-date-timezone.mjs";
-const M = /* @__PURE__ */ v({
+const F = /* @__PURE__ */ v({
   name: "ApFieldDateRangeRead",
   __name: "read",
   props: {
@@ -12,6 +12,7 @@ const M = /* @__PURE__ */ v({
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     id: {},
     defaultPickerValue: {},
     placeholder: {},
@@ -116,5 +117,5 @@ const M = /* @__PURE__ */ v({
   }
 });
 export {
-  M as default
+  F as default
 };

package/es/src/ap-field/hooks/use-read-mode-render.d.ts

@@ -0,0 +1,9 @@
+import { Ref, VNode, RendererNode, RendererElement } from 'vue';
+import { BasicApFieldProps } from '../interface';
+export declare const useReadModeRender: (props: BasicApFieldProps<object>, val: Ref<any>) => {
+    renderer: (children: VNode[]) => VNode< RendererNode, RendererElement, {
+        [key: string]: any;
+    }> | VNode< RendererNode, RendererElement, {
+        [key: string]: any;
+    }>[];
+};

package/es/src/ap-field/hooks/use-read-mode-render.mjs

@@ -0,0 +1,6 @@
+const o = (r, d) => ({
+  renderer: (e) => r.customReadMode?.(e, d.value) ?? e
+});
+export {
+  o as useReadModeRender
+};

package/es/src/ap-field/interface.d.ts

@@ -7,6 +7,7 @@ import { SharedTimeProps } from '@aplus-frontend/antdv/es/vc-picker/panels/TimeP
 import { LegacyDataNode } from '@aplus-frontend/antdv/es/vc-tree-select/interface';
 import { ZoneAlias } from '@aplus-frontend/utils';
 import { Dayjs } from 'dayjs';
+import { VNode } from 'vue';
 import { LiteralUnion, Recordable } from '../type';
 import { ApFormatPresetType } from './date/interface';
 import { InputPasswordProps } from './text/input-password-props';
@@ -21,6 +22,13 @@ export type BasicApFieldProps<FieldPropsType = any> = {
     class?: unknown;
     style?: unknown;
     emptyText?: string;
+    /**
+     * 自定义渲染只读模式（仅输入类型控件支持）
+     * @param originalNode 默认渲染的节点
+     * @param val 将要渲染的文本
+     * @returns
+     */
+    customReadMode?: (originalNode: any, val?: any) => VNode;
 } & FieldPropsType;
 export type ApFieldTextProps = BasicApFieldProps<InputProps> & {
     /**

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

@@ -1,15 +1,18 @@
-import { defineComponent as D, useSlots as R, computed as m, shallowRef as V, unref as t, createElementBlock as s, createBlock as I, openBlock as l, normalizeClass as i, createCommentVNode as f, createElementVNode as M, renderSlot as u, toDisplayString as $, mergeProps as A, createSlots as U, renderList as z, withCtx as E, normalizeProps as T, guardReactiveProps as w } from "vue";
+import { defineComponent as I, useSlots as $, computed as m, shallowRef as A, unref as t, createBlock as f, openBlock as r, withCtx as c, createElementVNode as y, normalizeClass as s, createElementBlock as v, createCommentVNode as h, renderSlot as i, toDisplayString as U, mergeProps as z, createSlots as E, renderList as T, normalizeProps as _, guardReactiveProps as w } from "vue";
 import { InputNumber as F } from "@aplus-frontend/antdv";
 import { omit as O, isNil as W } from "lodash-unified";
-import { roundWith as _, toDecimalMark as L } from "../../utils/format.mjs";
+import "../../render/index.mjs";
+import { roundWith as L, toDecimalMark as Z } from "../../utils/format.mjs";
 import "../../config-provider/index.mjs";
 import "../../hooks/index.mjs";
-import { useDefaultPlaceholder as Z } from "../hooks/use-default-placeholder.mjs";
-import j from "../style/index.mjs";
-import { addZeroToDecimalPlaces as q } from "./helper.mjs";
-import { useNamespace as G } from "../../config-provider/hooks/use-namespace.mjs";
-import { useControllableValue as H } from "../../hooks/useControllableValue.mjs";
-const se = /* @__PURE__ */ D({
+import { useDefaultPlaceholder as j } from "../hooks/use-default-placeholder.mjs";
+import { useReadModeRender as q } from "../hooks/use-read-mode-render.mjs";
+import G from "../style/index.mjs";
+import { addZeroToDecimalPlaces as H } from "./helper.mjs";
+import { useNamespace as J } from "../../config-provider/hooks/use-namespace.mjs";
+import { useControllableValue as K } from "../../hooks/useControllableValue.mjs";
+import Q from "../../render/render.mjs";
+const fe = /* @__PURE__ */ I({
   name: "ApFieldNumber",
   __name: "index",
   props: {
@@ -17,6 +20,7 @@ const se = /* @__PURE__ */ D({
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     size: {},
     bordered: { type: Boolean, default: !0 },
     placeholder: {},
@@ -61,60 +65,67 @@ const se = /* @__PURE__ */ D({
     limitDecimalsRetain: { type: Boolean }
   },
   emits: ["update:value"],
-  setup(c, { expose: y, emit: v }) {
-    const h = v, B = R(), { b: r } = G("field-number"), b = j("field"), o = c, g = m(
+  setup(B, { expose: b, emit: g }) {
+    const k = g, R = $(), { b: l } = J("field-number"), S = G("field"), o = B, x = m(
       () => O(o, ["value", "onUpdate:value", "mode"])
-    ), n = V(), { value: p, updateValue: k } = H(
+    ), n = A(), { value: u, updateValue: C } = K(
       o,
-      h
-    ), S = Z("Number", o), x = m(() => {
-      let e = t(p);
+      k
+    ), M = j("Number", o), d = m(() => {
+      let e = t(u);
       if (W(e))
         return o.emptyText;
-      o.precision && (e = _(e, o.precision));
-      let a = o.thousands ? L(e) : String(e);
-      return o.precision && o.limitDecimalsRetain && (a = q(a, o.precision)), a;
-    });
-    function C() {
+      o.precision && (e = L(e, o.precision));
+      let a = o.thousands ? Z(e) : String(e);
+      return o.precision && o.limitDecimalsRetain && (a = H(a, o.precision)), a;
+    }), { renderer: N } = q(o, d);
+    function P() {
       n.value?.focus();
     }
-    function N() {
+    function D() {
       n.value?.blur();
     }
-    return y({ focus: C, blur: N }), (e, a) => e.mode === "read" ? (l(), s("span", {
+    return b({ focus: P, blur: D }), (e, a) => e.mode === "read" ? (r(), f(t(Q), {
       key: 0,
-      class: i([t(r)(), t(b)])
-    }, [
-      e.$slots.prefix ? (l(), s("span", {
-        key: 0,
-        class: i(t(r)("label-left"))
-      }, [
-        u(e.$slots, "prefix")
-      ], 2)) : f("", !0),
-      M("span", null, $(x.value), 1),
-      e.$slots.addonAfter ? (l(), s("span", {
-        key: 1,
-        class: i(t(r)("label-right"))
-      }, [
-        u(e.$slots, "addonAfter")
-      ], 2)) : f("", !0)
-    ], 2)) : (l(), I(t(F), A({ key: 1 }, g.value, {
+      renderer: t(N)
+    }, {
+      default: c(() => [
+        y("span", {
+          class: s([t(l)(), t(S)])
+        }, [
+          e.$slots.prefix ? (r(), v("span", {
+            key: 0,
+            class: s(t(l)("label-left"))
+          }, [
+            i(e.$slots, "prefix")
+          ], 2)) : h("", !0),
+          y("span", null, U(d.value), 1),
+          e.$slots.addonAfter ? (r(), v("span", {
+            key: 1,
+            class: s(t(l)("label-right"))
+          }, [
+            i(e.$slots, "addonAfter")
+          ], 2)) : h("", !0)
+        ], 2)
+      ]),
+      _: 3
+    }, 8, ["renderer"])) : (r(), f(t(F), z({ key: 1 }, x.value, {
       ref_key: "inputRef",
       ref: n,
-      placeholder: t(S),
-      value: t(p),
+      placeholder: t(M),
+      value: t(u),
       mode: e.inputMode,
-      "onUpdate:value": t(k)
-    }), U({ _: 2 }, [
-      z(B, (J, d) => ({
-        name: d,
-        fn: E((P) => [
-          u(e.$slots, d, T(w(P || {})))
+      "onUpdate:value": t(C)
+    }), E({ _: 2 }, [
+      T(R, (X, p) => ({
+        name: p,
+        fn: c((V) => [
+          i(e.$slots, p, _(w(V || {})))
         ])
       }))
     ]), 1040, ["placeholder", "value", "mode", "onUpdate:value"]));
   }
 });
 export {
-  se as default
+  fe as default
 };

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

@@ -16,6 +16,7 @@ const h = {
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     size: {},
     bordered: { type: Boolean },
     placeholder: {},

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

@@ -1,13 +1,13 @@
-import { defineComponent as V, computed as p, ref as C, onMounted as O, unref as e, createElementBlock as u, openBlock as a, Fragment as m, createTextVNode as S, toDisplayString as U, createBlock as d, mergeProps as _ } from "vue";
-import { Spin as N, RadioGroup as R } from "@aplus-frontend/antdv";
+import { defineComponent as V, computed as u, ref as C, onMounted as O, unref as e, createElementBlock as p, openBlock as a, Fragment as m, createTextVNode as R, toDisplayString as S, createBlock as d, mergeProps as U } from "vue";
+import { Spin as _, RadioGroup as N } from "@aplus-frontend/antdv";
 import { omit as z, isNil as F } from "lodash-unified";
 import "../../config-provider/index.mjs";
 import "../../hooks/index.mjs";
 import G from "../hooks/use-options.mjs";
-import P from "../style/index.mjs";
-import { getOptionValue as A, getOptionLabel as D } from "./helper.mjs";
-import { useControllableValue as E } from "../../hooks/useControllableValue.mjs";
-import { useNamespace as I } from "../../config-provider/hooks/use-namespace.mjs";
+import M from "../style/index.mjs";
+import { getOptionValue as P, getOptionLabel as A } from "./helper.mjs";
+import { useControllableValue as D } from "../../hooks/useControllableValue.mjs";
+import { useNamespace as E } from "../../config-provider/hooks/use-namespace.mjs";
 const Y = /* @__PURE__ */ V({
   name: "ApFieldRadio",
   __name: "index",
@@ -16,6 +16,7 @@ const Y = /* @__PURE__ */ V({
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     prefixCls: {},
     value: {},
     size: {},
@@ -33,9 +34,9 @@ const Y = /* @__PURE__ */ V({
   },
   emits: ["update:value"],
   setup(c, { expose: f, emit: v }) {
-    const t = c, y = p(
+    const t = c, y = u(
       () => z(t, ["value", "onUpdate:value", "options", "request", "vertical"])
-    ), g = v, { options: n, updateOptions: k } = G(t), { value: r, updateValue: x } = E(t, g), { b, m: B } = I("field-radio"), T = P("field"), l = C(!1);
+    ), g = v, { options: n, updateOptions: k } = G(t), { value: r, updateValue: x } = D(t, g), { b, m: B } = E("field-radio"), T = M("field"), l = C(!1);
     async function s() {
       t.request && (l.value = !0, t.request?.().then((o) => k(o)).finally(() => {
         l.value = !1;
@@ -44,24 +45,24 @@ const Y = /* @__PURE__ */ V({
     O(() => {
       s();
     });
-    const h = p(() => {
+    const h = u(() => {
       const o = e(r);
       if (F(o))
         return t.emptyText;
       const i = n.value?.find(
-        (q) => o === A(q)
+        (q) => o === P(q)
       );
-      return D(i) || t.emptyText;
+      return A(i) || t.emptyText;
     });
     return f({
       request: s
-    }), (o, i) => o.mode === "read" ? (a(), u(m, { key: 0 }, [
-      S(U(h.value), 1)
-    ], 64)) : (a(), u(m, { key: 1 }, [
-      l.value ? (a(), d(e(N), {
+    }), (o, i) => o.mode === "read" ? (a(), p(m, { key: 0 }, [
+      R(S(h.value), 1)
+    ], 64)) : (a(), p(m, { key: 1 }, [
+      l.value ? (a(), d(e(_), {
         key: 0,
         size: "small"
-      })) : (a(), d(e(R), _({ key: 1 }, y.value, {
+      })) : (a(), d(e(N), U({ key: 1 }, y.value, {
         ref: "radioGroupRef",
         value: e(r),
         options: e(n),

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

@@ -9,6 +9,7 @@ const y = /* @__PURE__ */ p({
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     prefixCls: {},
     value: {},
     size: {},

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

@@ -1,5 +1,5 @@
-import { defineComponent as b, computed as a, shallowRef as y, useSlots as h, createBlock as B, openBlock as C, unref as t, mergeProps as _, createSlots as x, withCtx as k, renderSlot as w } from "vue";
-import { Rate as R } from "@aplus-frontend/antdv";
+import { defineComponent as b, computed as a, shallowRef as y, useSlots as h, createBlock as B, openBlock as C, unref as t, mergeProps as _, createSlots as x, withCtx as R, renderSlot as k } from "vue";
+import { Rate as w } from "@aplus-frontend/antdv";
 import { omit as g } from "lodash-unified";
 import "../../hooks/index.mjs";
 import { useControllableValue as V } from "../../hooks/useControllableValue.mjs";
@@ -10,6 +10,7 @@ const A = /* @__PURE__ */ b({
     mode: { default: "edit" },
     class: {},
     style: {},
+    customReadMode: {},
     prefixCls: {},
     count: { default: 5 },
     value: {},
@@ -44,7 +45,7 @@ const A = /* @__PURE__ */ b({
     return r({
       focus: p,
       blur: m
-    }), (v, S) => (C(), B(t(R), _(n.value, {
+    }), (v, S) => (C(), B(t(w), _(n.value, {
       ref_key: "rateRef",
       ref: o,
       value: t(c),
@@ -53,8 +54,8 @@ const A = /* @__PURE__ */ b({
     }), x({ _: 2 }, [
       d.character ? {
         name: "character",
-        fn: k(() => [
-          w(v.$slots, "character")
+        fn: R(() => [
+          k(v.$slots, "character")
         ]),
         key: "0"
       } : void 0

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

@@ -1,11 +1,14 @@
-import { defineComponent as B, computed as b, shallowRef as x, useSlots as S, createElementBlock as _, createBlock as g, openBlock as r, toDisplayString as k, unref as e, mergeProps as P, createSlots as C, renderList as I, withCtx as U, renderSlot as w, normalizeProps as R, guardReactiveProps as V } from "vue";
+import { defineComponent as R, computed as l, shallowRef as _, useSlots as P, createBlock as u, openBlock as d, unref as e, withCtx as p, createElementVNode as k, toDisplayString as C, mergeProps as I, createSlots as M, renderList as N, renderSlot as U, normalizeProps as V, guardReactiveProps as w } from "vue";
 import { InputNumber as z } from "@aplus-frontend/antdv";
 import { omit as A } from "lodash-unified";
 import "../../hooks/index.mjs";
+import "../../render/index.mjs";
 import { useDefaultPlaceholder as D } from "../hooks/use-default-placeholder.mjs";
-import { formatSecond as E } from "./helper.mjs";
+import { useReadModeRender as E } from "../hooks/use-read-mode-render.mjs";
+import { formatSecond as s } from "./helper.mjs";
 import { useControllableValue as F } from "../../hooks/useControllableValue.mjs";
-const M = { key: 0 }, H = /* @__PURE__ */ B({
+import O from "../../render/render.mjs";
+const Y = /* @__PURE__ */ R({
   name: "ApFieldSecond",
   __name: "index",
   props: {
@@ -13,6 +16,7 @@ const M = { key: 0 }, H = /* @__PURE__ */ B({
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     size: {},
     bordered: { type: Boolean, default: !0 },
     placeholder: {},
@@ -54,35 +58,46 @@ const M = { key: 0 }, H = /* @__PURE__ */ B({
     onFocus: {}
   },
   emits: ["update:value"],
-  setup(u, { expose: d, emit: s }) {
-    const o = u, p = b(
+  setup(i, { expose: m, emit: f }) {
+    const o = i, { renderer: c } = E(
+      o,
+      l(() => s(Number(t.value)))
+    ), v = l(
       () => A(o, ["value", "onUpdate:value", "min", "placeholder", "mode"])
-    ), i = s, t = x(), { value: a, updateValue: f } = F(
+    ), y = f, r = _(), { value: t, updateValue: h } = F(
       o,
-      i
-    ), c = S(), m = D("Second", o);
-    function y() {
-      t.value?.focus();
+      y
+    ), B = P(), b = D("Second", o);
+    function x() {
+      r.value?.focus();
     }
-    function v() {
-      t.value?.blur();
+    function S() {
+      r.value?.blur();
     }
-    return d({ focus: y, blur: v }), (l, N) => l.mode === "read" ? (r(), _("span", M, k(e(E)(Number(e(a)))), 1)) : (r(), g(e(z), P({
+    return m({ focus: x, blur: S }), (a, L) => a.mode === "read" ? (d(), u(e(O), {
+      key: 0,
+      renderer: e(c)
+    }, {
+      default: p(() => [
+        k("span", null, C(e(s)(Number(e(t)))), 1)
+      ]),
+      _: 1
+    }, 8, ["renderer"])) : (d(), u(e(z), I({
       key: 1,
       min: 0,
       style: { width: "100%" },
-      placeholder: e(m),
-      value: e(a)
-    }, p.value, { "onUpdate:value": e(f) }), C({ _: 2 }, [
-      I(c, (O, n) => ({
+      placeholder: e(b),
+      value: e(t)
+    }, v.value, { "onUpdate:value": e(h) }), M({ _: 2 }, [
+      N(B, (T, n) => ({
         name: n,
-        fn: U((h) => [
-          w(l.$slots, n, R(V(h || {})))
+        fn: p((g) => [
+          U(a.$slots, n, V(w(g || {})))
         ])
       }))
     ]), 1040, ["placeholder", "value", "onUpdate:value"]));
   }
 });
 export {
-  H as default
+  Y as default
 };

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

@@ -8,6 +8,7 @@ const m = /* @__PURE__ */ n({
     class: {},
     style: {},
     emptyText: { default: "--" },
+    customReadMode: {},
     size: {},
     bordered: { type: Boolean },
     placeholder: {},

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

@@ -1,8 +1,8 @@
-import { defineComponent as S, computed as f, ref as h, useSlots as U, onMounted as V, unref as o, createVNode as s, Fragment as a, createBlock as i, createElementBlock as _, openBlock as u, resolveDynamicComponent as N, mergeProps as P, withCtx as q, renderSlot as z, normalizeProps as F, guardReactiveProps as T } from "vue";
-import { Spin as O, Segmented as R } from "@aplus-frontend/antdv";
-import { omit as w, isFunction as c, isUndefined as A, isString as D, isNumber as E } from "lodash-unified";
+import { defineComponent as S, computed as c, ref as h, useSlots as U, onMounted as V, unref as o, createVNode as s, Fragment as a, createBlock as i, createElementBlock as _, openBlock as u, resolveDynamicComponent as N, mergeProps as P, withCtx as q, renderSlot as z, normalizeProps as F, guardReactiveProps as R } from "vue";
+import { Spin as T, Segmented as M } from "@aplus-frontend/antdv";
+import { omit as O, isFunction as f, isUndefined as w, isString as A, isNumber as D } from "lodash-unified";
 import "../../hooks/index.mjs";
-import M from "../hooks/use-options.mjs";
+import E from "../hooks/use-options.mjs";
 import { useControllableValue as $ } from "../../hooks/useControllableValue.mjs";
 const L = /* @__PURE__ */ S({
   name: "ApFieldSegmented",
@@ -16,6 +16,7 @@ const L = /* @__PURE__ */ S({
     emptyText: {
       default: "--"
     },
+    customReadMode: {},
     prefixCls: {},
     options: {},
     block: {
@@ -43,45 +44,45 @@ const L = /* @__PURE__ */ S({
   setup(v, {
     emit: y
   }) {
-    const t = v, g = f(() => w(t, ["onUpdate:value", "value", "defaultValue", "options"])), {
+    const t = v, g = c(() => O(t, ["onUpdate:value", "value", "defaultValue", "options"])), {
       options: p,
       updateOptions: b
-    } = M(t), k = y, {
+    } = E(t), k = y, {
       value: d,
       updateValue: x
     } = $(t, k), r = h(!1), B = U();
     V(() => {
-      c(t.request) && (r.value = !0, t.request().then((e) => b(e)).finally(() => {
+      f(t.request) && (r.value = !0, t.request().then((e) => b(e)).finally(() => {
         r.value = !1;
       }));
     });
-    const C = f(() => {
+    const C = c(() => {
       const e = o(d);
-      if (A(e))
+      if (w(e))
         return s(a, null, [t.emptyText]);
       const l = o(p)?.find((m) => m === e || m?.value === e);
-      if (D(l) || E(l))
+      if (A(l) || D(l))
         return s(a, null, [l]);
       const n = l?.label || B.label;
-      return c(n) ? s(a, null, [n?.({
+      return f(n) ? s(a, null, [n?.({
         ...l
       })]) : s(a, null, [n || t.emptyText]);
     });
-    return (e, l) => r.value ? (u(), i(o(O), {
+    return (e, l) => r.value ? (u(), i(o(T), {
       key: 0,
       size: "small"
     })) : (u(), _(a, {
       key: 1
     }, [e.mode === "read" ? (u(), i(N(C.value), {
       key: 0
-    })) : (u(), i(o(R), P({
+    })) : (u(), i(o(M), P({
       key: 1
     }, g.value, {
       value: o(d),
       options: o(p),
       "onUpdate:value": o(x)
     }), {
-      label: q((n) => [z(e.$slots, "label", F(T(n)))]),
+      label: q((n) => [z(e.$slots, "label", F(R(n)))]),
       _: 3
     }, 16, ["value", "options", "onUpdate:value"]))], 64));
   }