element - table 表头合并和纵向排列（纵向单列）

参考文章：https://www.freesion.com/article/74021198804/

var list = [
    {
        category: "关键指标数据",
        // 数据明细指标
        indicators: [
            { activityName: "录单率", value: "1" },
            { activityName: "净欠费率", value: "2" },
            { activityName: "新增车牌绑定率", value: "3" },
            { activityName: "累计车牌绑定率", value: "4" },
            { activityName: "道边车位产值(元)", value: "5" },
            { activityName: "车场车位产值(元)", value: "6" },
            { activityName: "道边车位周转率", value: "7" },
            { activityName: "车场车位周转率", value: "8" },
        ],
    },
    {
        category: "基础数据类型",
        // 数据明细指标
        indicators: [
            { activityName: "道边车位数(个)", value: "1" },
            { activityName: "车场车位数(个)", value: "2" },
            { activityName: "道边收费岗位数(个)", value: "3" },
            { activityName: "车位管理员总人数(个)",  value: "4", },
            { activityName: "全天班人数(个)", value: "5" },
            { activityName: "半天班人数(个)", value: "6" },
            { activityName: "岗位均管车位数(个)", value: "7" },
            { activityName: "人均管理车位数(个)", value: "8" },
        ],
    },
];

<el-table :data="alldata" :span-method="arraySpanMethod" border style="width: 100%;" fit :header-cell-style="{'background-color': '#F5F7FA','color': '#2F2F2F'}" :default-sort="{prop: 'create_date', order: 'desc'}" highlight-current-row>
               <el-table-column prop="category" label="数据类型" width="180" align="center">
               </el-table-column>
               <el-table-column label="数据明细指标" prop="activityName">
               </el-table-column>
               <el-table-column prop="value" label="2022-05-30">
               </el-table-column>
               <el-table-column prop="value" label="2022-05-30">
               </el-table-column>
           </el-table>

created() {
        // 二次处理数据
        this.alldata = this.handleTableArr(list);
        console.log(this.alldata);
    },

methods: {
        // 解析数据
        handleTableArr(data) {
            let arr = [];
            for (let i = 0; i < data.length; i++) {
                let indicators = data[i]["indicators"];
                let count = indicators.length;
                for (let j = 0; j < indicators.length; j++) {
                    let indicators_child = indicators[j];
                    let info = {
                        // 确定每天数据的 合并行的数量
                        span_num: 1, // 合并个格子
                        value: indicators_child["value"],
                        activityName: indicators_child["activityName"],
                        category: data[i]["category"], // 第一列合并的名字
                    };
                    arr.push(info);
                }
                // 第一列的合并数量, 赋值给每个大项的第一个单元格. 比如合格积分要合并 8 行.
                arr[arr.length - count]["count"] = count;
            }
            // console.log("arr", arr);
            return arr;
        },
        // 表格合并的方法
        arraySpanMethod({ row, column, rowIndex, columnIndex }) {
            // 第一列
            if (columnIndex === 0) {
                if (row.count) {
                    return [row.count, 1];
                } else {
                    return [0, 0];
                }
            }
            // 第二列
            if (columnIndex === 1) {
                if (row.span_num > 0) {
                    return [row.span_num, 1];
                } else {
                    return [0, 0];
                }
            }
        },
}