cnhis-design-vue 3.4.0-beta.4 → 3.4.0-beta.41

package/es/components/fabric-chart/src/hooks/birthProcess/useBirthProcess.js

@@ -1,3 +1,4 @@
+import { i18n } from '../../../../../_virtual/_virtual_i18n-methods.js';
 import { fabric } from '../../../../../shared/utils/fabricjs/index.js';
 import { drawLine, drawArrow, drawPoint, defaultStyle, drawText, defaultTextStyle, drawTextAndIconGroup, defaultRectStyle } from '../useDraw.js';
 import { useGrid } from '../useGrid.js';
@@ -464,14 +465,7 @@ function useBirthProcess(canvas, propItems, emits, pointTipProps, pointMenuProps
           pointMenuProps.show = true;
           if (!event2.target) {
             pointMenuProps.target = null;
-            pointMenuProps.list = [function() {
-              var _a, _b, _c;
-              try {
-                return ((_a = window.getLanguageByCode) == null ? void 0 : _a.call(window, "10010.1.219")) || ((_c = (_b = window.top) == null ? void 0 : _b.getLanguageByCode) == null ? void 0 : _c.call(_b, "10010.1.219")) || "\u65B0\u589E\u8282\u70B9";
-              } catch (e) {
-                return "\u65B0\u589E\u8282\u70B9";
-              }
-            }()];
+            pointMenuProps.list = [i18n("10010.1.219", "\u65B0\u589E\u8282\u70B9")];
             yScaleValue.filter((item) => item.show).forEach((item) => {
               if (!getEqualXTypes([...gridPoints], x, "key").includes(item.key)) {
                 if (["cervix", "fetalPresentation"].includes(item.key) && y < originYCervix)
@@ -486,14 +480,7 @@ function useBirthProcess(canvas, propItems, emits, pointTipProps, pointMenuProps
             }
           } else {
             pointMenuProps.target = event2.target;
-            pointMenuProps.list = [function() {
-              var _a, _b, _c;
-              try {
-                return ((_a = window.getLanguageByCode) == null ? void 0 : _a.call(window, "10010.1.220")) || ((_c = (_b = window.top) == null ? void 0 : _b.getLanguageByCode) == null ? void 0 : _c.call(_b, "10010.1.220")) || "\u5220\u9664\u8282\u70B9";
-              } catch (e) {
-                return "\u5220\u9664\u8282\u70B9";
-              }
-            }()];
+            pointMenuProps.list = [i18n("10010.1.220", "\u5220\u9664\u8282\u70B9")];
             [...gridPoints].forEach((obj) => {
               if (obj.origin && obj.left === event2.target.left && obj.top === event2.target.top) {
                 pointMenuProps.list.push({

package/es/components/fabric-chart/src/hooks/birthProcess/useBirthProcessChart.js

@@ -22,26 +22,18 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
     redrawPoints: null,
     clickMenu: null
   });
-  const leftScales = computed(() => props.data.scaleValues.map((item) => {
-    var _a;
-    return {
-      ...item,
-      width: (_a = item.width) != null ? _a : 60
-    };
-  }).filter(({
-    layout = "left",
-    show = true
-  }) => layout === "left" && show));
-  const rightScales = computed(() => props.data.scaleValues.map((item) => {
-    var _a;
-    return {
-      ...item,
-      width: (_a = item.width) != null ? _a : 60
-    };
-  }).filter(({
-    layout = "left",
-    show = true
-  }) => layout === "right" && show));
+  const leftScales = computed(
+    () => props.data.scaleValues.map((item) => {
+      var _a;
+      return { ...item, width: (_a = item.width) != null ? _a : 60 };
+    }).filter(({ layout = "left", show = true }) => layout === "left" && show)
+  );
+  const rightScales = computed(
+    () => props.data.scaleValues.map((item) => {
+      var _a;
+      return { ...item, width: (_a = item.width) != null ? _a : 60 };
+    }).filter(({ layout = "left", show = true }) => layout === "right" && show)
+  );
   const leftAddAreaWidth = 30;
   const rightAddAreaWidth = computed(() => {
     var _a;
@@ -57,9 +49,7 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
   });
   const endX = computed(() => {
     var _a;
-    const {
-      width
-    } = props.data;
+    const { width } = props.data;
     const rightScalesWidth = (_a = rightScales.value) == null ? void 0 : _a.reduce((width2, item) => {
       width2 += item.width;
       return width2;
@@ -82,9 +72,7 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
     return [xAxisNumberTop ? 0 : p[0], xAxisNumberBottom ? 0 : p[1]];
   });
   const yCellHeight = computed(() => {
-    const {
-      height
-    } = props.data;
+    const { height } = props.data;
     const xAxisNumber = getxAxisNumber();
     return (height - padding.value.reduce((p1, p2) => p1 + p2, 0)) / (gridYNumber.value + xAxisNumber);
   });
@@ -94,9 +82,7 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
   });
   const originYCervix = computed(() => {
     var _a;
-    const {
-      scaleValues
-    } = props.data;
+    const { scaleValues } = props.data;
     const FHRisShow = (_a = scaleValues.find((item) => item.key === "FHR")) == null ? void 0 : _a.show;
     if (!FHRisShow && !originY.value)
       return originY.value;
@@ -106,47 +92,33 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
     return endY.value - padding.value[0] - max * spaceValue * yCellHeight.value;
   });
   const endY = computed(() => {
-    const {
-      height
-    } = props.data;
+    const { height } = props.data;
     const xAxisNumber = getxAxisNumber("bottom");
     return height - yCellHeight.value * xAxisNumber - padding.value[1];
   });
   const startTime = computed(() => getTime(props.data.xAxis.time.startTime));
   const timeXCell = computed(() => 1 * 60 * 60 * 1e3 / xCellWidth.value);
   const cervixYCell = computed(() => {
-    const {
-      scaleValues
-    } = props.data;
+    const { scaleValues } = props.data;
     const cervixItem = scaleValues.find((item) => item.key === "cervix");
     return yCellHeight.value / ((cervixItem == null ? void 0 : cervixItem.spaceValue) || 1);
   });
   const FHRYCell = computed(() => {
-    const {
-      scaleValues
-    } = props.data;
+    const { scaleValues } = props.data;
     const cervixItem = scaleValues.find((item) => item.key === "FHR");
     return yCellHeight.value / ((cervixItem == null ? void 0 : cervixItem.spaceValue) || 10);
   });
   const fetalPresentationYCell = computed(() => {
-    const {
-      scaleValues
-    } = props.data;
+    const { scaleValues } = props.data;
     const cervixItem = scaleValues.find((item) => item.key === "fetalPresentation");
     return yCellHeight.value / ((cervixItem == null ? void 0 : cervixItem.spaceValue) || 1);
   });
   const event = computed(() => {
     var _a;
-    return ((_a = props.data.grid) == null ? void 0 : _a.event) || {
-      selectable: true,
-      evented: true,
-      hovered: true
-    };
+    return ((_a = props.data.grid) == null ? void 0 : _a.event) || { selectable: true, evented: true, hovered: true };
   });
   function getxAxisNumber(position) {
-    const {
-      xAxis
-    } = props.data;
+    const { xAxis } = props.data;
     return Object.values(xAxis).reduce((num, item) => {
       if (item.show && (!position || position && item.position === position))
         num++;
@@ -156,10 +128,7 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
   const propItems = reactive({
     canvasWidth: props.data.width,
     canvasHeight: props.data.height,
-    borderStyle: {
-      ...defaultBorderStyle,
-      ...props.data.borderStyle || {}
-    },
+    borderStyle: { ...defaultBorderStyle, ...props.data.borderStyle || {} },
     selectionStyle: props.data.selectionStyle || {},
     grid: props.data.grid,
     other: props.data.other,
@@ -187,17 +156,24 @@ function useBirthProcessChart(canvas, props, emits, canvasRef, pointTipProps, po
     scalebarBorder: Reflect.has(props.data, "scalebarBorder") ? props.data.scalebarBorder : true,
     padding: padding.value
   });
-  watch(() => canvas.value, (value) => {
-    if (value)
-      init();
-  }, {
-    immediate: true
-  });
+  watch(
+    () => canvas.value,
+    (value) => {
+      if (value)
+        init();
+    },
+    {
+      immediate: true
+    }
+  );
   function init() {
-    const {
-      clickMenu: _clickMenu,
-      redrawPoints: _redrawPoints
-    } = useBirthProcess(canvas, propItems, emits, pointTipProps, pointMenuProps);
+    const { clickMenu: _clickMenu, redrawPoints: _redrawPoints } = useBirthProcess(
+      canvas,
+      propItems,
+      emits,
+      pointTipProps,
+      pointMenuProps
+    );
     exposeMethods.redrawPoints = _redrawPoints;
     exposeMethods.clickMenu = _clickMenu;
   }

package/es/components/fabric-chart/src/hooks/electrocardiogram/hooks/useDetailEvent.js

@@ -35,20 +35,10 @@ function useDetailEvent(polyline, options) {
     lineStartIndex,
     xCellWidth,
     yCellHeight,
-    grid: gridOptions = {
-      subLineStyle: {},
-      mainLineStyle: {
-        x: {},
-        y: {}
-      }
-    }
+    grid: gridOptions = { subLineStyle: {}, mainLineStyle: { x: {}, y: {} } }
   } = options;
   let detailGroup = null;
-  const {
-    computedX,
-    computedY,
-    getYValue
-  } = useElectrocardiogramCumputedPoint(options);
+  const { computedX, computedY, getYValue } = useElectrocardiogramCumputedPoint(options);
   function computedWidthByX(x) {
     return computedX(x) * scale;
   }
@@ -58,6 +48,7 @@ function useDetailEvent(polyline, options) {
   function calcPointData(y) {
     return getYValue(y / scale);
   }
+  const detailCellWidth = xCellWidth * scale;
   const detailCellHeight = yCellHeight * scale;
   function clearDetailGroup() {
     var _a;
@@ -72,10 +63,8 @@ function useDetailEvent(polyline, options) {
     const target = event.target;
     if (!target.points)
       return;
-    const {
-      x: pointerX,
-      y: pointerY
-    } = event.pointer;
+    const mainXLineOffsetX = event.pointer.x % xCellWidth;
+    const { x: pointerX, y: pointerY } = event.pointer;
     const currentIdx = Math.floor((pointerX - target.left) / target.width * target.points.length) + lineStartIndex;
     let startIdx = currentIdx - detailRadius;
     let endIdx = currentIdx + detailRadius;
@@ -109,13 +98,13 @@ function useDetailEvent(polyline, options) {
     };
     clearDetailGroup();
     detailGroup = new fabric.Group();
-    const objects = [createWrapper(), createGrid(detailPoints, targetIdx), createMainLine(detailPoints.map(({
-      x,
-      y
-    }) => ({
-      x,
-      y: -y
-    }))), createSupportLines(detailPoints, targetIdx), createCurrentPoint(detailPoints, targetIdx)];
+    const objects = [
+      createWrapper(),
+      createGrid(detailPoints, targetIdx),
+      createMainLine(detailPoints.map(({ x, y }) => ({ x, y: -y }))),
+      createSupportLines(detailPoints, targetIdx),
+      createCurrentPoint(detailPoints, targetIdx)
+    ];
     showScaleText && objects.push(createScaleText());
     showNumberText && objects.push(createNumberText(detailPoints, targetIdx));
     detailGroup.add(...objects).addWithUpdate();
@@ -140,27 +129,34 @@ function useDetailEvent(polyline, options) {
     }
     function createGrid(points2, targetIdx2) {
       const subLineOptions = (idx) => idx % GRID_SUBLINE_NUMBER ? gridOptions.subLineStyle : null;
-      const subLineSpace = detailCellHeight / GRID_SUBLINE_NUMBER;
+      const subLineSpaceY = detailCellHeight / GRID_SUBLINE_NUMBER;
+      const subLineSpaceX = detailCellWidth / GRID_SUBLINE_NUMBER;
       const zeroPointY = EMPTY_TOP_SPACE + points2[maxIdx].y / Math.abs(points2[maxIdx].y - points2[minIdx].y) * polylineHeight;
-      const yTopCellNumber = Math.ceil(zeroPointY / subLineSpace);
-      const yBottomCellNumber = Math.ceil((renderHeight - zeroPointY) / subLineSpace);
+      const yTopCellNumber = Math.ceil(zeroPointY / subLineSpaceY);
+      const yBottomCellNumber = Math.ceil((renderHeight - zeroPointY) / subLineSpaceY);
       function createRowLine(y, idx) {
         return new fabric.Line([offset.x, offset.y + y, offset.x + renderWidth, offset.y + y], {
           ...gridOptions.mainLineStyle.x,
           ...subLineOptions(idx)
         });
       }
-      const rowLineGroup = new fabric.Group([...range(yBottomCellNumber).map((idx) => createRowLine(idx * subLineSpace + zeroPointY, idx)), ...range(yTopCellNumber).map((idx) => createRowLine(-(idx * subLineSpace) + zeroPointY, idx))]);
-      const currentPointX = targetIdx2 / points2.length * renderWidth;
-      const xLeftCellNumber = Math.ceil(currentPointX / subLineSpace);
-      const xRightCellNumber = Math.ceil((renderWidth - currentPointX) / subLineSpace);
+      const rowLineGroup = new fabric.Group([
+        ...range(yBottomCellNumber).map((idx) => createRowLine(idx * subLineSpaceY + zeroPointY, idx)),
+        ...range(yTopCellNumber).map((idx) => createRowLine(-(idx * subLineSpaceY) + zeroPointY, idx))
+      ]);
+      const currentPointX = targetIdx2 / points2.length * renderWidth - mainXLineOffsetX * scale;
+      const xLeftCellNumber = Math.ceil(currentPointX / subLineSpaceX);
+      const xRightCellNumber = Math.ceil((renderWidth - currentPointX) / subLineSpaceX);
       function createColumnLine(x, idx) {
         return new fabric.Line([offset.x + x, offset.y, offset.x + x, offset.y + renderHeight], {
           ...gridOptions.mainLineStyle.y,
-          ...idx === 0 ? gridOptions.subLineStyle : subLineOptions(idx)
+          ...subLineOptions(idx)
         });
       }
-      const columnLineGroup = new fabric.Group([...range(xRightCellNumber).map((idx) => createColumnLine(idx * subLineSpace + currentPointX, idx)), ...range(xLeftCellNumber).map((idx) => createColumnLine(-(idx * subLineSpace) + currentPointX, idx))]);
+      const columnLineGroup = new fabric.Group([
+        ...range(xRightCellNumber).map((idx) => createColumnLine(idx * subLineSpaceX + currentPointX, idx)),
+        ...range(xLeftCellNumber).map((idx) => createColumnLine(-(idx * subLineSpaceX) + currentPointX, idx))
+      ]);
       return new fabric.Group([columnLineGroup, rowLineGroup]);
     }
     function createMainLine(detailPoints2) {
@@ -217,6 +213,7 @@ function useDetailEvent(polyline, options) {
     function createScaleText() {
       return new fabric.Text(`x${scale}`, {
         ...defaultStyle,
+        objectCaching: false,
         fill: "black",
         fontSize: 20,
         left: offset.x + 10,
@@ -225,6 +222,7 @@ function useDetailEvent(polyline, options) {
     }
     function createNumberText(points2, targetIdx2) {
       const defaultTextOptions = {
+        objectCaching: false,
         fontSize: 16,
         left: offset.x + renderWidth / 2 + 10
       };
@@ -247,7 +245,7 @@ function useDetailEvent(polyline, options) {
         fill: CURRENT_COLOR,
         top: offset.y + renderHeight - SPACE * 3
       });
-      return new fabric.Group([maxText, minText, currentText]);
+      return new fabric.Group([maxText, minText, currentText], { objectCaching: false });
     }
   });
   polyline.on("mouseup", async (event) => {

package/es/components/fabric-chart/src/hooks/electrocardiogram/useElectrocardiogram.js

@@ -18,10 +18,7 @@ import '../surgicalAnesthesia/useOther.js';
 import '../../../../../shared/utils/index.js';
 
 function useElectrocardiogram(canvas, propItems, flag) {
-  const {
-    computedX,
-    computedY
-  } = useElectrocardiogramCumputedPoint(propItems);
+  const { computedX, computedY } = useElectrocardiogramCumputedPoint(propItems);
   const {
     borderStyle,
     originX,
@@ -37,6 +34,7 @@ function useElectrocardiogram(canvas, propItems, flag) {
     rowNumber,
     lineStyle,
     titleStyle,
+    titleOffset,
     config,
     calibrationLineHeight
   } = propItems;
@@ -68,17 +66,15 @@ function useElectrocardiogram(canvas, propItems, flag) {
     dataList.forEach((lineItem, idx) => {
       if (idx === dataList.length - 1 && arguments.length)
         return;
-      const {
-        x,
-        y,
-        rowIdx
-      } = lineItem.origin;
+      const { x, y, rowIdx, limitX } = lineItem.origin;
       const showLength = getShowLength(lineItem.data);
       const points = lineItem.data.reduce((res, value, _idx) => {
-        const _res = idx < ECG.MAXLINENUMBER - 1 && _idx >= startIdx && _idx <= startIdx + showLength || idx === ECG.MAXLINENUMBER - 1 ? [{
-          x: computedX(res.length + 1),
-          y: computedY(-+value) + y
-        }] : [];
+        let _res = idx < ECG.MAXLINENUMBER - 1 && _idx >= startIdx && _idx <= startIdx + showLength || idx === ECG.MAXLINENUMBER - 1 ? [{ x: computedX(res.length + 1), y: computedY(-+value) + y }] : [];
+        if (_res.length) {
+          if (idx < ECG.MAXLINENUMBER - 1 && _res[0].x > limitX) {
+            _res = [];
+          }
+        }
         return res.concat(_res);
       }, []);
       const polyline = new fabric.Polyline(points, {
@@ -91,7 +87,7 @@ function useElectrocardiogram(canvas, propItems, flag) {
         hoverCursor: "default",
         lockMovementX: true,
         lockMovementY: true,
-        objectCaching: true,
+        objectCaching: false,
         evented: true,
         selectable: true
       });
@@ -114,56 +110,64 @@ function useElectrocardiogram(canvas, propItems, flag) {
       }
       if (arguments.length)
         return;
-      drawCalibrationLine({
-        x,
-        y
-      }, lineStyle);
-      const title = new fabric.Text(String(lineItem.title), {
-        ...titleStyle,
-        left: x + (columnNumber === 4 ? xCellWidth : xCellWidth / 2),
-        top: y,
-        originX: "left",
-        originY: "bottom"
-      });
-      fixedPointsCache.add(title);
+      drawCalibrationLine({ x, y }, lineStyle);
+      drawTitle(lineItem, x, y);
     });
     const renderObjects = arguments.length ? [...gridPoints] : [...gridPoints, ...fixedPointsCache];
     canvas.value.add(...renderObjects);
   }
+  function drawTitle(lineItem, x, y) {
+    var _a, _b;
+    if (!lineItem.title)
+      return;
+    const titleOriginX = x + (columnNumber === 4 ? xCellWidth : xCellWidth / 2);
+    const titleX = titleOriginX + ((_a = titleOffset == null ? void 0 : titleOffset.x) != null ? _a : 0);
+    const titleY = y + ((_b = titleOffset == null ? void 0 : titleOffset.y) != null ? _b : 0);
+    const title = new fabric.Text(String(lineItem.title), {
+      ...titleStyle,
+      left: titleX,
+      top: titleY,
+      originX: "left",
+      originY: "bottom",
+      objectCaching: false
+    });
+    fixedPointsCache.add(title);
+  }
   function bindPointEvent(polyline, options) {
     useDetailEvent(polyline, options);
   }
-  function drawCalibrationLine({
-    x,
-    y
-  }, lineStyle2) {
+  function drawCalibrationLine({ x, y }, lineStyle2) {
     const originX2 = x - xCellWidth;
     const minCellWidth = xCellWidth / ECG.SMALLCELLNUMBER;
-    const line = new fabric.Polyline([{
-      x: originX2,
-      y
-    }, {
-      x: originX2 + minCellWidth,
-      y
-    }, {
-      x: originX2 + minCellWidth,
-      y: y - calibrationLineHeight
-    }, {
-      x: originX2 + minCellWidth * 3,
-      y: y - calibrationLineHeight
-    }, {
-      x: originX2 + minCellWidth * 3,
-      y
-    }, {
-      x: originX2 + minCellWidth * 4,
-      y
-    }], {
-      ...lineStyle2,
-      fill: "transparent",
-      strokeWidth: 1,
-      left: originX2,
-      ...defaultStyle
-    });
+    const line = new fabric.Polyline(
+      [
+        {
+          x: originX2,
+          y
+        },
+        {
+          x: originX2 + minCellWidth,
+          y
+        },
+        {
+          x: originX2 + minCellWidth,
+          y: y - calibrationLineHeight
+        },
+        {
+          x: originX2 + minCellWidth * 3,
+          y: y - calibrationLineHeight
+        },
+        {
+          x: originX2 + minCellWidth * 3,
+          y
+        },
+        {
+          x: originX2 + minCellWidth * 4,
+          y
+        }
+      ],
+      { ...lineStyle2, fill: "transparent", strokeWidth: 1, left: originX2, ...defaultStyle }
+    );
     fixedPointsCache.add(line);
   }
   function drawDivider() {
@@ -200,9 +204,7 @@ function useElectrocardiogram(canvas, propItems, flag) {
     });
   }, 150);
   function drawBorder() {
-    const {
-      strokeWidth
-    } = borderStyle;
+    const { strokeWidth } = borderStyle;
     const border = new fabric.Rect({
       ...borderStyle,
       width: canvasWidth - strokeWidth,