<template>
    <n-space vertical>
        <n-data-table 
            size="small"
            :columns="table.columns" 
            :data="table.data" 
            :max-height="400"
            :single-line="false"/>
    </n-space>
</template>

<script>
import {
    NSpace,
    NDataTable,
} from 'naive-ui';

export default {
    name: 'WgyWork',
    components: {
        NSpace,
        NDataTable,
    },
    data() {
        let vueSelf = this;
        return {
            table: {
                columns: [
                    {
                        align: 'center',
                        title: '张三2023年1月考勤得分明细表',
                        key: 'title',
                        children: [
                            {
                                align: 'center',
                                title: '月',
                                key: 'month',
                                width: 60,
                            },
                            {
                                align: 'center',
                                title: '日',
                                key: 'day',
                                width: 60,
                            },
                            {
                                align: 'center',
                                title: '签到',
                                key: 'signIn',
                                width: 60,
                            },
                            {
                                align: 'center',
                                title: '签退',
                                key: 'signOut',
                                width: 60,
                            },
                            {
                                align: 'center',
                                title: '轨迹',
                                key: 'distance',
                                width: 60,
                            },
                            {
                                align: 'center',
                                title: '总分',
                                key: 'score',
                                width: 60,
                            },
                            {
                                align: 'center',
                                title: '备注',
                                key: 'remark',
                                width: 100,
                            }
                        ]
                    }
                ],
                data: []
            }
        }
    },
    methods: {
        
    },
    mounted() {
        let data = [];
        for(var i = 0; i < 100; i++) {
            data.push({
                month: 12,
                day: 1,
                signIn: 1,
                signOut: 1,
                distance: 1,
                remark: '123'
            })
        }
        this.table.data = data;
    }
}
</script>

<style lang="stylus" scoped>

</style>