使用Vue组件进行复杂的表格布局

Question

嗨，我正在尝试进行此布局 使用组件： element.eleme.io/table和Vue Js 在制作此部分时，我遇到了一个问题。

表摘要部分：   使用表组件 这是代码

<el-table
          ref="multipleTable"
          :data="tableData3"
          :stripe="true"
          border
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55"/>
          <el-table-column label="S.No." width="120" type="index"/>
          <el-table-column property="name" label="Part Name" width="120"/>
          <el-table-column property="part_labour" label="Part/Labour" show-overflow-tooltip/>
          <el-table-column property="part_number" label="Part Number" show-overflow-tooltip/>
          <el-table-column property="package_name" label="Package Name" show-overflow-tooltip/>
          <el-table-column property="price" label="Qty./Price(INR)" show-overflow-tooltip/>
          <el-table-column property="hsn" label="HSN" show-overflow-tooltip/>
          <el-table-column property="discount" label="Discount" show-overflow-tooltip/>
          <el-table-column property="tax_percentage" label="Tax%" show-overflow-tooltip/>
          <el-table-column property="tax" label="Tax" show-overflow-tooltip/>
          <el-table-column property="total" label="Total" show-overflow-tooltip/>
        </el-table>

我要在此表中创建“总计折扣”部分