解决NCC提出的拖动列宽时,有固定列出现表格中间断开问题

src/TableHeader.js

@@ -31,6 +31,7 @@ class TableHeader extends Component {
     this.table = null;
     this._thead = null;//当前对象
     this.event = false;//避免多次绑定问题
+    this.lastColumWidth = null;//非固定列最后一列的初始化宽度
   }
 
   static defaultProps = {
@@ -185,7 +186,7 @@ class TableHeader extends Component {
     Event.stopPropagation(e); 
     let event = Event.getEvent(e) ,
     targetEvent = Event.getTarget(event);
-    const { clsPrefix, contentTable } = this.props;
+    const { clsPrefix, contentTable,lastShowIndex } = this.props;
     let currentElement = this.getOnLineObject(targetEvent);
     if(!currentElement)return;
     let type = currentElement.getAttribute('data-type');
@@ -202,6 +203,14 @@ class TableHeader extends Component {
       this.drag.oldWidth = parseInt((currentObj).style.width);
       this.drag.minWidth = currentObj.style.minWidth != ""?parseInt(currentObj.style.minWidth):defaultWidth;
       this.drag.tableWidth = parseInt(this.table.table.style.width ?this.table.table.style.width:this.table.table.scrollWidth);
+      console.log(" ----- ",this.drag);
+      if(!this.tableOldWidth){
+        this.tableOldWidth = this.drag.tableWidth;//this.getTableWidth();
+        // console.log(" this.tableOldWidth--- ",this.tableOldWidth);
+      }
+      if(!this.lastColumWidth){
+        this.lastColumWidth = parseInt(this.table.cols[lastShowIndex].style.width);
+      }
     }else if(type != 'online' &&  this.props.draggable){
         // if (!this.props.draggable || targetEvent.nodeName.toUpperCase() != "TH") return; 
         if (!this.props.draggable) return; 
@@ -217,6 +226,15 @@ class TableHeader extends Component {
     }
   };
  
+  getTableWidth = ()=>{
+    let tableWidth = 0,offWidth = 0;//this.table.cols.length;
+    for (let index = 0; index < this.table.cols.length; index++) {
+      let da = this.table.cols[index];
+      tableWidth += parseInt((da).style.width);
+    }
+    return (tableWidth-offWidth);
+  }
+ 
   /**
    * 判断当前的target 是否是 th，如果不是，直接递归查找。
    * @memberof TableHeader
@@ -235,7 +253,7 @@ class TableHeader extends Component {
    */
   onTrMouseMove = (e) => {
     if(!this.props.dragborder && !this.props.draggable)return;
-    const { clsPrefix ,dragborder,contentDomWidth,scrollbarWidth,contentTable,headerScroll} = this.props;
+    const { clsPrefix ,dragborder,contentDomWidth,scrollbarWidth,contentTable,headerScroll,lastShowIndex} = this.props;
     Event.stopPropagation(e); 
     let event = Event.getEvent(e);  
     if(this.props.dragborder && this.drag.option == "border"){
@@ -252,13 +270,20 @@ class TableHeader extends Component {
         if(this.fixedTable.cols){
             this.fixedTable.cols[this.drag.currIndex].style.width = newWidth + "px";
         }
-        const newTableWidth = this.drag.tableWidth + diff +'px';
+
-        this.table.table.style.width  = newTableWidth;//改变table的width
+        // const newTableWidth = this.drag.tableWidth + diff;// +'px';
-        if(this.table.innerTableBody){//TODO 后续需要处理此处
+        // this.table.table.style.width  = newTableWidth+'px';;//改变table的width
-          this.table.innerTableBody.style.width  = newTableWidth ;
+        // if(this.table.innerTableBody){//TODO 后续需要处理此处
+        //   this.table.innerTableBody.style.width  = newTableWidth+'px'; ;
+        // }
+
+        let newDiff = (parseInt(currentCols.style.minWidth) - parseInt(currentCols.style.width));
+        if(newDiff > 0){//缩小 
+          let lastWidth = this.lastColumWidth + newDiff;
+          this.table.cols[lastShowIndex].style.width = lastWidth +"px";
         }
+
         let showScroll =  contentDomWidth - (this.drag.tableWidth + diff) - scrollbarWidth ;
-    
         //表头滚动条处理
         if(headerScroll){
             if(showScroll < 0){