接口返回的数据，圈出来的三个list是动态数据。
多个sku就换行展示，多个应收应付费用横向展示，这个横向展示的之前的没做过。
那些英文费用就是数组里的动态数据。
一些假数据
list: [{
unitPrice: '客户名',
skuList: [{
skuName: 'sku名',
skuNum: 'sku数量'
},
{
skuName: 'sku名1',
skuNum: 'sku数量1'
},
{
skuName: 'sku名2',
skuNum: 'sku数量2'
}
],
collectExpenseList: [{
expenseName: '费用名称',
amount: '费用金额'
},
{
expenseName: '费用名称1',
amount: '费用金额1'
},
{
expenseName: '费用名称2',
amount: '费用金额2'
}
]
}],
<el-table border :data="list" max-height="300" ref="multipleTable" @select="handleSelectionChange"
@select-all="handleAllChange" v-loading="loading">
<el-table-column type="selection" width="40"> </el-table-column>
<el-table-column label="#" type="index" :index="indexMethod" fixed width="56"></el-table-column>
<el-table-column label="客户名称" prop="unitPrice">
</el-table-column>
<el-table-column label="系统编号" prop="lssuingBatchNo">
</el-table-column>
<el-table-column label="客户订单号" prop="customerOrderCode">
</el-table-column>
<el-table-column label="尾程渠道" prop="finalChannelName">
</el-table-column>
<el-table-column label="供应商渠道" prop="finalSupplierChannelName">
</el-table-column>
<el-table-column label="出库单号" prop="outOrderCode">
</el-table-column>
<el-table-column label="发货日期" prop="shipmentDateName">
</el-table-column>
<el-table-column label="邮编" prop="zipCode">
</el-table-column>
<el-table-column label="州/省" prop="state" width="160">
</el-table-column>
<!-- -->
<el-table-column label="SKU" prop="skuList" width="160">
<template slot-scope="scope">
<span v-for="(item,index) in scope.row.skuList">
{{ item.skuName }}
<div class="bottomLine" v-if="scope.row.skuList.length >= 2 && index != scope.row.skuList.length - 1">
</div>
</span>
</template>
</el-table-column>
<!-- -->
<el-table-column label="数量" prop="skuList" width="160">
<template slot-scope="scope">
<span v-for="(item,index) in scope.row.skuList">
{{ item.skuNum }}
<div class="bottomLine" v-if="scope.row.skuList.length >= 2 && index != scope.row.skuList.length - 1">
</div>
</span>
</template>
</el-table-column>
<el-table-column label="重量单位" prop="weightName" width="160">
</el-table-column>
<el-table-column label="zone/派送分区" prop="zoneName" width="160">
</el-table-column>
<el-table-column label="地址类型" prop="addressName" width="160">
</el-table-column>
<el-table-column label="成人签收" prop="isAdultSignature" width="160">
</el-table-column>
<el-table-column label="燃油附加率" prop="rate" width="160">
</el-table-column>
<el-table-column label="应收计费重" prop="collectWeightingValue" width="160">
</el-table-column>
<!-- 应收费用列表-->
<el-table-column label="应收费用列表" prop="collectExpenseList" width="160">
<template slot-scope="scope">
<el-table-column v-for="title in scope.row.collectExpenseList" :prop="title.prop" :label="title.expenseName" align="center"
:key="title.prop" :index="title.index" :width="title.width">
<span>{{ title.amount }}</span>
</el-table-column>
</template>
</el-table-column>
<!-- -->
<!-- 应付费用列表-->
<el-table-column label="应付费用列表" prop="costExpenseList" width="160">
</el-table-column>
<!-- -->
<!-- <el-table-column label="供应商名称" prop="createTimeName" width="160">
</el-table-column> -->
<el-table-column label="应付计费重" prop="costWeightingValue" width="160">
</el-table-column>
<el-table-column label="应收客户" prop="collectAmount" width="160">
</el-table-column>
<el-table-column label="应付供应商" prop="costAmount" width="160">
</el-table-column>
<el-table-column label="理论利润" prop="profit" width="160">
</el-table-column>
</el-table>
我这个横向展示，正常的是绿色框里内容就够了，现在红色框重复了
