cnhis-design-vue 2.1.65 → 2.1.68

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cnhis-design-vue",
-  "version": "2.1.65",
+  "version": "2.1.68",
   "description": "前端业务UI库",
   "keyword": "cnhis-design-vue vue cnhis",
   "homepage": "http://dv.cnhis.com/",

package/packages/big-table/src/BigTable.vue

@@ -7,6 +7,7 @@
       'table-editing': isTableEdit
     }"
     :style="{ height: tableHeight }"
+    v-resize="onResize"
   >
     <div class="check-wrap" v-if="hasRefresh && !isNestTable">
       <p class="check-wrap-title">
@@ -70,6 +71,7 @@
       @sort-change="sortChange"
       @scroll="handlerScroll"
       @cell-mouseenter="handleCellMouseenter"
+      @resizable-change="resizableChange"
       :tooltip-config="{ enterable: false }"
       :checkbox-config="{
         checkField: 'checked',
@@ -163,9 +165,10 @@ import batchEditing from './utils/batchEditing';
 import EditForm from './components/edit-form/EditForm.vue';
 
 import nestTable from './utils/nestTable';
+import eventBroadcast from './utils/eventBroadcast';
 import bigTableProps from './utils/bigTableProps';
 import SvgIcon from '@/component/svg/index.vue';
-
+import resize from 'vue-resize-directive';
 let addInlineEditPrimaryKey = '';
 export default create({
   name: 'big-table',
@@ -187,7 +190,7 @@ export default create({
     SvgIcon,
     AutoLayoutButton
   },
-  mixins: [format, batchEditing, nestTable],
+  mixins: [format, batchEditing, nestTable, eventBroadcast],
   props: Object.assign({}, bigTableProps),
   beforeCreate() {
     Vue.use(Button)
@@ -210,6 +213,10 @@ export default create({
   //   this.removeInsert();
   // },
   beforeRouteLeave() {},
+  beforeDestroy(){
+    // 移除事件监听
+    this.$off();
+  },
   destroyed() {
     this.unBindDocumentClick();
   },
@@ -2118,7 +2125,7 @@ export default create({
         if (this.rowBtnAutoLayout && !this.isRowEditing) {
           // 行内列表按钮改为自适应。
           let filterList = Array.isArray(row.btnList) ? row.btnList.filter(btn => btn.isShow == '1' && btn.type != 'LINK') : [];
-          return [<AutoLayoutButton btnList={filterList} row={row} index={rowIndex} on-clickBtn={(...arg) => this.clickBtn(...arg)} />];
+          return [<AutoLayoutButton key={row.theUniqueKey + rowIndex} btnList={filterList} row={row} index={rowIndex} on-clickBtn={(...arg) => this.clickBtn(...arg)} />];
         }
         // 行编辑
         const inlineBtnList = this.generateInlineBtnList(row, rowIndex);
@@ -3151,8 +3158,20 @@ export default create({
         }
       }
       return cValue;
+    },
+
+    resizableChange({column }) {
+      let { property } =column || {}
+      if (property == "operatorColumn") {
+        this.broadcastEvent('operatorColumn-resize');
+      }
+    },
+
+    onResize(){
+      this.broadcastEvent('operatorColumn-resize');
     }
-  }
+  },
+  directives: { resize }
 });
 </script>
 <style lang="less" scoped>

package/packages/big-table/src/assets/style/table-base.less

@@ -4,6 +4,7 @@ body {
   }
 }
 .big-table {
+  width: 100%;
   position: relative;
   // height: calc(100% - 52px);
 
@@ -383,4 +384,4 @@ body {
     border-radius: 2px;
     border: 2px solid #5585f5 !important;
   }
-}
+}

package/packages/big-table/src/components/AutoLayoutButton.vue

@@ -7,6 +7,7 @@ import utils from '@/utils/utils-map';
 import preventReClick from '@/directive/preventReClick';
 export default {
   name: 'AutoLayoutButton',
+  inject: ['registerEvent', 'unregisterEvent', 'dispatchEvent'],
   data() {
     return {
       showList: [],
@@ -45,25 +46,25 @@ export default {
         return item.alias || item[key];
       };
     },
-    showBtnList() {
-      if (!Array.isArray(this.btnList)) return [];
-      let res = this.btnList
-        .map(btn => {
-          if (btn.isShow == '1' && btn.type != 'LINK') {
-            let config = {
-              btnStyle: vexutils.getBtnStyle(btn),
-              btnType: btn.showStyle == 'none_bg' || btn.showStyle === 'only_icon' ? 'link' : 'primary',
-              btnGhost: btn.showStyle == 'white_bg',
-              btnTitle: this.handleName(btn)
-            };
-            return Object.assign(btn, config);
-          } else {
-            return null;
-          }
-        })
-        .filter(Boolean);
-      return res;
-    }
+    // showBtnList() {
+    //   if (!Array.isArray(this.btnList)) return [];
+    //   let res = this.btnList
+    //     .map(btn => {
+    //       if (btn.isShow == '1' && btn.type != 'LINK') {
+    //         let config = {
+    //           btnStyle: vexutils.getBtnStyle(btn),
+    //           btnType: btn.showStyle == 'none_bg' || btn.showStyle === 'only_icon' ? 'link' : 'primary',
+    //           btnGhost: btn.showStyle == 'white_bg',
+    //           btnTitle: this.handleName(btn)
+    //         };
+    //         return Object.assign(btn, config);
+    //       } else {
+    //         return null;
+    //       }
+    //     })
+    //     .filter(Boolean);
+    //   return res;
+    // }
   },
   render() {
     const row = this.row;
@@ -73,7 +74,7 @@ export default {
       console.log(this.hideList,'----------------hideList')
     }
     return (
-      <div class="c_auto-layout-wrap" ref="layoutWrap" v-resize={() => this.onResize()}>
+      <div class="c_auto-layout-wrap" ref="layoutWrap">
         {this.showList.length === 0 && this.hideList.length === 0 ? (
           this.renderAllBtn(this.btnList)
         ) : (
@@ -88,16 +89,20 @@ export default {
   watch: {
     btnList:{
       handler(){
-        this.debouncePageResize();
+        this.reset();
+        this.onResize();
       }
     }
   },
   beforeCreate() {},
   created() {
-    this.debouncePageResize = utils.debounce(this.handlePageResize, 300)
+    this.debouncePageResize = utils.debounce(this.handlePageResize, 300);
+    this.attachEvent();
   },
   beforeMount() {},
-  mounted() {},
+  mounted() {
+    this.onResize();
+  },
   beforeUpdate() {},
   updated() {},
   beforeDestroy() {},
@@ -145,7 +150,7 @@ export default {
           <a-button
             v-preventReClick={1000}
             ref={`rowBtnItem${btn.sid}`}
-            key={btn.sid}
+            key={btn.sid + j}
             data-key={btn.sid}
             on-click={e => this.clickBtn(row, btn, index, e, j)}
             class="btn-custom-class row-btn"
@@ -178,7 +183,7 @@ export default {
           <a-menu slot="overlay">
             {this.hideList.map((b, j) => {
               return b ? (
-                <a-menu-item key={b.sid} class="c_dropdown-btn" on-click={e => this.clickBtn(row, b, index, e.domEvent, j)}>
+                <a-menu-item key={b.sid + j} class="c_dropdown-btn" on-click={e => this.clickBtn(row, b, index, e.domEvent, j)}>
                   {this.getBtnIcon(b)}
                    {b.showStyle === 'only_icon' ? '' : this.handleName(b)}
                 </a-menu-item>
@@ -189,9 +194,11 @@ export default {
       );
     },
 
-    onResize() {
+   async onResize() {
       // utils.debounce(this.handlePageResize(), 300);
-      this.debouncePageResize();
+        this.$nextTick(()=>{
+          this.debouncePageResize();
+        });
     },
 
     handlePageResize() {
@@ -204,6 +211,8 @@ export default {
         let btnTotalWidth = 0;
         let showBtnListWidth = 0;
         let hideIndex = -1;
+        let len = this?.btnList?.length || 0;
+        let last = len -1 > 0 ? len -1 : 0;
         this.btnList.forEach((btn, i) => {
           // 记录宽度
           let btnDom = this.$refs[`rowBtnItem${btn.sid}`];
@@ -215,7 +224,9 @@ export default {
             btn.showType = '_hide';
             return;
           }
-          btnTotalWidth += (this.btnShowWidthObj[btn.id] || 0) + 10;
+          // 最后一个不用加
+          let mg = last == i ? 0: 10;
+          btnTotalWidth += (this.btnShowWidthObj[btn.id] || 0) + mg;
           if (btnTotalWidth < (wrapWidth)) {
             btn.showType = '_show';
             showBtnListWidth = btnTotalWidth
@@ -236,7 +247,7 @@ export default {
         // 边界处理
         // 如果有 hideList 有数据
         // 展示的按钮宽度和加上“更多按钮”的宽度大于容器的宽度，showList 最后一个按钮移动到 hideList
-        if(this.hideList.length > 0 && (showBtnListWidth + 15 > wrapWidth)){
+        if(this.hideList.length > 0 && (showBtnListWidth + 15 + 10 > wrapWidth)){
             let t = this.showList.pop();
             t && this.hideList.unshift(t);
         }
@@ -244,6 +255,20 @@ export default {
 
     clickBtn(row, btn, index, e, j) {
       this.$emit('clickBtn', row, btn, index, e, j);
+    },
+
+    attachEvent() {
+      this.registerEvent('operatorColumn-resize', this.onResize);
+      // this.$on('hook:beforeDestroy', () => {
+      //   console.log(('unregisterEvent-----'))
+      //   this.unregisterEvent('operatorColumn-resize', this.onResize);
+      // });
+    },
+
+    reset(){
+      // 重置
+      this.hideList = [];
+      this.showList = [];
     }
   },
   components: {
@@ -269,8 +294,11 @@ export default {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  .row-btn {
-    margin-right: 10px;
+  .row-btn + .row-btn {
+    margin-left: 10px;
+  }
+  .row-btn + .ant-dropdown-trigger {
+    margin-left: 10px;
   }
 }
 .ant-dropdown-menu-item.c_dropdown-btn{

package/packages/big-table/src/utils/eventBroadcast.js

@@ -0,0 +1,24 @@
+export default {
+  provide() {
+    return {
+      dispatchEvent: this.dispatchEvent,
+      registerEvent: this.registerEvent,
+      unregisterEvent: this.unregisterEvent,
+    };
+  },
+  methods: {
+    dispatchEvent(name, args) {
+      this.$emit('event', name, args);
+    },
+    broadcastEvent(name, data) {
+      this.$emit(`table-broadcast-${name}`, data);
+    },
+    registerEvent(name, callback) {
+      this.$on(`table-broadcast-${name}`, callback);
+    },
+    unregisterEvent(name) {
+      this.$off(`table-broadcast-${name}`);
+    },
+
+  }
+};

package/packages/fabric-chart/src/fabric-chart/FabricLines.vue

@@ -62,10 +62,10 @@ export default {
       this.canvas.on('mouse:up', event => {
         if (event.button === 3) {
           const { x, y } = event.pointer;
-          const { originX, endX, endYTop, originYTop } = this.$propItems();
-          if (!(x < 0 || x > endX || y < originYTop || y > endYTop)) {
+          if (this.isTopTreeAndGridLimit(x, y)) {
             this.activeEvent = event;
-            document.querySelector('.upper-canvas').addEventListener('contextmenu', this.addEventListenerContextmenu, true);
+            !this.isAddEventListenerContextmenu && document.querySelector('.upper-canvas').addEventListener('contextmenu', this.addEventListenerContextmenu, true);
+            this.isAddEventListenerContextmenu = true;
           }
         }
       });
@@ -82,30 +82,29 @@ export default {
      */
     addEventListenerContextmenu(event) {
       event.preventDefault();
-      const x = event.offsetX;
-      const y = event.offsetY;
-      const { originX, endX, endYTop, originYTop } = this.$propItems();
-      if (!(x < 0 || x > endX || y < originYTop || y > endYTop)) {
-        this.openRightModal(this.activeEvent);
+      const { offsetX, offsetY } = event;
+      if (this.isTopTreeAndGridLimit(offsetX, offsetY)) {
+        this.openRightModal();
       }
       return false;
     },
     // 打开右键菜单
-    openRightModal(event) {
+    openRightModal() {
+      const { clientX, pageX, clientY, pageY } = this.activeEvent.e;
       this.rightPos = {
-        clientX: event.e.clientX || event.e.pageX,
-        clientY: event.e.clientY || event.e.pageY
+        clientX: clientX ?? pageX,
+        clientY: clientY ?? pageY
       };
       this.isRightVisible = false;
-      const target = event.target;
-      const id = target ? target.id : '';
+      const target = this.activeEvent.target;
+      const id = target?.id || '';
       this.$nextTick(() => {
         if (id && id.includes('_lineGroup_')) {
           this._currentPoint = target || '';
           this.rightClickNode = Object.freeze(rightClickNode.slice());
           this.isRightVisible = true;
         } else {
-          this.doContextmenuEvent(event.pointer);
+          this.doContextmenuEvent(this.activeEvent.pointer);
         }
       });
     },
@@ -237,75 +236,75 @@ export default {
           lineItemList.push(rightLine);
         }
 
-        // 文字内容
-        const textTop = x2 ? (y1 + y2) / 2 : y1 + yCellHeightTop / 2;
-        let textLimitRight;
-        let text =
-          (endMinute === '' && leftLine) || (item[1] && !(x1 === originX && x2 === originX) && !(x1 === endX && x2 === endX))
-            ? this.drawLineText(textArr.concat([textContent]), textTop, i, j, centerLine, leftLine, x1, x2)
-            : null;
-        // 文字内容居右侧竖线且超出当前线段右边界则移除
-        if (text) {
-          textLimitRight = lineList[j + 1]?.[0] && this.cumputedX(lineList[j + 1][0]) <= endX ? this.cumputedX(lineList[j + 1][0]) : endX;
-          if (text.originX === 'left' && text.left + text.width + 2 >= textLimitRight) {
-            textLimitRight !== endX && textArr.push(textContent);
-            this.canvas.remove(text);
-            text = null;
-          } else {
-            textArr = [];
-            this.hoverEvent(text, { textObj, startTime: item[0], endTime: item[1] });
-            textList.push(text);
-          }
-        }
-
         // 设置拖动限制值
-        let leftLimit = {};
-        leftLimit.x2 = x2 ? x2 : endX;
-        leftLimit.x1 = originX;
+        const leftLimit = {
+          x1: originX,
+          x2: x2 ? x2 : endX
+        };
+        const rightLimit = {
+          x1: x2 ? x1 : originX,
+          x2: endX
+        };
         if (lineList[j - 1]) {
           const [preItem0, preItem1] = lineList[j - 1];
           if (preItem1) {
             const preEndMinute = new Date(preItem1).getTime();
-            if (preEndMinute >= minMinute && preEndMinute < maxMinute) leftLimit.x1 = this.cumputedX(preItem1);
+            if (preEndMinute >= minMinute && preEndMinute < maxMinute) {
+              leftLimit.x1 = this.cumputedX(preItem1);
+              if (!x2) rightLimit.x1 = leftLimit.x1;
+            }
           } else {
             const preStartMinute = new Date(preItem0).getTime();
-            if (preStartMinute >= minMinute && preStartMinute < maxMinute) leftLimit.x1 = this.cumputedX(preItem0);
+            if (preStartMinute >= minMinute && preStartMinute < maxMinute) {
+              leftLimit.x1 = this.cumputedX(preItem0);
+              if (!x2) rightLimit.x1 = leftLimit.x1;
+            }
           }
         }
-        let rightLimt = {};
-        rightLimt.x1 = x2 ? x1 : originX;
-        rightLimt.x2 = endX;
         if (lineList[j + 1]) {
           const [preItem0] = lineList[j + 1];
           if (preItem0) {
             const preStartMinute = new Date(preItem0).getTime();
-            if (preStartMinute > minMinute && preStartMinute <= maxMinute) rightLimt.x2 = this.cumputedX(preItem0);
+            if (preStartMinute > minMinute && preStartMinute <= maxMinute) rightLimit.x2 = this.cumputedX(preItem0);
           }
         }
 
-        this.lineEvent({
-          line: leftLine,
-          line1: centerLine,
+        // 文字内容
+        const textTop = x2 ? (y1 + y2) / 2 : y1 + yCellHeightTop / 2;
+        let text =
+          (endMinute === '' && leftLine) || (item[1] && !(x1 === originX && x2 === originX) && !(x1 === endX && x2 === endX))
+            ? this.drawLineText(textArr.concat([textContent]), textTop, i, j, x1, x2, { leftLimit, rightLimit, y2 })
+            : null;
+        // 文字内容居右侧竖线且超出当前线段右边界则移除
+        if (text) {
+          textArr = [];
+          this.hoverEvent(text, { textObj, startTime: item[0], endTime: item[1] });
+          textList.push(text);
+        }
+
+        const commonOptions = {
+          __range: [x1, x2],
+          __baseY: y2,
+          centerLine,
           text,
           textObj,
-          limitX: leftLimit,
+          leftLimit,
+          rightLimit,
           startTime: item[0],
-          endTime: item[1],
+          endTime: item[1]
+        };
+        this.lineEvent({
+          __position: 'left',
+          line: leftLine,
+          limitX: leftLimit,
           preText: textList[text ? textList.length - 2 : textList.length - 1] || null,
-          textLimitRight
+          ...commonOptions
         });
-        this.lineEvent({ line: rightLine, line2: centerLine, text, textObj, limitX: rightLimt, startTime: item[0], endTime: item[1], preText: null, textLimitRight: rightLimt.x2 });
+        this.lineEvent({ __position: 'right', line: rightLine, limitX: rightLimit, preText: null, ...commonOptions });
       }
       this.canvas.add(...lineItemList, ...textList);
-      // this.canvas.requestRenderAll();
     },
-    drawLineText(textArr, top, i, j, centerLine, leftLine, x1, x2) {
-      // const value = textArr.map(v => {
-      //   const channel = v.channel ? `(${v.channel})` : '';
-      //   const consistence = v.consistence ? `(${v.consistence})` : '';
-      //   const total = v.total ? `(${v.total})` : '';
-      //   return `${v.currentSpeed || ''}${channel}${consistence}${total}`
-      // }).join('—');
+    drawLineText(textArr, top, i, j, x1, x2, { leftLimit, rightLimit, y2 }) {
       const value = textArr.filter(v => v !== '').join('—');
 
       if (value === '') return null;
@@ -322,16 +321,58 @@ export default {
         colIndex: j,
         ...(this.linesObj.dataTextStyle || {})
       });
-      const limitWidth = text.width + 2; // 横线小于text文字的宽度则text显示在右侧
-      const originX = !centerLine || (x2 && x2 - x1 <= limitWidth) ? 'left' : 'center';
-      const left = x2 && x2 - x1 > limitWidth ? (x1 + x2) / 2 : this.textMarginLeft + (x2 && x2 - x1 <= limitWidth ? x2 : x1 + (leftLine?.width ?? 0) / 3);
-      text.set({
-        originX,
-        left
-      });
+      this.setTextPosition(text, top, x1, x2, leftLimit, rightLimit, y2);
       text.hasControls = text.hasBorders = false;
       return text;
     },
+    setTextPosition(text, top, x1, x2, leftLimit, rightLimit, baseY) {
+      const textWidth = text.width + 2; // 横线小于text文字的宽度则text显示在右侧
+      const centerLineWidth = (x2 || x1) - x1 ?? 0;
+      const rightWidth = rightLimit.x2 - leftLimit.x2 || rightLimit.x2 - x1 || 0;
+      const leftWidth = rightLimit.x1 - leftLimit.x1 || x1 - leftLimit.x1 || 0;
+      const changeOptions = {
+        originX: 'center',
+        left: x1 + centerLineWidth / 2,
+        top,
+        scaleX: 1,
+        scaleY: 1,
+        originY: 'center',
+        backgroundColor: '#fff',
+        textLimit: {
+          x1,
+          x2: x2 || x1
+        }
+      };
+
+      if (centerLineWidth >= textWidth) {
+        // console.log('正常显示的文本')
+      } else if (textWidth <= rightWidth) {
+        changeOptions.originX = 'left';
+        changeOptions.left = (x2 ? x2 : x1 + 3) + this.textMarginLeft;
+        changeOptions.backgroundColor = 'transparent';
+        changeOptions.textLimit.x2 = changeOptions.left + text.width;
+      } else if (textWidth <= leftWidth) {
+        changeOptions.originX = 'right';
+        changeOptions.left = x1 - 3 - this.textMarginLeft;
+        changeOptions.backgroundColor = 'transparent';
+        changeOptions.textLimit.x1 = changeOptions.left - text.width;
+      } else {
+        changeOptions.scaleX = 0.75;
+        changeOptions.scaleY = 0.75;
+        changeOptions.originY = 'bottom';
+        changeOptions.top = baseY + 1.5;
+        changeOptions.backgroundColor = 'transparent';
+        if (leftLimit.x1 == this.propItems.originX) {
+          changeOptions.originX = 'left';
+          changeOptions.left = leftLimit.x1 + this.textMarginLeft;
+        }
+        if (rightLimit.x2 == this.propItems.endX) {
+          changeOptions.originX = 'right';
+          changeOptions.left = rightLimit.x2 - this.textMarginLeft;
+        }
+      }
+      text.setCoords().set(changeOptions);
+    },
     /**
      * @description: 画-|-样式的组
      * @param {*} x1 // |-|中左侧线的x轴坐标
@@ -347,11 +388,12 @@ export default {
       let point;
       let left;
       const { position, customIcon, isContinue } = others;
+      const halfH = (y2 - y1) / 2;
       if (position === 'left') {
-        point = [x1, y1, x1, y2];
+        point = [x1, y1, x1, y2 - halfH + 1];
         left = x1 - this.propItems.xCellWidth / 2;
       } else {
-        point = [x2, y1, x2, y2];
+        point = [x2, y1, x2, y2 - halfH + 1];
         left = x2 - this.propItems.xCellWidth / 2;
       }
       let line;
@@ -367,7 +409,7 @@ export default {
 
         line = await this.createPoint(_customIcon.type, {
           left: x1,
-          top: y1 + (y2 - y1) / 2,
+          top: y1 + halfH,
           originY: 'center',
           ...dataLineStyle,
           ...(dataLineStyle.stroke
@@ -382,7 +424,7 @@ export default {
         line = isContinue
           ? await this.createArrow({
               left: x2,
-              top: y1 + (y2 - y1) / 2 - 3.5,
+              top: y1 + halfH - 3.5,
               originY: 'bottom',
               originX: 'right',
               fill: 'transparent',
@@ -434,20 +476,23 @@ export default {
       });
     },
     lineEvent(attr) {
-      const { line, line1, line2, text, textObj, limitX, startTime, endTime, preText, textLimitRight } = attr;
+      const { line, centerLine, text, textObj, leftLimit, rightLimit, limitX, startTime, endTime, preText, __position, __range, __baseY } = attr;
       if (line) {
         line.hasControls = line.hasBorders = false;
-        line1 && (line.line1 = line1);
-        line2 && (line.line2 = line2);
+        centerLine && (line.centerLine = centerLine);
         text && (line.text = text);
         line.limitX = limitX;
         preText && (line.preText = preText);
-        textLimitRight && (line.textLimitRight = textLimitRight);
+        line.leftLimit = leftLimit;
+        line.rightLimit = rightLimit;
+        line.__position = __position;
+        line.__range = __range;
+        line.__baseY = __baseY;
+
         this.hoverEvent(line, { textObj, startTime, endTime });
         // 移动中 实时更新相关联的线的坐标
         line.on('moving', () => {
           this.lineMoveLimit(line);
-          this.lineMoveUpdateLine(line);
           this.textUpdatePositionX(line);
           // this.canvas.renderAll();
           this.showDrapPopup(line);
@@ -544,46 +589,19 @@ export default {
       if (line.left > line.limitX.x2) {
         line.set('left', line.limitX.x2);
       }
-    },
-    lineMoveUpdateLine(line) {
-      if (line.line1) {
-        line.line1.setCoords().set({ x1: line.left });
-      }
-      if (line.line2) {
-        line.line2.setCoords().set({ x2: line.left });
+      if (line.centerLine) {
+        const options = line.__position === 'left' ? { x1: line.left } : { x2: line.left };
+        line.centerLine.setCoords().set(options);
       }
     },
     textUpdatePositionX(line) {
       const text = line.text || null;
       if (text) {
-        // 如果line2存在说明当前拖动的是右边手柄，line1存在则是左边手柄，都不存在说明不存在中间线
-        const centerLine = line.line1 || line.line2 || null;
-        const left = line.left;
-        const limitWidth = text.width + 2;
-        let originX = text.originX;
-        let v;
-        if (centerLine?.x2 - centerLine?.x1 > limitWidth) {
-          v = left + (centerLine.width / 2) * (line.line2 ? -1 : 1);
-          originX = 'center';
-        } else {
-          v = this.textMarginLeft + (centerLine ? centerLine.x2 : left + 3);
-          originX = 'left';
-          // 移动到最右边界时候文字超出当前线段可拖动的右边界的情况
-          if (line.textLimitRight && v + limitWidth > line.textLimitRight) {
-            v = this.propItems.endX + 100; // 此值随便设置，只要达到隐藏效果即可
-          }
-        }
-        text.setCoords();
-        text.set({ left: v, originX });
-      }
-      // 拖动左侧竖线时需要更改上一线段文字的位置，以防止文字被遮挡
-      const preText = line.preText || null;
-      if (!preText) return;
-      const limitWidth = preText.width + 2;
-      if (preText.originX === 'left' && preText.left + limitWidth > line.left) {
-        const v = this.propItems.endX + 100; // 此值随便设置，只要达到隐藏效果即可
-        preText.setCoords();
-        preText.set({ left: v });
+        const { __baseY, __range, leftLimit, rightLimit, __position } = line;
+        const x1 = __position === 'left' ? line.left : __range[0];
+        const x2 = __position === 'right' ? line.left : __range[1];
+        const top = __baseY - this.propItems.yCellHeightTop / 2;
+        this.setTextPosition(text, top, x1, x2, leftLimit, rightLimit, __baseY);
       }
     },
     repaintLine() {