cnhis-design-vue 3.1.14-beta.14 → 3.1.14-beta.17

package/es/packages/form-render/src/components/renderer/combination.js

@@ -1,4 +1,7 @@
-import { defineComponent, ref, createVNode, createTextVNode, toRaw } from 'vue';
+import { defineComponent, ref, computed, watch, onMounted, createVNode, createTextVNode } from 'vue';
+import { isField } from '@formily/core';
+import { Path } from '../../../../../node_modules/@formily/path/esm/index.js';
+import { isNumber } from 'lodash-es';
 import { assignUpdateValue, formRenderLog } from '../../utils/index.js';
 import { connect, mapProps } from '@formily/vue';
 import { useDebounceFn, isObject } from '@vueuse/core';
@@ -15,6 +18,9 @@ const script = defineComponent({
     value: {
       type: String
     },
+    maxGroupNum: {
+      type: Number
+    },
     getProperties: {
       type: Function,
       default: () => []
@@ -27,17 +33,34 @@ const script = defineComponent({
     const emitChange = useDebounceFn(function emitChange2() {
       emit("update:value", JSON.stringify(_values.value));
     }, 300);
-    const combinationRepeat = ref(1);
+    const formRenderRefs = ref([]);
+    const groupNum = ref(1);
+    const maxGroupNum = computed(() => {
+      if (!isNumber(props.maxGroupNum))
+        return Infinity;
+      if (props.maxGroupNum < 1)
+        return 0;
+      return ~~props.maxGroupNum;
+    });
     function add() {
-      combinationRepeat.value++;
+      groupNum.value++;
       _values.value.push({});
       emitChange();
     }
     function remove(idx) {
-      combinationRepeat.value--;
+      groupNum.value--;
       _values.value.splice(idx, 1);
       emitChange();
     }
+    watch(maxGroupNum, (value) => {
+      if (groupNum.value <= value)
+        return;
+      groupNum.value = value;
+      _values.value.splice(groupNum.value);
+      emitChange();
+    }, {
+      immediate: true
+    });
     const _values = ref([{}]);
     function initValues(data) {
       if (!data)
@@ -47,19 +70,32 @@ const script = defineComponent({
         if (!Array.isArray(parsed))
           throw new Error();
         parsed.forEach((v, idx) => {
-          if (isObject(v)) {
-            _values.value[idx] = v;
-          } else {
-            _values.value[idx] = {};
-            formRenderLog(`invalid Object value ${v} in COMBINATION => ${props.title}[${idx}]`, "warn");
-          }
+          if (idx > maxGroupNum.value - 1)
+            return;
+          if (isObject(v))
+            return _values.value[idx] = v;
+          _values.value[idx] = {};
+          formRenderLog(`invalid Object value ${v} in COMBINATION => ${props.title}[${idx}]`, "warn");
         });
-        combinationRepeat.value = _values.value.length;
+        groupNum.value = Math.min(_values.value.length, maxGroupNum.value);
       } catch (e) {
         formRenderLog(`invalid JSON value ${data} in COMBINATION => ${props.title}`, "warn");
+      } finally {
+        setFormValueByInitValue();
+      }
+      function setFormValueByInitValue() {
+        _values.value.forEach((item, idx) => {
+          var _a;
+          (_a = formRenderRefs.value[idx]) == null ? void 0 : _a.setFieldState("*", (state) => {
+            if (!isField(state))
+              return;
+            state.value = Path.getIn(item, state.path);
+          });
+        });
       }
     }
-    initValues(props.value);
+    watch(() => props.value, (value) => initValues(value));
+    onMounted(() => initValues(props.value));
     function stop(event) {
       event.stopPropagation();
     }
@@ -68,7 +104,7 @@ const script = defineComponent({
       value
     }) {
       !_values.value[idx] && (_values.value[idx] = {});
-      _values.value[idx][fieldKey] = value;
+      Path.setIn(_values.value[idx], fieldKey, value);
       emitChange();
     }
     const FormRenderComponent = FormRender;
@@ -82,16 +118,17 @@ const script = defineComponent({
       }, [props.title]), createVNode(NButton, {
         "onClick": add,
         "type": "info",
-        "text": true
+        "text": true,
+        "disabled": groupNum.value >= maxGroupNum.value
       }, {
         default: () => [createTextVNode("\u65B0\u589E")]
       })]), Array.from({
-        length: combinationRepeat.value
+        length: groupNum.value
       }).map((_, idx) => {
         return createVNode("section", {
           "class": "form-render__combinationContent"
         }, [createVNode(FormRenderComponent, {
-          "initialData": toRaw(_values.value[idx]) || {},
+          "ref": (_ref) => formRenderRefs.value[idx] = _ref,
           "fieldList": props.getProperties(),
           "onUpdateValue": () => false,
           "onInput": stop,

package/es/packages/form-render/src/components/renderer/formItem.js

@@ -60,7 +60,7 @@ const FORM_ITEM = connect(script, mapProps({
   const feedback = !isVoidField(field) ? field.selfErrors.length ? field.selfErrors.join(",") : void 0 : void 0;
   return {
     ...props,
-    required: field.required,
+    required: isVoidField(field) ? void 0 : field.required,
     class: "form-render__formItem",
     style: {
       "--form-item-column": (_a = props.span) != null ? _a : 3

package/es/packages/form-render/src/components/renderer/radio.d.ts

@@ -1,7 +1,9 @@
 import { AnyObject } from '../../../../../../es/src/types';
 import { PropType } from 'vue';
 export declare const RADIO: import("vue").DefineComponent<{
-    value: {};
+    value: {
+        type: (NumberConstructor | StringConstructor)[];
+    };
     options: {
         type: PropType<AnyObject[]>;
         default: () => never[];
@@ -10,8 +12,11 @@ export declare const RADIO: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    value: {};
+    onChange: {};
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:value"[], "update:value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    value: {
+        type: (NumberConstructor | StringConstructor)[];
+    };
     options: {
         type: PropType<AnyObject[]>;
         default: () => never[];
@@ -20,7 +25,10 @@ export declare const RADIO: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}>>, {
+    onChange: {};
+}>> & {
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}, {
     options: AnyObject[];
     vertical: boolean;
 }>;

package/es/packages/form-render/src/components/renderer/radio.js

@@ -1,11 +1,13 @@
-import { defineComponent, createVNode } from 'vue';
+import { defineComponent, computed, createVNode } from 'vue';
 import { connect, mapProps } from '@formily/vue';
 import { NRadioGroup, NSpace, NRadio } from 'naive-ui';
 import { assignUpdateValue } from '../../utils/index.js';
 
 const script = defineComponent({
   props: {
-    value: {},
+    value: {
+      type: [String, Number]
+    },
     options: {
       type: Array,
       default: () => []
@@ -13,12 +15,28 @@ const script = defineComponent({
     vertical: {
       type: Boolean,
       default: false
-    }
+    },
+    onChange: {}
   },
-  setup(props) {
+  emits: ["update:value"],
+  setup(props, {
+    emit
+  }) {
+    function dangerousTypeTransform(value) {
+      return value + "";
+    }
+    const valueRef = computed({
+      get() {
+        return dangerousTypeTransform(props.value);
+      },
+      set(v) {
+        emit("update:value", v);
+      }
+    });
     return () => {
       return createVNode(NRadioGroup, {
-        "value": props.value
+        "value": valueRef.value,
+        "onUpdate:value": ($event) => valueRef.value = $event
       }, {
         default: () => [createVNode(NSpace, {
           "vertical": props.vertical

package/es/packages/form-render/src/components/renderer/select.js

@@ -1,7 +1,7 @@
-import { defineComponent, ref, watch, inject, computed, nextTick, createVNode } from 'vue';
+import { defineComponent, ref, computed, inject, watch, createVNode } from 'vue';
 import { isField } from '@formily/core';
 import { isEqual, cloneDeep } from 'lodash-es';
-import { InjectAsyncQueue, InjectionFormItemDepsCollector, InjectionChangeContextCollector } from '../../constants/index.js';
+import { InjectionChangeContextCollector, InjectAsyncQueue, InjectionFormItemDepsCollector } from '../../constants/index.js';
 import { assignUpdateValue, traverseDependKey } from '../../utils/index.js';
 import { connect, mapProps } from '@formily/vue';
 import { NSelect } from 'naive-ui';
@@ -31,48 +31,53 @@ const script = defineComponent({
     emit
   }) {
     const remoteOptions = ref(null);
-    watch(remoteOptions, (o) => console.log("remoteOption", o));
     const lastSearch = ref("");
-    const asyncQueue = inject(InjectAsyncQueue);
+    const labelKey = computed(() => {
+      var _a, _b;
+      return (_b = (_a = props.urlConfig) == null ? void 0 : _a.nameKey) != null ? _b : "text";
+    });
+    const valueKey = computed(() => {
+      var _a, _b;
+      return (_b = (_a = props.urlConfig) == null ? void 0 : _a.valueKey) != null ? _b : "value";
+    });
+    const changeContextCollector = inject(InjectionChangeContextCollector);
+    function update(v, option) {
+      changeContextCollector == null ? void 0 : changeContextCollector.setContext(fieldKey.value, "currentOption", cloneDeep(option));
+      emit("update:value", v);
+    }
     const {
       title,
       field,
       fieldKey
     } = useFormField();
-    function filterOption(options, searchContent) {
-      return options.filter((option) => {
-        return !searchContent || String(option[labelKey.value]).includes(searchContent);
-      });
-    }
+    const asyncQueue = inject(InjectAsyncQueue);
     async function fetchData(content) {
       lastSearch.value = content || "";
-      if (remoteOptions.value)
-        return;
-      const config = props.urlConfig;
-      if (!config) {
+      if (!configFor(props)) {
         return remoteOptions.value = null;
       }
-      try {
-        remoteOptions.value = await asyncQueue.addAsync({
-          ...createParams(config, field.value),
-          key: title.value
-        });
-      } catch (e) {
-        remoteOptions.value = null;
-      }
-      function createParams(config2, field2) {
+      if (remoteOptions.value)
+        return;
+      remoteOptions.value = await asyncQueue.addAsync({
+        ...createParams(configFor(props), field.value, title.value)
+      });
+      function createParams(config, field2, key) {
         const _params = {};
-        traverseDependKey(config2.dependKey, (dependKey, valueKey2) => {
+        traverseDependKey(config.dependKey, (dependKey, valueKey2) => {
           const _field = field2.query(dependKey).take();
           if (isField(_field)) {
             _params[valueKey2] = _field.value;
           }
         });
         return {
-          ...config2,
-          params: Object.assign({}, config2.params, _params)
+          ...config,
+          params: Object.assign({}, config.params, _params),
+          key
         };
       }
+      function configFor(target) {
+        return target.urlConfig;
+      }
     }
     const parsedOptions = computed(() => {
       if (remoteOptions.value)
@@ -80,45 +85,34 @@ const script = defineComponent({
       if (!Array.isArray(props.options))
         return [];
       return filterOption(props.options, lastSearch.value);
+      function filterOption(options, searchContent) {
+        return options.filter((option) => {
+          return !searchContent || String(option[labelKey.value]).includes(searchContent);
+        });
+      }
     });
     const formItemDepsCollector = inject(InjectionFormItemDepsCollector);
     watch(() => props.urlConfig, (config, oldConfig) => {
       if (isEqual(config, oldConfig))
         return;
       remoteOptions.value = null;
-      config && formItemDepsCollector.setDeps(fieldKey.value, config.dependKey || [], async () => {
+      if (!config)
+        return;
+      formItemDepsCollector.setDeps(fieldKey.value, config.dependKey || [], async () => {
         remoteOptions.value = null;
-        await nextTick();
-        props.value != null && await fetchData();
+        emit("update:value", null);
       });
-      config && fetchData();
+      props.value && fetchData();
     }, {
       immediate: true
     });
     watch(() => props.value, (n, o) => {
       var _a, _b;
-      if (o == null && n != null) {
-        fetchData();
-      }
-      if (isField(field.value) && field.value.visited) {
-        (_b = (_a = field.value).validate) == null ? void 0 : _b.call(_a);
-      }
+      o == null && n != null && fetchData();
+      isField(field.value) && field.value.visited && ((_b = (_a = field.value).validate) == null ? void 0 : _b.call(_a));
     }, {
       immediate: true
     });
-    const changeContextCollector = inject(InjectionChangeContextCollector);
-    function update(v, option) {
-      changeContextCollector == null ? void 0 : changeContextCollector.setContext(fieldKey.value, "currentOption", cloneDeep(option));
-      emit("update:value", v);
-    }
-    const labelKey = computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.urlConfig) == null ? void 0 : _a.nameKey) != null ? _b : "text";
-    });
-    const valueKey = computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.urlConfig) == null ? void 0 : _a.valueKey) != null ? _b : "value";
-    });
     function focusDecorator(onFocus) {
       return (...args) => {
         if (isField(field.value)) {
@@ -128,16 +122,16 @@ const script = defineComponent({
       };
     }
     return () => createVNode(NSelect, {
-      "value": props.value,
-      "onUpdate:value": update,
       "remote": true,
       "filterable": true,
+      "value": props.value,
+      "onUpdate:value": update,
       "labelField": labelKey.value,
       "valueField": valueKey.value,
+      "options": parsedOptions.value,
       "onSearch": fetchData,
       "onUpdate:show": (show) => show && fetchData(),
-      "onFocus": focusDecorator(props.onFocus),
-      "options": parsedOptions.value
+      "onFocus": focusDecorator(props.onFocus)
     }, slots);
   }
 });

package/es/packages/form-render/src/components/renderer/simpleComponent.d.ts

@@ -1,12 +1,14 @@
+import { AnyObject } from '../../../../../../es/src/types';
 export declare const TEXT: {
-    (props: any): JSX.Element;
+    (props: AnyObject): JSX.Element;
     props: {
         content: {};
         fieldItem: {};
+        value: {};
     };
 };
 export declare const BUTTON: {
-    (props: any): JSX.Element;
+    (props: AnyObject): JSX.Element;
     props: {
         onClick: {};
         fieldItem: {};

package/es/packages/form-render/src/components/renderer/simpleComponent.js

@@ -11,12 +11,13 @@ function createPropFor(props) {
   };
 }
 const textScript = (props) => {
-  var _a, _b;
-  return createVNode("div", null, [(_b = (_a = createSlot(props.content, props)).default) == null ? void 0 : _b.call(_a)]);
+  var _a, _b, _c;
+  return createVNode("div", null, [(_c = (_b = createSlot((_a = props.content) != null ? _a : props.value, props)).default) == null ? void 0 : _c.call(_b)]);
 };
 textScript.props = {
   content: {},
-  fieldItem: {}
+  fieldItem: {},
+  value: {}
 };
 const TEXT = connect(textScript, mapProps((props) => {
   var _a;

package/es/packages/form-render/src/hooks/useAsyncQueue.d.ts

@@ -34,7 +34,7 @@ export declare class AsyncQueue<T = any, K = any, R = any> {
 export declare function useAsyncQueue(): {
     create: (parallelism?: number) => AsyncQueue<FormAsyncQueueItem, any, {
         label: string;
-        value: any;
+        value: unknown;
     }[]>;
 };
 export {};

package/es/packages/form-render/src/hooks/useChangeContext.d.ts

@@ -1,7 +1,7 @@
 import { FormChangeContext } from '../types';
 export declare class ContextCollector {
     private readonly contextMap;
-    setContext(key: string, prop: keyof FormChangeContext, value: any): void;
+    setContext<T extends keyof FormChangeContext>(key: string, prop: T, value: FormChangeContext[T]): void;
     getContext(key: string): Partial<{
         currentOption: import("../../../../src/types").AnyObject;
     }>;

package/es/packages/form-render/src/hooks/useChangeContext.js

@@ -4,7 +4,7 @@ class ContextCollector {
   }
   setContext(key, prop, value) {
     const context = this.contextMap.get(key) || {};
-    Reflect.set(context, prop, value);
+    context[prop] = value;
     this.contextMap.set(key, context);
   }
   getContext(key) {

package/es/packages/form-render/src/hooks/useFieldListAdaptor.js

@@ -6,9 +6,10 @@ import { fieldKeyEscape, arrayed, createLinebarId, transformDateFormat } from '.
 function useFieldListAdaptor(collector, uuid) {
   const { createValidatorSchema } = useFormValidator();
   const createStandardSchema = (item) => {
+    var _a;
     const result = {
       name: item.val_key,
-      type: "string",
+      type: (_a = item.fieldType) != null ? _a : "string",
       title: item.alias || item.name,
       "x-component": item.html_type,
       "x-component-props": {
@@ -98,6 +99,7 @@ function useFieldListAdaptor(collector, uuid) {
     schema["x-decorator-props"].showLabel = false;
     Object.assign(schema["x-component-props"], {
       title: item.alias || item.name,
+      maxGroupNum: item.maxGroupNum,
       getProperties: () => item.children || []
     });
     return schema;
@@ -126,7 +128,6 @@ function useFieldListAdaptor(collector, uuid) {
   };
   const createCustomSchema = (item) => {
     const schema = createStandardSchema(item);
-    item.fieldType && (schema.type = item.fieldType);
     Object.assign(schema["x-component-props"], {
       fieldItem: item
     });

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

@@ -1,8 +1,9 @@
-import { ArrayAble, Func } from '../../../../../es/src/types';
+import { Func } from '../../../../../es/src/types';
+import { DependKeyType } from '../../../../../es/packages/form-render';
 export declare class FormItemDepsCollector {
     private readonly collector;
-    setDeps(key: string, dependKeys: ArrayAble<string> | Record<string, string> | ArrayAble<Record<'paramName' | 'paramValue', string>>, callback: Func): void;
-    trigger(dependKey: string, payload?: any): void;
+    setDeps(key: string, dependKeys: DependKeyType, callback: Func): void;
+    trigger(dependKey: string, payload?: unknown): void;
 }
 export declare function useFormItemDeps(): {
     create: () => FormItemDepsCollector;

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

@@ -1,7 +1,7 @@
-import { Func } from '../../../../../es/src/types';
+import { Func, WithNull } from '../../../../../es/src/types';
 declare type RequestInstance = Record<string, Func>;
 export declare function useFormRequest(): {
-    getHttpInstance: () => RequestInstance | null;
+    getHttpInstance: () => WithNull<RequestInstance>;
     registGlobHttpInstance: (instance: RequestInstance) => void;
 };
 export {};