<template>
    <div class="cus-table-container dark-iview-table">
        <vuescroll>
            <div class="cus-table-top dark-iview-input dark-iview-select">
                <div class="class-filter-wrap">
                    <span class="label">班级</span>
                    <Select v-model="curClass" size="small" style="width: 200px;display:inline-block;">
                        <Option v-for="(item,index) in teachClassList" :key="index" :value="item.classroomCode">{{item.classroomName}}</Option>
                        <Option value="all">所有班级</Option>
                    </Select>
                </div>
                <h1 class="sch-title">课程表</h1>
            </div>
            <Table :columns="timeColumns" disabled-hover :data="tableData" border :span-method="handleSpan" style="width:calc(100% - 15px);margin-top:20px;">
                <!--上午/下午-->
                <template slot-scope="{ row, index }" slot="sub">
                    <p style="padding:10px 0px 4px 0px;font-size: 20px;">
                        {{parseInt(row.time.substr(0,2)) > 12 ? '下午':'上午'}}
                    </p>
                </template>
                <!--时段-->
                <template slot-scope="{ row, index }" slot="time">
                    <p style="padding:10px 0px 4px 0px;font-size: 20px;">
                        {{row.time}}
                    </p>
                    <p style="font-size:12px;padding:4px 0px 10px 0px;">
                        {{'('+row.label+')'}}
                    </p>
                </template>
                <!--星期一-->
                <template slot-scope="{ row, index }" slot="MON">
                    <div :class="row.weeklies.MON.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.MON.classroomCode">{{row.weeklies.MON.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.MON.classroomCode">{{row.weeklies.MON.classroomName}}</p>
                    </div>
                </template>
                <!--星期二-->
                <template slot-scope="{ row, index }" slot="TUE">
                    <div :class="row.weeklies.TUE.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.TUE.classroomCode">{{row.weeklies.TUE.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.TUE.classroomCode">{{row.weeklies.TUE.classroomName}}</p>
                    </div>
                </template>
                <!--星期三-->
                <template slot-scope="{ row, index }" slot="WED">
                    <div :class="row.weeklies.WED.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.WED.classroomCode">{{row.weeklies.WED.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.WED.classroomCode">{{row.weeklies.WED.classroomName}}</p>
                    </div>
                </template>
                <!--星期四-->
                <template slot-scope="{ row, index }" slot="THU">
                    <div :class="row.weeklies.THU.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.THU.classroomCode">{{row.weeklies.THU.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.THU.classroomCode">{{row.weeklies.THU.classroomName}}</p>
                    </div>
                </template>
                <!--星期五-->
                <template slot-scope="{ row, index }" slot="FRI">
                    <div :class="row.weeklies.FRI.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.FRI.classroomCode">{{row.weeklies.FRI.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.FRI.classroomCode">{{row.weeklies.FRI.classroomName}}</p>
                    </div>
                </template>
                <!--星期六-->
                <template slot-scope="{ row, index }" slot="SAT">
                    <div :class="row.weeklies.SAT.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.SAT.classroomCode">{{row.weeklies.SAT.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.SAT.classroomCode">{{row.weeklies.SAT.classroomName}}</p>
                    </div>
                </template>
                <!--星期日-->
                <template slot-scope="{ row, index }" slot="SUN">
                    <div :class="row.weeklies.SUN.status == 1 ? 'week-day-cell':'week-day-cell vact-status'">
                        <p class="course-name" v-show="curClass == 'all' || curClass == row.weeklies.SUN.classroomCode">{{row.weeklies.SUN.courseName}}</p>
                        <p class="classroom-name" v-show="curClass == 'all' || curClass == row.weeklies.SUN.classroomCode">{{row.weeklies.SUN.classroomName}}</p>
                    </div>
                </template>
            </Table>
        </vuescroll>
    </div>
</template>
<script>
    export default {
        props: {
            listType: {
                type: String,
                default:'school'
            },
            courseInfo: {
                type: Object,
                default: () => {
                    return {}
                }
            }
        },
        data() {
            return {
                teachClassList:[],
                myCusPlan: [],
                curClass:'all',
                subIndex: 0,
                schoolInfo: {},
                tableData:[],
                timeColumns: [
                    {
                        title: ' ',
                        slot: 'sub',
                        width: 100,
                        align: 'center',
                        className:'custom-bg'
                    },
                    {
                        title: ' ',
                        slot: 'time',
                        width: 200,
                        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'
                    }
                ],
            }
        },
        methods: {
            //获取课程安排
            getMyCusPlan() {
                this.$api.courseMgmt.findPlan({
                    //id: item.id,
                    code: this.$store.state.userInfo.TEAMModelId
                }).then(
                    (res) => {
                        if (!res.error) {
                            this.myCusPlan = res.result.data
                            this.fullTable111()
                        }
                    },
                    (planErr) => {

                    }
                )
            },
            //根据上下午合并单元格
            handleSpan({ row, column, rowIndex, columnIndex }) {
                this.getSubIndex()
                if (rowIndex === 0 && columnIndex === 0) {
                    return [this.subIndex, 1]
                } else if (rowIndex < this.subIndex && columnIndex === 0) {
                    return [0,0]
                }
                if (rowIndex == this.subIndex && columnIndex === 0) {
                    return [this.schoolInfo.timetable.length - this.subIndex, 1]
                } else if (rowIndex > this.subIndex && columnIndex === 0){
                    return [0,0]
                }
            },
            getSubIndex() {
                for (let index in this.schoolInfo.timetable) {
                    if (parseInt(this.tableData[index].time.substr(0, 2)) > 12) {
                        this.subIndex = parseInt(index)
                        break
                    }
                }
            },
            //填充课程表
            fullTable() {
                if (this.courseInfo.classes) {
                    //完善班级信息
                    for (let index in this.courseInfo.classes) {
                        let classroom = this.$store.state.user.schoolProfile.school_classes.filter((item) => {
                            return item.classroomCode == this.courseInfo.classes[index].classroomCode
                        })
                        if (classroom.length > 0) {
                            this.$set(this.courseInfo.classes[index], 'classroomName', classroom[0].classroomName)
                            this.$set(this.courseInfo.classes[index], 'headMaster', classroom[0].headMaster)
                            this.$set(this.courseInfo.classes[index], 'studentCount', classroom[0].studentCount)
                            this.$set(this.courseInfo.classes[index], 'code', classroom[0].code)
                        } else {
                            this.$api.schoolSetting.findClassInfo({
                                code: this.$store.state.userInfo.TEAMModelId,
                                classroomCode: this.courseInfo.classes[index].classroomCode
                            }).then(
                                (res) => {
                                    if (res.error == null) {
                                        if (res.result.data.length > 0) {
                                            this.$set(this.courseInfo.classes[index], 'headMaster', '- -')
                                            this.$set(this.courseInfo.classes[index], 'studentCount', 0)
                                            this.$set(this.courseInfo.classes[index], 'classroomName', res.result.data[0].classroomName)
                                            this.$set(this.courseInfo.classes[index], 'code', this.$store.state.userInfo.TEAMModelId)
                                        } else {
                                            this.$set(this.courseInfo.classes[index], 'headMaster', '- -')
                                            this.$set(this.courseInfo.classes[index], 'studentCount', 0)
                                            this.$set(this.courseInfo.classes[index], 'classroomName', '暂无班级信息')
                                            this.$set(this.courseInfo.classes[index], 'code', this.$store.state.userInfo.TEAMModelId)
                                        }
                                    } else {
                                        this.$set(this.courseInfo.classes[index], 'headMaster', '- -')
                                        this.$set(this.courseInfo.classes[index], 'studentCount', 0)
                                        this.$set(this.courseInfo.classes[index], 'classroomName', '暂无班级信息')
                                        this.$set(this.courseInfo.classes[index], 'code', this.$store.state.userInfo.TEAMModelId)
                                    }
                                },
                                (err) => {
                                    this.$set(this.courseInfo.classes[index], 'headMaster', '- -')
                                    this.$set(this.courseInfo.classes[index], 'studentCount', 0)
                                    this.$set(this.courseInfo.classes[index], 'classroomName', '暂无班级信息')
                                    this.$set(this.courseInfo.classes[index], 'code', this.$store.state.userInfo.TEAMModelId)
                                }
                            )
                        }
                    }
                    for (let item of this.myCusPlan[index].classes) {
                        for (let index in item.courseTimes) {
                            for (let tableIndex in this.tableData) {
                                if (item.courseTimes[index]) {
                                    if (this.tableData[tableIndex].time == item.courseTimes[index].time) {
                                        this.$set(this.tableData[tableIndex].weeklies[item.courseTimes[index].day], 'classroomName', item.classroomName)
                                        this.$set(this.tableData[tableIndex].weeklies[item.courseTimes[index].day], 'classroomCode', item.classroomCode)
                                        this.$set(this.tableData[tableIndex].weeklies[item.courseTimes[index].day], 'courseName', this.myCusPlan[index].course.courseName)
                                        break
                                    }
                                }
                            }
                        }
                    }
                }
            },
            //填充课程表
            async fullTable111() {
                //完善课程信息
                let result = await this.fullCourse()
                if (result !== 200) {
                    this.$Message.error('课程名称查询失败')
                }
                //完善班级信息
                let classR = await this.fullClass()
                if (classR !== 200) {
                    this.$Message.error('课程名称查询失败')
                }
                //填充课表
                for (let index in this.myCusPlan) {
                    for (let item of this.myCusPlan[index].classes) {
                        for (let i in item.courseTimes) {
                            for (let tableIndex in this.tableData) {
                                if (item.courseTimes[i]) {
                                    if (this.tableData[tableIndex].time == item.courseTimes[i].time) {
                                        this.$set(this.tableData[tableIndex].weeklies[item.courseTimes[i].day], 'classroomName', item.classroomName)
                                        this.$set(this.tableData[tableIndex].weeklies[item.courseTimes[i].day], 'classroomCode', item.classroomCode)
                                        this.$set(this.tableData[tableIndex].weeklies[item.courseTimes[i].day], 'courseName', this.myCusPlan[index].courseName)
                                        break
                                    }
                                }
                            }
                        }
                    }
                }
            },
            async fullClass() {
                return new Promise(async (r, j) => {
                    for (let i in this.myCusPlan) {
                        for (let j in this.myCusPlan[i].classes) {
                            let classroom = this.$store.state.user.schoolProfile.school_classes.filter((item) => {
                                return item.classroomCode == this.myCusPlan[i].classes[j].classroomCode
                            })
                            if (classroom.length > 0) {
                                this.myCusPlan[i].classes[j].classroomName = classroom[0].classroomName
                            } else {
                                let result = await this.$api.schoolSetting.findClassInfo({
                                    classroomCode: this.myCusPlan[i].classes[j].classroomCode
                                })
                                if (!result.error && result.result.data) {
                                    this.myCusPlan[i].classes[j].classroomName = result.result.data[0].classroomName
                                } else {
                                    this.myCusPlan[i].classes[j].classroomName = '未查到班级'
                                }
                            }
                        }
                    }
                    this.getTeachClassList()
                    r(200)
                })
            },
            async fullCourse() {
                return new Promise((r, j) => {
                    let ids = this.myCusPlan.map(item => {
                        return item.id
                    })
                    this.$api.courseMgmt.findCourse({
                        id: ids
                    }).then(
                        (res) => {
                            if (!res.error && res.result.data) {
                                let resData = res.result.data
                                for (let index in this.myCusPlan) {
                                    let cur = resData.filter((item) => {
                                        return item.id == this.myCusPlan[index].id
                                    })
                                    if (cur) {
                                        this.myCusPlan[index].courseName = cur[0].courseName
                                    } else {
                                        this.myCusPlan[index].courseName = '未查到课程名'
                                    }
                                }
                                r(200)
                                
                            } else {
                                for (let index in this.myCusPlan) {
                                    this.myCusPlan[index].courseName = '查询失败'
                                }
                                r(500)
                            }
                            
                        },
                        (err) => {
                            for (let index in this.myCusPlan) {
                                this.myCusPlan[index].courseName = '查询失败'
                            }
                            r(500)
                        }
                    )
                })
            },
            getTeachClassList() {
                let set = []
                for (let planItem of this.myCusPlan) {
                    for (let classItem of planItem.classes) {
                        let check = set.filter((item) => {
                            return item.classroomCode == classItem.classroomCode
                        })
                        if (check.length == 0) {
                            set.push({
                                classroomCode: classItem.classroomCode,
                                classroomName: classItem.classroomName
                            })
                        }
                    }
                }
                this.teachClassList = set
            }
        },
        created() {
            this.getMyCusPlan()
        },
        watch: {
            courseInfo: {
                handler(n, o) {
                    this.schoolInfo = this.$store.state.user.schoolProfile.school_base
                    let timeTable = this.$store.state.user.schoolProfile.school_base.timetable.filter((item, index) => {
                        return item.type == 1
                    })
                    this.tableData = JSON.parse(JSON.stringify(timeTable))
                    this.fullTable()
                },
                deep: true,
                immediate: true
            }
        },
        computed: {
            
        }
    }
</script>
<style lang="less" scoped>
    @import "./CourseTable.less";
</style>
<style lang="less">
    .cus-table-container .ivu-table {
        width:100%;
        
    }
    .ivu-table .custom-bg{
        background:#404040 !important;
    }
</style>
