
<template>
    <div class="form-container">
        <Form :model="formTop" label-position="top">
            <FormItem label="科目" v-if="isSchool">
                <Select v-model="formTop.subject" disabled>
                    <Option v-for="(item,index) in currentPeriod.subjects" :value="item.id" :key="index">{{ item.name }}</Option>
                </Select>
            </FormItem>
            <FormItem label="年级" v-if="isSchool">
                <Select v-model="formTop.grade">
                    <Option v-for="(item,index) in currentPeriod.grades" :value="item.id" :key="index">{{item.name}}</Option>
                </Select>
            </FormItem>
            <FormItem label="学期" v-if="isSchool">
                <Select v-model="formTop.semester">
                    <Option v-for="(item,index) in currentPeriod.semesters" :value="item.id"  :key="index">{{item.name}}</Option>
                </Select>
            </FormItem>
            <FormItem label="名称">
                <Input v-if="isSchool" v-model="formTop.volume" placeholder="非必填,默认由年级+科目+学期组成..."></Input>
                <Input v-else v-model="formTop.volume" placeholder="填写册别名称"></Input>
            </FormItem>
            <FormItem>
                <Button @click="handleSubmit" :loading="isLoading">确认</Button>
            </FormItem>
        </Form>
    </div>
</template>

<script>
    export default {
        props: ['originData', 'periodIndex', 'subjectIndex', 'editVolume', 'addType'],
        data() {
            return {
				isSchool:false,
                originDatas: {},
                currentPeriod: {},
                editItem: null,
                addVolumeType: 'school',
                isLoading: false,
                formTop: {
                    subject: '',
                    grade: '',
                    semester: '',
                    volume: ''
                }
            }
        },
        created() {
			this.isSchool = this.$route.name === 'syllabus'
			if(this.originData && this.originData.period){
				this.currentPeriod = this.originData.period[this.periodIndex]
				this.originDatas = this.originData
			}
        },
        methods: {
            // 提交添加
            handleSubmit() {
                this.isLoading = true
				const isSchool = this.$route.name === 'syllabus'
                let params = {
                    type:  isSchool ? 0 : 1,
                    code: isSchool ? this.$store.state.userInfo.schoolCode : this.$store.state.userInfo.TEAMModelId,
					scope: isSchool ? 'school' : 'private',
                    periodId: isSchool ? this.currentPeriod.id : null,
                    subjectId: isSchool ? this.formTop.subject : null,
                    gradeId: isSchool ? this.formTop.grade : null,
                    semesterId: isSchool ? this.formTop.semester : null,
                    volumeName: this.getNewVolumeName(),
                    status: 1
                }
                if (this.editItem && this.editItem.id && this.editItem.code) {
                    params.id = this.editItem.id
                    params.code = this.editItem.code
                    params.ttl = this.editItem.ttl
                    params.pk = this.editItem.pk
                    params.volumeCode = this.editItem.volumeCode
                }
                if (this.$route.name === 'personalSyllabus') {
                    params.TEAMModelId = this.$store.state.userInfo.TEAMModelId
                }
                this.$api.syllabus.SaveOrUpdateVolume(params).then(res => {
                    if (!res.error && res) {
                        this.$emit('addFinish', res.volume.id)
                    } else {
                        this.$Message.warning('操作失败,错误代码：' + res.error.code + ',错误信息:' + res.v)
                    }
                    this.isLoading = false
                    this.closeModal()
                    this.editItem = null
                }).catch(err => {
                    console.log(err)
                    this.$Message.warning('操作失败')
                    this.isLoading = false
                })
            },

            // 获取新册别名称
            getNewVolumeName() {
                if (this.formTop.volume) {
                    return this.formTop.volume
                } else {
                    let subject = this.currentPeriod.subjects[this.subjectIndex].name
                    let grade = this.currentPeriod.grades.filter(item => item.id === this.formTop.grade)[0].name
                    let semester = this.currentPeriod.semesters.filter(item => item.id === this.formTop.semester)[0].name
                    return subject + grade + semester
                }
            },

            // 添加完成 关闭窗口
            closeModal() {
                this.$emit('addFinish', false)
                this.formTop.volume = ''
            }
        },
        mounted() {
        },
        watch: {
            addType: {
                handler(newValue, oldValue) {
                    if (newValue) {
                        this.addVolumeType = newValue
                    }
                }
            },
            originData: {
                handler(newValue, oldValue) {
                    this.originDatas = newValue
            console.log(this.originData)

                }
            },
            periodIndex: {
                handler(newValue, oldValue) {
                    this.currentPeriod = this.originDatas.period[newValue]
                    this.formTop.subject = this.currentPeriod.subjects.length ? this.currentPeriod.subjects[0].id : ''
                    this.formTop.grade = this.currentPeriod.grades.length ? this.currentPeriod.grades[0].id : ''
                    this.formTop.semester = this.currentPeriod.semesters.length ? this.currentPeriod.semesters[0].id : ''
                    this.formTop.volume = ''
                    console.log(this.currentPeriod)
                }
            },
            subjectIndex: {
                handler(newValue, oldValue) {
                    this.formTop.subject = this.currentPeriod.subjects ? this.currentPeriod.subjects[newValue].id : ''
                }
            },
            editVolume: {
                handler(newValue, oldValue) {
                    if (newValue) { // 有编辑册别传过来则为编辑状态
                        this.editItem = newValue
                        this.formTop.subject = this.formTop.subject || this.currentPeriod.subjects[0].id
                        this.formTop.grade = this.formTop.grade || this.currentPeriod.grades[0].id
                        this.formTop.semester = this.formTop.semester || this.currentPeriod.semesters[0].id
                        this.formTop.volume = newValue.volumeName
                    } else { // 否则为新增状态
                        this.formTop.subject = this.formTop.subject || this.currentPeriod.subjects[0].id
                        this.formTop.grade = this.formTop.grade || this.currentPeriod.grades[0].id
                        this.formTop.semester = this.formTop.semester || this.currentPeriod.semesters[0].id
                        this.formTop.volume = ''
                        this.editItem = newValue
                    }
                }
            }
        }

    }
</script>

<style>
    .form-container .ivu-form .ivu-form-item-label {
        color: #fff;
        margin:10px 0;
        font-size:16px;
    }

    .form-container .ivu-input {
        background: #575757;
        border-color: transparent;
        height: 35px;
        color:#fff;
    }
    .form-container .ivu-input::-webkit-input-placeholder {
        color:#808080;
    }

    .form-container .ivu-select-single .ivu-select-selection {
        background: #575757;
        color: #fbfbfb;
        border-color: transparent;
        height: 35px;
    }

    .form-container .ivu-select-single .ivu-select-arrow {
        color: #fbfbfb;
    }

    .form-container .ivu-btn {
        width: 100%;
        height: 40px;
        background: rgb(11, 151, 117);
        border: none;
        color:#fff;
    }
</style>
