cnhis-design-vue 3.1.14-beta.13 → 3.1.14-beta.16

package/es/packages/big-table/style/index.css

@@ -389,12 +389,145 @@ body > .vxe-table--tooltip-wrapper {
 }
 .custom-big-table .domPropsInnerHTML-span {
   height: 100%;
+  /*         老版图标样式              */
 }
 .custom-big-table .domPropsInnerHTML-span img {
   display: inline-block;
   height: var(--tableImageHeight);
   width: var(--tableImageWidth);
 }
+.custom-big-table .domPropsInnerHTML-span .icon-dot-red {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: red;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(255, 0, 0, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-blue {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: blue;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(0, 0, 255, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-green {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: green;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(0, 128, 0, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-gray {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: gray;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(128, 128, 128, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-yellow {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: yellow;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(255, 255, 0, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-resolved {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #36be8c;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(54, 190, 140, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-huifu {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #42d0f6;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(66, 208, 246, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-close {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #718391;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(113, 131, 145, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-audit {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #f4ba32;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(244, 186, 50, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-design {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #927ce1;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(146, 124, 225, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-develop {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #4eb0ef;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(78, 176, 239, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-develop-complete {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #6381f9;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(99, 129, 249, 0.5);
+}
 .no-data-tip {
   display: flex;
   flex-direction: column;

package/es/packages/fabric-chart/src/FabricChart.js

@@ -164,7 +164,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           return {
             ...v,
             bigType: item.type,
-            titleStyle: item.style,
             unit: item.unit,
             dataIndex
           };

package/es/packages/fabric-chart/src/hooks/useLeft.js

@@ -15,7 +15,9 @@ function useLeft(canvas, propItems, emits, setPopup, pointTipProps, getXValue, g
     painHeight,
     iconsWidth,
     itemList,
-    painIndex
+    painIndex,
+    canvasWidth,
+    canvasHeight
   } = propItems;
   const mainScaleWidth = 9;
   const subScaleWidth = 5;
@@ -56,7 +58,7 @@ function useLeft(canvas, propItems, emits, setPopup, pointTipProps, getXValue, g
       value: `${item.title.slice(0, 2)}
 ${item.title.slice(-2)}`,
       ...defaultTextStyle,
-      ...item.titleStyle || {}
+      ...item.style || {}
     }, {
       left: iconsWidth,
       top: painOriginY.originY
@@ -167,7 +169,7 @@ ${item.title.slice(-2)}`,
     const list = JSON.parse(JSON.stringify(itemList));
     let topY = endY;
     const leftX = iconsWidth - left.icons.marginRight;
-    list.reverse().forEach((item, index) => {
+    list.reverse().forEach((item) => {
       topY -= 10;
       let title = item.title.replace(/(.{2})/g, "$1\n");
       if (title.endsWith("\n")) {
@@ -194,7 +196,9 @@ ${item.title.slice(-2)}`,
           unit: item.unit,
           type: item.bigType,
           dataIndex: item.dataIndex
-        }
+        },
+        originLeft: leftX,
+        originTop: topY - (text.height || 30) / 2
       });
       topY -= text.height || 30;
       setPointEvent(icon);
@@ -226,9 +230,16 @@ ${item.title.slice(-2)}`,
             });
           } else {
             console.log("\u5F53\u524D\u65F6\u95F4\u6BB5\u5185\u65E0\u53EF\u65B0\u589E\u8282\u70B9");
+            setRestore();
           }
+        } else {
+          setRestore();
         }
       }
+      function setRestore() {
+        point.setCoords();
+        point.set({ left: point.originLeft, top: point.originTop });
+      }
     });
   }
   onMounted(() => {

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

@@ -8,6 +8,9 @@ export declare const COMBINATION: import("vue").DefineComponent<{
     value: {
         type: StringConstructor;
     };
+    maxGroupNum: {
+        type: NumberConstructor;
+    };
     getProperties: {
         type: PropType<() => FieldItem[]>;
         default: () => never[];
@@ -20,6 +23,9 @@ export declare const COMBINATION: import("vue").DefineComponent<{
     value: {
         type: StringConstructor;
     };
+    maxGroupNum: {
+        type: NumberConstructor;
+    };
     getProperties: {
         type: PropType<() => FieldItem[]>;
         default: () => never[];

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,14 +33,31 @@ 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;
+    });
+    watch(maxGroupNum, (value) => {
+      if (groupNum.value <= value)
+        return;
+      groupNum.value = value;
+      _values.value.splice(groupNum.value);
+      emitChange();
+    }, {
+      immediate: true
+    });
     function add() {
-      combinationRepeat.value++;
+      groupNum.value++;
       _values.value.push({});
       emitChange();
     }
     function remove(idx) {
-      combinationRepeat.value--;
+      groupNum.value--;
       _values.value.splice(idx, 1);
       emitChange();
     }
@@ -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/select.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, watch, inject, computed, nextTick, createVNode } from 'vue';
+import { defineComponent, ref, inject, computed, watch, createVNode } from 'vue';
 import { isField } from '@formily/core';
 import { isEqual, cloneDeep } from 'lodash-es';
 import { InjectAsyncQueue, InjectionFormItemDepsCollector, InjectionChangeContextCollector } from '../../constants/index.js';
@@ -31,7 +31,6 @@ const script = defineComponent({
     emit
   }) {
     const remoteOptions = ref(null);
-    watch(remoteOptions, (o) => console.log("remoteOption", o));
     const lastSearch = ref("");
     const asyncQueue = inject(InjectAsyncQueue);
     const {
@@ -88,8 +87,7 @@ const script = defineComponent({
       remoteOptions.value = null;
       config && formItemDepsCollector.setDeps(fieldKey.value, config.dependKey || [], async () => {
         remoteOptions.value = null;
-        await nextTick();
-        props.value != null && await fetchData();
+        emit("update:value", null);
       });
       config && fetchData();
     }, {

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

@@ -3,6 +3,7 @@ export declare const TEXT: {
     props: {
         content: {};
         fieldItem: {};
+        value: {};
     };
 };
 export declare const BUTTON: {

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/useFieldListAdaptor.js

@@ -98,6 +98,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;

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

@@ -72,6 +72,7 @@ export declare type FieldItem = {
     suffixConfig: FieldItem[] | FieldItem;
     fieldType: 'string' | 'object' | 'array' | 'number' | 'void' | 'boolean' | 'datetime';
     content: string | FormRenderer | Record<string, FormRenderer>;
+    maxGroupNum: number;
     properties: FieldItem[];
     children: FieldItem[];
     componentProps: AnyObject;

package/es/packages/index.css

@@ -389,12 +389,145 @@ body > .vxe-table--tooltip-wrapper {
 }
 .custom-big-table .domPropsInnerHTML-span {
   height: 100%;
+  /*         老版图标样式              */
 }
 .custom-big-table .domPropsInnerHTML-span img {
   display: inline-block;
   height: var(--tableImageHeight);
   width: var(--tableImageWidth);
 }
+.custom-big-table .domPropsInnerHTML-span .icon-dot-red {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: red;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(255, 0, 0, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-blue {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: blue;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(0, 0, 255, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-green {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: green;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(0, 128, 0, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-gray {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: gray;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(128, 128, 128, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-yellow {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: yellow;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(255, 255, 0, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-resolved {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #36be8c;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(54, 190, 140, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-huifu {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #42d0f6;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(66, 208, 246, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-close {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #718391;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(113, 131, 145, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-audit {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #f4ba32;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(244, 186, 50, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-design {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #927ce1;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(146, 124, 225, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-develop {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #4eb0ef;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(78, 176, 239, 0.5);
+}
+.custom-big-table .domPropsInnerHTML-span .icon-dot-develop-complete {
+  width: 8px;
+  height: 8px;
+  -webkit-border-radius: 50%;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+  background: #6381f9;
+  display: inline-block;
+  margin-right: 6px;
+  box-shadow: 0px 2px 4px 0px rgba(99, 129, 249, 0.5);
+}
 .no-data-tip {
   display: flex;
   flex-direction: column;

package/es/packages/shortcut-provider/src/types/index.d.ts

@@ -8,19 +8,21 @@ export interface ShortcutSignatureInfo {
     alt?: boolean;
     key: string;
 }
-export interface ShortcutOption {
+export declare type ShortcutOption = {
     label: string | Render;
-    key?: string;
     defaultShortcut: ShortcutSignatureInfo;
-    order?: number;
-    debounce?: boolean;
-    debounceOption?: {
+    callback(): void;
+} & Partial<{
+    placeholder: string;
+    editPlaceholder: string;
+    key: string;
+    order: number;
+    debounce: boolean;
+    debounceOption: {
         duration?: number;
     };
-    beforeTrigger?(): void | Promise<unknown>;
-    callback(): void;
-    afterTrigger?(): void | Promise<unknown>;
-}
+    operation: Array<'disabled' | 'reset'>;
+}>;
 export interface ShortcutItem extends ShortcutOption {
     status: ShortcutStatus;
     currentKeySignature: string;

package/es/packages/shortcut-provider/src/utils/index.js

@@ -4,7 +4,7 @@ function isKeyboardEvent(event) {
 function normalizeSignatureInfo(info) {
   var _a, _b;
   let ctrl, shift, alt;
-  const key = (_b = (_a = info.key) == null ? void 0 : _a.toLowerCase()) != null ? _b : "";
+  const key = (_b = (_a = info.key) == null ? void 0 : _a.toUpperCase()) != null ? _b : "";
   if (isKeyboardEvent(info)) {
     ctrl = info.ctrlKey;
     shift = info.shiftKey;
@@ -18,18 +18,18 @@ function normalizeSignatureInfo(info) {
 }
 function getKeySignature(info) {
   const { ctrl, shift, alt, key } = normalizeSignatureInfo(info);
-  return `${ctrl ? "CTRL_" : ""}${shift ? "SHIFT_" : ""}${alt ? "ALT_" : ""}${key}`;
+  return `${ctrl ? "Ctrl_" : ""}${shift ? "Shift_" : ""}${alt ? "Alt_" : ""}${key}`;
 }
-const keyBlackList = ["control", "alt", "shift"];
+const keyBlackList = ["CONTROL", "ALT", "SHIFT"];
 const inBlackList = (key) => {
   return keyBlackList.includes(key);
 };
 function getDisplaySignature(info) {
   const { ctrl, shift, alt, key } = normalizeSignatureInfo(info);
-  return `${ctrl ? "ctrl+ " : ""}${alt ? "alt + " : ""}${shift ? "shift + " : ""}${inBlackList(key) ? "" : key}`;
+  return `${ctrl ? "Ctrl+ " : ""}${alt ? "Alt + " : ""}${shift ? "Shift + " : ""}${inBlackList(key) ? "" : key}`;
 }
 function transformKey2DisplaySignature(keySignature) {
-  return keySignature.toLowerCase().replace(/_/g, " + ");
+  return keySignature.replace(/_/g, " + ");
 }
 function isShortcutProvider(ele) {
   return ele && ele.getAttribute("is-shortcut-capture") != void 0;