cnhis-design-vue 3.1.16-beta.7 → 3.1.16

package/es/packages/big-table/index.d.ts

@@ -2868,7 +2868,7 @@ declare const BigTable: SFCWithInstall<import("vue").DefineComponent<{
     loadExpandMethod: ({ row, rowIndex }: any) => Promise<void>;
     nestHandleClickRow: (table: any, data: any) => void;
     initAnchor: () => void;
-    updateAnchor: (field: string) => void;
+    updateAnchor: (field: string) => Promise<void>;
     anchorEvent: ({ scrollLeft }: {
         scrollLeft: number;
     }) => void;

package/es/packages/big-table/src/BigTable.vue.d.ts

@@ -1126,8 +1126,7 @@ declare const _default: import("vue").DefineComponent<{
                 textColorGhostHoverWarning: string;
                 textColorGhostPressedWarning: string;
                 textColorGhostFocusWarning: string;
-                textColorGhostDisabledWarning: string;
-                /**
+                textColorGhostDisabledWarning: string; /**
                  * 判断是否渲染EditForm
                  * @param {*} row
                  * @param {*} column
@@ -1684,22 +1683,7 @@ declare const _default: import("vue").DefineComponent<{
             onClick: import("vue").PropType<import("naive-ui/es/_utils").MaybeArray<(e: MouseEvent) => void>>;
             onChange: import("vue").PropType<import("naive-ui/es/input/src/interface").OnUpdateValue>;
             onClear: import("vue").PropType<import("naive-ui/es/_utils").MaybeArray<(e: MouseEvent) => void>>;
-            status: import("vue").PropType<import("naive-ui/es/form/src/interface").FormValidationStatus>; /**
-             * 针对 bigTable 的设置列
-             * type: 列的类型
-             * field: 列字段名（注：属性层级越深，渲染性能将直线下降）
-             * title: 列标题（支持开启国际化）
-             * width: 列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 "%" 或者 "min-width" 布局）
-             * minWidth: 最小列宽度；会自动将剩余空间按比例分配
-             * resizable: 列是否允许拖动列宽调整大小
-             * visible: 列是否显示
-             * fixed: 将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）
-             * align: 列对齐方式
-             * headerAlign: 表头列的对齐方式
-             * footerAlign: 表尾列的对齐方式
-             * formatter: 格式化显示内容 Function({cellValue, row, column})
-             * sortable: 是否允许列排序
-             */
+            status: import("vue").PropType<import("naive-ui/es/form/src/interface").FormValidationStatus>;
             'onUpdate:value': import("vue").PropType<import("naive-ui/es/_utils").MaybeArray<import("naive-ui/es/input/src/interface").OnUpdateValue>>;
             onUpdateValue: import("vue").PropType<import("naive-ui/es/_utils").MaybeArray<import("naive-ui/es/input/src/interface").OnUpdateValue>>;
             textDecoration: import("vue").PropType<string | [string, string]>;
@@ -2888,7 +2872,7 @@ declare const _default: import("vue").DefineComponent<{
     loadExpandMethod: ({ row, rowIndex }: any) => Promise<void>;
     nestHandleClickRow: (table: any, data: any) => void;
     initAnchor: () => void;
-    updateAnchor: (field: string) => void;
+    updateAnchor: (field: string) => Promise<void>;
     anchorEvent: ({ scrollLeft }: {
         scrollLeft: number;
     }) => void;

package/es/packages/big-table/src/BigTable.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, reactive, useAttrs, computed, onMounted, onUnmounted, onActivated, createVNode, h, resolveComponent, Teleport, createTextVNode, nextTick, watch, openBlock, createElementBlock, Fragment, createBlock, unref, withCtx, renderList, createCommentVNode, createElementVNode, normalizeClass, normalizeStyle, mergeProps, renderSlot, toDisplayString, withDirectives, vShow, isVNode } from 'vue';
+import { defineComponent, ref, reactive, useAttrs, computed, onMounted, onUnmounted, onActivated, nextTick, createVNode, h, resolveComponent, Teleport, createTextVNode, watch, openBlock, createElementBlock, Fragment, createBlock, unref, withCtx, renderList, createCommentVNode, createElementVNode, normalizeClass, normalizeStyle, mergeProps, renderSlot, toDisplayString, withDirectives, vShow, isVNode } from 'vue';
 import { isArray, isFunction } from 'lodash-es';
 import bigTableState from './bigTableState.js';
 import bigTableProps from './bigTableProps.js';
@@ -243,7 +243,9 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       let columns = formatColumns(config);
       columns = handleGroupColums(columns, props);
       xGrid.value && xGrid.value.reloadColumn(columns);
-      initAnchor();
+      nextTick(() => {
+        initAnchor();
+      });
       setGroupTreeExpand();
       resetTableInlineEditStatus();
     };
@@ -352,10 +354,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         showSeq = true
       } = map;
       if (isEdit) {
-        state.editConfig = Object.assign(state.editConfig, editConfig);
+        Object.assign(state.editConfig, editConfig);
         state.rowConfig.height = 48;
       }
-      state.rowConfig = Object.assign(state.rowConfig, rowConfig);
+      Object.assign(state.rowConfig, rowConfig);
       state.rowConfig.keyField = handleRowId.value;
       if (selectType) {
         isBatchSelect = 1;

package/es/packages/big-table/src/components/edit-form/edit-date.js

@@ -1,4 +1,5 @@
-import { defineComponent, createVNode, mergeProps } from 'vue';
+import { defineComponent, computed, createVNode, mergeProps } from 'vue';
+import { generateTimeFormat } from '../../../../../src/utils';
 import { isFunction } from 'lodash-es';
 import { NDatePicker } from 'naive-ui';
 
@@ -25,7 +26,6 @@ var EditDate = defineComponent({
   emits: ["formChange"],
   setup(props, {
     attrs,
-    slots,
     emit
   }) {
     const onConfirm = (value) => {
@@ -102,11 +102,21 @@ var EditDate = defineComponent({
         return customDateDisabled(ts, props.row);
       };
     }
+    const formatConfig = computed(() => {
+      const valueFormat = props.col.valueFormat || "yyyy-MM-dd HH:mm:ss";
+      return {
+        valueFormat,
+        format: valueFormat,
+        timePickerProps: {
+          format: generateTimeFormat(valueFormat)
+        }
+      };
+    });
     const config = {
       type: props.col.type || props.col.dateType || "datetime",
       clearable: props.col.clearable || true,
       disabled: props.col.disabled || false,
-      valueFormat: props.col.valueFormat || "yyyy-MM-dd HH:mm:ss",
+      ...formatConfig.value,
       isDateDisabled: customDateDisabledDecorator(props.col.isDateDisabled) || isDateDisabled,
       placeholder: props.col.placeholder || "\u8BF7\u9009\u62E9",
       ...props.col.componentProps || {}

package/es/packages/big-table/src/components/edit-form/edit-time.js

@@ -41,6 +41,7 @@ var editTime = defineComponent({
     const config = {
       placeholder: props.col.placeholder || "\u8BF7\u9009\u62E9",
       valueFormat: props.col.valueFormat || "HH:mm",
+      format: props.col.valueFormat || "yyyy-MM-dd HH:mm:ss",
       ...props.col.componentProps || {}
     };
     return () => createVNode(NTimePicker, mergeProps(attrs, config, {

package/es/packages/big-table/src/hooks/useAnchor.d.ts

@@ -1,6 +1,6 @@
 export declare const useAnchor: (props: any, state: any, emit: any, xGrid: any) => {
     initAnchor: () => void;
-    updateAnchor: (field: string) => void;
+    updateAnchor: (field: string) => Promise<void>;
     anchorEvent: ({ scrollLeft }: {
         scrollLeft: number;
     }) => void;

package/es/packages/big-table/src/hooks/useAnchor.js

@@ -1,29 +1,37 @@
 import { useThrottleFn } from '@vueuse/core';
 
 const useAnchor = (props, state, emit, xGrid) => {
+  let setAnchorStatus = true;
   function initAnchor() {
-    var _a;
+    var _a, _b, _c;
     if ((_a = props.anchor) == null ? void 0 : _a.length) {
       const columns = xGrid.value.getColumns();
       let left = 0;
       columns.forEach((column) => {
-        const { field, minWidth, width } = column;
+        const { field, minWidth, width, fixed } = column;
         const colWidth = +(minWidth || width);
-        left += colWidth;
-        const anchorObj = props.anchor.find((v) => v.field === field);
-        anchorObj && state.anchorList.push({
-          ...anchorObj,
-          left: left - colWidth
-        });
+        if (fixed == "left") ; else {
+          left += colWidth;
+          const anchorObj = props.anchor.find((v) => v.field === field);
+          anchorObj && state.anchorList.push({
+            ...anchorObj,
+            left: left - colWidth
+          });
+        }
       });
-      state.anchorValue = state.anchorList[0].field;
+      state.anchorValue = ((_c = (_b = state.anchorList) == null ? void 0 : _b[0]) == null ? void 0 : _c.field) || "";
     }
   }
-  function updateAnchor(field) {
-    xGrid.value.scrollToColumn(field);
+  async function updateAnchor(field) {
+    setAnchorStatus = false;
+    const anchorObj = state.anchorList.find((v) => v.field === field);
+    await xGrid.value.scrollTo(anchorObj.left);
+    setTimeout(() => {
+      setAnchorStatus = true;
+    });
   }
   function setAnchorValue({ scrollLeft }) {
-    if (state.anchorList.length) {
+    if (state.anchorList.length && setAnchorStatus) {
       const anchorObj = state.anchorList.find((v) => scrollLeft < v.left);
       if (anchorObj) {
         state.anchorValue = anchorObj.field;

package/es/packages/big-table/src/hooks/useSeparateRow.js

@@ -84,13 +84,15 @@ function useSeparateRow(getColumnConfig, getFieldItem, $VXETable) {
         });
       }
       (await res).push(...Array.from({ length: getColumnInfoMaxLength(parsedRowData) }).map((_, index) => {
+        const separateData = getSeparateRowData(parsedRowData, index);
         if (index === 0) {
           separateDataMap.value.set(row, {
             row,
             rawRow: rawData[dataIndex],
             index,
-            separateData: getSeparateRowData(parsedRowData, index)
+            separateData
           });
+          row.$__SEPARATE_DATA = [separateData];
           return row;
         }
         const data2 = { $__SEPARATE: true };
@@ -98,8 +100,9 @@ function useSeparateRow(getColumnConfig, getFieldItem, $VXETable) {
           row: data2,
           rawRow: rawData[dataIndex],
           index,
-          separateData: getSeparateRowData(parsedRowData, index)
+          separateData
         });
+        row.$__SEPARATE_DATA.push(separateData);
         return data2;
       }));
       return res;

package/es/packages/button-print/index.d.ts

@@ -2537,7 +2537,10 @@ declare const ButtonPrint: SFCWithInstall<import("vue").DefineComponent<{
             modelValue: boolean;
         };
         emit: (event: "success" | "update:modelValue", ...args: any[]) => void;
-        form: any;
+        form: {
+            account: string;
+            password: string;
+        };
         rules: import("naive-ui").FormRules;
         style: {
             width: string;

package/es/packages/button-print/src/ButtonPrint.vue.d.ts

@@ -2541,7 +2541,10 @@ declare const _default: import("vue").DefineComponent<{
             modelValue: boolean;
         };
         emit: (event: "success" | "update:modelValue", ...args: any[]) => void;
-        form: any;
+        form: {
+            account: string;
+            password: string;
+        };
         rules: import("naive-ui").FormRules;
         style: {
             width: string;

package/es/packages/button-print/src/ButtonPrint.vue_vue_type_script_setup_true_lang.js

@@ -228,7 +228,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           templateId: getTemplateIdByFormatId(state.currentFormatId),
           print: {
             print: "1",
-            type: "1"
+            type: "1",
+            callback: "1"
           },
           params
         };

package/es/packages/button-print/src/components/IdentityVerification.js

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, ref, onMounted, watch, openBlock, createBlock, unref, normalizeStyle, withCtx, createElementVNode, createVNode, createTextVNode } from 'vue';
+import { defineComponent, reactive, ref, watch, openBlock, createBlock, unref, normalizeStyle, withCtx, createElementVNode, createVNode, createTextVNode } from 'vue';
 import { useMessage, NModal, NForm, NFormItem, NInput, NButton } from 'naive-ui';
 import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.js';
 
@@ -19,7 +19,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       account: "",
       password: ""
     };
-    let form = reactive(JSON.parse(JSON.stringify(DEFAULT_FORM)));
+    let form = reactive({ ...DEFAULT_FORM });
     const rules = {
       account: { required: true, message: "\u8BF7\u8F93\u5165\u8D26\u53F7" },
       password: { required: true, message: "\u8BF7\u8F93\u5165\u5BC6\u7801" }
@@ -33,9 +33,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     const submit = async () => {
       var _a;
-      const { data = {} } = await props.verifyUser(form);
+      const { data = {} } = await props.verifyUser(form) || {};
       if (data.result !== "SUCCESS") {
-        $message.error(data.resultMsg);
+        $message.error(data.resultMsg || "\u8BF7\u6DFB\u52A0\u8EAB\u4EFD\u6821\u9A8C\u63A5\u53E3\u914D\u7F6E");
         return false;
       }
       emit("success", (_a = data.map) == null ? void 0 : _a.token);
@@ -51,12 +51,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
       });
     };
-    onMounted(() => {
-    });
     watch(() => props.modelValue, (val) => {
       if (val)
         return;
-      form = JSON.parse(JSON.stringify(DEFAULT_FORM));
+      Object.assign(form, DEFAULT_FORM);
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(NModal), {

package/es/packages/button-print/src/components/IdentityVerification.vue.d.ts

@@ -26,7 +26,10 @@ declare const _default: import("vue").DefineComponent<{
         modelValue: boolean;
     };
     emit: (event: "success" | "update:modelValue", ...args: any[]) => void;
-    form: any;
+    form: {
+        account: string;
+        password: string;
+    };
     rules: FormRules;
     style: {
         width: string;

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

@@ -260,7 +260,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const list = (item == null ? void 0 : item.list) || [];
       if (!list.length)
         return 0;
-      return yCellHeight.value / ((parseInt(list[1]) - parseInt(list[0])) / item.spaceGridNumber);
+      return yCellHeight.value / ((list[1] - list[0]) / item.spaceGridNumber);
     }
     const { cumputedX, cumputedY, getXValue, getYValue } = useCumputedPoint(propItems);
     useTop(canvas, propItems);

package/es/packages/fabric-chart/src/components/PopupTip.js

@@ -20,8 +20,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           style: normalizeStyle(unref(pointStyle))
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(__props.list, (item) => {
-            return openBlock(), createElementBlock("li", null, toDisplayString(item), 1);
-          }), 256))
+            return openBlock(), createElementBlock("li", { key: item }, toDisplayString(item), 1);
+          }), 128))
         ], 4), [
           [vShow, __props.show]
         ])

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

@@ -1,18 +1,18 @@
 const TEMPERATURE_MENU = [
   {
     label: "\u5347\u6E29",
-    value: false,
+    value: true,
     type: "rise"
   },
   {
     label: "\u836F\u7269\u964D\u6E29",
     value: void 0,
-    type: "drugCooling"
+    type: "drugReduce"
   },
   {
     label: "\u7269\u7406\u964D\u6E29",
     value: void 0,
-    type: "physicalCooling"
+    type: "physicsReduce"
   },
   {
     label: "\u4E0D\u5347",
@@ -24,12 +24,12 @@ const PAIN_MENU = [
   {
     label: "\u836F\u7269\u964D\u75DB",
     value: void 0,
-    type: "drugReducePain"
+    type: "drugReduce"
   },
   {
     label: "\u7269\u7406\u964D\u75DB",
     value: void 0,
-    type: "physicalReducePain"
+    type: "physicsReduce"
   }
 ];
 

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

@@ -234,19 +234,19 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
       lineAttr = {},
       noRiseStyle = {},
       verifiedStyle = {},
-      coolingStyle = {},
+      reduceStyle = {},
       type = "circle"
     } = item;
     const pointList = [];
     const lineList = [];
     const otherList = [];
     item.list.forEach((v, index) => {
-      var _a;
+      var _a, _b;
       const points = getPointer(v, scaleValue);
       const nextV = item.list[index + 1];
       const nextPoint = getPointer(nextV, scaleValue);
-      let coolLine, coolPoint, noRiseText, arrowGroup, verifiedText;
-      if (points && scaleValue.type === "temperature") {
+      let reduceLine, reducePoint, noRiseText, arrowGroup, verifiedText;
+      if ((points == null ? void 0 : points.length) && (scaleValue.type === "temperature" || scaleValue.type === "pain")) {
         if (v.noRise) {
           if (typeof v.noRise === "string") {
             noRiseText = drawText([points[0], points[1] + 5], {
@@ -285,24 +285,21 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
           });
           otherList.push(verifiedText);
         }
-        if (v.physicalCooling || v.drugCooling) {
-          const coolingLineStyle = {
+        if (v.physicsReduce || v.drugReduce) {
+          const reduceY = cumputedY(scaleValue.type, scaleValue.list, v.physicsReduce || v.drugReduce);
+          reduceLine = drawLine([...points, points[0], reduceY], {
             ...lineAttr,
-            stroke: coolingStyle.stroke,
-            strokeDashArray: [3, 3]
-          };
-          const coolY = cumputedY(scaleValue.type, scaleValue.list, v.physicalCooling || v.drugCooling);
-          coolLine = drawLine([...points, points[0], coolY], {
-            ...coolingLineStyle
+            ...reduceStyle.line,
+            ...defaultStyle
           });
-          coolPoint = drawPoint("circle", {
+          reducePoint = drawPoint(((_a = reduceStyle == null ? void 0 : reduceStyle.point) == null ? void 0 : _a.type) || "circle", {
             left: points[0],
-            top: coolY,
-            ...coolingStyle,
+            top: reduceY,
+            ...reduceStyle.point,
             ...defaultStyle
           });
-          coolLine && otherList.push(coolLine);
-          coolPoint && otherList.push(coolPoint);
+          reduceLine && otherList.push(reduceLine);
+          reducePoint && otherList.push(reducePoint);
         }
       }
       let point;
@@ -312,7 +309,7 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
           ...lineAttr
         });
       } else if (points && !nextPoint && !v.breakpoint && scaleValue.type === "temperature" && dataIndex < scaleValue.dataList.length - 1 && index === item.list.length - 1) {
-        const nextV2 = (_a = scaleValue.dataList[dataIndex + 1].list) == null ? void 0 : _a[0];
+        const nextV2 = (_b = scaleValue.dataList[dataIndex + 1].list) == null ? void 0 : _b[0];
         const nextLinePoint = getPointer(nextV2, scaleValue);
         line = nextLinePoint ? drawLine([...points, ...nextLinePoint], {
           ...lineAttr
@@ -338,8 +335,8 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
         verifiedText,
         leftLine: previousLine,
         rightLine: line,
-        coolLine,
-        coolPoint,
+        reduceLine,
+        reducePoint,
         lockMovementX: true,
         ...pointAttr,
         ...propItems.event
@@ -433,9 +430,18 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
       x: point.left,
       y: point.top
     };
-    const yValue = getYValue(type, point.top);
-    pointTipProps.list = [`${title} ${yValue}${unit || ""}`, `\u65F6\u95F4 ${((data == null ? void 0 : data.time) || getXValue(point.left)).slice(-5)}`];
+    pointTipProps.list = [getListValue(), `\u65F6\u95F4 ${((data == null ? void 0 : data.time) || getXValue(point.left)).slice(-5)}`];
     pointTipProps.show = true;
+    function getListValue() {
+      const { value, drugReduce, physicsReduce } = data;
+      if (drugReduce) {
+        return `\u836F\u7269\u964D${type == "pain" ? "\u75DB" : "\u6E29"} ${value}\u2014>${drugReduce}${unit || ""}`;
+      }
+      if (physicsReduce) {
+        return `\u7269\u7406\u964D${type == "pain" ? "\u75DB" : "\u6E29"} ${value}\u2014>${physicsReduce}${unit || ""}`;
+      }
+      return `${title} ${value}${unit || ""}`;
+    }
   }
   function moveLimit(point) {
     point.setCoords();
@@ -456,9 +462,9 @@ function useCenter(canvas, propItems, emits, cumputedX, cumputedY, getXValue, ge
       point.rightLine.setCoords();
       point.rightLine.set({ x1: point.left, y1: point.top });
     }
-    if (point.coolLine) {
-      point.coolLine.setCoords();
-      point.coolLine.set({ x1: point.left, y1: point.top });
+    if (point.reduceLine) {
+      point.reduceLine.setCoords();
+      point.reduceLine.set({ x1: point.left, y1: point.top });
     }
     if (point.noRiseText) {
       point.noRiseText.setCoords();

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

@@ -44,12 +44,19 @@ function drawTextGroup(rectStyle, fontStyle, groupStyle) {
     ...defaultRectStyle,
     ...rectStyle
   });
-  const texts = new fabric.Text(String(fontStyle.value), {
+  const { value = "\u6807\u9898", textAlign = "center", verticalAlign = "center" } = fontStyle;
+  const textLeft = rectStyle.width / 2;
+  const textTop = rectStyle.height / 2;
+  const texts = new fabric.Text(String(value), {
     ...defaultTextStyle,
     ...fontStyle,
-    ...fontStyle.textAlign == "left" ? {
-      originX: "left",
-      left: -(rectStyle.width / 2)
+    ...textAlign == "left" || textAlign == "right" ? {
+      originX: textAlign,
+      left: textAlign == "left" ? -textLeft : textLeft
+    } : {},
+    ...verticalAlign == "top" || verticalAlign == "bottom" ? {
+      originY: verticalAlign,
+      top: verticalAlign == "top" ? -textTop : textTop
     } : {}
   });
   return new fabric.Group([rect, texts], {

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

@@ -47,12 +47,20 @@ function useCanvasEvent(canvas, propItems, emits) {
       if (index > 0) {
         topY += propItems[`${topList[index - 1].key}Height`];
       }
-      selections2.push(drawRect({
-        left: iconsWidth,
+      const commonOptions = {
         top: topY + 1,
-        width: endX - iconsWidth,
         height: propItems[`${item.key}Height`] - 1
+      };
+      selections2.push(drawRect({
+        left: iconsWidth,
+        width: originX - iconsWidth,
+        ...commonOptions
       }, item.key));
+      selections2.push(drawRect({
+        left: originX,
+        width: endX - originX,
+        ...commonOptions
+      }, item.key + "Title"));
     });
     selections2.push(drawRect({
       left: originX,

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

@@ -3,25 +3,75 @@ import { fabric } from '../utils/index.js';
 import { defaultStyle } from './useDraw.js';
 
 function useOther(canvas, propItems, cumputedX) {
-  const { originY, other, vitalSignsOriginY } = propItems;
+  const { other, vitalSignsOriginY } = propItems;
   function drawOther() {
-    if (!other || !other.list)
+    if (!(other == null ? void 0 : other.list))
       return false;
     const list = [];
-    other.list.forEach((v, i) => {
-      var _a;
-      const text = new fabric.Text(String(v.value.toString().split("").join("\n")), {
-        originX: "center",
-        top: (((_a = v.style) == null ? void 0 : _a.baseTop) || 0) + vitalSignsOriginY.originY,
-        left: cumputedX(v.time),
-        textAlign: "center",
-        ...defaultStyle,
-        ...v.style || {}
+    const otherList = [];
+    other.list.forEach((item) => {
+      const align = item.align || "vertical";
+      const left = cumputedX(item.time);
+      const obj = otherList.find((v) => v.left == left);
+      if (obj) {
+        obj[align].push(item);
+      } else {
+        const initObj = {
+          left,
+          vertical: [],
+          horizontal: []
+        };
+        initObj[align].push(item);
+        otherList.push(initObj);
+      }
+    });
+    let textWidth = 0;
+    otherList.forEach((item) => {
+      let topY = vitalSignsOriginY.originY;
+      let leftX = item.left;
+      let textHeight = 0;
+      item.vertical.forEach((v) => {
+        const { commonOptions, value } = getTextData(v);
+        topY += (v.baseTop || 0) + textHeight;
+        const text = new fabric.Text(value, {
+          top: topY,
+          left: item.left,
+          ...commonOptions
+        });
+        textHeight = text.height || 0;
+        setTextWidth(text);
+      });
+      item.horizontal.forEach((v, i) => {
+        if (i > 0 || item.vertical.length) {
+          leftX += textWidth;
+        }
+        const { commonOptions, value } = getTextData(v);
+        const text = new fabric.Text(value, {
+          top: vitalSignsOriginY.originY,
+          left: leftX,
+          ...commonOptions
+        });
+        setTextWidth(text);
       });
-      list.push(text);
     });
+    function setTextWidth(text) {
+      if (!textWidth) {
+        textWidth = text.width || 0;
+      }
+      list.push(text);
+    }
+    function getTextData(v) {
+      return {
+        commonOptions: {
+          originX: "center",
+          textAlign: "center",
+          ...defaultStyle,
+          ...v.style || {}
+        },
+        value: String(v.value.toString().split("").join("\n"))
+      };
+    }
     const group = list.length > 0 ? new fabric.Group([...list], { ...defaultStyle }) : null;
-    group && group.sendToBack();
     group && canvas.value.add(group);
   }
   onMounted(() => {