@carefrees/form-utils-vue 0.0.8

package/lib/hooks/attr/attr.FormItem.js

@@ -0,0 +1,120 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const formUtils = require("@carefrees/form-utils");
+const useHtmlFor = require("../useHtmlFor.js");
+const register_FormItem = require("../register/register.FormItem.js");
+const vue = require("vue");
+const useFormItemAttr = (options) => {
+  const {
+    trigger = "onChange",
+    dependencies,
+    noticeOnlyRuleDataField,
+    isNoticeParentField,
+    noticeWatchField,
+    preserve,
+    valuePropName = "value",
+    getValuePath = valuePropName,
+    getValueFromEvent,
+    formatValue,
+    onAfterUpdate,
+    useAttrs,
+    useRules,
+    inputAttrs,
+    ...rest
+  } = options;
+  const {
+    formItemInstance,
+    form,
+    ruleInstance,
+    newName,
+    newSort,
+    deepRefData
+  } = register_FormItem.useRegisterFormItem({
+    ...rest
+  });
+  formItemInstance.dependencies = dependencies;
+  formItemInstance.noticeOnlyRuleDataField = noticeOnlyRuleDataField;
+  formItemInstance.isNoticeParentField = isNoticeParentField;
+  formItemInstance.onAfterUpdate = onAfterUpdate;
+  formItemInstance.noticeWatchField = noticeWatchField;
+  formItemInstance.preserve = preserve;
+  const oldValue = vue.ref(formUtils.get(form.formData, vue.toValue(newName)));
+  vue.watch(() => [formUtils.get(form.formData, vue.toValue(newName)), vue.toValue(newName)], () => {
+    oldValue.value = form.getFieldValue(newName.value);
+  }, {
+    immediate: true
+  });
+  const onValueChange = (event) => {
+    var _a;
+    try {
+      let value = event;
+      if (typeof getValueFromEvent === "function") {
+        value = getValueFromEvent(event, form, formItemInstance);
+      } else if (event && event.target && typeof event.target === "object" && getValuePath in event.target) {
+        value = formUtils.get(event.target, getValuePath);
+      }
+      if (typeof formatValue === "function") {
+        value = formatValue(value, form, formItemInstance, event);
+      }
+      if (oldValue.value !== value) {
+        form.updatedFieldValue(newName.value, value, "validate");
+        (_a = formItemInstance.onAfterUpdate) == null ? void 0 : _a.call(formItemInstance, value, form, formItemInstance, event);
+        if (Array.isArray(formItemInstance.noticeWatchField) && formItemInstance.noticeWatchField.length) {
+          form.noticeWatch(formItemInstance.noticeWatchField);
+        }
+        if (Array.isArray(formItemInstance.noticeOnlyRuleDataField) && formItemInstance.noticeOnlyRuleDataField.length) {
+          form.onlyValidate(formItemInstance.noticeOnlyRuleDataField);
+        }
+        if (formItemInstance.isNoticeParentField && formItemInstance.parentDataField) {
+          form.notice(formItemInstance.parentDataField);
+        }
+      }
+    } catch (error) {
+      console.log(error);
+    }
+  };
+  formItemInstance.onChange = onValueChange;
+  const htmlFor = useHtmlFor.useHtmlFor(newName);
+  vue.watch(() => htmlFor, () => {
+    formItemInstance.htmlFor = htmlFor.value;
+  }, {
+    immediate: true
+  });
+  const newAttrs = vue.computed(() => {
+    const _attr = inputAttrs || {};
+    return {
+      ..._attr,
+      [trigger]: onValueChange,
+      name: vue.toValue(newName),
+      id: vue.toValue(htmlFor),
+      [valuePropName]: vue.toValue(oldValue)
+    };
+  });
+  const attrsLastData = vue.ref(vue.toValue(newAttrs));
+  vue.watch(() => [vue.toValue(newAttrs), vue.toValue(deepRefData), vue.toValue(oldValue)], () => {
+    attrsLastData.value = (useAttrs == null ? void 0 : useAttrs(newAttrs.value, form, formItemInstance)) || newAttrs.value;
+  }, {
+    immediate: true
+  });
+  const validateResult = vue.ref(ruleInstance.value.getValidateResult());
+  vue.watch(() => [vue.toValue(deepRefData), vue.toValue(oldValue)], () => {
+    useRules == null ? void 0 : useRules(ruleInstance.value, form, formItemInstance);
+  });
+  vue.watch(() => [ruleInstance.value.messages, ruleInstance.value.rules, vue.toValue(oldValue)], () => {
+    validateResult.value = ruleInstance.value.getValidateResult();
+  });
+  return {
+    valuePropName,
+    htmlFor,
+    onChange: onValueChange,
+    formItemInstance,
+    form,
+    ruleInstance,
+    newAttrs,
+    attrsLastData,
+    validateResult,
+    newSort,
+    newName
+  };
+};
+exports.useFormItemAttr = useFormItemAttr;

package/lib/hooks/index.d.ts

@@ -0,0 +1,13 @@
+export * from './useAttrs';
+export * from './useForm';
+export * from './useFormItem';
+export * from './useFormList';
+export * from './useHtmlFor';
+export * from './useMultipleForm';
+export * from './useFormItemParentName';
+export * from './useEffect';
+export * from './register/register.FormHideItem';
+export * from './register/register.FormItem';
+export * from './register/register.FormList';
+export * from './register/register.form';
+export * from './attr/attr.FormItem';

package/lib/hooks/register/register.FormHideItem.d.ts

@@ -0,0 +1,9 @@
+import { RegisterFormItemOptions } from './register.FormItem';
+interface RegisterFormHideItemOptions extends Omit<RegisterFormItemOptions, 'rules'> {
+}
+/**注册表单隐藏表单项到表单实例中*/
+export declare const useRegisterFormHideItem: (options: RegisterFormHideItemOptions) => {
+    form: import('@carefrees/form-utils').FormInstanceBase<any>;
+    isHide: import('vue').Ref<any, any>;
+};
+export {};

package/lib/hooks/register/register.FormHideItem.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const formUtils = require("@carefrees/form-utils");
+const useFormItemParentName = require("../useFormItemParentName.js");
+const useForm = require("../useForm.js");
+const useEffect = require("../useEffect.js");
+const useRegisterFormHideItem = (options) => {
+  const { name, sort, isJoinParentField = true } = options;
+  const form = useForm.useFormInject();
+  const { newName, newSort } = useFormItemParentName.useFormItemParentNameInject({ name, sort, isJoinParentField });
+  const hideItemInstance = vue.ref(new formUtils.FormHideItemInstanceBase().ctor(newName.value));
+  const isHide = vue.ref(form.getFieldHideValue(newName.value));
+  vue.watch(
+    [isHide.value],
+    () => {
+      hideItemInstance.value.preHideValue = isHide.value;
+    },
+    { immediate: true }
+  );
+  const setValue = () => {
+    isHide.value = form.getFieldHideValue(newName.value);
+  };
+  hideItemInstance.value.updatedItem = setValue;
+  vue.watch(
+    [form, newSort.value],
+    () => {
+      hideItemInstance.value.instance = form;
+      hideItemInstance.value.sort = newSort.value;
+    },
+    { immediate: true }
+  );
+  useEffect.useEffect(() => {
+    return form.registerFormHideItem(hideItemInstance.value);
+  });
+  return { form, isHide };
+};
+exports.useRegisterFormHideItem = useRegisterFormHideItem;