<template>
    <transition name="fade" mode="out-in">
        <div class="study-detail-container">
            <Table :columns="columns" :data="data"></Table>
        </div>
    </transition>
</template>
<script>
    export default {
        components: {
        },
        props: {
            studyData: {
                type: Object,
                default: () => {
                    return {}
                }
            },
            learnContent: {
                type: Object,
                default:() => {
                    return {}
                }
            }
        },
        data() {
            return {
            }
        },
        methods: {
            
        },
        computed: {
            columns() {
                let col = []
                col.push({
                    title: '学习阶段',
                    key: 'keyName'
                })
                if (this.learnContent.pk == 'LearnProcess') {
                    for (let index in this.learnContent.steps) {
                        col.push({
                            title: this.learnContent.steps[index].name,
                            key: index,
                            align: 'center'
                        })
                    }
                }
                return col
            },
            data() {
                let data = [
                    {
                        keyName: '得分'
                    },
                    {
                        keyName: '作答次数'
                    },
                    {
                        keyName: '状态'
                    },
                    //{
                    //    keyName: '尝试次数最多'
                    //}
                ]
                if (this.learnContent.pk == 'LearnProcess') {
                    for (let index in this.learnContent.steps) {
                        if (this.studyData.steps[index]) {
                            data[0][index] = this.studyData.steps[index].score
                            data[1][index] = this.studyData.steps[index].count
                            data[2][index] = this.studyData.steps[index].score >= 80 ? '已通过' : '未通过'
                        } else {
                            data[0][index] = '--'
                            data[1][index] = '--'
                            data[2][index] = '未进行'
                        }
                        
                    }
                } else {
                    
                }
                return data
                
                return data
            }
        },
        watch: {
            studyData: {
                handler(n, o) {
                },
                deep: true
            }
        }
    }
</script>
<style scoped lang="less">
    .study-detail-container {
        background: white;
        padding:20px 50px;
        
    }
</style>
<style>
    .study-detail-container .ivu-table td {
        color:black;
    }
    .study-detail-container .ivu-table-header thead tr th {
        color:black;
    }
    .study-detail-container .ivu-table-row-hover {
        background: unset;
    }
</style>