<template>
    <div class="achievement-container">
        <Row>
            <span class="component-title">{{$t('totalAnalysis.ach_title4')}}</span>
        </Row>
        <!-- 进线情况统计 -->
        <Row class-name="base-table-row">
            <BaseTable ref="entryTable"
                       :columns="entryNumberColumns"
                       :tableName="$t('totalAnalysis.ach_title4')"
                       :tableDatas="entryTableData"
                       tableRef="entryTable"
                       :pageSize="10"
                       :tips="'* 绿色代表进线，蓝色代表踩线'"></BaseTable>
        </Row>
        <Row>
            <span class="component-title">{{$t('totalAnalysis.ach_title5')}}</span>
        </Row>
        <!-- 进线率统计 -->
        <Row class-name="base-table-row">
            <BaseTable :columns="entryRateColumns"
                       :tableName="$t('totalAnalysis.ach_title5')"
                       :tableDatas="entryBarData"
                       tableRef="entryRateTable"
                       :isScroll="false"
                       ref="rateTable"></BaseTable>
        </Row>
    </div>
</template>

<script>
    import BaseTable from '@/components/student-analysis/total/BaseMyTable.vue'
    export default {
        components: {
            BaseTable
        },
        data() {
            return {
                entryBarData: [],
                entryTableData: [],
                entryData: [],
                footfaultData: [],
                tipContent: '',
                classList: [],
                joinNum: 0,
				analysisJson:'',
                entryNumberColumns: [
                    {
                        title: this.$t('totalAnalysis.base_name'),
                        key: 'name',
                        minWidth: 100,
                        fixed: 'left'
                    },
                    {
                        title: this.$t('totalAnalysis.base_class'),
                        key: 'className'
                    },
                    {
                        title: this.$t('totalAnalysis.ach_table_text1'),
                        key:'gradeRank',
                        renderType: 'renderRank'
                    },
                    {
                        title: this.$t('totalAnalysis.ach_table_text2'),
                        sortable: 'custom',
                        key: 'score',
                        renderType: 'renderEntry',
                        filters: [
                            {
                                label: this.$t('totalAnalysis.ach_table_text6'),
                                value: 1
                            },
                            {
                                label: this.$t('totalAnalysis.ach_table_text7'),
                                value: 2
                            }
                        ],
                        filterMultiple: false,
                        filterRemote(value, row) {
                        }
                    }
                ],
                entryRateColumns: [
                    {
                        title: this.$t('totalAnalysis.ach_table_text1'),
                        key: 'gradeRank',
                        sortable: 'custom'
                    },
                    {
                        title: this.$t('totalAnalysis.base_class'),
                        key: 'name'
                    },
                    {
                        title: this.$t('totalAnalysis.ach_text8'),
                        key: 'entryNum',
                        sortable: true
                    },
                    {
                        title: this.$t('totalAnalysis.ach_text7'),
                        key: 'totalNum',
                        sortable: true
                    },
                    {
                        title: this.$t('totalAnalysis.ach_text9'),
                        key: 'overAverageRate',
                        sortable: 'custom',
                        renderType: function(h, params) {
                            return h('span', params.row.overAverageRate + '%')
                        }
                    }
                ]
            }
        },

        created() {
            let scatter = this.$store.state.totalAnalysis.scatter
            this.classList = this.$store.state.totalAnalysis.classList
			
			this.analysisJson = this.getAnalysisJson
			console.log(this.analysisJson)
        },

        methods: {
			
			/* 添加科目的表头 */
            renderColumns(data) {
                // 渲染进线表格
                let subjectList = data.classes[0].subjects
				let subjectColumns = []
                subjectList.forEach(item => {
                    let subjectColumn = {
                        title: item.name,
                        sortable: 'custom',
                        key: item.name
                    }
					subjectColumns.push(subjectColumn)
                })
				// 清除之前的科目columns 添加当前评测的科目columns
				this.entryNumberColumns.splice(4,this.entryNumberColumns.length - 4,...subjectColumns)
            },
			
			/* 获取进线情况统计表格数据 */
			getTableDatas(analysisJson){
				let result = []
				analysisJson.students.forEach((stu,stuIndex) => {
					result.push({
						name:stu.name,
						className:stu.className,
						gradeRank:0,
						score:stu.total,
					})
					// 动态添加学生每个科目的得分
					stu.subjects.forEach(subject => {
						result[stuIndex][subject.name] = subject.score
					})
				})
				/* 根据表格每个学生的总分来进行排序 */
				let rateRanks = result.sort((a, b) => { return Number(b.score) - Number(a.score) })
				result.forEach(item => {
					item.gradeRank = rateRanks.map(i => i.name).indexOf(item.name) + 1
				})
				return result
			},
			
			/* 获取进线率统计数据 */
			getEntryBarData(analysisJson){
				let result = []
				analysisJson.classes.forEach((classItem,classIndex) => {
					result.push({
						gradeRank:0,
						name:classItem.className,
						entryNum:classItem.lineCount,
						totalNum:classItem.stuCount,
						overAverageRate:classItem.stuCount > 0 ? ((classItem.lineCount / classItem.stuCount) * 100).toFixed(2) : 0.00,
					})
				})
				let rateRanks = result.sort((a, b) => { return Number(a.overAverageRate) - Number(b.overAverageRate) })
				result.forEach(item => {
					item.gradeRank = rateRanks.map(i => i.name).indexOf(item.name) + 1
				})
				return result
			}
        },
        mounted() {
            this.$refs.rateTable.$el.childNodes[1].style.borderRight = '0'
            this.$refs.entryTable.$el.childNodes[1].style.borderRight = '0'

            if (this.getAnalysisJson) {
				this.renderColumns(this.getAnalysisJson) // 渲染科目表头
				this.entryTableData = this.getTableDatas(this.getAnalysisJson)
				this.entryBarData = this.getEntryBarData(this.getAnalysisJson)
            }
        },
        computed: {
            getAnalysisJson() {
                return this.$store.state.totalAnalysis.analysisJson
            }
        },
        watch: {
            getAnalysisJson(val) {
                if (!val) return
				this.renderColumns(val)
				this.entryTableData = this.getTableDatas(val)
				this.entryBarData = this.getEntryBarData(val)
            }
        }
    }
</script>

<style src="./AchievementAnalysis.css" scoped></style>
