el-table 纵向展示

<div class="table-box">
                <el-table
                    style="width: 100%"
                    :data="getValues"
                    >
                    <el-table-column
                        v-for="(item, index) in getHeaders"
                        :key="index"
                        :prop="item"
                        :show-header="false"
                    >
                    </el-table-column>
                </el-table>
            </div>


headers: [
                {
                    prop: 'seat',
                    label: '席位',
                },
                {
                    prop: 'mainSquad',
                    label: '主班',
                },
                {
                    prop: 'viceSquad',
                    label: '副班',
                },
                {
                    prop: 'unit',
                    label: '单位',
                },
                {
                    prop: 'commander',
                    label: '指挥员',
                },
                {
                    prop: 'dutyOfficer',
                    label: '值班参谋',
                },
            ],
            tableData: [
                {seat: '席位1',mainSquad: '王某某',viceSquad: '张某某',unit:'xxx单位',commander:'李某某',dutyOfficer:'马某'},
                {seat: '席位2',mainSquad: '王某人',viceSquad: '张某人',unit:'xxx单位',commander:'李某人',dutyOfficer:'马某人'},
                {seat: '席位3',mainSquad: '王某人',viceSquad: '张某人',unit:'xxx单位',commander:'李某人',dutyOfficer:'马某人'},
                {seat: '席位4',mainSquad: '王某人',viceSquad: '张某人',unit:'xxx单位',commander:'李某人',dutyOfficer:'马某人'},
                {seat: '席位5',mainSquad: '王某人',viceSquad: '张某人',unit:'xxx单位',commander:'李某人',dutyOfficer:'马某人'},
                
            ]

computed: {
        getHeaders() {
            return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
        },
        getValues() {
            return this.headers.map(item => {
            return this.tableData.reduce((pre, cur, index) => Object.assign(pre, {['value' + index]: cur[item.prop]}), {'title': item.label,});
            });
        }
    },


 getRowSpan(count, index) {
            if (index === 0) {
                return count;
            } else {
                return 0;
            }
        },


:deep(.el-table th.el-table__cell>.cell){
    display:none !important;
    height:0px !important;
}
:deep(.el-table_1_column_1){
    background: url('@/assets/jiankong/table_header_bg.png') no-repeat !important;
    background-size: 100% 100% !important;
}
:deep(.el-table th.el-table__cell.is-leaf){
    display: none !important;
}
:deep(.el-table) {
    .el-table__header {
        background: url('@/assets/jiankong/table_header_bg.png') no-repeat;
        background-size: 100% 100%;
    }

    .el-table__row {
        background: url('@/assets/jiankong/table_row_bg.png') no-repeat !important;
        background-size: 100% 100% !important;
    }

    tr.el-table__row--striped td.el-table__cell {
        background: transparent;
    }

    th.el-table__cell.is-leaf {
        border-bottom: none;
    }
}

.table-box {
    margin-top: 0.8125rem;
}