cnhis-design-vue 3.1.17-beta.1 → 3.1.17-beta.10

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

@@ -0,0 +1,84 @@
+import { defineComponent, inject, computed, createVNode } from 'vue';
+import { isVoidField } from '@formily/core';
+import { useField, connect, mapProps } from '@formily/vue';
+import { NFormItem } from 'naive-ui';
+import Annotation from '../../../../annotation-edit/index.js';
+import { InjectionAnnotation, InjectionFormUUID } from '../../constants/index.js';
+import '@formily/path';
+import '@vue/shared';
+import 'lodash-es';
+import 'date-fns';
+import { dotEscape } from '../../utils/schema.js';
+
+const script = defineComponent({
+  props: {
+    label: String,
+    propertyKey: String,
+    annotation: {}
+  },
+  setup(props, {
+    slots
+  }) {
+    const annotation = inject(InjectionAnnotation);
+    const annotationContent = computed({
+      get() {
+        var _a, _b;
+        return (_b = (_a = annotation.value) == null ? void 0 : _a[props.propertyKey]) != null ? _b : "";
+      },
+      set(value) {
+        annotation.value = {
+          property: props.propertyKey,
+          value
+        };
+      }
+    });
+    function renderAnnotation() {
+      return createVNode(Annotation, {
+        "class": "form-render__formItemLabel--annotation",
+        "modelValue": annotationContent.value,
+        "onUpdate:modelValue": ($event) => annotationContent.value = $event
+      }, null);
+    }
+    const showAnnotation = computed(() => {
+      return annotation.value && props.annotation !== false;
+    });
+    const showLabel = computed(() => props.label && props.label !== " ");
+    const field = useField();
+    const uuid = inject(InjectionFormUUID);
+    const id = computed(() => {
+      return dotEscape(`${uuid}-${field.value.path.toString()}`);
+    });
+    function renderLabel() {
+      return showLabel.value ? createVNode("section", {
+        "class": "form-render__formItemLabel"
+      }, [createVNode("span", {
+        "class": ["form-render__formItemLabel--text", {
+          "has-annotation": showAnnotation.value
+        }]
+      }, [props.label]), showAnnotation.value ? renderAnnotation() : null]) : null;
+    }
+    return () => createVNode(NFormItem, {
+      id: id.value
+    }, {
+      ...slots,
+      label: renderLabel
+    });
+  }
+});
+const FORM_ITEM = connect(script, mapProps({
+  title: "label"
+}, (props, field) => {
+  const feedback = !isVoidField(field) ? field.selfErrors.length ? field.selfErrors.join(",") : void 0 : void 0;
+  return {
+    ...props,
+    required: isVoidField(field) ? void 0 : field.required,
+    class: "form-render__formItem",
+    style: {
+      "--form-item-column": props.span
+    },
+    feedback,
+    "validation-status": feedback ? "error" : void 0
+  };
+}));
+
+export { FORM_ITEM };

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

@@ -0,0 +1,31 @@
+import { Func } from '../../../../../../es/shared/types';
+import { PropType } from 'vue';
+export declare const INPUT_NUMBER: import("vue").DefineComponent<{
+    value: {
+        type: (NumberConstructor | StringConstructor)[];
+    };
+    onChange: {
+        type: PropType<Func<any[], any>>;
+        required: true;
+    };
+    prefix: {
+        type: StringConstructor;
+    };
+    suffix: {
+        type: StringConstructor;
+    };
+}, () => 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: {
+        type: (NumberConstructor | StringConstructor)[];
+    };
+    onChange: {
+        type: PropType<Func<any[], any>>;
+        required: true;
+    };
+    prefix: {
+        type: StringConstructor;
+    };
+    suffix: {
+        type: StringConstructor;
+    };
+}>>, {}>;

package/es/components/form-render/src/components/renderer/inputNumber.js

@@ -0,0 +1,53 @@
+import { defineComponent, watch, computed, createVNode } from 'vue';
+import { isString, isNumber } from 'lodash-es';
+import { useCommonInjection } from '../../hooks/useCommonInjection.js';
+import { createInputSlot, parseNumberFromMaybeString } from '../../utils/index.js';
+import { connect, mapProps } from '@formily/vue';
+import { NInputNumber } from 'naive-ui';
+import { assignUpdateValue } from '../../utils/schema.js';
+
+const script = defineComponent({
+  props: {
+    value: {
+      type: [Number, String]
+    },
+    onChange: {
+      type: Function,
+      required: true
+    },
+    prefix: {
+      type: String
+    },
+    suffix: {
+      type: String
+    }
+  },
+  setup(props) {
+    const _slots = createInputSlot(props);
+    useCommonInjection().injectValueValidate(() => props.value);
+    watch(() => props.value, (value) => {
+      if (value == null)
+        return;
+      if (!isString(value) && !isNumber(value) || Number.isNaN(+value))
+        return props.onChange(null);
+      props.onChange(+value);
+    });
+    const valueRef = computed({
+      get: () => parseNumberFromMaybeString(props.value),
+      set: (v) => {
+        var _a;
+        return (_a = props.onChange) == null ? void 0 : _a.call(props, v);
+      }
+    });
+    return () => {
+      return createVNode(NInputNumber, {
+        "value": valueRef.value,
+        "onUpdate:value": ($event) => valueRef.value = $event,
+        "show-button": false
+      }, _slots.value);
+    };
+  }
+});
+const INPUT_NUMBER = connect(script, mapProps(assignUpdateValue));
+
+export { INPUT_NUMBER };

package/es/components/form-render/src/components/renderer/jsonCombination/hooks/useDeepValidate.d.ts

@@ -0,0 +1,5 @@
+import { Ref } from 'vue';
+import { FormRenderExpose } from '../../../../../../../../es/components/form-render';
+export declare function useDeepValidate(): {
+    bindDeepValidate: (formRenderRefs: Ref<FormRenderExpose[]>) => void;
+};

package/es/components/form-render/src/components/renderer/jsonCombination/hooks/useDeepValidate.js

@@ -0,0 +1,33 @@
+import { isField } from '@formily/core';
+import { flatten } from 'lodash-es';
+import { onMounted } from 'vue';
+import '../../../../../index.js';
+import { arrayed } from '../../../../utils/index.js';
+import { useFormField } from '../../../../hooks/useFormField.js';
+
+function useDeepValidate() {
+  function bindDeepValidate(formRenderRefs) {
+    const { field } = useFormField();
+    onMounted(() => {
+      if (!isField(field.value))
+        return;
+      const tempValidator = field.value.validator;
+      field.value.validator = [
+        {
+          async validator() {
+            return Promise.allSettled(formRenderRefs.value.map((formRenderRef) => formRenderRef.validate())).then((resultList) => {
+              const rejected = resultList.filter((res) => res.status === "rejected");
+              if (!rejected.length)
+                return "";
+              return flatten(rejected.map((res) => res.reason));
+            });
+          }
+        },
+        ...tempValidator ? arrayed(tempValidator) : []
+      ];
+    });
+  }
+  return { bindDeepValidate };
+}
+
+export { useDeepValidate };

package/es/components/form-render/src/components/renderer/jsonCombination/index.d.ts

@@ -0,0 +1,44 @@
+import { FieldItem } from '../../../../../../../es/components/form-render';
+import { PropType } from 'vue';
+export declare const JSON_COMBINATION: import("vue").DefineComponent<{
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    value: {
+        type: (ArrayConstructor | StringConstructor)[];
+    };
+    maxGroupNum: {
+        type: NumberConstructor;
+    };
+    getProperties: {
+        type: PropType<() => FieldItem[]>;
+        default: () => never[];
+    };
+    onInput: {};
+    onBlur: {};
+    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<{
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    value: {
+        type: (ArrayConstructor | StringConstructor)[];
+    };
+    maxGroupNum: {
+        type: NumberConstructor;
+    };
+    getProperties: {
+        type: PropType<() => FieldItem[]>;
+        default: () => never[];
+    };
+    onInput: {};
+    onBlur: {};
+    onChange: {};
+}>> & {
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}, {
+    title: string;
+    getProperties: () => FieldItem[];
+}>;

package/es/components/form-render/src/components/renderer/jsonCombination/index.js

@@ -0,0 +1,173 @@
+import { defineComponent, ref, computed, watch, onMounted, createVNode } from 'vue';
+import { isField } from '@formily/core';
+import { Path } from '@formily/path';
+import { AddCircleOutline, RemoveCircle } from '@vicons/ionicons5';
+import { isNumber, isArray, isEqual } from 'lodash-es';
+import { useDeepValidate } from './hooks/useDeepValidate.js';
+import { formRenderLog, mergeDeepProperties } from '../../../utils/index.js';
+import { connect, mapProps } from '@formily/vue';
+import { useDebounceFn, isObject } from '@vueuse/core';
+import { NButton, NIcon } from 'naive-ui';
+import script$1 from '../../../FormRender.js';
+import { assignUpdateValue } from '../../../utils/schema.js';
+
+const script = defineComponent({
+  name: "FormJsonCombination",
+  props: {
+    title: {
+      type: String,
+      default: ""
+    },
+    value: {
+      type: [String, Array]
+    },
+    maxGroupNum: {
+      type: Number
+    },
+    getProperties: {
+      type: Function,
+      default: () => []
+    },
+    onInput: {},
+    onBlur: {},
+    onChange: {}
+  },
+  emits: ["update:value"],
+  setup(props, {
+    emit
+  }) {
+    formRenderLog("\u5F53\u524DCOMBINATION\u63A7\u4EF6\u4E3Ajson\u6A21\u5F0F,\u63A8\u8350\u4F7F\u7528\u975Ejson\u6A21\u5F0F,FieldItem.jsonCombination=false", "warn");
+    const emitChange = useDebounceFn(function emitChange2() {
+      emit("update:value", JSON.stringify(combinationData.value));
+    }, 300);
+    const combinationData = ref([]);
+    const currentGroupNum = computed(() => combinationData.value.length);
+    function setCombinationData(data, withInitialData = false) {
+      if (isArray(data)) {
+        if (!data.length)
+          data.push({});
+        data = JSON.stringify(data);
+      }
+      const parsedData = getParsedData(data);
+      if (!needLoad(parsedData))
+        return;
+      parsedData.splice(maxGroupNum.value);
+      parsedData.forEach(setCombinationItemData);
+      combinationData.value.splice(parsedData.length);
+      combinationData.value.forEach(setFormRenderData);
+      function needLoad(_data) {
+        return !!_data && !isEqual(_data, combinationData.value);
+      }
+      function setCombinationItemData(v, idx) {
+        if (!isObject(v))
+          return;
+        combinationData.value[idx] = v;
+        withInitialData && mergeDeepProperties(v, props.getProperties());
+      }
+      function getParsedData(data2) {
+        try {
+          if (!data2)
+            return null;
+          const result = JSON.parse(data2);
+          if (!Array.isArray(result))
+            return null;
+          return result;
+        } catch (e) {
+          return null;
+        }
+      }
+    }
+    watch(() => props.value, (value) => setCombinationData(value));
+    onMounted(() => {
+      setCombinationData(props.value || "[{}]", true);
+      emitChange();
+    });
+    const formRenderRefs = ref([]);
+    useDeepValidate().bindDeepValidate(formRenderRefs);
+    function setFormRenderData(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);
+      });
+    }
+    function setFormRenderRef(idx, _ref) {
+      formRenderRefs.value[idx] = _ref;
+      setFormRenderData(combinationData.value[idx] || {}, idx);
+    }
+    function addGroup() {
+      combinationData.value.push(mergeDeepProperties({}, props.getProperties()));
+      emitChange();
+    }
+    function removeGroup(idx) {
+      combinationData.value.splice(idx, 1);
+      formRenderRefs.value.splice(idx, 1);
+      emitChange();
+    }
+    const maxGroupNum = computed(() => {
+      if (!isNumber(props.maxGroupNum))
+        return Infinity;
+      if (props.maxGroupNum < 1)
+        return 0;
+      return ~~props.maxGroupNum;
+    });
+    watch(maxGroupNum, (value) => {
+      if (currentGroupNum.value <= value)
+        return;
+      combinationData.value.splice(value);
+      emitChange();
+      formRenderRefs.value.splice(value);
+    }, {
+      immediate: true
+    });
+    function onChange(idx, {
+      fieldKey,
+      value
+    }) {
+      !combinationData.value[idx] && (combinationData.value[idx] = {});
+      Path.setIn(combinationData.value[idx], fieldKey, value);
+      emitChange();
+    }
+    const FormRenderComponent = script$1;
+    return () => {
+      return createVNode("section", {
+        "class": "form-render__combination"
+      }, [createVNode("header", {
+        "class": "form-render__combinationHeader"
+      }, [createVNode("div", {
+        "class": "form-render__combinationHeaderText"
+      }, [props.title]), createVNode(NButton, {
+        "onClick": addGroup,
+        "type": "info",
+        "text": true,
+        "disabled": currentGroupNum.value >= maxGroupNum.value
+      }, {
+        icon: () => createVNode(NIcon, {
+          "component": AddCircleOutline
+        }, null),
+        default: () => "\u65B0\u589E"
+      })]), Array.from({
+        length: currentGroupNum.value
+      }).map((_, idx) => createVNode("section", {
+        "class": "form-render__combinationContentJson"
+      }, [createVNode(FormRenderComponent, {
+        "ref": (_ref) => setFormRenderRef(idx, _ref),
+        "fieldList": props.getProperties(),
+        "onFormChange": (payload) => onChange(idx, payload)
+      }, null), idx === 0 ? null : createVNode(NButton, {
+        "text": true,
+        "class": "form-render__combinationClose",
+        "type": "error",
+        "onClick": () => removeGroup(idx)
+      }, {
+        icon: () => createVNode(NIcon, {
+          "component": RemoveCircle
+        }, null)
+      })]))]);
+    };
+  }
+});
+const JSON_COMBINATION = connect(script, mapProps(assignUpdateValue));
+
+export { JSON_COMBINATION };

package/es/components/form-render/src/components/renderer/linebar.js

@@ -0,0 +1,73 @@
+import { defineComponent, ref, inject, createVNode } from 'vue';
+import { connect, mapProps } from '@formily/vue';
+import { NDivider, NCollapseTransition } from 'naive-ui';
+import '../../../index.js';
+import { InjectionFormItemDepsCollector, FormItemLineBarDepKeyPrepend } from '../../constants/index.js';
+import { useFormField } from '../../hooks/useFormField.js';
+
+const script = defineComponent({
+  name: "FormCollapse",
+  props: {
+    show: {
+      type: Boolean,
+      default: true
+    },
+    line: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props, {
+    slots
+  }) {
+    const _show = ref(props.show);
+    function toggleShow() {
+      if (props.disabled)
+        return;
+      _show.value = !_show.value;
+    }
+    const {
+      fieldKey
+    } = useFormField();
+    const formItemDepsCollector = inject(InjectionFormItemDepsCollector);
+    formItemDepsCollector.setDeps(fieldKey.value, FormItemLineBarDepKeyPrepend + fieldKey.value, (v = true) => {
+      _show.value = v;
+    });
+    return () => {
+      return createVNode("section", {
+        "class": "form-render__linebar",
+        "anchor-target": true
+      }, [props.line ? createVNode(NDivider, {
+        "style": {
+          margin: "4px 0"
+        }
+      }, {
+        default() {
+          return [props.title];
+        }
+      }) : createVNode("header", {
+        "class": "form-render__linebarHeader",
+        "onClick": toggleShow
+      }, [props.title]), createVNode(NCollapseTransition, {
+        "class": "form-render__linebarItem",
+        "show": _show.value
+      }, slots)]);
+    };
+  }
+});
+const LINEBAR = connect(script, mapProps((props, field) => {
+  return {
+    ...props,
+    title: field.title
+  };
+}));
+
+export { LINEBAR };

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

@@ -0,0 +1,34 @@
+import { AnyObject } from '../../../../../../es/shared/types';
+import { PropType } from 'vue';
+export declare const RADIO: import("vue").DefineComponent<{
+    value: {
+        type: (NumberConstructor | StringConstructor)[];
+    };
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    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[];
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onChange: {};
+}>> & {
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}, {
+    options: AnyObject[];
+    vertical: boolean;
+}>;

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

@@ -0,0 +1,69 @@
+import { defineComponent, computed, createVNode } from 'vue';
+import { connect, mapProps } from '@formily/vue';
+import { isNumber } from 'lodash-es';
+import { NRadioGroup, NSpace, NRadio } from 'naive-ui';
+import '@formily/path';
+import '@vue/shared';
+import 'date-fns';
+import { assignUpdateValue } from '../../utils/schema.js';
+
+const script = defineComponent({
+  props: {
+    value: {
+      type: [String, Number]
+    },
+    options: {
+      type: Array,
+      default: () => []
+    },
+    vertical: {
+      type: Boolean,
+      default: false
+    },
+    onChange: {}
+  },
+  emits: ["update:value"],
+  setup(props, {
+    emit
+  }) {
+    function dangerousTypeTransform(value) {
+      if (isNumber(value))
+        return value + "";
+      return value;
+    }
+    const valueRef = computed({
+      get() {
+        return dangerousTypeTransform(props.value);
+      },
+      set(v) {
+        emit("update:value", v);
+      }
+    });
+    return () => {
+      return createVNode(NRadioGroup, {
+        "value": valueRef.value,
+        "onUpdate:value": ($event) => valueRef.value = $event
+      }, {
+        default: () => [createVNode(NSpace, {
+          "vertical": props.vertical
+        }, {
+          default: () => {
+            var _a;
+            return [(_a = props.options) == null ? void 0 : _a.map((option) => {
+              return createVNode(NRadio, {
+                "value": option.value
+              }, {
+                default: () => [option.text]
+              });
+            })];
+          }
+        })]
+      });
+    };
+  }
+});
+const RADIO = connect(script, mapProps({
+  dataSource: "options"
+}, assignUpdateValue));
+
+export { RADIO };

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

@@ -0,0 +1,47 @@
+import { AnyObject, Func } from '../../../../../../es/shared/types';
+import { UrlConfig } from '../../types';
+import { PropType } from 'vue';
+export declare const SELECT: import("vue").DefineComponent<{
+    value: {
+        type: StringConstructor;
+    };
+    lazyRequest: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    urlConfig: {
+        type: PropType<UrlConfig>;
+    };
+    onFocus: {
+        type: PropType<Func<any[], any>>;
+    };
+    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: StringConstructor;
+    };
+    lazyRequest: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    urlConfig: {
+        type: PropType<UrlConfig>;
+    };
+    onFocus: {
+        type: PropType<Func<any[], any>>;
+    };
+    onChange: {};
+}>> & {
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}, {
+    options: AnyObject[];
+    lazyRequest: boolean;
+}>;