@aplus-frontend/ui
Version:
186 lines (185 loc) • 5.43 kB
JavaScript
import { defineComponent as D, useSlots as L, ref as c, onMounted as _, computed as M, unref as l, cloneVNode as $, createBlock as b, openBlock as v, mergeProps as j, createSlots as q, withCtx as a, resolveDynamicComponent as E, renderList as K, createElementVNode as O, normalizeClass as Q, createVNode as d, normalizeStyle as U, renderSlot as Y, normalizeProps as G, guardReactiveProps as H } from "vue";
import { Form as J, Tooltip as W, TypographyText as X } from "@aplus-frontend/antdv";
import { useToken as Z } from "@aplus-frontend/antdv/es/theme/internal";
import { isFunction as y, cloneDeep as ee, isArray as oe, omit as F } from "lodash-unified";
import { apFormItemColPropKeys as le } from "../constant.mjs";
import { QuestionCircleOutlined as te } from "@ant-design/icons-vue";
import "../../config-provider/index.mjs";
import { useInjectForm as re } from "../context.mjs";
import { isPromise as ae } from "@fruits-chain/utils";
import { getValidVNodeList as ne } from "../../utils/slot.mjs";
import { useNamespace as ie } from "../../config-provider/hooks/use-namespace.mjs";
const Ve = /* @__PURE__ */ D({
name: "ApFormItem",
__name: "index",
props: {
htmlFor: {},
prefixCls: {},
label: {},
help: {},
extra: {},
labelCol: {},
wrapperCol: {},
hasFeedback: { type: Boolean, default: !1 },
colon: { type: Boolean, default: void 0 },
labelAlign: {},
prop: {},
name: {},
rules: {},
autoLink: { type: Boolean, default: !0 },
required: { type: Boolean, default: void 0 },
validateFirst: { type: Boolean, default: void 0 },
validateStatus: {},
validateTrigger: {},
messageVariables: {},
hidden: { type: Boolean },
noStyle: { type: Boolean },
tooltip: {},
span: {},
order: {},
offset: {},
push: {},
pull: {},
xs: {},
sm: {},
md: {},
lg: {},
xl: {},
xxl: {},
flex: {},
bordered: { type: Boolean, default: !1 },
valuePropName: { default: "value" },
initialValue: {},
_signal: {},
transform: {},
description: {},
customFilled: {},
disabled: { type: Boolean }
},
setup(V, { expose: g }) {
const e = V, u = L(), { model: m, updateModel: B, internalInstance: h } = re(), { m: i, b: C } = ie("ap-form-item"), s = c(!1), r = c(), [, k] = Z();
_(async () => {
let o = y(e.initialValue) ? e.initialValue() : e.initialValue;
ae(o) && (o = await o), h?.registerField({
name: e.name,
initialValue: ee(o),
transform: e.transform
});
});
const f = M(() => e.name ? oe(e.name) ? e.name.reduce((o, t) => o?.[t], l(m)) : m?.value[e.name] : null);
function x() {
const o = u.default?.() || [];
if (!e.name)
return o[0];
const t = ne(o)[0];
return t ? $(t, {
[e.valuePropName]: l(f),
[`onUpdate:${e.valuePropName}`]: N,
variant: e.bordered ? "borderless" : t?.props?.variant,
bordered: e.bordered ? !1 : t?.props?.bordered,
onFocus: P,
onBlur: I
}) : null;
}
function N(o) {
B?.(e.name, o);
}
function P() {
s.value = !0;
}
function I() {
s.value = !1;
}
function S() {
r.value?.onFieldBlur();
}
function T() {
r.value?.onFieldChange();
}
function w() {
r.value?.clearValidate();
}
function z() {
r.value?.resetField();
}
function R(o = !1) {
const t = l(f);
if (!o || !e.transform)
return t;
const n = y(e.transform) ? e.transform : e.transform.transformer;
return e.transform ? n(t) : t;
}
return g({
onFieldBlur: S,
onFieldChange: T,
clearValidate: w,
resetField: z,
getFieldValue: R
}), (o, t) => (v(), b(l(J).Item, j(
{
ref_key: "formItemRef",
ref: r
},
l(F)(e, [...l(le), "tooltip", "label", "description"]),
{
class: {
[l(i)("bordered")]: o.bordered,
[l(i)("focused")]: o.bordered && s.value,
[l(i)("disabled")]: o.bordered && o.disabled,
[l(C)()]: !0
},
colon: o.bordered ? !1 : e.colon
}
), q({
default: a(() => [
(v(), b(E(x())))
]),
_: 2
}, [
e.tooltip ? {
name: "tooltip",
fn: a(({ class: n }) => [
O("span", {
class: Q(n)
}, [
d(l(W), {
title: e.tooltip
}, {
default: a(() => [
d(l(te), {
style: U({
color: l(k).colorTextTertiary,
fontSize: "14px",
transform: "translateY(1px)"
})
}, null, 8, ["style"])
]),
_: 1
}, 8, ["title"])
], 2)
]),
key: "0"
} : void 0,
o.label ? {
name: "label",
fn: a(() => [
d(l(X), {
content: o.label,
ellipsis: { tooltip: o.label },
style: { "min-width": "0px", flex: "1" }
}, null, 8, ["content", "ellipsis"])
]),
key: "1"
} : void 0,
K(l(F)(u, "default"), (n, p) => ({
name: p,
fn: a((A) => [
Y(o.$slots, p, G(H(A || {})))
])
}))
]), 1040, ["class", "colon"]));
}
});
export {
Ve as default
};