cnhis-design-vue 3.1.14-beta.2 → 3.1.14-beta.5

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

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

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

@@ -0,0 +1,7 @@
+export declare const DATE: import("vue").DefineComponent<{
+    onChange: {};
+    value: {};
+}, () => 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<{
+    onChange: {};
+    value: {};
+}>>, {}>;

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

@@ -0,0 +1,83 @@
+import { defineComponent, createVNode } from 'vue';
+import { isField } from '@formily/core';
+import { connect, mapProps } from '@formily/vue';
+import { isObject } from '@vueuse/core';
+import { NDatePicker } from 'naive-ui';
+
+const script = defineComponent({
+  props: {
+    onChange: {},
+    value: {}
+  },
+  setup(_) {
+    return () => {
+      return createVNode(NDatePicker, null, null);
+    };
+  }
+});
+const DATE = connect(script, mapProps((props, field) => {
+  const _props = {
+    ...props
+  };
+  if (isField(field)) {
+    Object.assign(_props, {
+      "formatted-value": field.value,
+      "onUpdate:formatted-value"(v) {
+        field.setValue(v);
+      }
+    });
+    if (isObject(props.validate)) {
+      const {
+        min_date,
+        max_date
+      } = props.validate;
+      if (min_date || max_date) {
+        _props.isDateDisabled = isDateDisabled;
+        _props.isTimeDisabled = isTimeDisabled;
+      }
+    }
+  }
+  return _props;
+  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();
+    }
+  }
+}));
+
+export { DATE };

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

@@ -0,0 +1,9 @@
+export declare const FORM_ITEM: import("vue").DefineComponent<{
+    label: StringConstructor;
+    propertyKey: StringConstructor;
+    annotation: {};
+}, () => 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<{
+    label: StringConstructor;
+    propertyKey: StringConstructor;
+    annotation: {};
+}>>, {}>;

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

@@ -0,0 +1,157 @@
+import { defineComponent, inject, computed, ref, createVNode } from 'vue';
+import { isVoidField } from '@formily/core';
+import { connect, mapProps } from '@formily/vue';
+import { FileTrayFull, FileTray } from '@vicons/ionicons5';
+import { isBoolean } from 'lodash-es';
+import { NFormItem, NPopover, NIcon, NInput } from 'naive-ui';
+import { InjectionAnnotation } from '../../../../../packages/form-render/src/constants';
+
+const script = defineComponent({
+  props: {
+    label: String,
+    propertyKey: String,
+    annotation: {}
+  },
+  setup(props, {
+    slots
+  }) {
+    const annotation = inject(InjectionAnnotation);
+    const annotationContent = computed({
+      get() {
+        return annotation.value[props.propertyKey];
+      },
+      set(value) {
+        annotation.value = {
+          property: props.propertyKey,
+          value
+        };
+      }
+    });
+    function renderTextarea() {
+      return createVNode(NInput, {
+        "type": "textarea",
+        "value": annotationContent.value,
+        "onUpdate:value": ($event) => annotationContent.value = $event
+      }, null);
+    }
+    const __showPopper = ref(false);
+    const showPopper = computed({
+      get() {
+        return __showPopper.value;
+      },
+      async set(value) {
+        __showPopper.value = value;
+        if (!value && isEdit.value) {
+          await new Promise((resolve) => setTimeout(resolve, 200));
+          isEdit.value = false;
+        }
+      }
+    });
+    const isEdit = ref(false);
+    let clickTimer;
+    function iconClick() {
+      clearTimeout(clickTimer);
+      if (showPopper.value && isEdit.value) {
+        showPopper.value = false;
+        return;
+      }
+      clickTimer = setTimeout(() => {
+        if (!annotationContent.value) {
+          isEdit.value = showPopper.value = true;
+        }
+      }, 200);
+    }
+    function iconDbClick() {
+      clearTimeout(clickTimer);
+      if (!annotationContent.value)
+        return;
+      showPopper.value = true;
+      isEdit.value = true;
+    }
+    function iconMouseenter() {
+      if (!annotationContent.value)
+        return;
+      showPopper.value = true;
+    }
+    function iconMouseleave() {
+      if (!annotationContent.value || isEdit.value)
+        return;
+      showPopper.value = false;
+    }
+    function renderAnnotation() {
+      return createVNode("section", {
+        "class": ["form-render__formItemLabel--annotation", {
+          "is-active": !!annotationContent.value
+        }],
+        "style": {
+          "--icon-right": "-5"
+        },
+        "form-item-hover-show": !annotationContent.value && !isEdit.value
+      }, [createVNode(NPopover, {
+        "style": {
+          maxWidth: "200px",
+          wordBreak: "break-all"
+        },
+        "show": showPopper.value,
+        "onUpdate:show": ($event) => showPopper.value = $event,
+        "trigger": "manual",
+        "duration": 100
+      }, {
+        default: renderDefault,
+        trigger: renderTrigger
+      })]);
+      function renderText() {
+        return createVNode("span", null, [annotationContent.value]);
+      }
+      function renderDefault() {
+        return createVNode("div", null, [isEdit.value ? renderTextarea() : renderText()]);
+      }
+      function renderTrigger() {
+        return createVNode("div", {
+          "class": "form-render__formItemLabel--icon",
+          "onMouseleave": iconMouseleave,
+          "onMouseenter": iconMouseenter,
+          "onDblclick": iconDbClick,
+          "onClick": iconClick
+        }, [createVNode(NIcon, {
+          "component": annotationContent.value ? FileTrayFull : FileTray
+        }, null)]);
+      }
+    }
+    const showAnnotation = computed(() => {
+      return annotation.value && (!isBoolean(props.annotation) || props.annotation);
+    });
+    const showLabel = computed(() => props.label && props.label !== " ");
+    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, null, {
+      ...slots,
+      label: renderLabel
+    });
+  }
+});
+const FORM_ITEM = connect(script, mapProps({
+  title: "label"
+}, (props, field) => {
+  var _a;
+  const feedback = !isVoidField(field) ? field.selfErrors.length ? field.selfErrors.join(",") : void 0 : void 0;
+  return {
+    ...props,
+    required: field.required,
+    class: "form-render__formItem",
+    style: {
+      "--form-item-column": (_a = props.span) != null ? _a : 3
+    },
+    feedback,
+    "validation-status": feedback ? "error" : void 0
+  };
+}));
+
+export { FORM_ITEM };

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

@@ -0,0 +1,17 @@
+export * from './input';
+export * from './select';
+export * from './formItem';
+export * from './textarea';
+export * from './inputNumber';
+export * from './linebar';
+export * from './inputGroup';
+export * from './date';
+export * from './cascader';
+export * from './combination';
+export * from './checkbox';
+export * from './switch';
+export * from './radio';
+export * from './labelSelect';
+export * from './slider';
+export * from './complex';
+export * from './simpleComponent';

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

@@ -0,0 +1,17 @@
+export { INPUT } from './input.js';
+export { SELECT } from './select.js';
+export { FORM_ITEM } from './formItem.js';
+export { TEXTAREA } from './textarea.js';
+export { INPUT_NUMBER } from './inputNumber.js';
+export { LINEBAR } from './linebar.js';
+export { INPUT_GROUP } from './inputGroup.js';
+export { DATE } from './date.js';
+export { SEARCH_CASCADE } from './cascader.js';
+export { COMBINATION } from './combination.js';
+export { CHECKBOX } from './checkbox.js';
+export { SWITCH } from './switch.js';
+export { RADIO } from './radio.js';
+export { LABEL } from './labelSelect.js';
+export { SLIDER } from './slider.js';
+export { COMPLEX } from './complex.js';
+export { BUTTON, TEXT } from './simpleComponent.js';

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

@@ -0,0 +1,15 @@
+export declare const INPUT: import("vue").DefineComponent<{
+    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<{
+    prefix: {
+        type: StringConstructor;
+    };
+    suffix: {
+        type: StringConstructor;
+    };
+}>>, {}>;

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

@@ -0,0 +1,40 @@
+import { defineComponent, computed, createVNode, Fragment } from 'vue';
+import { createSlot, assignUpdateValue } from '../../utils/index.js';
+import { connect, mapProps } from '@formily/vue';
+import { NInput } from 'naive-ui';
+
+const script = defineComponent({
+  name: "FormInput",
+  props: {
+    prefix: {
+      type: String
+    },
+    suffix: {
+      type: String
+    }
+  },
+  setup(props, {
+    attrs
+  }) {
+    const _slots = computed(() => {
+      const res = {};
+      if (props.prefix) {
+        res.prefix = () => createVNode(Fragment, null, [createSlot(props.prefix, props).default()]);
+      }
+      if (props.suffix) {
+        res.suffix = () => createVNode(Fragment, null, [createSlot(props.suffix, props).default()]);
+      }
+      return res;
+    });
+    return () => {
+      return createVNode(NInput, attrs, _slots.value);
+    };
+  }
+});
+const INPUT = connect(script, mapProps((props, field) => {
+  const _props = assignUpdateValue(props, field);
+  _props.allowInput = (value) => !value.startsWith(" ") && !value.endsWith(" ");
+  return _props;
+}));
+
+export { INPUT };

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

@@ -0,0 +1,11 @@
+export declare const INPUT_GROUP: import("vue").DefineComponent<{
+    [x: string]: never;
+    [x: number]: never;
+    [x: symbol]: never;
+}, {
+    mergedClsPrefix: import("vue").ComputedRef<string>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    [x: string]: never;
+    [x: number]: never;
+    [x: symbol]: never;
+}>>, {}>;

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

@@ -0,0 +1,8 @@
+import { connect, mapProps } from '@formily/vue';
+import { NInputGroup } from 'naive-ui';
+
+const INPUT_GROUP = connect(NInputGroup, mapProps((props) => {
+  return { style: { "--column": props.span || 3 }, class: "form-render__inputGroup" };
+}));
+
+export { INPUT_GROUP };

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

@@ -0,0 +1,5 @@
+export declare const INPUT_NUMBER: import("vue").DefineComponent<{
+    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<{
+    onChange: {};
+}>>, {}>;

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

@@ -0,0 +1,18 @@
+import { defineComponent, createVNode } from 'vue';
+import { assignUpdateValue } from '../../utils/index.js';
+import { connect, mapProps } from '@formily/vue';
+import { NInputNumber } from 'naive-ui';
+
+const script = defineComponent({
+  props: {
+    onChange: {}
+  },
+  setup(_) {
+    return () => {
+      return createVNode(NInputNumber, null, null);
+    };
+  }
+});
+const INPUT_NUMBER = connect(script, mapProps(assignUpdateValue));
+
+export { INPUT_NUMBER };

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

@@ -0,0 +1 @@
+export declare const LABEL: import("vue").DefineComponent<{}, () => string, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;

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

@@ -0,0 +1,18 @@
+import { connect, mapProps } from '@formily/vue';
+import { defineComponent } from 'vue';
+
+const script = defineComponent({
+  name: "FormLabel",
+  setup(props) {
+    return () => {
+      return "";
+    };
+  }
+});
+const LABEL = connect(script, mapProps((props, field) => {
+  return {
+    ...props
+  };
+}));
+
+export { LABEL };

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

@@ -0,0 +1,40 @@
+export declare const LINEBAR: import("vue").DefineComponent<{
+    show: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    line: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        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<{
+    show: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    line: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    disabled: boolean;
+    title: string;
+    show: boolean;
+    line: boolean;
+}>;

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

@@ -0,0 +1,75 @@
+import { defineComponent, ref, onMounted, inject, createVNode } from 'vue';
+import { connect, mapProps } from '@formily/vue';
+import { NDivider, NCollapseTransition } from 'naive-ui';
+import { useFormField } from '../../../../../packages/form-render';
+import { InjectionFormItemDepsCollector, FormItemLineBarDepKeyPrepend } from '../../constants/index.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);
+    onMounted(() => {
+      _show.value = 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/packages/form-render/src/components/renderer/radio.d.ts

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

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

@@ -0,0 +1,45 @@
+import { defineComponent, 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: {},
+    options: {
+      type: Array,
+      default: () => []
+    },
+    vertical: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props) {
+    return () => {
+      return createVNode(NRadioGroup, {
+        "value": props.value
+      }, {
+        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 };