cnhis-design-vue 3.4.0-beta.7 → 3.4.0-beta.71

package/es/components/fabric-chart/src/hooks/surgicalAnesthesia/useSurgicalAnesthesiaChart.js

@@ -1,10 +1,10 @@
-import { reactive, ref, computed, unref, onMounted, nextTick, onBeforeUnmount, watch, toRefs } from 'vue';
+import { reactive, ref, onMounted, nextTick, onBeforeUnmount, watch, toRefs } from 'vue';
 import { useDialog } from 'naive-ui';
 import { defaultBorderStyle } from '../useDraw.js';
 import '../../../../../shared/utils/fabricjs/index.js';
 import { format } from 'date-fns';
 import { getChildrenSize } from '../../utils/index.js';
-import { cloneDeep, range, flatten, isFunction } from 'lodash-es';
+import { isFunction, cloneDeep, range, flatten } from 'lodash-es';
 import '../useEvent.js';
 import '../useShadow.js';
 import '../useCommon.js';
@@ -29,229 +29,173 @@ function useSurgicalAnesthesiaChart(canvas, props, emits, canvasRef, pointTipPro
   const pauseFlickerPoint = ref();
   let timeout = null;
   const oldChildrenSize = getChildrenSize(((_a = props.data.top) == null ? void 0 : _a.treeData) || []);
-  const layout = computed(
-    () => props.data.layout || {
+  function buildDerived() {
+    var _a2, _b, _c, _d, _e, _f;
+    const layout = props.data.layout || {
       top: "drug",
       center: "xAxis",
       bottom: "intraoperatively"
-    }
-  );
-  const originX = computed(() => {
-    var _a2;
-    return (_a2 = props.data.left.width) != null ? _a2 : 0;
-  });
-  const gridXNumber = computed(() => {
-    const { grid } = props.data;
-    return grid.mainXCell * grid.subXCell;
-  });
-  const gridYNumber = computed(() => {
+    };
+    const originX = (_a2 = props.data.left.width) != null ? _a2 : 0;
     const { grid } = props.data;
-    return grid.mainYCell * grid.subYCell;
-  });
-  const topGridYNumber = computed(() => {
+    const gridXNumber = grid.mainXCell * grid.subXCell;
+    const gridYNumber = grid.mainYCell * grid.subYCell;
     const { show = true, tree = {} } = props.data.top;
-    if (!show)
-      return 0;
     const { rowNumber = oldChildrenSize } = tree;
-    if (oldChildrenSize < rowNumber) {
-      return rowNumber;
-    }
-    return oldChildrenSize;
-  });
-  const topGridYCellHeight = computed(() => props.data.top.tree.cellHeight);
-  const topGridHeight = computed(() => topGridYCellHeight.value * topGridYNumber.value);
-  const topGridOriginY = computed(() => {
-    const currentLayout = getLayout("drug") || "top";
-    return getOriginTop(currentLayout);
-  });
-  const topGridEndY = computed(() => topGridOriginY.value + topGridHeight.value);
-  const startTime = computed(
-    () => {
-      var _a2;
-      return Date.parse(((_a2 = props.data.xAxis) == null ? void 0 : _a2.startTime) || format(new Date(), "yyyy-MM-dd HH:mm:ss"));
-    }
-  );
-  const xAxis = computed(() => {
+    const topGridYNumber = !show ? 0 : oldChildrenSize < rowNumber ? rowNumber : oldChildrenSize;
+    const topGridYCellHeight = props.data.top.tree.cellHeight;
+    const topGridHeight = topGridYCellHeight * topGridYNumber;
+    const startTime = Date.parse(((_b = props.data.xAxis) == null ? void 0 : _b.startTime) || format(new Date(), "yyyy-MM-dd HH:mm:ss"));
     const cloneXAxis = cloneDeep(props.data.xAxis);
     const { spaceValue, spaceTimeStamp } = cloneXAxis;
-    const list = range(gridXNumber.value / spaceValue + 1).map(
-      (n) => n === 0 ? cloneXAxis.startTime : format(new Date(startTime.value + n * spaceValue * spaceTimeStamp), "yyyy-MM-dd HH:mm:ss")
+    const list = range(gridXNumber / spaceValue + 1).map(
+      (n) => n === 0 ? cloneXAxis.startTime : format(new Date(startTime + n * spaceValue * spaceTimeStamp), "yyyy-MM-dd HH:mm:ss")
     );
-    return {
+    const xAxis = {
       ...cloneXAxis,
       list,
-      left: originX.value
+      left: originX
     };
-  });
-  const treeData = getTreeData();
-  const originYXAxis = computed(() => {
-    const currentLayout = getLayout("xAxis") || "center";
-    return getOriginTop(currentLayout);
-  });
-  const endX = computed(() => {
-    var _a2;
-    const { width, right } = props.data;
-    if (!right)
-      return width;
-    const endWidth = (_a2 = right.width) != null ? _a2 : 0;
-    return width - endWidth;
-  });
-  const originY = computed(() => {
-    const currentLayout = getLayout("intraoperatively") || "bottom";
-    return getOriginTop(currentLayout);
-  });
-  const extracorporealCirculationHeight = computed(() => {
-    var _a2;
-    const { show, height } = ((_a2 = props.data.other) == null ? void 0 : _a2.extracorporealCirculation) || {};
-    if (!show || !height)
-      return 0;
-    return height;
-  });
-  const markHeight = computed(() => {
-    var _a2;
-    const { show, height } = ((_a2 = props.data.other) == null ? void 0 : _a2.mark) || {};
-    if (!show || !height)
-      return 0;
-    return height;
-  });
-  const endY = computed(
-    () => originY.value + (props.data.height - topGridHeight.value - xAxis.value.height - markHeight.value - extracorporealCirculationHeight.value)
-  );
-  const xCellWidth = computed(() => (endX.value - originX.value) / gridXNumber.value);
-  const yCellHeight = computed(() => (endY.value - originY.value) / gridYNumber.value);
-  const timeXCell = computed(() => xAxis.value.spaceTimeStamp / xCellWidth.value);
-  const itemList = computed(() => {
-    const { scaleValues } = props.data;
-    return flatten(
-      scaleValues.map((item) => {
-        return item.dataList.filter((v) => v.show).map((v, dataIndex) => {
-          return {
-            ...v,
-            bigType: item.type,
-            unit: item.unit,
-            dataIndex
-          };
-        });
-      })
-    );
-  });
-  const pulseYCell = computed(() => computedYCell("pulse"));
-  const temperatureYCell = computed(() => computedYCell("temperature"));
-  const event = computed(() => {
-    var _a2;
-    return ((_a2 = props.data.grid) == null ? void 0 : _a2.event) || { selectable: true, evented: true, hovered: true };
-  });
-  const propItems = reactive({
-    canvasWidth: props.data.width,
-    canvasHeight: props.data.height,
-    borderStyle: { ...defaultBorderStyle, ...props.data.borderStyle },
-    pointSelectionStyle: props.data.pointSelectionStyle || {},
-    grid: props.data.grid,
-    top: props.data.top,
-    left: props.data.left,
-    other: props.data.other,
-    topGridYNumber: unref(topGridYNumber),
-    topGridYCellHeight: unref(topGridYCellHeight),
-    topGridOriginY: unref(topGridOriginY),
-    topGridEndY: unref(topGridEndY),
-    treeData,
-    getTreeData,
-    xAxis: unref(xAxis),
-    originYXAxis: unref(originYXAxis),
-    startTime: unref(startTime),
-    timeXCell: unref(timeXCell),
-    gridXNumber: unref(gridXNumber),
-    gridYNumber: unref(gridYNumber),
-    xCellWidth: unref(xCellWidth),
-    yCellHeight: unref(yCellHeight),
-    originX: unref(originX),
-    endX: unref(endX),
-    originY: unref(originY),
-    endY: unref(endY),
-    markHeight: unref(markHeight),
-    extracorporealCirculationHeight: unref(extracorporealCirculationHeight),
-    itemList: unref(itemList),
-    scaleValues: props.data.scaleValues,
-    pulseYCell: unref(pulseYCell),
-    temperatureYCell: unref(temperatureYCell),
-    event: unref(event),
-    dialog,
-    extraMenuConfig: props.data.extraMenuConfig || {}
-  });
-  function getLayout(moduleName) {
-    let layoutName = "";
-    Object.entries(layout.value).some(([key, value]) => {
-      if (value === moduleName) {
-        layoutName = key;
-        return true;
-      }
-      return;
-    });
-    return layoutName;
-  }
-  function getLayoutHeight(layoutName) {
-    const moduleName = layout.value[layoutName];
-    const xAxisHeight = xAxis.value.height;
-    switch (moduleName) {
-      case "drug":
-        return topGridHeight.value;
-      case "xAxis":
-        return xAxisHeight;
-      default:
-        return props.data.height - topGridHeight.value - xAxisHeight;
+    function getLayout(moduleName) {
+      let layoutName = "";
+      Object.entries(layout).some(([key, value]) => {
+        if (value === moduleName) {
+          layoutName = key;
+          return true;
+        }
+        return false;
+      });
+      return layoutName;
     }
-  }
-  function getOriginTop(layoutName) {
-    switch (layoutName) {
-      case "top":
-        return 0;
-      case "center":
-        return getLayoutHeight("top");
-      default:
-        return getLayoutHeight("top") + getLayoutHeight("center");
+    function getLayoutHeight(layoutName) {
+      const moduleName = layout[layoutName];
+      const xAxisHeight = xAxis.height;
+      switch (moduleName) {
+        case "drug":
+          return topGridHeight;
+        case "xAxis":
+          return xAxisHeight;
+        default:
+          return props.data.height - topGridHeight - xAxisHeight;
+      }
     }
-  }
-  function getTreeData() {
-    const { show = true, tree = {} } = props.data.top;
-    if (!show)
-      return [];
-    const cloneData = cloneDeep(props.data.top.treeData);
-    let levelRow = 0;
-    const { cellWidth, cellHeight } = props.data.top.tree;
-    const { rowNumber = oldChildrenSize } = tree;
-    if (oldChildrenSize < rowNumber) {
-      cloneData.push(...range(rowNumber - oldChildrenSize).map(() => ({})));
+    function getOriginTop(layoutName) {
+      switch (layoutName) {
+        case "top":
+          return 0;
+        case "center":
+          return getLayoutHeight("top");
+        default:
+          return getLayoutHeight("top") + getLayoutHeight("center");
+      }
     }
-    transferTree(cloneData);
-    function transferTree(treeData2, deep = 0) {
-      treeData2.forEach((item) => {
-        var _a2;
-        const other = {
-          top: levelRow * cellHeight + topGridOriginY.value,
-          left: deep * cellWidth,
-          width: cellWidth,
-          height: cellHeight,
-          uuid: uuidGenerator()
-        };
-        levelRow++;
-        if ((_a2 = item.children) == null ? void 0 : _a2.length) {
-          levelRow--;
-          const childrenSize = getChildrenSize(item.children);
-          other.height = childrenSize * cellHeight;
-          transferTree(item.children, deep + 1);
-        } else {
-          other.width = originX.value - other.left;
-        }
-        Object.assign(item, other);
-      });
+    const topGridOriginY = getOriginTop(getLayout("drug") || "top");
+    const topGridEndY = topGridOriginY + topGridHeight;
+    const originYXAxis = getOriginTop(getLayout("xAxis") || "center");
+    const { width, right } = props.data;
+    const endX = !right ? width : width - ((_c = right.width) != null ? _c : 0);
+    const originY = getOriginTop(getLayout("intraoperatively") || "bottom");
+    const { show: ecShow, height: ecHeight } = ((_d = props.data.other) == null ? void 0 : _d.extracorporealCirculation) || {};
+    const extracorporealCirculationHeight = !ecShow || !ecHeight ? 0 : ecHeight;
+    const { show: markShow, height: markH } = ((_e = props.data.other) == null ? void 0 : _e.mark) || {};
+    const markHeight = !markShow || !markH ? 0 : markH;
+    const endY = originY + (props.data.height - topGridHeight - xAxis.height - markHeight - extracorporealCirculationHeight);
+    const xCellWidth = (endX - originX) / gridXNumber;
+    const yCellHeight = (endY - originY) / gridYNumber;
+    const timeXCell = xAxis.spaceTimeStamp / xCellWidth;
+    const itemList = flatten(
+      props.data.scaleValues.map((item) => {
+        return item.dataList.filter((v) => v.show).map((v, dataIndex) => ({
+          ...v,
+          bigType: item.type,
+          unit: item.unit,
+          dataIndex
+        }));
+      })
+    );
+    function computedYCell(type) {
+      const { scaleValues } = props.data;
+      const item = scaleValues.find((v) => v.type === type);
+      return yCellHeight * (item.spaceGridNumber || 1) / (item.spaceValue || 1);
     }
-    return cloneData;
-  }
-  function computedYCell(type) {
-    const { scaleValues } = props.data;
-    const item = scaleValues.find((v) => v.type === type);
-    return yCellHeight.value * (item.spaceGridNumber || 1) / (item.spaceValue || 1);
+    const pulseYCell = computedYCell("pulse");
+    const temperatureYCell = computedYCell("temperature");
+    const event = ((_f = props.data.grid) == null ? void 0 : _f.event) || { selectable: true, evented: true, hovered: true };
+    const getTreeData = () => {
+      const { show: show2 = true, tree: tree2 = {} } = props.data.top;
+      if (!show2)
+        return [];
+      const cloneData = cloneDeep(props.data.top.treeData);
+      let levelRow = 0;
+      const { cellWidth, cellHeight } = props.data.top.tree;
+      const { rowNumber: rowNumber2 = oldChildrenSize } = tree2;
+      if (oldChildrenSize < rowNumber2) {
+        cloneData.push(...range(rowNumber2 - oldChildrenSize).map(() => ({})));
+      }
+      transferTree(cloneData);
+      function transferTree(treeData, deep = 0) {
+        treeData.forEach((item) => {
+          var _a3;
+          const other = {
+            top: levelRow * cellHeight + topGridOriginY,
+            left: deep * cellWidth,
+            width: cellWidth,
+            height: cellHeight,
+            uuid: uuidGenerator()
+          };
+          levelRow++;
+          if ((_a3 = item.children) == null ? void 0 : _a3.length) {
+            levelRow--;
+            const childrenSize = getChildrenSize(item.children);
+            other.height = childrenSize * cellHeight;
+            transferTree(item.children, deep + 1);
+          } else {
+            other.width = originX - other.left;
+          }
+          Object.assign(item, other);
+        });
+      }
+      return cloneData;
+    };
+    return {
+      canvasWidth: props.data.width,
+      canvasHeight: props.data.height,
+      borderStyle: { ...defaultBorderStyle, ...props.data.borderStyle },
+      pointSelectionStyle: props.data.pointSelectionStyle || {},
+      grid: props.data.grid,
+      top: props.data.top,
+      left: props.data.left,
+      other: props.data.other,
+      topGridYNumber,
+      topGridYCellHeight,
+      topGridOriginY,
+      topGridEndY,
+      treeData: getTreeData(),
+      getTreeData,
+      xAxis,
+      originYXAxis,
+      startTime,
+      timeXCell,
+      gridXNumber,
+      gridYNumber,
+      xCellWidth,
+      yCellHeight,
+      originX,
+      endX,
+      originY,
+      endY,
+      markHeight,
+      extracorporealCirculationHeight,
+      itemList,
+      scaleValues: props.data.scaleValues,
+      pulseYCell,
+      temperatureYCell,
+      event,
+      dialog,
+      extraMenuConfig: props.data.extraMenuConfig || {}
+    };
   }
+  const propItems = reactive(buildDerived());
   onMounted(async () => {
     await nextTick();
     const { redrawLinePoints: _redrawLinePoints, clickMenu: _clickTopMenu } = useTop(

package/es/components/fabric-chart/src/hooks/surgicalAnesthesia/useTop.d.ts

@@ -1,11 +1,12 @@
 import { type Ref } from 'vue';
 import { fabric } from '../../../../../shared/utils/fabricjs';
 import { AnyObject } from '../../../../../shared/types';
-import { IPointTipProps, IPointMenuProps } from '../../../../../components/fabric-chart/src/interface';
+import { IPointTipProps, IPointMenuProps, ICoordinateValue, PopupMenuItem } from '../../../../../components/fabric-chart/src/interface';
 export declare function useTop(canvas: Ref<fabric.Canvas>, propItems: AnyObject, emits: Function, pointTipProps: IPointTipProps, pointMenuProps: IPointMenuProps): {
     redrawLinePoints: () => void;
-    clickMenu: ({ item, target }: {
-        item: AnyObject;
+    clickMenu: ({ item, target, pointer }: {
+        item: PopupMenuItem;
         target: any;
+        pointer: ICoordinateValue;
     }) => void;
 };

package/es/components/fabric-chart/src/hooks/surgicalAnesthesia/useTop.js

@@ -18,7 +18,7 @@ import '@vueuse/core';
 import './useOther.js';
 import '../../../../../shared/utils/index.js';
 
-const NEW_OTHER_MENU = filter(OTHER_MENU, (o) => o.type !== "add");
+const NEW_OTHER_MENU = filter(OTHER_MENU, (o) => o.key !== "add");
 function findTreeItem(tree, type, [x, y]) {
   var _a, _b;
   let item = null;
@@ -776,8 +776,6 @@ function useTop(canvas, propItems, emits, pointTipProps, pointMenuProps) {
           pointMenuProps.list = NEW_OTHER_MENU.concat(treeMenuList).map((item) => {
             return {
               ...item,
-              renderItem: () => item.label,
-              type: item.key || item.type,
               _type: "tree"
             };
           });
@@ -793,21 +791,22 @@ function useTop(canvas, propItems, emits, pointTipProps, pointMenuProps) {
   }
   function clickMenu({
     item,
-    target
+    target,
+    pointer
   }) {
     var _a;
     if (!target)
       return;
     const {
-      type,
+      key,
       _type
     } = item;
     const params = {
       ...target.origin,
       type: _type
     };
-    if (NEW_OTHER_MENU.map((item2) => item2.type).includes(type)) {
-      if (type === "remove") {
+    if (NEW_OTHER_MENU.map((item2) => item2.key).includes(key)) {
+      if (key === "remove") {
         const removeItemList = [...gridPoints].filter((p) => {
           var _a2;
           return ((_a2 = p.origin) == null ? void 0 : _a2.uuid) === params.uuid;
@@ -819,9 +818,9 @@ function useTop(canvas, propItems, emits, pointTipProps, pointMenuProps) {
           });
         }
       }
-      emits(type, omit(params, ["uuid"]));
+      emits(key, omit(params, ["uuid"]));
     } else {
-      (_a = extraMenuConfig.click) == null ? void 0 : _a.call(extraMenuConfig, type, omit(params, ["uuid"]));
+      (_a = extraMenuConfig.click) == null ? void 0 : _a.call(extraMenuConfig, key, omit(params, ["uuid"]));
     }
   }
   useGrid(canvas, {

package/es/components/fabric-chart/src/hooks/temperature/useBottom.js

@@ -2,6 +2,7 @@ import { fabric } from '../../../../../shared/utils/fabricjs/index.js';
 import { drawTextGroup, defaultTextStyle, defaultStyle } from '../useDraw.js';
 import 'date-fns';
 import 'lodash-es';
+import '../../utils/eventBus.js';
 import '../useEvent.js';
 import '../useShadow.js';
 import '../useCommon.js';

package/es/components/fabric-chart/src/hooks/temperature/useCenter.d.ts

@@ -1,11 +1,12 @@
 import { type Ref } from 'vue';
 import { fabric } from '../../../../../shared/utils/fabricjs';
-import { IObject, IPropItems, IPointTipProps, IPointMenuProps } from '../../../../../components/fabric-chart/src/interface';
+import { IObject, IPropItems, IPointTipProps, IPointMenuProps, PopupMenuItem, ICoordinateValue } from '../../../../../components/fabric-chart/src/interface';
 import { AnyObject } from '../../../../../shared/types';
 export declare function useCenter(canvas: Ref<fabric.Canvas>, propItems: IPropItems, emits: Function, computedX: Function, computedY: Function, getXValue: Function, getYValue: Function, addRenderItem: Function | undefined, pointTipProps: IPointTipProps, pointMenuProps: IPointMenuProps): {
-    clickMenu: ({ item, target }: {
-        item: any;
+    clickMenu: ({ item, target, pointer }: {
+        item: PopupMenuItem;
         target: any;
+        pointer: ICoordinateValue;
     }) => void;
     setPopup: (point: any, status?: string) => void;
     isAddPoint: (x: number) => boolean;