antd grid row col 绘制分组表头table

<div class="table">

            <a-row type="flex" justify="center">

                <a-col :span="24" class="td-col">

                    <span class="table_title">2023年人口及年龄基本情况统计表</span>

                    <span class="sub_title">统计时间：2023-06-29</span>

                </a-col>

            </a-row>

            <a-row type="flex" justify="center">

                <a-col :span="4" class="td-col">年龄段</a-col>

                <a-col :span="8">

                    <a-row type="flex" justify="center">

                        <a-col :span="24" class="td-col">户籍人口</a-col>

                    </a-row>

                    <a-row type="flex" justify="center">

                        <a-col :span="8" class="td-col">男</a-col>

                        <a-col :span="8" class="td-col">女</a-col>

                        <a-col :span="8" class="td-col">合计</a-col>

                    </a-row>

                </a-col>

                <a-col :span="8">

                    <a-row type="flex" justify="center">

                        <a-col :span="24" class="td-col">非户籍人口</a-col>

                    </a-row>

                    <a-row type="flex" justify="center">

                        <a-col :span="8" class="td-col">男</a-col>

                        <a-col :span="8" class="td-col">女</a-col>

                        <a-col :span="8" class="td-col">合计</a-col>

                    </a-row>

                </a-col>

                <a-col :span="4" class="td-col">

                    合计

                </a-col>

            </a-row>

        </div>

<style lang="less" scoped>

.table_title{

    font-size: 32px;

    color: #000;

    font-weight: bold;

}

.sub_title{

    font-size: 24px;

    color: #000;

    right: 150px;

    position: absolute;

}

.td-col{

    display: flex;

    justify-content: center;

    align-items: center;

    padding: 16px;

}

.thread {

    display: flex;

    text-align: center;

    flex-direction: column;

    justify-content: center;

    border: 1px solid #000;

    .ant-col{

        border-top: 1px solid #000;

        border-right: 1px solid #000;

    }

    .ant-row-flex:first-child .ant-col{

        border-top: none;

        border-right: none;

    }

    .ant-row-flex .ant-col:last-child {

        border-right: none;

    }

}

.tbody {

    display: flex;

    text-align: center;

    flex-direction: column;

    justify-content: center;

    border-right: 1px solid #000;

    border-bottom: 1px solid #000;

    border-left: 1px solid #000;

    .ant-col{

        border-top: 1px solid #000;

        border-right: 1px solid #000;

    }

    .ant-row-flex:first-child .ant-col{

        border-top: none;

    }

    .ant-row-flex .ant-col:last-child{

        border-right: none;

    }

}

</style>