cnhis-design-vue 3.1.24-beta.7 → 3.1.24-beta.8

package/es/components/form-render/src/hooks/useFieldVisitor.js

@@ -0,0 +1,46 @@
+import { arrayed } from '../../../../shared/utils/index.js';
+import { isFunction } from '@vueuse/core';
+
+function useFieldVisitor() {
+  function matchFieldName(matcher, target) {
+    return matcher.split("|").some((m) => m.trim() === target);
+  }
+  function traverse(fieldList, visitorMap, key = "val_key") {
+    if (!visitorMap)
+      return fieldList;
+    return fieldList.reduce((fin, field) => {
+      if (Array.isArray(field.children)) {
+        field.children = traverse(field.children, visitorMap, key);
+      }
+      if (Array.isArray(field.properties)) {
+        field.properties = traverse(field.properties, visitorMap, key);
+      }
+      if (field.suffixConfig) {
+        field.suffixConfig = traverse(arrayed(field.suffixConfig), visitorMap, key);
+      }
+      const visitorKey = Object.keys(visitorMap).find((matcher) => {
+        return matchFieldName(matcher, field[key]);
+      });
+      const visitor = visitorKey && visitorMap[visitorKey];
+      let current = field;
+      const before = [];
+      const after = [];
+      isFunction(visitor) && visitor({
+        field,
+        replace(field2) {
+          current = field2;
+        },
+        insertBefore(field2) {
+          before.push(...arrayed(field2));
+        },
+        insertAfter(field2) {
+          after.push(...arrayed(field2));
+        }
+      });
+      return fin.concat([...before, current, ...after]);
+    }, []);
+  }
+  return { traverse };
+}
+
+export { useFieldVisitor };

package/es/components/form-render/src/hooks/useFormContext.d.ts

@@ -0,0 +1,11 @@
+import { Form } from '@formily/core';
+import { ShallowReactive } from 'vue';
+import { FormRenderProps } from '../../../../../es/components/form-render';
+export declare function useFormContext(props: ShallowReactive<FormRenderProps>, formModel: Form): {
+    asyncQueue: import("../../../../../es/components/form-render").FormAsyncQueue;
+    SchemaField: import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
+    businessCollector: import("../../../../../es/components/form-render").BusinessCollector;
+    changeContextCollector: import("../../../../../es/components/form-render").ContextCollector;
+    formItemDepsCollector: import("../../../../../es/components/form-render").FormItemDepsCollector;
+    formUUID: string;
+};

package/es/components/form-render/src/hooks/useFormContext.js

@@ -0,0 +1,68 @@
+import { uuidGenerator } from '../../../../shared/utils/index.js';
+import { isObject } from '@vue/shared';
+import { cloneDeep } from 'lodash-es';
+import { provide, computed, readonly } from 'vue';
+import { createSchemaField } from '@formily/vue';
+import '../../index.js';
+import components from '../components/renderer/index.js';
+import { useFormRenderLifeCycle } from './useFormRenderLifeCycle.js';
+import { usePresetScope } from './usePresetScope.js';
+import { injectOrProvide, presetRequestHandler } from '../utils/index.js';
+import { InjectionBusinessCollector, InjectionChangeContextCollector, InjectionFormItemDepsCollector, InjectionFormUUID, InjectionAnnotation, InjectAsyncQueue, InjectionSchemaField } from '../constants/index.js';
+import { useBusinessBinding } from './useBusinessBinding.js';
+import { useChangeContext } from './useChangeContext.js';
+import { useFormItemDeps } from './useFormItemDeps.js';
+import { useAsyncQueue } from './useAsyncQueue.js';
+
+function useFormContext(props, formModel) {
+  const { callLifeCycle } = useFormRenderLifeCycle(props);
+  const asyncQueue = injectOrProvide(
+    InjectAsyncQueue,
+    () => useAsyncQueue().create(props.parallelism, {
+      beforeRequest(...args) {
+        return callLifeCycle("beforeRequest", cloneDeep(args)) || args[1];
+      },
+      afterRequest(...args) {
+        return callLifeCycle("afterRequest", cloneDeep(args)) || presetRequestHandler(args[1]);
+      }
+    })
+  );
+  const SchemaField = injectOrProvide(
+    InjectionSchemaField,
+    () => createSchemaField({
+      components: { ...components, ...props.components },
+      scope: Object.assign({}, usePresetScope(), props.scope)
+    }).SchemaField
+  );
+  const businessCollector = useBusinessBinding().create(formModel, props.businessFormatter);
+  provide(InjectionBusinessCollector, businessCollector);
+  const changeContextCollector = useChangeContext().create();
+  provide(InjectionChangeContextCollector, changeContextCollector);
+  const formItemDepsCollector = useFormItemDeps().create();
+  provide(InjectionFormItemDepsCollector, formItemDepsCollector);
+  const formUUID = props.uuid || uuidGenerator();
+  provide(InjectionFormUUID, formUUID);
+  provide(
+    InjectionAnnotation,
+    computed({
+      get() {
+        return props.annotation ? readonly(props.annotation) : null;
+      },
+      set(payload) {
+        if (!isObject(props.annotation) || !isObject(payload))
+          return;
+        props.annotation[payload.property] = payload.value;
+      }
+    })
+  );
+  return {
+    asyncQueue,
+    SchemaField,
+    businessCollector,
+    changeContextCollector,
+    formItemDepsCollector,
+    formUUID
+  };
+}
+
+export { useFormContext };

package/es/components/form-render/src/hooks/useFormField.d.ts

@@ -0,0 +1,5 @@
+export declare function useFormField(): {
+    field: import("vue").Ref<import("@formily/core").GeneralField>;
+    title: import("vue").ComputedRef<any>;
+    fieldKey: import("vue").ComputedRef<string>;
+};

package/es/components/form-render/src/hooks/useFormField.js

@@ -0,0 +1,13 @@
+import { useField } from '@formily/vue';
+import { computed } from 'vue';
+
+function useFormField() {
+  const field = useField();
+  return {
+    field,
+    title: computed(() => field.value.title),
+    fieldKey: computed(() => field.value.props.name.toString())
+  };
+}
+
+export { useFormField };

package/es/components/form-render/src/hooks/useFormItemDeps.d.ts

@@ -0,0 +1,11 @@
+import { Func } from '../../../../../es/shared/types';
+import { DependKeyType } from '../../../../../es/components/form-render';
+export declare class FormItemDepsCollector {
+    private readonly collector;
+    setDeps(key: string, dependKeys: DependKeyType, callback: Func): void;
+    getDeps(dependKey: string): Map<string, Func<any[], any>> | undefined;
+    trigger(dependKey: string, payload?: unknown): void;
+}
+export declare function useFormItemDeps(): {
+    create: () => FormItemDepsCollector;
+};

package/es/components/form-render/src/hooks/useFormItemDeps.js

@@ -0,0 +1,31 @@
+import { isFunction } from 'lodash-es';
+import '../utils/index.js';
+import { traverseDependKey } from '../utils/schema.js';
+
+class FormItemDepsCollector {
+  constructor() {
+    this.collector = /* @__PURE__ */ new Map();
+  }
+  setDeps(key, dependKeys, callback) {
+    traverseDependKey(dependKeys, (dependKey) => {
+      const map = this.collector.get(dependKey) || /* @__PURE__ */ new Map();
+      map.set(key, callback);
+      this.collector.set(dependKey, map);
+    });
+  }
+  getDeps(dependKey) {
+    return this.collector.get(dependKey);
+  }
+  trigger(dependKey, payload) {
+    var _a;
+    (_a = this.getDeps(dependKey)) == null ? void 0 : _a.forEach((cb) => isFunction(cb) && cb(payload));
+  }
+}
+function useFormItemDeps() {
+  function create() {
+    return new FormItemDepsCollector();
+  }
+  return { create };
+}
+
+export { FormItemDepsCollector, useFormItemDeps };

package/es/components/form-render/src/hooks/useFormRenderLifeCycle.d.ts

@@ -0,0 +1,13 @@
+import { UndefinedAble } from '../../../../../es/shared/types';
+import { FormRenderLifeCycle, FormRenderProps } from '../../../../../es/components/form-render';
+export declare function useFormRenderLifeCycle(props: FormRenderProps): {
+    callLifeCycle: <T extends "onSetup" | "beforeRequest" | "afterRequest">(lifeCycleName: T, payload?: Parameters<Required<Partial<{
+        onSetup(): void;
+        beforeRequest(fieldKey: string, params?: import("../../../../../es/shared/types").AnyObject | undefined): void | UndefinedAble<import("../../../../../es/shared/types").AnyObject>;
+        afterRequest(fieldKey: string, payload?: any): import("../../../../../es/shared/types").AnyObject[];
+    }>>[T]> | undefined) => UndefinedAble<ReturnType<Required<Partial<{
+        onSetup(): void;
+        beforeRequest(fieldKey: string, params?: import("../../../../../es/shared/types").AnyObject | undefined): void | UndefinedAble<import("../../../../../es/shared/types").AnyObject>;
+        afterRequest(fieldKey: string, payload?: any): import("../../../../../es/shared/types").AnyObject[];
+    }>>[T]>>;
+};

package/es/components/form-render/src/hooks/useFormRenderLifeCycle.js

@@ -0,0 +1,10 @@
+import { isFunction } from 'lodash-es';
+
+function useFormRenderLifeCycle(props) {
+  function callLifeCycle(lifeCycleName, payload) {
+    return props.lifeCycle && isFunction(props.lifeCycle[lifeCycleName]) && props.lifeCycle[lifeCycleName].apply(void 0, payload || []);
+  }
+  return { callLifeCycle };
+}
+
+export { useFormRenderLifeCycle };

package/es/components/form-render/src/hooks/useFormRequest.d.ts

@@ -0,0 +1,19 @@
+import { Func, Nullable } from '../../../../../es/shared/types';
+import { FormRequestType } from '../../../../../es/components/form-render';
+declare type RequestInstance = Record<string, Func>;
+declare type SearchRequestInfo = {
+    method: FormRequestType;
+    url: string;
+    primaryKeyUrl?: string;
+};
+export declare function useFormRequest(): {
+    getHttpInstance: () => Nullable<RequestInstance>;
+    registGlobHttpInstance: (instance: RequestInstance) => void;
+    getSearchRequestInfo: () => {
+        method: FormRequestType;
+        url: string;
+        primaryKeyUrl?: string | undefined;
+    };
+    registGlobSearchInfo: (info: SearchRequestInfo) => void;
+};
+export {};

package/es/components/form-render/src/hooks/useFormRequest.js

@@ -0,0 +1,19 @@
+let http = null;
+const searchRequestInfo = { method: "post", url: "", primaryKeyUrl: "" };
+function useFormRequest() {
+  function getHttpInstance() {
+    return http;
+  }
+  function registGlobHttpInstance(instance) {
+    http = instance;
+  }
+  function getSearchRequestInfo() {
+    return { ...searchRequestInfo };
+  }
+  function registGlobSearchInfo(info) {
+    Object.assign(searchRequestInfo, info);
+  }
+  return { getHttpInstance, registGlobHttpInstance, getSearchRequestInfo, registGlobSearchInfo };
+}
+
+export { useFormRequest };

package/es/components/form-render/src/hooks/useFormValidator.d.ts

@@ -0,0 +1,6 @@
+import { AnyObject } from '../../../../../es/shared/types';
+import { FieldItem } from '../types';
+export declare function useFormValidator(): {
+    createValidatorSchema: (fieldItem: FieldItem) => AnyObject[];
+};
+export declare const validateMessageLocale: () => void;

package/es/components/form-render/src/hooks/useFormValidator.js

@@ -0,0 +1,84 @@
+import { arrayed } from '../../../../shared/utils/index.js';
+import { once, isString } from 'lodash-es';
+import '../utils/index.js';
+import { isFunction } from '@vueuse/core';
+import { registerValidateLocale } from '@formily/core';
+import { isIdCard } from '../utils/business.js';
+
+function useFormValidator() {
+  const validateMap = /* @__PURE__ */ new Map([
+    ["mobile", ({ validate }) => ({ format: "phone", message: validate == null ? void 0 : validate.message })],
+    ["integer", ({ validate }) => ({ format: "integer", message: validate == null ? void 0 : validate.message })],
+    ["number", ({ validate }) => ({ format: "number", message: validate == null ? void 0 : validate.message })],
+    [
+      "id_card",
+      ({ validate }) => ({
+        validator(value) {
+          var _a;
+          if (value == null)
+            return;
+          if (!isString(value) || !isIdCard(value))
+            return (_a = validate == null ? void 0 : validate.message) != null ? _a : "\u8BE5\u5B57\u6BB5\u4E0D\u662F\u5408\u6CD5\u7684\u8EAB\u4EFD\u8BC1\u683C\u5F0F";
+        }
+      })
+    ],
+    [
+      "regular",
+      ({ validate, regular_expression, regular_error_tip }) => {
+        const pattern = regular_expression || (validate == null ? void 0 : validate.regular_expression) || "";
+        const message = regular_error_tip || (validate == null ? void 0 : validate.regular_error_tip) || (validate == null ? void 0 : validate.message) || "\u683C\u5F0F\u9519\u8BEF";
+        return { pattern, message };
+      }
+    ]
+  ]);
+  const commonValidateConfig = { triggerType: "onBlur" };
+  const createDecimalValidator = (decimal, message) => {
+    const errorMessage = message != null ? message : `\u5C0F\u6570\u4F4D\u6570\u6700\u591A${decimal}\u4F4D`;
+    return {
+      validator(value) {
+        var _a;
+        return ((_a = String(value).split(".")[1]) == null ? void 0 : _a.length) > decimal ? errorMessage : "";
+      }
+    };
+  };
+  function createValidatorSchema(fieldItem) {
+    const rules = [];
+    const {
+      defined_error_msg,
+      validate: { vali_obj, max_length, min_length, message, max_value, min_value, decimal_length } = {},
+      validator
+    } = fieldItem;
+    if (validator) {
+      arrayed(validator).forEach((f) => {
+        if (!isFunction(f))
+          return;
+        rules.push({ validator: (value) => f(value, fieldItem) });
+      });
+    }
+    if (max_length)
+      rules.push({ max: max_length, message });
+    if (min_length)
+      rules.push({ min: min_length, message });
+    if (max_value)
+      rules.push({ maximum: max_value, message });
+    if (min_value)
+      rules.push({ minimum: min_value, message });
+    if (decimal_length != null)
+      rules.push(createDecimalValidator(+decimal_length, message));
+    if (vali_obj) {
+      const ruleCreator = validateMap.get(vali_obj) || (({ validate }) => ({ format: vali_obj, message: validate == null ? void 0 : validate.message }));
+      rules.push(Object.assign({}, commonValidateConfig, ruleCreator(fieldItem)));
+    }
+    return rules;
+  }
+  return { createValidatorSchema };
+}
+const validateMessageLocale = once(() => {
+  registerValidateLocale({
+    "zh-CN": {
+      required: "${alias}\u4E3A\u5FC5\u586B"
+    }
+  });
+});
+
+export { useFormValidator, validateMessageLocale };

package/es/components/form-render/src/hooks/useNuiThemeOverrides.d.ts

@@ -0,0 +1,4 @@
+import { GlobalThemeOverrides } from 'naive-ui';
+export declare function useNuiThemeOverrides(): {
+    nuiThemeOverrides: GlobalThemeOverrides;
+};

package/es/components/form-render/src/hooks/useNuiThemeOverrides.js

@@ -0,0 +1,18 @@
+function useNuiThemeOverrides() {
+  const nuiThemeOverrides = {
+    Input: { paddingMedium: "8px", paddingSmall: "8px", paddingLarge: "8px", paddingTiny: "8px" },
+    InternalSelection: { paddingSingle: "8px", paddingMultiple: "2px" },
+    Form: {
+      feedbackHeightMedium: "16px",
+      feedbackHeightLarge: "16px",
+      feedbackHeightSmall: "16px",
+      feedbackFontSizeLarge: "12px",
+      feedbackFontSizeMedium: "12px",
+      feedbackFontSizeSmall: "12px",
+      feedbackPadding: "0px"
+    }
+  };
+  return { nuiThemeOverrides };
+}
+
+export { useNuiThemeOverrides };

package/es/components/form-render/src/hooks/usePresetScope.d.ts

@@ -0,0 +1,6 @@
+export declare function usePresetScope(): {
+    isIdCard(value: unknown): boolean;
+    isMobile(value: unknown): boolean;
+    isEmail(value: unknown): boolean;
+    isNumber(value: unknown): boolean;
+};

package/es/components/form-render/src/hooks/usePresetScope.js

@@ -0,0 +1,22 @@
+import { isString } from 'lodash-es';
+import '../utils/index.js';
+import { isIdCard, isMobile } from '../utils/business.js';
+
+function usePresetScope() {
+  return {
+    isIdCard(value) {
+      return isString(value) && isIdCard(value);
+    },
+    isMobile(value) {
+      return isString(value) && isMobile(value);
+    },
+    isEmail(value) {
+      return isString(value) && /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value);
+    },
+    isNumber(value) {
+      return isString(value) && /\d+/.test(value);
+    }
+  };
+}
+
+export { usePresetScope };

package/es/components/form-render/src/types/fieldItem.d.ts

@@ -0,0 +1,248 @@
+import { AnyObject, ArrayAble } from '../../../../../es/shared/types';
+import { SchemaEffectTypes, SchemaTypes } from '@formily/vue';
+import { CSSProperties, VNode } from 'vue';
+import { DependKeyType, FormCommonState, FormRequestType } from '../../../../../es/components/form-render';
+export * from '@formily/core';
+declare type FieldBusinessType = 'password' | 'id_card' | 'age' | 'age_unit' | 'mobile' | 'telephone' | 'email' | 'sex' | 'birthday' | 'bank_card' | 'website' | 'gestational_weeks' | 'gestational_stage' | 'customer_name';
+export declare type ValidateItem = Partial<{
+    /**
+     * 业务类型
+     */
+    obj_type: FieldBusinessType;
+    /**
+     * 校验类型
+     */
+    vali_obj: string;
+    max_value: string | number;
+    min_value: string | number;
+    min_length: string | number;
+    max_length: string | number;
+    decimal_length: string | number;
+    regular_expression: RegExp | string;
+    regular_error_tip: string;
+    [key: string]: any;
+}>;
+interface OptionItem {
+    text: string;
+    value: any;
+    keyword?: string;
+    children?: OptionItem[];
+}
+interface FormRendererPayload {
+    clearable: boolean;
+    disabled: boolean;
+    fieldItem: FieldItem;
+    readOnly: boolean;
+    value: unknown;
+}
+export interface FormRenderer {
+    (payload: FormRendererPayload): ArrayAble<VNode> | any;
+}
+export declare type UrlConfig = {
+    url: string;
+} & Partial<{
+    method?: FormRequestType;
+    nameKey?: string;
+    valueKey?: string;
+    params?: AnyObject;
+    dependKey?: DependKeyType;
+}>;
+interface SwitchProperty {
+    value?: any;
+    describe?: string;
+}
+interface ReactionType {
+    dependencies?: string[];
+    target?: string;
+    effects?: SchemaEffectTypes[];
+    when?: string | boolean;
+    fulfill?: {
+        state?: AnyObject;
+        run?: string;
+    };
+    otherwise?: {
+        state?: AnyObject;
+        run?: string;
+    };
+    [key: string]: any;
+}
+export declare type FormWordbook = Partial<{
+    level_num: number;
+    id: string;
+    name: string;
+    render_key: string[];
+    search_key: string[];
+    primary_key: string;
+    type: string;
+    value_key: string;
+    level_key: string;
+    link_key: string;
+    link_key_split: string;
+    show_key: string[];
+    conObj: AnyObject[];
+    conObjFirstLevel: AnyObject[];
+}>;
+export declare type FieldItem = {
+    /**
+     * 字段的key
+     */
+    val_key: string;
+    /**
+     * 控件类型
+     */
+    html_type: string;
+} & Partial<{
+    /**
+     * 是否开启批注(需要先在表单维度开启)
+     */
+    annotation: boolean;
+    /**
+     * 定制化字段, AGE类型控件时的单位字段
+     */
+    val_key_unit: string;
+    /**
+     * 是否允许编辑('1'为允许编辑)
+     */
+    is_edit: FormCommonState;
+    /**
+     * 控件在栅栏系统中的的宽度值, 默认为3
+     */
+    elem_width: number;
+    /**
+     * 是否展示('1'为展示)
+     */
+    is_show: FormCommonState;
+    /**
+     * 是否允许为空('1'为允许为空)
+     */
+    is_null: FormCommonState;
+    /**
+     * 字段label
+     */
+    name: string;
+    /**
+     * 字段label(优先级比name高)
+     */
+    alias: string;
+    /**
+     * 默认值
+     */
+    default_val: any;
+    /**
+     * 是否开启清空功能('0'表示开启)
+     */
+    is_empty: FormCommonState;
+    /**
+     * 是否隐藏label('1'表示隐藏)
+     */
+    hide_title: FormCommonState;
+    placeholder: string;
+    validate: ValidateItem;
+    option: OptionItem[];
+    /**
+     * 是否开启多选('0'表示开启, 值是反的)
+     */
+    multi_select: FormCommonState;
+    /**
+     * 多选时最大选择数量
+     */
+    multi_select_value: number | string;
+    /**
+     * 1.用于CASCADER控件提供层级参数
+     * 2.用于SEARCH控件提供字段信息
+     */
+    wordbook: FormWordbook;
+    /**
+     * switch控件,开启状态参数
+     */
+    open: SwitchProperty;
+    /**
+     * switch控件,关闭状态参数
+     */
+    close: SwitchProperty;
+    /**
+     * date控件value格式
+     */
+    date_format: string;
+    /**
+     * slider控件间距
+     */
+    step_length: string | number;
+    urlConfig: UrlConfig;
+    /**
+     * 控件组
+     */
+    suffixConfig: ArrayAble<FieldItem>;
+    /**
+     * 数据源签名
+     */
+    autograph: string;
+    /**
+     * 合并错误信息
+     */
+    defined_error_msg: string;
+    /**
+     * 数据类型
+     */
+    fieldType: SchemaTypes;
+    /**
+     * BUTTON/TEXT控件内容
+     */
+    content: string | FormRenderer | Record<string, FormRenderer>;
+    /**
+     * 用于控制是否启用请求的懒执行
+     */
+    lazyRequest: boolean;
+    /**
+     * 用于控制请求是否开启缓存
+     */
+    requestCache: boolean;
+    /**
+     * COMBINATION控件最大表单组数量
+     */
+    maxGroupNum: number;
+    /**
+     * COMBINATION json format
+     */
+    jsonCombination: boolean;
+    /**
+     * COMBINATION控件子项
+     */
+    children: FieldItem[];
+    /**
+     * 子项
+     */
+    properties: FieldItem[];
+    /**
+     * 控件额外的props
+     */
+    componentProps: AnyObject;
+    /**
+     * FormItem额外的props
+     */
+    decoratorProps: AnyObject;
+    /**
+     * 是否不使用decorator组件(n-form-item)
+     */
+    noDecorator: Boolean;
+    /**
+     * COMPLEX控件布局类型
+     */
+    display: 'grid' | 'flex';
+    /**
+     * COMPLEX控件额外样式
+     */
+    wrapperStyle: CSSProperties | Record<string, string>;
+    /**
+     * 自定义校验规则
+     * @param value 表单当前控件的值
+     * @param fieldItem 配置参数
+     * @return {void|string} 返回校验信息
+     */
+    validator: (value: unknown, fieldItem: FieldItem) => void | string;
+    /**
+     * 表单联动配置
+     */
+    reactions: ArrayAble<ReactionType>;
+    [key: string]: any;
+}>;

package/es/components/form-render/src/types/fieldItem.js

@@ -0,0 +1 @@
+export * from '@formily/core';