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

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

@@ -9,7 +9,7 @@ import { useLeft } from './hooks/useLeft.js';
 import { useRight } from './hooks/useRight.js';
 import { useBottom } from './hooks/useBottom.js';
 import { useOther } from './hooks/useOther.js';
-import { useEvent } from './hooks/useEvent.js';
+import { useEvent, useCanvasEvent } from './hooks/useEvent.js';
 import script$1 from './components/PopupTip.vue_vue_type_script_setup_true_lang.js';
 import { useCumputedPoint } from './hooks/useCumputedPoint.js';
 
@@ -19,10 +19,11 @@ var script = /* @__PURE__ */ defineComponent({
     data: { type: null, required: true },
     addRenderItem: { type: Function, required: false }
   },
-  emits: ["change", "add"],
-  setup(__props, { emit: emits }) {
+  emits: ["change", "add", "select"],
+  setup(__props, { expose, emit: emits }) {
     const props = __props;
     const defaultHeight = 15;
+    let select = ref();
     const canvasRef = ref(null);
     let canvas = ref();
     const dateHeight = computed(() => {
@@ -53,11 +54,11 @@ var script = /* @__PURE__ */ defineComponent({
     });
     const gridXNumber = computed(() => {
       const { grid } = props.data;
-      return grid.mainXCell * grid.subXCell;
+      return grid.mainXCell * grid.subXCell + grid.surplusXCell;
     });
     const gridYNumber = computed(() => {
       const { grid } = props.data;
-      return grid.mainYCell * grid.subYCell;
+      return grid.mainYCell * grid.subYCell + grid.surplusYCell;
     });
     const endX = computed(() => {
       const { width, right = null, top } = props.data;
@@ -66,6 +67,10 @@ var script = /* @__PURE__ */ defineComponent({
       const endWidth = right.width || 50;
       return width - endWidth;
     });
+    const endXLimit = computed(() => {
+      const { grid } = props.data;
+      return endX.value - grid.surplusXCell * xCellWidth.value;
+    });
     const originX = computed(() => {
       const { top, left } = props.data;
       const originX2 = top.titleWidth + iconsWidth.value;
@@ -85,6 +90,10 @@ var script = /* @__PURE__ */ defineComponent({
       const topHeight = dateHeight.value + dayHeight + xScaleHeight + hospitalDaysHeight.value + operationDaysHeight.value;
       return topHeight;
     });
+    const originYLimit = computed(() => {
+      const { grid } = props.data;
+      return originY.value + grid.surplusYCell * yCellHeight.value;
+    });
     const xCellWidth = computed(() => {
       return (endX.value - originX.value) / gridXNumber.value;
     });
@@ -177,8 +186,8 @@ var script = /* @__PURE__ */ defineComponent({
         endY: endY.value
       };
       if (painIndex.value === 0) {
-        obj.originY = originY.value;
-        obj.endY = originY.value + painHeight.value;
+        obj.originY = originYLimit.value;
+        obj.endY = originYLimit.value + painHeight.value;
       } else if (painIndex.value === left.yScaleValue.length - 1) {
         obj.originY = endY.value - painHeight.value;
         obj.endY = endY.value;
@@ -192,22 +201,37 @@ var script = /* @__PURE__ */ defineComponent({
         endY: endY.value
       };
       if (painIndex.value === 0) {
-        obj.originY = originY.value + painHeight.value;
+        obj.originY = originYLimit.value + painHeight.value;
         obj.endY = endY.value;
       } else if (painIndex.value === left.yScaleValue.length - 1) {
-        obj.originY = originY.value;
+        obj.originY = originYLimit.value;
         obj.endY = endY.value - painHeight.value;
       }
       return obj;
     });
+    const topList = computed(() => {
+      const { top } = props.data;
+      let topList2 = [];
+      for (let i in top) {
+        if (top[i].show) {
+          topList2.push({
+            ...top[i],
+            key: i
+          });
+        }
+      }
+      return topList2.sort((a, b) => a.seq - b.seq);
+    });
     const propItems = reactive({
       canvasWidth: props.data.width,
       canvasHeight: props.data.height,
       borderStyle: props.data.borderStyle || defaultBorderStyle,
+      selectionStyle: props.data.selectionStyle || {},
       dateHeight: dateHeight.value,
       hospitalDaysHeight: hospitalDaysHeight.value,
       operationDaysHeight: operationDaysHeight.value,
       xScalevalueHeight: xScalevalueHeight.value,
+      topList: topList.value,
       breathingHeight: breathingHeight.value,
       grid: props.data.grid,
       top: props.data.top,
@@ -224,7 +248,9 @@ var script = /* @__PURE__ */ defineComponent({
       iconsWidth: iconsWidth.value,
       originX: originX.value,
       originY: originY.value,
+      originYLimit: originYLimit.value,
       endX: endX.value,
+      endXLimit: endXLimit.value,
       endY: endY.value,
       xCellWidth: xCellWidth.value,
       yCellHeight: yCellHeight.value,
@@ -253,11 +279,16 @@ var script = /* @__PURE__ */ defineComponent({
         fireRightClick: true
       });
       useEvent(canvasRef.value);
+      const { select: selectFunc } = useCanvasEvent(canvas, propItems, emits);
+      select.value = selectFunc;
     });
     onBeforeUnmount(() => {
       canvas.value.clear();
       canvas.value = null;
     });
+    expose({
+      select
+    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
         createElementVNode("canvas", {

package/es/packages/fabric-chart/src/hooks/index.d.ts

@@ -1,4 +1,4 @@
-export { defaultBorderStyle } from './useDraw';
+export * from './useDraw';
 export * from './useCumputedPoint';
 export * from './useTop';
 export * from './useLeft';

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

@@ -1,4 +1,4 @@
-export { defaultBorderStyle } from './useDraw.js';
+export { defaultBorderStyle, defaultLineStyle, defaultRectStyle, defaultStyle, defaultTextStyle, drawLine, drawPoint, drawTextGroup } from './useDraw.js';
 export { useCumputedPoint } from './useCumputedPoint.js';
 export { useTop } from './useTop.js';
 export { useLeft } from './useLeft.js';
@@ -6,4 +6,4 @@ export { useRight } from './useRight.js';
 export { useCenter } from './useCenter.js';
 export { useBottom } from './useBottom.js';
 export { useOther } from './useOther.js';
-export { useEvent } from './useEvent.js';
+export { useCanvasEvent, useEvent } from './useEvent.js';

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

@@ -88,19 +88,26 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
       }
       const [data1, data2] = copyDataList;
       const getPoint = (item) => {
-        return item.x && item.y ? {
-          x: item.x,
-          y: item.y
-        } : {
-          x: cumputedX(item.time),
-          y: cumputedY(pulseObj.type, pulseObj.list, item.value)
-        };
+        if (item.x && item.y) {
+          return {
+            x: item.x,
+            y: item.y
+          };
+        }
+        if (isEffectiveNode(item) && isLimit(item.time)) {
+          let y = cumputedY(pulseObj.type, pulseObj.list, item.value);
+          y = y < vitalSignsOriginY.originY ? vitalSignsOriginY.originY : y > vitalSignsOriginY.endY ? vitalSignsOriginY.endY : y;
+          return {
+            x: cumputedX(item.time),
+            y
+          };
+        }
       };
       data1.list.forEach((item, index) => {
         const point1 = getPoint(item);
         const item2 = data2.list[index];
         const point2 = item2 ? getPoint(item2) : null;
-        if (point2 && point1.x === point2.x && point1.y !== point2.y) {
+        if (point1 && point2 && point1.x === point2.x && point1.y !== point2.y) {
           points1.push(point1);
           points2.push(point2);
           const itemPrev = data1.list[index - 1];
@@ -108,12 +115,12 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
           const itemNext2 = data2.list[index + 1];
           if (itemPrev && points1.length === 1) {
             const point = getPoint(itemPrev);
-            points1.unshift(point);
+            point && points1.unshift(point);
           }
           if (itemNext && itemNext2) {
             const pointNext = getPoint(itemNext);
             const pointNext2 = getPoint(itemNext2);
-            if (pointNext.x === pointNext2.x && pointNext.y === pointNext2.y) {
+            if (pointNext && pointNext2 && pointNext.x === pointNext2.x && pointNext.y === pointNext2.y) {
               points1.push(pointNext);
             }
           } else {
@@ -349,13 +356,11 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
           coolPoint && otherList.push(coolPoint);
         }
       }
-      let line;
       let point;
-      let previousLine;
-      line = points && nextPoint && !v.breakpoint ? drawLine([...points, ...nextPoint], {
+      const line = points && nextPoint && !v.breakpoint ? drawLine([...points, ...nextPoint], {
         ...lineAttr
       }) : null;
-      previousLine = lineList[index - 1];
+      const previousLine = lineList[index - 1];
       const pointAttrNew = {
         origin: {
           data: v,

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

@@ -62,6 +62,7 @@ function drawPoint(type = "circle", style) {
     originY: "center",
     hasControls: false,
     hasBorders: false,
+    hoverCursor: "pointer",
     ...style
   };
   const createCircleBorder = () => {

package/es/packages/fabric-chart/src/hooks/useEvent.d.ts

@@ -1 +1,7 @@
+import { Ref } from 'vue';
+import { fabric } from '../utils';
+import { IPropItems } from '../interface';
 export declare function useEvent(element: HTMLCanvasElement | any): void;
+export declare function useCanvasEvent(canvas: Ref<fabric.Canvas>, propItems: IPropItems, emits: any): {
+    select: (key: string) => void;
+};

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

@@ -1,4 +1,5 @@
 import { useEventListener } from '@vueuse/core';
+import { fabric } from '../utils/index.js';
 
 function useEvent(element) {
   useEventListener(element.nextSibling, "contextmenu", (e) => {
@@ -6,5 +7,70 @@ function useEvent(element) {
     return false;
   });
 }
+function useCanvasEvent(canvas, propItems, emits) {
+  const { originY, originX, endX, endY, iconsWidth, selectionStyle, topList } = propItems;
+  function drawRect(options, key) {
+    const { left, top, width, height } = options;
+    const rect = new fabric.Rect({
+      key,
+      left: left != null ? left : 0,
+      top: top != null ? top : 0,
+      width,
+      height,
+      stroke: "transparent",
+      strokeWidth: 1,
+      fill: "transparent",
+      lockMovementX: true,
+      lockMovementY: true,
+      transparentCorners: false,
+      ...selectionStyle
+    });
+    canvas.value.add(rect);
+    rect.on("mousedown", () => {
+      emits("select", key);
+    });
+    return rect;
+  }
+  function initSelection() {
+    if (typeof (selectionStyle == null ? void 0 : selectionStyle.evented) === "boolean" && !(selectionStyle == null ? void 0 : selectionStyle.evented))
+      return;
+    const selections2 = [];
+    selections2.push(drawRect({
+      left: iconsWidth,
+      top: originY,
+      width: originX - iconsWidth,
+      height: endY
+    }, "left"));
+    let topY = 0;
+    topList.forEach((item, index) => {
+      if (index > 0) {
+        topY += propItems[`${topList[index - 1].key}Height`];
+      }
+      selections2.push(drawRect({
+        left: iconsWidth,
+        top: topY,
+        width: endX - iconsWidth,
+        height: propItems[`${item.key}Height`]
+      }, item.key));
+    });
+    selections2.push(drawRect({
+      left: originX,
+      top: originY,
+      width: endX - originX,
+      height: endY - originY
+    }, "grid"));
+    canvas.value.renderAll();
+    return selections2;
+  }
+  const selections = initSelection();
+  function select(key) {
+    canvas.value.discardActiveObject();
+    canvas.value.renderAll();
+    const obj = selections == null ? void 0 : selections.find((obj2) => obj2.key === key);
+    obj && obj.bringToFront();
+    obj && canvas.value.setActiveObject(obj);
+  }
+  return { select };
+}
 
-export { useEvent };
+export { useCanvasEvent, useEvent };

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

@@ -9,13 +9,13 @@ function useLeft(canvas, propItems, emits, setPopup, pointTipProps, getXValue, g
     originX,
     endX,
     yCellHeight,
-    borderStyle,
     left,
     vitalSignsOriginY,
     painOriginY,
     painHeight,
     iconsWidth,
-    itemList
+    itemList,
+    painIndex
   } = propItems;
   const mainScaleWidth = 9;
   const subScaleWidth = 5;
@@ -86,7 +86,7 @@ ${item.title.slice(-2)}`,
     title.sendToBack();
   }
   function drawScaleValue() {
-    let groupList = [];
+    const groupList = [];
     const column = !painHeight ? left.yScaleValue.length : left.yScaleValue.length - 1;
     const colWidth = (originX - iconsWidth) / column;
     const residue = (originX - iconsWidth) % column;
@@ -96,10 +96,17 @@ ${item.title.slice(-2)}`,
         drwaPainScaleValue(item);
         return;
       }
-      let list = [];
+      const list = [];
+      function createLine(points) {
+        const line2 = new fabric.Line(points, {
+          ...defaultBorderStyle,
+          ...item.style
+        });
+        list.push(line2);
+      }
       const rectWidth = index === 0 ? firstColWidth : colWidth;
       const rectLeft = index === 0 ? iconsWidth : firstColWidth + iconsWidth + (index - 1) * colWidth;
-      const line = index > 0 ? new fabric.Line([rectLeft, vitalSignsOriginY.originY, rectLeft, vitalSignsOriginY.endY], {
+      const line = index > 0 ? new fabric.Line([rectLeft, painIndex == 0 ? vitalSignsOriginY.originY : originY, rectLeft, vitalSignsOriginY.endY], {
         ...defaultBorderStyle
       }) : null;
       line && list.push(line);
@@ -118,13 +125,6 @@ ${item.title.slice(-2)}`,
           if (item.showScale && i !== item.list.length - 1) {
             for (let j = 0; j < 5; j++) {
               if (j > 0 || !item.showNumber || position !== "center") {
-                let createLine = function(points) {
-                  const line2 = new fabric.Line(points, {
-                    ...defaultBorderStyle,
-                    ...item.style
-                  });
-                  list.push(line2);
-                };
                 const x1 = j == 0 ? lineXMain[0] : lineXSub[0];
                 const x2 = j == 0 ? lineXMain[1] : lineXSub[1];
                 const y = top - j * spaceScale;
@@ -164,9 +164,9 @@ ${item.title.slice(-2)}`,
     group && group.sendToBack();
   }
   function drawIcons() {
-    let list = JSON.parse(JSON.stringify(itemList));
+    const list = JSON.parse(JSON.stringify(itemList));
     let topY = endY;
-    let leftX = iconsWidth - left.icons.marginRight;
+    const leftX = iconsWidth - left.icons.marginRight;
     list.reverse().forEach((item, index) => {
       topY -= 10;
       let title = item.title.replace(/(.{2})/g, "$1\n");

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

@@ -3,25 +3,14 @@ import { fabric } from '../utils/index.js';
 import { defaultBorderStyle, defaultRectStyle, defaultStyle } from './useDraw.js';
 
 function useRight(canvas, propItems) {
-  const {
-    endX,
-    endY,
-    temperatureYCell,
-    canvasWidth,
-    canvasHeight,
-    left,
-    right,
-    breathingHeight,
-    vitalSignsOriginY,
-    painOriginY
-  } = propItems;
+  const { endX, endY, temperatureYCell, canvasWidth, canvasHeight, left, right, breathingHeight, vitalSignsOriginY } = propItems;
   function drawScaleValue() {
     var _a, _b, _c;
     if (!right) {
       canvas.value.add(new fabric.Line([canvasWidth - 1, 0, canvasWidth - 1, canvasHeight], defaultBorderStyle));
       return false;
     }
-    let list = [];
+    const list = [];
     list.push(new fabric.Rect({
       ...defaultRectStyle,
       width: canvasWidth - endX - 1,

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

@@ -1,34 +1,24 @@
 import { onMounted, nextTick } from 'vue';
 import { fabric } from '../utils/index.js';
-import { defaultStyle, drawTextGroup, defaultTextStyle, defaultRectStyle } from './useDraw.js';
+import { defaultBorderStyle, defaultStyle, drawTextGroup, defaultTextStyle, defaultRectStyle } from './useDraw.js';
 
 function useTop(canvas, propItems) {
   const {
-    originY,
     grid,
     originX,
     xCellWidth,
     gridXNumber,
     top,
-    dateHeight,
-    hospitalDaysHeight,
-    operationDaysHeight,
     xScalevalueHeight,
-    iconsWidth
+    iconsWidth,
+    topList,
+    endXLimit,
+    canvasWidth
   } = propItems;
   function drawTop() {
-    let list = [];
+    const list = [];
+    endXLimit && list.push(new fabric.Line([endXLimit, 0, canvasWidth, 0], defaultBorderStyle));
     let topY = 0;
-    let topList = [];
-    for (let i in top) {
-      if (top[i].show) {
-        topList.push({
-          ...top[i],
-          key: i
-        });
-      }
-    }
-    topList.sort((a, b) => a.seq - b.seq);
     topList.forEach((item, index) => {
       if (index > 0) {
         topY += propItems[`${topList[index - 1].key}Height`];
@@ -62,7 +52,7 @@ function useTop(canvas, propItems) {
       top: topY
     });
     list.push(title);
-    let timeList = [];
+    const timeList = [];
     for (let j = 0; j < grid.mainXCell; j++) {
       timeList.push(top.xScalevalue.list);
     }
@@ -89,7 +79,7 @@ function useTop(canvas, propItems) {
       return false;
     const height = top.dayHeight;
     const width = xCellWidth * grid.subSecondXCell;
-    const dayList = gridXNumber / grid.subSecondXCell;
+    const dayList = (gridXNumber - grid.surplusXCell) / grid.subSecondXCell;
     for (let i = 0; i < dayList; i++) {
       const left = originX + i * width;
       const value = i % 2 === 0 ? "\u4E0A\u5348" : "\u4E0B\u5348";
@@ -108,7 +98,7 @@ function useTop(canvas, propItems) {
     }
   }
   function drawDate(item, list, topY) {
-    let height = propItems[`${item.key}Height`];
+    const height = propItems[`${item.key}Height`];
     const title = drawTextGroup({
       width: originX - iconsWidth,
       height,

package/es/packages/fabric-chart/src/interface.d.ts

@@ -14,6 +14,8 @@ interface IGrid {
     subSecondXCell: number;
     mainYCell: number;
     subYCell: number;
+    surplusXCell: number;
+    surplusYCell: number;
     mainLineStyle?: ImainLineStyle;
     subLineStyle?: fabric.ILineOptions;
     subSecondLineStyle?: fabric.ILineOptions;
@@ -23,10 +25,12 @@ export interface IPropItems {
     canvasWidth: number;
     canvasHeight: number;
     borderStyle: fabric.ILineOptions;
+    selectionStyle: any;
     dateHeight: number;
     hospitalDaysHeight: number;
     operationDaysHeight: number;
     xScalevalueHeight: number;
+    topList: IDate[];
     breathingHeight: number;
     grid: IGrid;
     top: ITop;
@@ -43,7 +47,9 @@ export interface IPropItems {
     iconsWidth: number;
     originX: number;
     originY: number;
+    originYLimit: number;
     endX: number;
+    endXLimit: number;
     endY: number;
     xCellWidth: number;
     yCellHeight: number;
@@ -96,6 +102,7 @@ export interface IData {
     width: number;
     height: number;
     borderStyle?: fabric.ILineOptions;
+    selectionStyle?: any;
     grid: IGrid;
     other?: IOther;
     top: ITop;

package/es/packages/form-render/index.d.ts

@@ -409,7 +409,7 @@ declare const FormRender: SFCWithInstall<import("vue").DefineComponent<{
     }[]>;
     formHeight: import("vue").ComputedRef<any>;
     scrollTo: (id: string) => Promise<void>;
-    onScroll: () => Promise<void>;
+    onScroll: () => void;
     bindInfo: (info: import("../../../es/src/types").AnyObject) => import("../../../es/src/types").AnyObject;
     queryWidget: (key: string, wrapperElement: HTMLElement, fieldList: import("./src/types").FieldItem[]) => Promise<{
         widgetElement: HTMLInputElement | null | undefined;

package/es/packages/form-render/src/FormRender.vue.d.ts

@@ -409,7 +409,7 @@ declare const _default: import("vue").DefineComponent<{
     }[]>;
     formHeight: import("vue").ComputedRef<any>;
     scrollTo: (id: string) => Promise<void>;
-    onScroll: () => Promise<void>;
+    onScroll: () => void;
     bindInfo: (info: AnyObject) => AnyObject;
     queryWidget: (key: string, wrapperElement: HTMLElement, fieldList: FieldItem[]) => Promise<{
         widgetElement: HTMLInputElement | null | undefined;

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

@@ -8,7 +8,7 @@ declare type DependKeyObj = {
 declare type UrlConfig = {
     method: FormRequestType;
     nameKey: string;
-    dependKey: ArrayAble<string> | ArrayAble<DependKeyObj>;
+    dependKey: ArrayAble<string> | Record<string, string> | ArrayAble<DependKeyObj>;
     url: string;
     valueKey: string;
 };

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

@@ -1,8 +1,8 @@
 import { defineComponent, ref, inject, computed, watch, createVNode } from 'vue';
 import { isField } from '@formily/core';
-import { isObject, isString } from 'lodash-es';
+import { isObject } from 'lodash-es';
 import { InjectAsyncQueue } from '../../constants/index.js';
-import { assignUpdateValue, formRenderLog, arrayed } from '../../utils/index.js';
+import { assignUpdateValue, formRenderLog, traverseDependKey } from '../../utils/index.js';
 import { connect, mapProps } from '@formily/vue';
 import { NCascader } from 'naive-ui';
 import { useFormField } from '../../hooks/useFormField.js';
@@ -74,12 +74,8 @@ const script = defineComponent({
           lvlnr: deep + 1 + ""
         };
         if (option2 && config2.dependKey) {
-          arrayed(config2.dependKey).forEach((key) => {
-            if (isString(key)) {
-              params[key] = option2[valueKey.value];
-            } else if (isObject(key)) {
-              params[key.paramName] = option2[key.paramValue];
-            }
+          traverseDependKey(config2.dependKey, (dependKey, valueKey2) => {
+            params[valueKey2] = option2[dependKey];
           });
         }
         return {