cnhis-design-vue 3.1.17-beta.9 → 3.1.18-beta.3

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

@@ -0,0 +1,42 @@
+import { AnyObject, Func } from '../../../../../../es/shared/types';
+import { UrlConfig } from '../../../../../../es/components/form-render';
+import { PropType } from 'vue';
+export declare const SEARCH_CASCADE: import("vue").DefineComponent<{
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    depth: {
+        type: (NumberConstructor | StringConstructor)[];
+        required: true;
+    };
+    urlConfig: {
+        type: PropType<UrlConfig>;
+    };
+    onFocus: {
+        type: PropType<Func<any[], any>>;
+    };
+    onChange: {};
+    value: {};
+}, () => 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<{
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    depth: {
+        type: (NumberConstructor | StringConstructor)[];
+        required: true;
+    };
+    urlConfig: {
+        type: PropType<UrlConfig>;
+    };
+    onFocus: {
+        type: PropType<Func<any[], any>>;
+    };
+    onChange: {};
+    value: {};
+}>> & {
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}, {
+    options: AnyObject[];
+}>;

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

@@ -0,0 +1,208 @@
+import { defineComponent, ref, computed, inject, watch, createVNode } from 'vue';
+import { isField } from '@formily/core';
+import { isEqual } from 'lodash-es';
+import { useCommonInjection } from '../../hooks/useCommonInjection.js';
+import { InjectAsyncQueue } from '../../constants/index.js';
+import '@vueuse/core';
+import '../../../index.js';
+import '@formily/path';
+import '@vue/shared';
+import 'date-fns';
+import { assignUpdateValue, traverseDependKey } from '../../utils/schema.js';
+import { useFormField } from '../../hooks/useFormField.js';
+import '../../../../../shared/utils/tapable/SyncHook.js';
+import '../../../../../shared/utils/tapable/SyncBailHook.js';
+import '../../../../../shared/utils/tapable/SyncWaterfallHook.js';
+import '../../../../../shared/utils/tapable/SyncLoopHook.js';
+import '../../../../../shared/utils/tapable/AsyncParallelHook.js';
+import '../../../../../shared/utils/tapable/AsyncParallelBailHook.js';
+import '../../../../../shared/utils/tapable/AsyncSeriesHook.js';
+import '../../../../../shared/utils/tapable/AsyncSeriesBailHook.js';
+import '../../../../../shared/utils/tapable/AsyncSeriesLoopHook.js';
+import '../../../../../shared/utils/tapable/AsyncSeriesWaterfallHook.js';
+import { connect, mapProps } from '@formily/vue';
+import './input.js';
+import './select.js';
+import './formItem.js';
+import './textarea.js';
+import './inputNumber.js';
+import './linebar.js';
+import './inputGroup.js';
+import './date.js';
+import './jsonCombination/index.js';
+import './combination.js';
+import './checkbox.js';
+import './switch.js';
+import './radio.js';
+import './labelSelect.js';
+import './slider.js';
+import './complex.js';
+import './simpleComponent.js';
+import { NCascader } from 'naive-ui';
+
+const script = defineComponent({
+  name: "FormCascader",
+  props: {
+    options: {
+      type: Array,
+      default: () => []
+    },
+    depth: {
+      type: [Number, String],
+      required: true
+    },
+    urlConfig: {
+      type: Object
+    },
+    onFocus: {
+      type: Function
+    },
+    onChange: {},
+    value: {}
+  },
+  emits: ["update:value"],
+  setup(props, {
+    slots,
+    emit
+  }) {
+    const remoteOptions = ref();
+    const {
+      field,
+      title
+    } = useFormField();
+    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 valueRef = computed(() => {
+      try {
+        const parsed = Array.isArray(props.value) ? props.value : JSON.parse(props.value || "");
+        if (!Array.isArray(parsed) || !parsed.length)
+          return null;
+        return parsed.map((option) => option[labelKey.value]).join(" / ");
+      } catch (e) {
+        return null;
+      }
+    });
+    function updateValue(_, __, options) {
+      emit("update:value", options.map(optionSimplify));
+      function optionSimplify(option) {
+        return {
+          ...option,
+          label: option[labelKey.value],
+          children: void 0,
+          parent: void 0
+        };
+      }
+    }
+    const asyncQueue = inject(InjectAsyncQueue);
+    async function fetchData(option) {
+      if (notNeedToFetchData(props, option))
+        return;
+      const data = await asyncQueue.addAsync(createRequestParams(deepFor(option), configFor(props), title.value, option));
+      if (!data.length && option) {
+        option.isLeaf = true;
+        updateValue(null, null, getOptionChain(option));
+        show.value = false;
+        return;
+      }
+      const result = data.map((item) => optionNormalize(item, deepFor(option)));
+      option ? option.children = result : remoteOptions.value = result;
+      function notNeedToFetchData(props2, option2) {
+        return !configFor(props2) || !option2 && remoteOptions.value || deepFor(option2) >= deepFor(props2) - 1;
+      }
+      function createRequestParams(deep, config, key, option2) {
+        const params = {
+          lvlnr: deep + 1 + ""
+        };
+        if (option2 && config.dependKey) {
+          traverseDependKey(config.dependKey, (dependKey, valueKey2) => {
+            params[valueKey2] = option2[dependKey];
+          });
+        }
+        return {
+          params,
+          ...config,
+          key
+        };
+      }
+      function getOptionChain(option2) {
+        let currentOption = option2;
+        const result2 = [option2];
+        while (currentOption.parent) {
+          result2.unshift(currentOption.parent);
+          currentOption = currentOption.parent;
+        }
+        return result2;
+      }
+      function optionNormalize(data2, depth) {
+        return {
+          [labelKey.value]: data2[labelKey.value],
+          [valueKey.value]: data2[valueKey.value],
+          depth: depth + 1,
+          parent: option,
+          isLeaf: depth + 2 >= deepFor(props)
+        };
+      }
+      function configFor(target) {
+        return target.urlConfig;
+      }
+      function deepFor(target) {
+        var _a;
+        return (_a = target == null ? void 0 : target.depth) != null ? _a : -1;
+      }
+    }
+    const {
+      injectValueValidate,
+      injectValueWatchFromEmpty
+    } = useCommonInjection();
+    injectValueWatchFromEmpty(() => props.value, fetchData);
+    injectValueValidate(() => props.value);
+    watch(() => props.urlConfig, async (config, oldConfig) => {
+      if (isEqual(config, oldConfig))
+        return;
+      remoteOptions.value = null;
+      await fetchData();
+    });
+    const show = ref(false);
+    function updateShow(v) {
+      show.value = !!v;
+      v && fetchData();
+    }
+    const parsedOptions = computed(() => {
+      return remoteOptions.value || props.options || [];
+    });
+    function focusDecorator(onFocus) {
+      return (...args) => {
+        if (isField(field.value)) {
+          field.value.visited = true;
+        }
+        onFocus == null ? void 0 : onFocus(...args);
+      };
+    }
+    return () => {
+      return createVNode(NCascader, {
+        "remote": true,
+        "checkStrategy": "child",
+        "show": !!show.value,
+        "onUpdate:show": updateShow,
+        "value": valueRef.value,
+        "onUpdate:value": updateValue,
+        "labelField": labelKey.value,
+        "valueField": valueKey.value,
+        "options": parsedOptions.value,
+        "onLoad": fetchData,
+        "onFocus": focusDecorator(props.onFocus)
+      }, slots);
+    };
+  }
+});
+const SEARCH_CASCADE = connect(script, mapProps({
+  dataSource: "options"
+}, assignUpdateValue));
+
+export { SEARCH_CASCADE };

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

@@ -0,0 +1,26 @@
+import { AnyObject } from '../../../../../../es/shared/types';
+import { PropType } from 'vue';
+export declare const CHECKBOX: import("vue").DefineComponent<{
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onChange: {};
+}, () => 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<{
+    options: {
+        type: PropType<AnyObject[]>;
+        default: () => never[];
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onChange: {};
+}>>, {
+    options: AnyObject[];
+    vertical: boolean;
+}>;

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

@@ -0,0 +1,45 @@
+import { defineComponent, createVNode } from 'vue';
+import '@formily/path';
+import '@vue/shared';
+import 'lodash-es';
+import 'date-fns';
+import { assignUpdateValue } from '../../utils/schema.js';
+import { connect, mapProps } from '@formily/vue';
+import { NCheckboxGroup, NSpace, NCheckbox } from 'naive-ui';
+
+const script = defineComponent({
+  name: "FormCheckbox",
+  props: {
+    options: {
+      type: Array,
+      default: () => []
+    },
+    vertical: {
+      type: Boolean,
+      default: false
+    },
+    onChange: {}
+  },
+  setup(props) {
+    return () => createVNode(NCheckboxGroup, null, {
+      default: () => [createVNode(NSpace, {
+        "vertical": props.vertical
+      }, {
+        default: () => {
+          var _a;
+          return [(_a = props.options) == null ? void 0 : _a.map((option) => createVNode(NCheckbox, {
+            "key": option.value,
+            "value": option.value
+          }, {
+            default: () => [option.text]
+          }))];
+        }
+      })]
+    });
+  }
+});
+const CHECKBOX = connect(script, mapProps({
+  dataSource: "options"
+}, assignUpdateValue));
+
+export { CHECKBOX };

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

@@ -0,0 +1,44 @@
+import { FieldItem } from '../../../../../../es/components/form-render';
+import { PropType } from 'vue';
+export declare const COMBINATION: import("vue").DefineComponent<{
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    value: {
+        type: ArrayConstructor;
+    };
+    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;
+    };
+    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/combination.js

@@ -0,0 +1,103 @@
+import { defineComponent, ref, computed, watch, inject, createVNode } from 'vue';
+import { isNumber, isArray } from 'lodash-es';
+import '../../../index.js';
+import { useField, RecursionField, connect } from '@formily/vue';
+import { NButton, NIcon } from 'naive-ui';
+import { InjectionBusinessCollector } from '../../constants/index.js';
+import '@formily/path';
+import '@vue/shared';
+import 'date-fns';
+import { createObjSchema } from '../../utils/schema.js';
+import { AddCircleOutline, RemoveCircle } from '@vicons/ionicons5';
+import { useFieldListAdaptor } from '../../hooks/useFieldListAdaptor.js';
+
+const script = defineComponent({
+  name: "FormCombination",
+  props: {
+    title: {
+      type: String,
+      default: ""
+    },
+    value: {
+      type: Array
+    },
+    maxGroupNum: {
+      type: Number
+    },
+    getProperties: {
+      type: Function,
+      default: () => []
+    },
+    onInput: {},
+    onBlur: {},
+    onChange: {}
+  },
+  emits: ["update:value"],
+  setup(props) {
+    const field = useField();
+    const currentGroupNum = ref(1);
+    const maxGroupNum = computed(() => {
+      if (!isNumber(props.maxGroupNum))
+        return Infinity;
+      if (props.maxGroupNum < 1)
+        return 0;
+      return ~~props.maxGroupNum;
+    });
+    watch(() => props.value, (value) => {
+      if (!isArray(value))
+        return;
+      currentGroupNum.value = Math.min(Math.max(value.length, 1), maxGroupNum.value);
+    }, {
+      immediate: true
+    });
+    function addGroup() {
+      currentGroupNum.value++;
+    }
+    async function removeGroup(idx) {
+      currentGroupNum.value--;
+      await field.value.remove(idx);
+    }
+    const collector = inject(InjectionBusinessCollector);
+    const {
+      schemaAdaptor
+    } = useFieldListAdaptor(collector);
+    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__combinationContent"
+      }, [createVNode(RecursionField, {
+        "schema": createObjSchema(schemaAdaptor(props.getProperties())),
+        "name": idx
+      }, null), idx === 0 ? null : createVNode(NButton, {
+        "text": true,
+        "type": "error",
+        "class": "form-render__combinationClose",
+        "onClick": () => removeGroup(idx)
+      }, {
+        icon: () => createVNode(NIcon, {
+          "component": RemoveCircle
+        }, null)
+      })]))]);
+    };
+  }
+});
+const COMBINATION = connect(script);
+
+export { COMBINATION };

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

@@ -0,0 +1,40 @@
+import { defineComponent, createVNode } from 'vue';
+import { connect, mapProps } from '@formily/vue';
+import '@formily/path';
+import '@vue/shared';
+import 'lodash-es';
+import 'date-fns';
+import { assignUpdateValue } from '../../utils/schema.js';
+
+const script = defineComponent({
+  props: {
+    onChange: {},
+    span: {
+      type: Number,
+      default: 6
+    },
+    display: {
+      type: String,
+      default: "grid"
+    },
+    wrapperStyle: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  setup(props, {
+    slots
+  }) {
+    return () => {
+      return createVNode("section", {
+        "class": "form-render__complex"
+      }, [createVNode("section", {
+        "class": `form-render__complexContent--${props.display}`,
+        "style": props.wrapperStyle
+      }, [slots.default && slots.default()])]);
+    };
+  }
+});
+const COMPLEX = connect(script, mapProps(assignUpdateValue));
+
+export { COMPLEX };

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

@@ -0,0 +1,117 @@
+import { defineComponent, computed, watch, createVNode, mergeProps } from 'vue';
+import { generateTimeFormat } from '../../../../../shared/utils/index.js';
+import { connect, mapProps } from '@formily/vue';
+import { isObject } from '@vueuse/core';
+import { format } from 'date-fns';
+import { NDatePicker } from 'naive-ui';
+import { useCommonInjection } from '../../hooks/useCommonInjection.js';
+import '@formily/path';
+import '@vue/shared';
+import 'lodash-es';
+import { assignUpdateValue } from '../../utils/schema.js';
+
+const script = defineComponent({
+  props: {
+    onChange: {},
+    value: {
+      type: String
+    },
+    validate: {
+      type: Object
+    },
+    valueFormat: {
+      type: String,
+      default: "yyyy-MM-dd"
+    }
+  },
+  emits: ["update:value"],
+  setup(props, {
+    emit
+  }) {
+    useCommonInjection().injectValueValidate(() => props.value);
+    function minCurrentDate() {
+      var _a;
+      return ((_a = props.validate) == null ? void 0 : _a.min_date) === "currTime";
+    }
+    function maxCurrentDate() {
+      var _a;
+      return ((_a = props.validate) == null ? void 0 : _a.max_date) === "currTime";
+    }
+    function isDateDisabled(time) {
+      return minCurrentDate() && time < yesterday() || maxCurrentDate() && time > Date.now();
+      function yesterday() {
+        return Date.now() - 24 * 60 * 60 * 1e3;
+      }
+    }
+    function isTimeDisabled(time) {
+      const checkDate = new Date(time);
+      const currentDate = new Date();
+      return {
+        isHourDisabled,
+        isMinuteDisabled
+      };
+      function checkHour() {
+        return checkDate.getHours();
+      }
+      function currentHour() {
+        return currentDate.getHours();
+      }
+      function currentMinute() {
+        return currentDate.getMinutes();
+      }
+      function isHourDisabled(hour) {
+        return minCurrentDate() && hour < currentHour() || maxCurrentDate() && hour > currentHour();
+      }
+      function isMinuteDisabled(minute) {
+        if (checkHour() === currentHour()) {
+          return minCurrentDate() && minute < currentMinute() || maxCurrentDate() && minute > currentMinute();
+        }
+        return minCurrentDate() && checkHour() < currentHour() || maxCurrentDate() && checkHour() > currentHour();
+      }
+    }
+    const validateConfig = computed(() => {
+      const result = {};
+      if (isObject(props.validate)) {
+        const {
+          min_date,
+          max_date
+        } = props.validate;
+        if (min_date || max_date) {
+          result.isDateDisabled = isDateDisabled;
+          result.isTimeDisabled = isTimeDisabled;
+        }
+      }
+      return result;
+    });
+    const formatConfig = computed(() => {
+      return {
+        valueFormat: props.valueFormat,
+        format: props.valueFormat,
+        timePickerProps: {
+          format: generateTimeFormat(props.valueFormat)
+        }
+      };
+    });
+    function formatDate(value) {
+      if (!value)
+        return value;
+      return format(new Date(value), props.valueFormat);
+    }
+    watch(() => props.value, (value) => {
+      if (!value || formatDate(value) === value)
+        return;
+      emit("update:value", formatDate(value));
+    });
+    const valueRef = computed({
+      get: () => formatDate(props.value),
+      set: (value) => emit("update:value", value)
+    });
+    return () => createVNode(NDatePicker, mergeProps(validateConfig.value, formatConfig.value, {
+      "formatted-value": valueRef.value,
+      "onUpdate:formatted-value": ($event) => valueRef.value = $event
+    }), null);
+  }
+});
+const DATE = connect(script, mapProps(assignUpdateValue));
+
+export { DATE };