yanzhen-design-vue
Version:
86 lines (85 loc) • 2.93 kB
JavaScript
import { computed, unref, useSlots, createVNode, mergeProps, withCtx } from "vue";
import { toArray, pick, mergeWith, flattenDeep, isBoolean, isFunction } from "lodash-es";
import { isEmptyValue } from "@yanzhen-libs/utils";
import { useProxyProps } from "@yanzhen-libs/utils-vue";
import "../../form/index.mjs";
import { AntFormItem } from "./form-item.mjs";
import "./form-item.vue.mjs";
import { useProvideFormItemGroupContext } from "./hooks/form-item-group-context.mjs";
import { useInjectForm } from "../../form/src/hooks/use-form.mjs";
import _sfc_main from "./form-item.vue2.mjs";
function useFormItemGroup(props, emit, expose) {
const namesRef = computed(() => {
return toArray(isEmptyValue(props.name) ? [] : props.name);
});
const injectForm = useInjectForm("ctx");
const validateInfosRef = computed(() => {
var _a;
const names = unref(namesRef);
return pick(((_a = unref(injectForm)) == null ? void 0 : _a.validateInfos) ?? props.validateInfos, ...names);
});
const errorInfos = computed(() => {
const names = unref(namesRef);
const validateInfos = unref(validateInfosRef);
const errors = toArray(pick(validateInfos, ...names));
const errorInfos2 = {};
for (const errorInfo of errors) {
mergeWith(errorInfos2, errorInfo, (objValue, srcValue, key) => {
switch (key) {
case "help":
return flattenDeep([objValue].concat(srcValue)).filter((value) => value);
}
switch (true) {
case isBoolean(objValue):
case isBoolean(srcValue):
return [objValue, srcValue].includes(true);
}
return [objValue, srcValue].includes("error") ? "error" : srcValue ?? objValue;
});
}
return errorInfos2;
});
useProvideFormItemGroupContext({
id: namesRef,
async onFieldChange(name) {
var _a;
name && ((_a = unref(injectForm)) == null ? void 0 : _a.validate(name));
},
onFieldBlur(name) {
var _a;
name && ((_a = unref(injectForm)) == null ? void 0 : _a.validate(name));
},
clearValidate(name) {
var _a;
name && ((_a = unref(injectForm)) == null ? void 0 : _a.clearValidate(name));
}
});
const slots = useSlots();
function renderFormItemList() {
if (isFunction(slots.default)) {
const VNodes = slots.default({
validateInfos: unref(validateInfosRef),
errorInfos: unref(errorInfos)
});
console.log(VNodes, "VNodes");
return VNodes;
}
}
const config = computed(() => pick(props, ...Object.keys(AntFormItem.props)));
const _props = useProxyProps(config, AntFormItem.emits, {
emit,
exclude: ["name", "rules"],
filter: true
});
return [
{ _props },
() => {
return createVNode(_sfc_main, mergeProps(unref(_props), unref(errorInfos)), {
default: withCtx(renderFormItemList)
});
}
];
}
export {
useFormItemGroup
};