表格如下：
数据格式如下：
一、elementUI el-table渲染到网页上
<div v-loading="loading" style="margin-bottom: 16px;">
<div v-if="syncList.length">
<el-table :data="syncList" style="width: 100%" :header-cell-style="getRowClass" :span-method="objectSpanMethod">
<el-table-column align="center" label="项目" max-width="96">
<el-table-column prop="category" width="90" label="类别" align="center">
<template slot-scope="scope">
<span>{{scope.row.category}}</span>
</template>
</el-table-column>
<el-table-column prop="staType" width="120" label="统计方式" align="center">
<template slot-scope="scope">
<span>{{scope.row.staType}}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column v-for="(item, index) in syncList[0].orgs" :key="index" :label="item.subsystemName" align="center"> // 动态列orgs
<template slot-scope="scope">
<span>{{scope.row.orgs?scope.row.orgs[index].subsystemName:''}}</span>
</template>
<el-table-column prop="dayShift" width="90" label="白班" align="center">
<template slot-scope="scope">
<span>{{scope.row.orgs[index].dayShift?scope.row.orgs[index].dayShift:"-"}}</span>
</template>
</el-table-column>
<el-table-column prop="nightShift" width="90" label="晚班" align="center">
<template slot-scope="scope">
<span>{{scope.row.orgs[index].nightShift?scope.row.orgs[index].nightShift:"-"}}</span>
</template>
</el-table-column>
<el-table-column prop="total" width="90" label="合计" align="center">
<template slot-scope="scope">
<span>{{scope.row.orgs[index].total?scope.row.orgs[index].total:"-"}}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="合计" align="center" >
<el-table-column prop="dayShift" width="90" label="白班" align="center">
<template slot-scope="scope">
<span>{{scope.row.thisPeriod.dayShift}}</span>
</template>
</el-table-column>
<el-table-column prop="nightShift" width="90" label="晚班" align="center">
<template slot-scope="scope">
<span>{{scope.row.thisPeriod.nightShift}}</span>
</template>
</el-table-column>
<el-table-column prop="total" width="90" label="合计" align="center">
<template slot-scope="scope">
<span>{{scope.row.thisPeriod.total}}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="上年同期" align="center" >
<el-table-column prop="dayShift" width="90" label="白班" align="center">
<template slot-scope="scope">
<span>{{scope.row.lastPeriod.dayShift}}</span>
</template>
</el-table-column>
<el-table-column prop="nightShift" width="90" label="晚班" align="center">
<template slot-scope="scope">
<span>{{scope.row.lastPeriod.nightShift}}</span>
</template>
</el-table-column>
<el-table-column prop="total" width="90" label="合计" align="center">
<template slot-scope="scope">
<span>{{scope.row.lastPeriod.total}}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="compare" align="center" label="增减%" max-width="96"></el-table-column>
</el-table>
</div>
<div v-else style="display: flex;justify-content: space-around;align-items: center;color: #c7c7c7;min-height: 200px;">
暂无数据
</div>
</div>
标签：xlsx,vue,index,nightShift,scope,orgs,total,下载,row From： https://www.cnblogs.com/mmzuo-798/p/18398098