@aplus-frontend/ui
Version:
253 lines (252 loc) • 6.84 kB
JavaScript
import { defineComponent as ee, reactive as te, shallowRef as re, ref as oe, unref as h, nextTick as ne, toRaw as P, watch as ie, onWatcherCleanup as le, computed as se, createBlock as ae, openBlock as ue, mergeProps as ce, withCtx as fe, renderSlot as de } from "vue";
import { Form as ge } from "@aplus-frontend/antdv";
import { useProvideForm as me } from "./context.mjs";
import { isArray as f, cloneDeep as pe, isEqual as he, isFunction as R, isPlainObject as M, omit as Fe } from "lodash-unified";
import { useUrlSearchParams as ye } from "@vueuse/core";
import { INTERNAL_FORM_INSTANCE_MARK as O } from "./constant.mjs";
import { getRouteType as Te } from "../utils/index.mjs";
import Ve from "./utils/set.mjs";
import { genParams as B, setToParams as j } from "./utils/params.mjs";
import { useInjectFormProvider as ve } from "./provider/context.mjs";
import { getModelValue as x } from "./utils/get.mjs";
import { useDevWarning as Ce } from "../utils/warning.mjs";
import { isDef as T } from "../utils/is.mjs";
const xe = /* @__PURE__ */ ee({
name: "ApForm",
__name: "ap-form",
props: {
layout: { default: "horizontal" },
labelCol: {},
wrapperCol: {},
colon: { type: Boolean, default: !0 },
labelAlign: { default: "right" },
labelWrap: { type: Boolean },
prefixCls: {},
requiredMark: {},
hideRequiredMark: { type: Boolean, default: !1 },
rules: {},
validateMessages: {},
validateOnRuleChange: { type: Boolean, default: !0 },
scrollToFirstError: {},
onSubmit: {},
name: {},
validateTrigger: { default: "change" },
size: {},
disabled: { type: Boolean },
onFieldsChange: {},
onFinish: {},
onFinishFailed: {},
onValidate: {},
variant: {},
initialValues: {},
onValuesChange: {},
syncToUrl: { type: [Boolean, Function], default: !1 },
syncToUrlPriority: { type: Boolean }
},
setup(W, { expose: N }) {
const n = W;
function V(e, t, r = !0, o) {
if (f(e)) {
let i = l;
for (let u = 0; u < e.length - 1; u++)
e[u] in i || (i[e[u]] = {}), i = i[e[u]];
o ? o(i, e[e.length - 1]) : i[e[e.length - 1]] = t;
} else
o ? o(l, e) : l[e] = t;
let a = f(e) ? e[0] : e;
if (r) {
const i = { [a]: l[a] };
F.triggerFormChange(n.name, i), n.onValuesChange?.(i, l, e);
}
y();
}
const s = re(), v = ye(Te()), F = ve(), S = Ce("ApForm"), C = oe(
n.syncToUrl ? B(n.syncToUrl, v, "get") : {}
);
let d = pe(_()), g = {};
const l = te(_());
let m = [];
function _() {
const e = n.initialValues || {};
return n.syncToUrlPriority ? {
...e,
...h(C)
} : {
...h(C),
...e
};
}
function q(e) {
const t = p(e, g);
F.triggerFormFinish(n.name, e), n.syncToUrl && j(v, B(n.syncToUrl, t, "set")), n.onFinish?.(t);
}
const D = async () => {
s.value?.resetFields(), await ne(() => {
Object.keys(l).forEach((e) => delete l[e]), Object.assign(l, d), y(), n.syncToUrl && j(
v,
B(
n.syncToUrl,
p(d, g),
"set"
)
);
});
}, K = (e) => {
s.value?.clearValidate(e);
}, L = (e, t) => s.value?.validateFields(e, t), $ = async (e, t) => {
const r = await s.value?.validateFields(
e,
t
);
return p(r, g);
}, b = (e) => e === !0 ? P(l) : s.value?.getFieldsValue(e), k = (e) => {
const t = b(e);
return p(t, g);
}, G = (e, t) => s.value?.validate(e, t), H = (e, t = {}) => {
s.value?.scrollToField(e, t);
}, J = (e) => {
Object.assign(l, e), y();
}, I = (e, t, r = !0, o) => {
V(e, t, r, o), y();
};
function U(e) {
return e(P(l)), m.push(e), () => {
m = m.filter((t) => t !== e);
};
}
function Q(e, t) {
if (f(e)) {
let r = d;
for (let o = 0; o < e.length - 1; o++)
T(r[e[o]]) || (r[e[o]] = {}), r = r[e[o]];
r[e[e.length - 1]] = t;
} else
d[e] = t;
}
function X(e, t) {
if (!T(e) || !T(t))
return;
const r = x(d, t);
if (he(r, e))
return;
const o = x(h(C), t);
T(o) && n.syncToUrlPriority || (V(t, e, !1), Q(t, e));
}
function Y(e, t) {
t && (g = Ve(
g,
[e].flat(1),
t,
!0
));
}
function w({ initialValue: e, name: t, transform: r }) {
X(e, t), Y(t, r);
}
function A() {
return d;
}
function Z(e) {
if (S(
e === O,
"usage",
"getInternalInstance should only used at internal"
), e === O)
return {
registerField: w,
registerWatch: U,
setFieldValue: I,
getInitialValues: A
};
}
function y() {
if (m.length) {
const e = P(l);
m.forEach((t) => {
t(e);
});
}
}
function p(e, t) {
if (e == null)
return;
let r = f(e) ? [] : {};
return Object.keys(e).forEach((o) => {
const a = e[o], i = t?.[o], u = R(i) ? i : i?.transformer, z = R(i) ? !0 : i?.flat;
if (R(u)) {
const c = u(a);
z ? f(c) && f(r) ? r = [...r, ...c] : M(c) && M(r) ? r = {
...r,
...c
} : r[o] = c : r[o] = c;
} else if (M(a) || f(a)) {
const c = p(
a,
i
);
r[o] = c;
} else
r[o] = a;
}), r;
}
const E = {
resetFields: D,
clearValidate: K,
validateFields: L,
getFieldsValue: b,
validate: G,
scrollToField: H,
setFieldsValue: J,
setFieldValue: I,
registerWatch: U,
validateFieldsReturnTransformed: $,
getFieldsValueTransformed: k,
getInternalInstance: Z
};
return ie(
() => n.name,
(e) => {
e && (F.registerForm(e, E), le(() => {
F.unregisterForm(n.name);
}));
},
{
immediate: !0
}
), me({
model: se(() => l),
updateModel: V,
internalInstance: {
registerWatch: U,
registerField: w,
setFieldValue: I,
getInitialValues: A
}
}), N(E), (e, t) => (ue(), ae(h(ge), ce(
{
ref_key: "formRef",
ref: s
},
h(Fe)(n, [
"initialValues",
"onValuesChange",
"onFinish",
"syncToUrl",
"syncToUrlPriority"
]),
{
model: l,
"data-form-name": e.name,
onFinish: q
}
), {
default: fe(() => [
de(e.$slots, "default")
]),
_: 3
}, 16, ["model", "data-form-name"]));
}
});
export {
xe as default
};