var tableData = [
[ //标题栏
{field: 'date',align: 'center', title: '日期', width: 130, rowspan: 3} //rowspan即纵向跨越的单元格数
,{align: 'center', title: '第三方支付', colspan: 8}
,{align: 'center', title: '积分支付', colspan: 8}
,{align: 'center',align: 'center', title: '其他', colspan: 3, rowspan: 2}
,{field: 'new_user',align: 'center', title: '新增用户', rowspan: 3}
,{align: 'center', title: '操作', rowspan: 3,templet: function (d)
{
return '<button class="layui-btn layui-table-btn layui-btn-xs" lay-event="refresh">刷新</button>';
}}
],
[ //标题栏
{align: 'center', title: '订单数量', colspan: 4}
,{align: 'center',align: 'center', title: '订单金额', colspan: 4} //colspan即横跨的单元格数,这种情况下不用设置field和width
,{align: 'center', title: '积分支付订单数量', colspan: 4}
,{align: 'center',align: 'center', title: '积分支付订单金额', colspan: 4} //colspan即横跨的单元格数,这种情况下不用设置field和width
,{align: 'center',align: 'center', title: '', colspan: 3}
],
[
{field: 'ordinary_order_num', title: '普通订单',align: 'center'}
,{field: 'upgrade_order_num', title: '升级订单',align: 'center'}
,{field: 'repurchase_order_num', title: '复购订单',align: 'center'}
,{title: '总计',align: 'center',templet: function (d)
{
return parseInt(d.ordinary_order_num)+parseInt(d.upgrade_order_num)+parseInt(d.repurchase_order_num);
},style:'color:red;'}
,{field: 'ordinary_order_amount', title: '普通订单',align: 'center'}
,{field: 'upgrade_order_amount', title: '升级订单',align: 'center'}
,{field: 'repurchase_order_amount', title: '复购订单',align: 'center'}
,{title: '总计',align: 'center',templet: function (d)
{
return parseFloat(d.ordinary_order_amount)+parseFloat(d.upgrade_order_amount)+parseFloat(d.repurchase_order_amount);
},style:'color:red;'},
{field: 'integral_ordinary_order_num', title: '普通订单',align: 'center'}
,{field: 'integral_upgrade_order_num', title: '升级订单',align: 'center'}
,{field: 'integral_repurchase_order_num', title: '复购订单',align: 'center'}
,{title: '总计',align: 'center',templet: function (d)
{
return parseInt(d.integral_ordinary_order_num)+parseInt(d.integral_upgrade_order_num)+parseInt(d.integral_repurchase_order_num);
},style:'color:red;'}
,{field: 'integral_ordinary_order_amount', title: '普通订单',align: 'center'}
,{field: 'integral_upgrade_order_amount', title: '升级订单',align: 'center'}
,{field: 'integral_repurchase_order_amount', title: '复购订单',align: 'center'}
,{title: '总计',align: 'center',templet: function (d)
{
return parseFloat(d.integral_ordinary_order_amount)+parseFloat(d.integral_upgrade_order_amount)+parseFloat(d.integral_repurchase_order_amount);
},style:'color:red;'}
,{field: 'share_amount', title: '分成金额',align: 'center'}
,{field: 'withdrawal_amount', title: '已提现金额',align: 'center'}
,{field: 'refund_amount', title: '退款金额',align: 'center'}
]
];
var options = {
elem: '#table'
,id: 'table'
,url: "statistic-api/statistics-day?staff_id="+staff_id+"&staff_token="+staff_token
,width: 2392
,height: tableHeight
,page: true //开启分页
,limit: 16
,limits: [16,20,30,40,50]
,cols: tableData
};
Table = table.render(options);
<div class="table-body">
<table class="layui-table" style="margin: 0;">
<thead>
<tr>
<th style="width: 45px;">日期</th>
<th style="width: 45px;">记帐码</th>
<th style="width: 90px;">科目</th>
<th style="width: 90px;">凭证货币金额</th>
<th style="width: 90px;">本位币金额</th>
<th style="width: 90px;">成本中心</th>
<th style="width: 90px;">利润中心</th>
<th style="width: 90px;">资金代码</th>
<th style="width: 90px;">摘要</th>
<th style="width: 90px;">制单人</th>
<th style="width: 90px;">审核人</th>
<th style="width: 90px;">操作</th>
</tr>
</thead>
<tbody>
<template v-for="item in list">
<tr>
<td style="width: 65px;" :rowspan="item.subjects.length">{{item.added_time}}</td>
<td style="width: 45px;" :rowspan="item.subjects.length">{{item.subjects[0].accounting_code}}</td>
<td style="width: 90px;">{{item.subjects[0].subject_name}}</td>
<td style="width: 90px;">{{item.subjects[0].amount_of_voucher_currency}}</td>
<td style="width: 90px;">{{item.subjects[0].amount_in_local_currency}}</td>
<td style="width: 90px;">{{item.subjects[0].cost_center}}</td>
<td style="width: 90px;">{{item.subjects[0].profit_center}}</td>
<td style="width: 90px;">{{item.subjects[0].fund_code}}</td>
<td style="width: 90px;">{{item.subjects[0].summary}}</td>
<td style="width: 90px;" :rowspan="item.subjects.length">{{item.creator}}</td>
<td style="width: 90px;" :rowspan="item.subjects.length">{{item.reviewer}}</td>
<td style="width: 45px;" :rowspan="item.subjects.length">
<button class="layui-btn icon-btn layui-btn-normal layui-btn-xs" @click="edit(item)" >编辑</button>
<button class="layui-btn icon-btn layui-btn-danger layui-btn-xs" @click="del(item)" >删除</button>
<button class="layui-btn icon-btn layui-btn-normal layui-btn-xs" @click="writeoff(item)" >冲销</button>
<button class="layui-btn icon-btn layui-btn-normal layui-btn-xs" @click="writeoff(item)" >审核</button>
</td>
</tr>
<tr v-for="item1,key in item.subjects" v-show="key > 0">
<td style="width: 90px;">{{item1.subject_name}}</td>
<td style="width: 90px;">{{item1.amount_of_voucher_currency}}</td>
<td style="width: 90px;">{{item1.amount_in_local_currency}}</td>
<td style="width: 90px;">{{item1.cost_center}}</td>
<td style="width: 90px;">{{item1.profit_center}}</td>
<td style="width: 90px;">{{item1.fund_code}}</td>
<td style="width: 90px;">{{item1.summary}}</td>
</tr>
</template>
</tbody>
</table>
</div>