element table合并最后一行所有列

表格属性 show-summary展示合计行

arraySpanMethod合并合计行

<el-table
        ref="table"
        border
        show-summary
        :data="dataList"
        :summary-method="getSummaries"
        :span-method="arraySpanMethod"
        style="width: 100%"
      >
        <el-table-column align="center" prop="name" label="课程名称">
        </el-table-column>
        <el-table-column align="center" prop="prop1" label="所属分类">
        </el-table-column>
        <el-table-column align="center" prop="prop2" label="课程要求">
        </el-table-column>
        <el-table-column align="center" prop="prop3" label="开始学习时间">
        </el-table-column>
        <el-table-column prop="prop4" align="center" label="完成学习时间">
        </el-table-column>
        <el-table-column prop="fenzhi" align="center" label="成绩">
          <template slot-scope="scope">
            {{ scope.row.fenzhi || "/" }}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="fenzhi" label="获得积分">
        </el-table-column>
      </el-table>

dataList: [
        { name: "123", id: "123213", fenzhi: "11" },
        { name: "123", id: "123213", fenzhi: "11" },
        { name: "123", id: "123213", fenzhi: "11" },
        { name: "123", id: "123213", fenzhi: "11" },
      ],

getSummaries(param) {
   //table自定义合计行方法summary-method
   const { columns, data } = param
    const sums = []
    columns.forEach((column, index) => {
      if (index === 0) {
        sums[index] = '总积分';
        return
      }
      if(index===6){
        const values = data.map(item => Number(item[column.property]))
        sums[1] = values.reduce((prev, curr) => {
          return prev + curr
        }, 0)
        sums[1]=sums[1]
      }

    })
    return sums
},
    arraySpanMethod() {
      //table合计行合并单元格
      setTimeout(() => {
        if (this.$refs.table.$el) {
          let current = this.$refs.table.$el
            .querySelector(".el-table__footer-wrapper")
            .querySelector(".el-table__footer");
          let cell = current.rows[0].cells;
          //cell[1].style.display = 'none'
          cell[1].colSpan = "9";
        }
      }, 50);
    },