欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

element合并单元格

程序员文章站 2022-07-13 14:28:05
...

 

获取表格基础合并数组

 getIndex(){
     let table = this.tableData
     this.spanArray = []
     table.forEach((item,index)=>{
         if(index === 0){
             this.spanArray.push({sameName:item.matterOrg,flag:0,arr:[]})
             this.spanArray.push({sameName:item.matterId,flag:0,arr:[]})
             this.spanArray.push({sameName:item.materialId,flag:0,arr:[]})
             this.spanArray.push({sameName:item.itemId,flag:0,arr:[]})
             this.spanArray.push({sameName:item.confirmId,flag:0,arr:[]})
             this.spanArray.push({sameName:item.cmaterialId,flag:0,arr:[]})
             this.spanArray.push({sameName:item.citemId,flag:0,arr:[]})
         }else{
             this.getSpan(item.matterOrg,index,0,table.length)
             this.getSpan(item.matterId,index,1,table.length)
             this.getSpan(item.materialId,index,2,table.length)
             this.getSpan(item.itemId,index,3,table.length)
             this.getSpan(item.confirmId,index,4,table.length)
             this.getSpan(item.cmaterialId,index,5,table.length)
              this.getSpan(item.citemId,index,6,table.length)
         }

    })
}
        

 非合并情况下进行数组替换

getSpan(value,index,arrayIndex,tableLength){
    if(value !== this.spanArray[arrayIndex].sameName || !value){
           this.spanArray[arrayIndex].arr.push({ row:this.spanArray[arrayIndex].flag,     
           length:index - this.spanArray[arrayIndex].flag})
           this.spanArray[arrayIndex].sameName = value
           this.spanArray[arrayIndex].flag = index
           if(index === tableLength-1){
               this.spanArray[arrayIndex].arr.push({ row:this.spanArray[arrayIndex].flag,             
               length: 1})
           }
    }else{
         if(index === tableLength-1){
              this.spanArray[arrayIndex].arr.push({ row:this.spanArray[arrayIndex].flag,                     
              length: index+1 - this.spanArray[arrayIndex].flag})
          }
     }
}

 合并单元格,table绑定

<el-table :data="tableData" v-loading="loading" border style="width: 100%;" :span-method="arraySpanMethod">

arraySpanMethod: function({ row, column, rowIndex, columnIndex }){
   let col = [
       [1],[2,3],[4,5],[6],[7,8,9],[10,11],[12,13]
   ]
   let flag = 1
   let obj = [0, 0]
   if(columnIndex === 0){
        obj = [1, 1]
   }else{
       col.forEach((colArray,arrayIndex)=>{
       if(flag === 1){
            colArray.forEach((colIndex)=>{
                if (columnIndex === colIndex && flag === 1) {
                      if(this.spanArray[arrayIndex].arr.length >0 ){
                             this.spanArray[arrayIndex].arr.forEach(item => {
                                 if (rowIndex === item.row) {
                                      obj = [item.length, 1]
                                      flag = 0
                                 }
                              })
                     }else{
                          obj = [1, 1]
                     }
                   }
               })
           }    
       })
    }
    return obj
}