<template>
    <!-- 首页mini课表，暂时不用 -->
    <div class="home-cus-plan dark-iview-table">
        <Table :columns="columns1" :data="data1" border>
            <!--星期一-->
            <template slot-scope="{ row, index }" slot="MON">
                <div v-if="row.MON == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
            <!--星期二-->
            <template slot-scope="{ row, index }" slot="TUE">
                <div v-if="row.TUE == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
            <!--星期三-->
            <template slot-scope="{ row, index }" slot="WED">
                <div v-if="row.WED == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
            <!--星期四-->
            <template slot-scope="{ row, index }" slot="THU">
                <div v-if="row.THU == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
            <!--星期五-->
            <template slot-scope="{ row, index }" slot="FRI">
                <div v-if="row.FRI == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
            <!--星期六-->
            <template slot-scope="{ row, index }" slot="SAT">
                <div v-if="row.SAT == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
            <!--星期日-->
            <template slot-scope="{ row, index }" slot="SUN">
                <div v-if="row.SUN == 1" class="active-cell">
                    <span class="course-dot"></span>
                </div>
            </template>
        </Table>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                columns1: [
                    {
                        title: ' ',
                        type: 'index',
                        align: 'center'
                    },
                    {
                        title: '一',
                        slot: 'MON',
                        align: 'center'
                    },
                    {
                        title: '二',
                        slot: 'TUE',
                        align: 'center'
                    },
                    {
                        title: '三',
                        slot: 'WED',
                        align: 'center'
                    },
                    {
                        title: '四',
                        slot: 'THU',
                        align: 'center'
                    },
                    {
                        title: '五',
                        slot: 'FRI',
                        align: 'center'
                    },
                    {
                        title: '六',
                        slot: 'SAT',
                        align: 'center'
                    },
                    {
                        title: '日',
                        slot: 'SUN',
                        align: 'center'
                    }
                ],
                data1: [
                    {
                        MON: '',
                        THU: '',
                        WED: '',
                        THU: '1',
                        FRI: '',
                        SAT: '1',
                        SUN:''
                    },
                    {
                        MON: '',
                        THU: '',
                        WED: '',
                        THU: '1',
                        FRI: '',
                        SAT: '',
                        SUN:''
                    },
                    {
                        MON: '',
                        THU: '1',
                        WED: '',
                        THU: '',
                        FRI: '1',
                        SAT: '1',
                        SUN:''
                    },
                    {
                        MON: '1',
                        THU: '',
                        WED: '',
                        THU: '1',
                        FRI: '',
                        SAT: '',
                        SUN:''
                    },
                    {
                        MON: '',
                        THU: '',
                        WED: '',
                        THU: '1',
                        FRI: '',
                        SAT: '',
                        SUN:''
                    },
                    {
                        MON: '1',
                        THU: '',
                        WED: '',
                        THU: '1',
                        FRI: '',
                        SAT: '',
                        SUN:''
                    },
                    {
                        MON: '',
                        THU: '',
                        WED: '1',
                        THU: '1',
                        FRI: '',
                        SAT: '',
                        SUN:''
                    }
                ]
            }
        }
    }
</script>
<style scoped lang="less">
    .course-dot {
        display:inline-block;
        width:8px;
        height:8px;
        background:aqua;
        border-radius:4px;
    }
    .active-cell {
        width:100%;
        height:48px;
        line-height:48px;
        background:#505050;
    }
</style>
<style>

</style>