<template>
    <div class="sm-system dark-iview-input" @click="initStatus">
        <Loading v-if="isLoading"></Loading>
        <div class="sm-school-header dark-iview-select common-save-btn">
            <div class="tab-box">
                <span class="pane" @click="tab = 'common'" :class="{ active: tab === 'common' }">
                    {{$t('schoolBaseInfo.commonset')}}
                </span>
                <span class="pane" @click="tab = 'period'" :class="{ active: tab === 'period' }">
                    {{schoolSetting.type == 1 ? $t('schoolBaseInfo.pdMgt') : $t('schoolBaseInfo.cgMgt')}}
                </span>
            </div>
            <Button v-if="$access.ability('admin','schoolSetting-upd').validateAll" class="school-tools" :loading="isLoading" :disabled="!updated" icon="ios-albums-outline" @click="saveData()">{{$t('schoolBaseInfo.saveInfo')}}</Button>
        </div>
        <!-- 通用设置 -->
        <div class="sm-system-body base-info-wrap" v-show="tab == 'common'">
            <!-- 校徽区域 -->
            <div class="base-info-item">
                <span class="setting-label"></span>
                <div class="badge-wrap">
                    <img class="school-badge" :src="schoolSetting.picture || defBadge" width="100">
                    <div class="upd-mask" v-if="$access.ability('admin','schoolSetting-upd').validateAll">
                        <Upload action="/blob/public-upload" class="upd-badge" :before-upload="customUpload" :on-success="success" :show-upload-list="false">
                            <Icon type="md-create" :title="$t('schoolBaseInfo.updBadge')" />
                        </Upload>
                    </div>
                </div>
            </div>
            <!-- 基础信息区域 -->
            <div class="base-info-item">
                <span class="setting-label">{{$t('schoolBaseInfo.schoolNameLabel')}}</span>
                <div class="editable school-name dark-iview-input disabled-iview-select text-cursor-disabled" @click.stop>
                    <Input v-model="schoolSetting.name" :disabled="!editSchNmStatus" :placeholder="$t('schoolBaseInfo.pdHolder')" :style="{width: snWitdh+'px'}" />
                    <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-create" class="edit-btn" :title="$t('schoolBaseInfo.editLabel')" @click.stop="editSchNmStatus = !editSchNmStatus" />
                </div>
            </div>
            <div class="base-info-item editable time-zone-select dark-iview-select disabled-iview-select" @click.stop>
                <span class="setting-label">{{$t('schoolBaseInfo.tmzLabel')}}</span>
                <Select :disabled="!$access.ability('admin','schoolSetting-upd').validateAll" filterable v-model="schoolSetting.timeZone.label" label-in-value :style="{width: tzWidth+'px', verticalAlign:'baseline'}" :placeholder="$t('schoolBaseInfo.tmzHolder')">
                    <Option v-for="(item,index) in timeZoneList" :value="item.label" :key="index" @click.native="setTimeZone(item)">{{ item.label }}</Option>
                </Select>
            </div>
            <div class="base-info-item custom-radio">
                <span class="setting-label">{{$t('schoolBaseInfo.scType')}}</span>
                <RadioGroup v-model="schoolSetting.type" >
                    <!-- 普教 -->
                    <Radio :label="1" :disabled="!$access.ability('admin','schoolSetting-upd').validateAll">
                        <span>{{$t('schoolBaseInfo.scType1')}}</span>
                    </Radio>
                    <!-- 高教 -->
                    <Radio :label="2" :disabled="!$access.ability('admin','schoolSetting-upd').validateAll">
                        <span>{{$t('schoolBaseInfo.scType2')}}</span>
                    </Radio>
                </RadioGroup>
            </div>

        </div>
        <!-- 学段管理 -->
        <div class="sm-system-body dark-iview-split dark-iview-select disabled-iview-select text-cursor-disabled" v-show="tab == 'period'">
            <Split v-model="split1">
                <!--学段列表-->
                <div slot="left" class="period-wrap">
                    <div class="col-title">
                        <span>{{$t('schoolBaseInfo.periodSettingLabel')}}</span>
                        <div class="action-btx-box">
                            <!-- 学段根据学校购买数量进行分配，学校只能进行编辑操作，不能新增和删除 -->
                            <!-- <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-add" @click="addPeriod()" class="action-btn-icon" />
                            <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-trash" @click="showComfirmDelPeriod()" :title="$t('schoolBaseInfo.delete')" :class="editIconStatus ? 'action-btn-icon':'custom-label-disabeld action-btn-icon'" /> -->
                            <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-create" @click.stop="editPrdIndex = curPriodIndex" :title="$t('schoolBaseInfo.editLabel')" :class="editIconStatus ? 'action-btn-icon':'custom-label-disabeld action-btn-icon'" />
                        </div>
                    </div>
                    <Draggable ghost-class="ghost" class="period-list list-group" :list="schoolSetting.period" :animation='200'>
                        <div class="period-item list-group-item" v-for="(item,index) in schoolSetting.period" :key="index" @click.capture="choosePeriod(index)" :class="index == curPriodIndex ? 'block-bg-active block-bg':'block-bg'">
                            <p class="period-item-name semester-name-label dark-iview-input" @click.stop>
                                <Input v-model="item.name" :disabled="editPrdIndex !== index" :placeholder="$t('schoolBaseInfo.pdHolder')" style="width: 160px" />
                                <span class="campus-label" @click="setCampus">
                                    {{item.campusId === null ? $t('schoolBaseInfo.campusHolder'): $JSONPath.query(schoolSetting, "$..campuses[?(@.id=='" + item.campusId + "')]").length > 0 ? $JSONPath.query(schoolSetting, "$..campuses[?(@.id=='" + item.campusId + "')]")[0].name : $t('schoolBaseInfo.campusHolder') }}
                                </span>
                            </p>
                            <p class="period-item-num"><span></span>{{ $t('schoolBaseInfo.semesterNum') + item.semesters.length}}</p>
                            <p class="period-item-num"><span></span>{{ $t('schoolBaseInfo.gradeNum') + item.grades.length}}</p>
                            <p class="period-item-num"><span></span>{{ $t('schoolBaseInfo.periodNum') + item.subjects.length}}</p>
                        </div>
                    </Draggable>
                </div>
                <div slot="right" style="height:100%" class="split-right">
                    <Split v-model="split2">
                        <vuescroll class="setting-scroll" slot="left">
                            <!-- 学期设置 -->
                            <div class="setting-content semester-content">
                                <p class="block-title bf-color1">
                                    {{$t('schoolBaseInfo.semesterSetting')}}
                                    <span class="semester-start-warning" v-show="startWarning">
                                        <Icon type="md-warning" />请设置入学期
                                    </span>
                                    <span class="block-action-box">
                                        <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-add" @click.stop="addSemester()" class="action-btn-icon" />
                                    </span>
                                </p>
                                <div v-for="(item,index) in schoolSetting.period[curPriodIndex].semesters" :key="index" class="semster-item" @mousemove="chooseSemester(index)">
                                    <span class="semester-name-label" @click.stop>
                                        <Input v-model="item.name" :disabled="editSemIndex !== index" :placeholder="$t('schoolBaseInfo.smHolder')" style="width: 180px" />
                                    </span>
                                    <span class="term-item-start" @click.stop>
                                        <span>{{$t('schoolBaseInfo.startDate')}}</span>
                                        <Select v-model="item.month" style="width:70px" :placeholder="$t('schoolBaseInfo.monthHolder')" :disabled="editSemIndex !== index">
                                            <Option v-for="(item,index) in monthList" :value="(index + 1)" :key="index" @click.native="countSemDays">{{ item }}</Option>
                                        </Select>
                                        <span> / </span>
                                        <Select v-model="item.day" style="width:70px" :placeholder="$t('schoolBaseInfo.dayHolder')" :disabled="editSemIndex !== index">
                                            <Option v-for="(item,index) in dayList" :value="(index + 1)" :key="index" @click.native="countSemDays">{{ item }}</Option>
                                        </Select>
                                    </span>
                                    <span class="term-item-students-num">{{$t('schoolBaseInfo.semesterDuration')+ semDays[index] + $t('schoolBaseInfo.dayUnit')  }}</span>
                                    <span class="year-start-tag" v-show="item.start == '1'">{{$t('schoolBaseInfo.admission')}}</span>
                                    <div class="action-btx-box hover-show-icon">
                                        <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-trash" @click.stop="showComfirmDelSemester()" :title="$t('schoolBaseInfo.delete')" class="action-btn-icon" />
                                        <!-- <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-create" @click.stop="editSemIndex = curSemIndex" :title="$t('schoolBaseInfo.editLabel')" class="action-btn-icon" /> -->
                                        <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-create" @click.stop="setEditSem(index)" :title="$t('schoolBaseInfo.editLabel')" class="action-btn-icon" />
                                    </div>
                                </div>
                                <!-- 时间轴UI -->
                                <div class="term-item-time-line" v-if="schoolSetting.period[curPriodIndex].semesters.length">
                                    <vuescroll>
                                        <ul style="padding-left:10px">
                                            <li v-for="(item,index) in monthList" :key="index" :title="timeLineColor(index).text">
                                                <div class="line-box">
                                                    <span class="time-dot" :style="{borderColor: timeLineColor(index).color}">
                                                        <span class="time-inner-dot" :style="{backgroundColor: timeLineColor(index).color}"></span>
                                                    </span>
                                                    <span class="time-line-tail"></span>
                                                </div>
                                                <p class="time-label">{{item}}</p>
                                                <div class="arrow-box" v-show="timeLineColor(index).showArrow">
                                                    <Icon class="arrow-item first-arrow" :style="{color: timeLineColor(index).color}" type="ios-arrow-up" />
                                                    <Icon class="arrow-item second-arrow" :style="{color: timeLineColor(index).color}" type="ios-arrow-up" />
                                                </div>
                                            </li>
                                        </ul>
                                    </vuescroll>
                                </div>
                                <p class="cur-semester-name">{{$t('schoolBaseInfo.curSemSta')}}{{schoolSetting.period[curPriodIndex].semesters[curSemIndex].name}}</p>
                            </div>
                            <Row>
                                <Col :lg="24" :xl="24" :xxl="12">
                                <!-- 年级设置 -->
                                <div class="setting-content grade-content">
                                    <p class="block-title bf-color3">
                                        {{$t('schoolBaseInfo.gradeSetting')}}
                                        <span class="block-action-box">
                                            <Icon type="md-add" @click.stop="addGrade" class="action-btn-icon" v-if="$access.ability('admin','schoolSetting-upd').validateAll" />
                                            <!-- <Icon type="md-trash" @click.stop="delGraStatus = true" class="action-btn-icon" v-if="$access.ability('admin','schoolSetting-upd').validateAll" /> -->
                                            <!-- <Icon type="md-create" @click.stop="editGraStatus = true" class="action-btn-icon" v-if="$access.ability('admin','schoolSetting-upd').validateAll" /> -->
                                        </span>
                                    </p>
                                    <div style="height:210px;">
                                        <vuescroll>
                                            <Draggable  ghost-class="ghost" class="grade-list list-group" :list="schoolSetting.period[curPriodIndex].grades" :animation='200'>
                                                <div class="grade-item list-group-item" v-for="(item,index) in schoolSetting.period[curPriodIndex].grades" :key="index" @click.stop>
                                                    <span class="grade-order">{{index + 1}}</span>
                                                    <Input class="grade-name" v-model="schoolSetting.period[curPriodIndex].grades[index]"  :disabled="etGradeIndex !== index" :placeholder="$t('schoolBaseInfo.gradeWarning')" :style="{width: getWidth(index,item)+'px'}" />
                                                    <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-create" @click.stop="etGradeIndex = index" class="grade-action-icon" />
                                                    <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" type="md-trash" @click.stop="showDelGrade(index)" class="grade-action-icon" />
                                                </div>
                                            </Draggable>
                                        </vuescroll>
                                    </div>
                                </div>
                                </Col>
                                <Col :lg="24" :xl="24" :xxl="12">
                                <!-- 学科设置 -->
                                <div class="setting-content subject-content">
                                    <p class="block-title bf-color2">
                                        {{$t('schoolBaseInfo.subjectSetting')}}
                                        <span class="block-action-box">
                                            <Icon type="md-add" @click.stop="addSubject()" class="action-btn-icon" v-if="$access.ability('admin','schoolSetting-upd').validateAll" />
                                        </span>
                                    </p>
                                    <div style="height:210px;">
                                        <vuescroll>
                                            <div class="subject-item input-line-height tag-item item-active" @click.stop v-for="(item,index) in schoolSetting.period[curPriodIndex].subjects" :key="index">
                                                <span v-if="item.type == 1" class="subject-label-conmon general-label" :title="$t('schoolBaseInfo.subType1')">
                                                </span>
                                                <span v-else-if="item.type == 2" class="subject-label-conmon profession-label" :title="$t('schoolBaseInfo.subType2')">
                                                </span>
                                                <span v-else-if="item.type == 3" class="subject-label-conmon subject-label" :title="$t('schoolBaseInfo.subType3')">
                                                </span>
                                                <Input v-model="item.name" :disabled="!editSubStatus" :placeholder="$t('schoolBaseInfo.subjectHolder')" :style="{width: getWidth(index,item.name)+'px'}" />
                                                <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" class="subject-action-iocn" type="md-trash" style="margin-left:-12px" @click="delSubject(index)" />
                                                <Icon v-if="$access.ability('admin','schoolSetting-upd').validateAll" class="subject-action-iocn" type="md-create" @click="etSubject(index)" />
                                            </div>
                                        </vuescroll>
                                    </div>
                                </div>
                                </Col>
                            </Row>
                            <!-- 学情设置 -->
                            <div class="setting-content analysis-content subject-content disabled-iview-inputnumber dark-iview-inputnumber">
                                <p class="block-title bf-color4">
                                    {{$t('schoolBaseInfo.anaLabel')}}
                                    <span class="block-action-box">
                                        <Icon type="md-add" class="action-btn-icon" @click.stop="addExamType" v-if="$access.ability('admin','schoolSetting-upd').validateAll" />
                                        <Icon type="md-trash" class="action-btn-icon" @click.stop="delAnaStatus = !delAnaStatus" v-if="$access.ability('admin','schoolSetting-upd').validateAll" />
                                        <Icon type="md-create" class="action-btn-icon" @click.stop="editAnaStatus = !editAnaStatus" v-if="$access.ability('admin','schoolSetting-upd').validateAll" />
                                    </span>
                                </p>
                                <div class="attr-box-item" style="margin-top:15px;">
                                    <p>
                                        <span>{{$t('schoolBaseInfo.exTypeLabel')}}</span>
                                    </p>
                                    <div class="attr-content">
                                        <div class="tag-item input-line-height item-active" @click.stop v-for="(item,index) in schoolSetting.period[curPriodIndex].analysis.type" :key="index">
                                            <Input v-model="item.name" :disabled="!editAnaStatus" :placeholder="$t('schoolBaseInfo.examHolder')" :style="{width: getWidth(index,item.name)+'px'}" />
                                            <Icon type="md-close" @click="confirmDelAna(index)" v-show="delAnaStatus" />
                                        </div>
                                        <span v-if="!schoolSetting.period[curPriodIndex].analysis.type" style="line-height:32px;">{{$t('schoolBaseInfo.noExam')}}</span>
                                    </div>
                                </div>
                                <div class="attr-box-item">
                                    <p>
                                        <Tooltip :content="$t('schoolBaseInfo.eugenicsTips')" placement="right">
                                            <Icon type="ios-information-circle-outline" color="aqua" size="16" style="margin-right: 5px;cursor: pointer;" />
                                        </Tooltip>
                                        <span>{{$t('schoolBaseInfo.eugenicsLabel')}}</span>
                                    </p>
                                    <div class="attr-content" @click.stop>
                                        <InputNumber :max="100" :min="0" :disabled="!editAnaStatus" v-model="schoolSetting.period[curPriodIndex].analysis.eugenics" :formatter="value => `${value}%`" :parser="value => value.replace('%', '')"></InputNumber>
                                    </div>
                                </div>
                                <div class="attr-box-item">
                                    <p>
                                        <Tooltip :content="$t('schoolBaseInfo.incomeTips')" placement="right">
                                            <Icon type="ios-information-circle-outline" color="aqua" size="16" style="margin-right:5px;cursor:pointer;" />
                                        </Tooltip>
                                        <span>{{$t('schoolBaseInfo.incomeLable')}}</span>
                                    </p>
                                    <div class="attr-content" @click.stop>
                                        <InputNumber :max="100" :min="0" :disabled="!editAnaStatus" v-model="schoolSetting.period[curPriodIndex].analysis.income" :formatter="value => `${value}%`" :parser="value => value.replace('%', '')"></InputNumber>
                                    </div>
                                </div>
                                <div class="attr-box-item">
                                    <p>
                                        <Tooltip :content="$t('schoolBaseInfo.touchTips')" placement="right">
                                            <Icon type="ios-information-circle-outline" color="aqua" size="16" style="margin-right: 5px;cursor: pointer;" />
                                        </Tooltip>
                                        <span>{{$t('schoolBaseInfo.touchLabel')}}</span>
                                    </p>
                                    <div class="attr-content" @click.stop>
                                        <InputNumber :max="100" :min="0" :disabled="!editAnaStatus" v-model="schoolSetting.period[curPriodIndex].analysis.touch" :formatter="value => `${value}${$t('schoolBaseInfo.scoreUnit')}`" :parser="value => value.replace($t('schoolBaseInfo.scoreUnit'), '')"></InputNumber>
                                    </div>
                                </div>
                            </div>
                            <!-- 专业设置 -->
                            <div class="setting-content profession-content disabled-iview-inputnumber dark-iview-inputnumber">
                                <p class="block-title bf-color5">
                                    {{$t('schoolBaseInfo.proSetting')}}
                                    <span class="block-action-box">
                                        <Icon type="md-add" class="action-btn-icon" @click.stop="addMajor" v-if="$access.ability('admin','schoolSetting-upd').validateAll" />
                                    </span>
                                </p>
                                <div style="height:150px">
                                    <vuescroll>
                                        <div class="subject-item input-line-height tag-item item-active" @click.stop v-for="(item,index) in schoolSetting.period[curPriodIndex].majors" :key="index">
                                            <Input v-model="item.name" :disabled="etMajorIndex !== index" :placeholder="$t('schoolBaseInfo.subjectHolder')" :style="{width: getWidth(index,item.name)+'px'}" />
                                            <Icon class="subject-action-iocn" type="md-trash" style="margin-left:0px" @click="delMajor(index)" />
                                            <Icon class="subject-action-iocn" type="md-create" @click="etMajorIndex = index" />
                                        </div>
                                    </vuescroll>
                                </div>
                            </div>
                        </vuescroll>
                        <!--时段设置-->
                        <div slot="right" class="time-setting-wrap">
                            <div class="col-title">
                                <span>{{$t('cusMgt.timeSetTitle')}}</span>
                            </div>
                            <div class="time-setting-body">
                                <TimeSetting :periodId="schoolSetting.period[curPriodIndex].id"></TimeSetting>
                            </div>
                        </div>
                    </Split>

                </div>
            </Split>
        </div>
        <!-- 添加校区 -->
        <Modal v-model="campusStatus" class="campus-modal dark-iview-modal" @on-cancel="selectedCampusIndex = -1" @on-ok="confirmCampus" @click.native="initStatus">
            <p slot="header" style="color:#DDDDDD;letter-spacing:2px;font-weight:400;">{{$t('schoolBaseInfo.setCampus')}}</p>
            <p v-for="(item,index) in schoolSetting.campuses" class="campus-name-item dark-iview-input disabled-iview-select text-cursor-disabled" :key="index" @click.stop="selectedCampusIndex = index">
                <Icon type="md-checkmark" size="20" style="margin-right:10px;position:absolute;left:15px;" v-if="index == selectedCampusIndex" />
                <Input v-model="item.name" :disabled="editCamIndex !== index" :placeholder="$t('schoolBaseInfo.campusHolder')" :style="{width: getWidth(0, item.name)+'px'}" />
                <Icon type="md-create" class="campus-btn-edit" :title="$t('schoolBaseInfo.editLabel')" size="20" @click.stop="editCamIndex = index" />
                <Icon type="md-trash" class="campus-btn-edit" :title="$t('schoolBaseInfo.delete')" size="20" style="margin-right:40px;" @click.stop="delCampus(index)" />
            </p>
            <Icon type="md-add-circle" size="40" style="margin:auto;cursor:pointer;margin-top:30px;" @click="addCampus" />
        </Modal>
        <!-- 添加学科 -->
        <Modal v-model="addSubStatus" class="dark-iview-modal dark-iview-form dark-iview-input" :title="$t('schoolBaseInfo.addSubject')" @on-cancel="cancelSubject" @on-ok="confirmSubject">
            <Form ref="subjectInfo" :model="subjectInfo" class="add-subject-form" label-colon>
                <!-- 学科类型 -->
                <FormItem prop="type" :label="$t('schoolBaseInfo.subType')">
                    <RadioGroup v-model="subjectInfo.type">
                        <Radio label="1">
                            <span>{{$t('schoolBaseInfo.subType1')}}</span>
                        </Radio>
                        <Radio label="2">
                            <span>{{$t('schoolBaseInfo.subType2')}}</span>
                        </Radio>
                        <Radio label="3">
                            <span>{{$t('schoolBaseInfo.subType3')}}</span>
                        </Radio>
                    </RadioGroup>
                </FormItem>
                <!-- 操作类型 -->
                <FormItem prop="type" :label="$t('schoolBaseInfo.acType')" v-if="subjectInfo.type == '1' && !subjectInfo.id">
                    <RadioGroup v-model="subjectInfo.isNew">
                        <Radio label="0">
                            <span>{{$t('schoolBaseInfo.acType1')}}</span>
                        </Radio>
                        <Radio label="1">
                            <span>{{$t('schoolBaseInfo.acType2')}}</span>
                        </Radio>
                    </RadioGroup>
                </FormItem>
                <!-- 选择通用学科 -->
                <FormItem prop="type" :label="$t('schoolBaseInfo.sltSubect')" v-if="subjectInfo.type == '1' && subjectInfo.isNew == '0' && !subjectInfo.id">
                    <Select v-model="subjectInfo.name" style="width:200px">
                        <Option v-for="item in generalSubList" :value="item.name" :key="item.id">{{ item.name }}</Option>
                    </Select>
                </FormItem>
                <!-- 学科名称 -->
                <FormItem prop="name" :label="$t('schoolBaseInfo.subName')" v-if="(subjectInfo.type == '1' && subjectInfo.isNew == '1') || subjectInfo.type !== '1' || subjectInfo.id">
                    <Input v-model="subjectInfo.name" style="width:200px" :placeholder="$t('schoolBaseInfo.nameWarning')"></Input>
                </FormItem>
            </Form>
        </Modal>
        <!-- 添加学期 -->
        <Modal v-model="addSemStatus" class="dark-iview-modal dark-iview-form dark-iview-input" :title="$t('schoolBaseInfo.addSemester')" @on-cancel="cancelSemester" @on-ok="confirmSemester">
            <Form ref="semesterInfo" :model="semtInfo" class="add-subject-form" label-colon :label-width="80" label-position="left">
                <!-- 名称 -->
                <FormItem prop="name" :label="$t('schoolBaseInfo.semesterName')">
                    <Input v-model="semtInfo.name" style="width:200px" :placeholder="$t('schoolBaseInfo.nameWarning')"></Input>
                </FormItem>
                <!-- 开始时间 -->
                <FormItem prop="name" :label="$t('schoolBaseInfo.semStartAt')">
                    <Select v-model="semtInfo.month" style="width:90px" :placeholder="$t('schoolBaseInfo.monthHolder')">
                        <Option v-for="(item,index) in monthList" :value="(index + 1)" :key="index" @click.native="countSemDays">{{ item }}</Option>
                    </Select>
                    <span style="display:inline-block;width:20px;text-align:center"> / </span>
                    <Select v-model="semtInfo.day" style="width:90px" :placeholder="$t('schoolBaseInfo.dayHolder')">
                        <Option v-for="(item,index) in dayList" :value="(index + 1)" :key="index" @click.native="countSemDays">{{ item }}</Option>
                    </Select>
                </FormItem>
                <!-- 是否为入学期 -->
                <FormItem prop="name" :label="$t('schoolBaseInfo.admission')">
                    <RadioGroup v-model="semtInfo.start">
                        <Radio :label="1">
                            <span>{{$t('schoolBaseInfo.yes')}}</span>
                        </Radio>
                        <Radio :label="0" style="margin-left:30px">
                            <span>{{$t('schoolBaseInfo.no')}}</span>
                        </Radio>
                    </RadioGroup>
                </FormItem>

            </Form>
        </Modal>

    </div>
</template>

<script>
// import BlobTool from '@/utils/blobTool.js'
import Draggable from 'vuedraggable'
import TimeSetting from '@/view/newcourse/TimeSetting.vue'
import '@/utils/Math.uuid'
export default {
    components: {
        Draggable, TimeSetting
    },
    data() {
        return {
            semtInfo: {
                id: '',
                name: '',
                month: '',
                day: '',
                start: ''
            },
            defBadge: undefined,
            subjectInfo: {
                type: '',
                name: '',
                id: '',
                isNew: '0'
            },
            addSubStatus: false,
            addSemStatus: false,
            tab: 'common',
            addTypeStatus: false,
            typeItem: {
                base: '',
                name: '',
                id: ''
            },
            delSubStatus: false,
            delAnaStatus: false,
            delGraStatus: false,

            editCamIndex: -1,
            editSchNmStatus: false,
            editPrdIndex: -1,
            editTZStatsu: true,
            editGraStatus: false,
            editSubStatus: false,
            editAnaStatus: false,
            editSemIndex: -1,
            etGradeIndex: -1,
            etSubIndex: -1,
            etMajorIndex: -1,
            split1: 0.2,
            split2: 0.7,
            split3: 0.38,
            monthList: [],
            timeZoneList: [],
            isLoading: false,
            dataDefault: {},
            updated: false,
            curPriodIndex: 0,
            curSemIndex: 0,
            isInit: true,
            schoolSetting: {
                schoolCode: '',
                name: '',
                period: [],
                campuses: [],
                timeZone: {
                    "label": "",
                    "value": ""
                }
            },

            colorList: [],
            TERM_MAX_LENGTH: 6, // 学期数上限
            campusStatus: false,
            semDays: [],
            selectedCampusIndex: -1,
            schoolSas: ''
        }
    },
    methods: {
        setEditSem(index) {
            this.semtInfo.name = this.schoolSetting.period[this.curPriodIndex].semesters[index].name
            this.semtInfo.month = this.schoolSetting.period[this.curPriodIndex].semesters[index].month
            this.semtInfo.day = this.schoolSetting.period[this.curPriodIndex].semesters[index].day
            this.semtInfo.start = this.schoolSetting.period[this.curPriodIndex].semesters[index].start
            this.semtInfo.id = this.schoolSetting.period[this.curPriodIndex].semesters[index].id
            this.addSemStatus = true
            console.log('456',this.semtInfo.name)
        },
        confirmSemester() {
            console.log('123',this.semtInfo.id)
            if (this.semtInfo.id) { //编辑
                let s = this.schoolSetting.period[this.curPriodIndex].semesters.find(item => {
                    return item.id == this.semtInfo.id
                })
                s.name = this.semtInfo.name
                s.month = this.semtInfo.month
                s.day = this.semtInfo.day
                s.start = this.semtInfo.start
            } else { //新增
                this.semtInfo.id = this.guid()
                this.schoolSetting.period[this.curPriodIndex].semesters.push(this._.cloneDeep(this.semtInfo))
            }

            //根据时间进行排序
            if (this.schoolSetting.period[this.curPriodIndex].semesters.length > 1) {
                this.schoolSetting.period[this.curPriodIndex].semesters.sort((a, b) => {
                    if (a.month == b.month) {
                        return a.day - b.day
                    } else {
                        return a.month - b.month
                    }
                })
            }
            this.countSemDays()
        },
        cancelSemester() {
            this.semtInfo = {
                id: '',
                name: '',
                month: '',
                day: '',
                start: ''
            }
        },
        customUpload(file) {
            let format = ['png', 'jpg', 'jpeg'] //头像文件格式
            let extension = file.name.substring(file.name.lastIndexOf('.') + 1, file.name.length)
            extension = extension.toLowerCase()
            if (format.length > 0 && format.indexOf(extension) == -1) {
                this.$Message.error({
                    content: this.$t('updModal.typeErr'),
                    duration: 3
                })
                return false
            }
            return true
            // 公共容器只开放了公共读权限，没有公共写的权限，所以需要将文件通过后端上传
        },
        success(response, file, fileList) {
            this.schoolSetting.picture = response.url
        },
        /**
         * 初始化状态
         */
        initStatus() {
            let isRep = false
            let pdName = this.schoolSetting.period.map(item => {
                return item.name
            })
            // 检查学段名称
            pdName.forEach((item, index) => {
                if (pdName.indexOf(item) != index) {
                    isRep = true
                    this.$Message.warning(this.$t('schoolBaseInfo.pdWarning'))
                }
            })
            if (isRep) return
            let curPd = this.schoolSetting.period[this.curPriodIndex]

            // 检查学期名称
            let semName = curPd.semesters.map(item => {
                return item.name
            })
            semName.forEach((item, index) => {
                if (semName.indexOf(item) != index) {
                    isRep = true
                    this.$Message.warning(this.$t('schoolBaseInfo.semWarning'))
                }
            })
            if (isRep) return

            // 检查年级名称
            curPd.grades.forEach((item,index) => {
                if(curPd.grades.indexOf(item) !== index){
                    this.$Message.warning(this.$t('schoolBaseInfo.gdNameWarning'))
                    isRep = true
                }
            })
            // let gradeName = curPd.grades.map(item => {
            //     return item.name
            // })
            // gradeName.forEach((item, index) => {
            //     if (gradeName.indexOf(item) != index) {
            //         isRep = true
            //         this.$Message.warning(this.$t('schoolBaseInfo.gdNameWarning'))
            //     }
            // })
            if (isRep) return

            // 检查学科名称 学科逻辑调整后与年级学期不同
            // let subName = curPd.subjects.map(item => {
            //     return item.name
            // })
            // subName.forEach((item, index) => {
            //     if (subName.indexOf(item) != index) {
            //         isRep = true
            //         this.$Message.warning(this.$t('schoolBaseInfo.subWarning'))
            //     }
            // })
            // if (isRep) return

            // 检查考试名称
            let exName = curPd.analysis.type.map(item => {
                return item.name
            })
            exName.forEach((item, index) => {
                if (exName.indexOf(item) != index) {
                    isRep = true
                    this.$Message.warning(this.$t('schoolBaseInfo.exWarning'))
                }
            })
            if (isRep) return

            // 检查专业名称
            let mName = curPd.majors.map(item => {
                return item.name
            })
            mName.forEach((item, index) => {
                if (mName.indexOf(item) != index) {
                    isRep = true
                    this.$Message.warning(this.$t('schoolBaseInfo.majorWarning'))
                }
            })
            if (isRep) return

            this.delGraStatus = false
            this.delSubStatus = false
            this.delAnaStatus = false
            this.editSubStatus = false
            // this.editGraStatus = false
            this.etGradeIndex = -1
            this.etMajorIndex = -1
            this.editAnaStatus = false
            this.editPrdIndex = -1
            this.editSemIndex = -1
            this.editCamIndex = -1
            this.editTZStatsu = true
            this.editSchNmStatus = false
        },
        //初始化数据
        initData() {
            this.schoolSetting.schoolCode = this.$store.state.userInfo.schoolCode
            this.schoolSetting.id = this.$store.state.userInfo.schoolCode
            this.schoolSetting.code = this.$store.state.userInfo.schoolCode
            this.schoolSetting.name = this.$store.state.userInfo.school

            this.schoolSetting.period.push({
                name: this.$t('schoolBaseInfo.presetPeriod') + '1',
                id: this.guid(),
                gradeCount: 0,
                semesterCount: 0,
                subjectCount: 0,
                semesters: [],
                grades: [],
                subjects: [],
                campusId: ""
            })
            this.schoolSetting.period[0].semesters.push({
                name: this.$t('schoolBaseInfo.persetSemester'),
                id: this.guid(),
                month: 1,
                day: 1
            })
            this.schoolSetting.period[0].grades.push(this.$t('schoolBaseInfo.presetGrade1'))
            this.schoolSetting.period[0].grades.push(this.$t('schoolBaseInfo.presetGrade2'))
            this.schoolSetting.period[0].grades.push(this.$t('schoolBaseInfo.presetGrade3'))
            this.schoolSetting.period[0].subjects.push({
                name: this.$t('schoolBaseInfo.presetSubject1'),
                id: this.guid()
            })
            this.schoolSetting.period[0].subjects.push({
                name: this.$t('schoolBaseInfo.presetSubject2'),
                id: this.guid()
            })
            this.schoolSetting.period[0].subjects.push({
                name: this.$t('schoolBaseInfo.presetSubject3'),
                id: this.guid()
            })
            this.schoolSetting.period[0].analysis = {
                income: 10,
                touch: 10,
                type: this.$GLOBAL.EXAM_TYPE()
            }
            this.updated = false
            this.countSemDays()
        },
        //计算时间轴选中颜色
        timeLineColor(index) {
            let len = this.schoolSetting.period[this.curPriodIndex].semesters.length
            let curIndex = -1 //当前选中学期
            if (this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex].month <= (index + 1)) {
                if (this.curSemIndex < len - 1) {
                    if (this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex + 1].month > (index + 1)) {
                        curIndex = this.curSemIndex
                    }
                }
            }
            let curMonth = this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex].month
            let nextMonth = -1 //下个学期的月份
            if (this.curSemIndex == len - 1) {
                nextMonth = this.schoolSetting.period[this.curPriodIndex].semesters[0].month
            } else {
                nextMonth = this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex + 1].month
            }
            if (curMonth == nextMonth) {
                return {
                    color: (index + 1) == curMonth ? this.colorList[this.curSemIndex] : '#606060',
                    text: this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex].name,
                    showArrow: (index + 1) == curMonth
                }
            }
            if (curIndex != -1) {
                return {
                    color: this.colorList[curIndex],
                    text: this.schoolSetting.period[this.curPriodIndex].semesters[curIndex].name,
                    showArrow: (index + 1) == curMonth || (index + 2) == nextMonth
                }
            } else if (this.curSemIndex == len - 1) {
                if (this.schoolSetting.period[this.curPriodIndex].semesters[0].month > (index + 1) || this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex].month <= (index + 1)) {
                    curIndex = this.curSemIndex
                    return {
                        color: this.colorList[curIndex],
                        text: this.schoolSetting.period[this.curPriodIndex].semesters[curIndex].name,
                        showArrow: (index + 1) == curMonth || (index + 2) == nextMonth
                    }
                } else {
                    return {
                        color: '#606060',
                        text: '',
                        showArrow: (index + 1) == curMonth || (index + 2) == nextMonth
                    }
                }
            } else {
                return {
                    color: '#606060',
                    text: '',
                    showArrow: (index + 1) == curMonth || (index + 2) == nextMonth
                }
            }

        },
        //获取月份列表
        getMonthList() {
            let lang = window.localStorage.getItem('local')
            if (lang.indexOf('CN') != -1 || lang.indexOf('cn') != -1) {
                this.monthList = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
            } else if (lang.indexOf('TW') != -1 || lang.indexOf('tw') != -1) {
                this.monthList = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
            } else {
                this.monthList = ['JAN.', 'FEB.', 'MAR.', 'APR.', 'MAY.', 'JUN.', 'JUL.', 'AUG.', 'SEP.', 'OCT.', 'NOV.', 'DEC.']
            }
        },
        //设置学校时区
        setTimeZone(item) {
            this.schoolSetting.timeZone.value = item.value
            this.editTZStatsu = true
        },

        //删除考试类型
        confirmDelAna(index) {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delExamTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.period[this.curPriodIndex].analysis.type[index].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    this.schoolSetting.period[this.curPriodIndex].analysis.type.splice(index, 1)
                }
            })
        },
        //显示删除年级
        showDelGrade(index) {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delGradeTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.period[this.curPriodIndex].grades[index].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    this.schoolSetting.period[this.curPriodIndex].grades.splice(index, 1)
                }
            })
        },
        //删除学科
        delSubject(index) {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delSubjectTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.period[this.curPriodIndex].subjects[index].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    this.schoolSetting.period[this.curPriodIndex].subjects.splice(index, 1)
                }
            })
        },
        //编辑学科
        etSubject(index) {
            this.etSubIndex = index
            this.subjectInfo.name = this.schoolSetting.period[this.curPriodIndex].subjects[index].name
            this.subjectInfo.type = this.schoolSetting.period[this.curPriodIndex].subjects[index].type
            this.subjectInfo.id = this.schoolSetting.period[this.curPriodIndex].subjects[index].id
            console.log(this.subjectInfo)
            this.addSubStatus = true
        },
        //确认添加或编辑学科
        confirmSubject() {
            if (this.subjectInfo.id) { //编辑学科
                this.schoolSetting.period[this.curPriodIndex].subjects[this.etSubIndex].name = this.subjectInfo.name
                this.schoolSetting.period[this.curPriodIndex].subjects[this.etSubIndex].type = this.subjectInfo.type
            } else { //新增学科
                //检查学科名称是否重复
                let isRep = false
                let curPd = this.schoolSetting.period[this.curPriodIndex]
                curPd.subjects.forEach(item => {
                    if (item.name == this.subjectInfo.name) {
                        isRep = true
                        this.$Message.warning(this.$t('schoolBaseInfo.subWarning'))
                    }
                })
                if (isRep) {
                    this.cancelSubject()
                    return
                }
                let id = this.guid()
                if (this.subjectInfo.type == 1) {
                    let isApply = this.generalSubList.find(item => item.name == this.subjectInfo.name)
                    id = isApply ? isApply.id : id
                }
                this.schoolSetting.period[this.curPriodIndex].subjects.push({
                    name: this.subjectInfo.name,
                    type: this.subjectInfo.type,
                    id
                })
            }
            this.cancelSubject()
        },
        cancelSubject() {
            this.subjectInfo = {
                type: '',
                name: '',
                id: '',
                isNew: '0'
            }
        },
        /**确认删除学段提示框 */
        showComfirmDelPeriod() {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delPdTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.period[this.curPriodIndex].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    let index = this.curPriodIndex
                    this.curSemIndex = 0
                    this.curPriodIndex = 0
                    if (this.schoolSetting.period.length > 1) {
                        this.schoolSetting.period.splice(index, 1)
                    } else {
                        this.$Message.warning(this.$t('schoolBaseInfo.ssTips2'))
                    }
                }
            })
        },
        //删除校区
        delCampus(index) {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delCampusTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.campuses[index].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    this.schoolSetting.campuses.splice(index, 1)
                }
            })
        },
        /**确认删除学期提示框 */
        showComfirmDelSemester() {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delSmTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    let semIndex = this.curSemIndex
                    let prdIndex = this.curPriodIndex
                    if (this.schoolSetting.period[this.curPriodIndex].semesters.length > 1) {
                        //this.curPriodIndex = 0
                        this.curSemIndex = 0
                        this.schoolSetting.period[prdIndex].semesters.splice(semIndex, 1)
                        this.countSemDays()
                    } else {
                        this.$Message.warning(this.$t('schoolBaseInfo.ssTips2'))
                    }
                }
            })
        },
        /**
         * 动态设置input宽度
         * */
        getWidth(index, text) {
            let width = 100
            if (text) {
                width = 18.25
                for (var i = 0; i < text.length; i++) {
                    var c = text.charCodeAt(i);
                    //单字节宽度
                    if ((c >= 0x0001 && c <= 0x007e) || (0xff60 <= c && c <= 0xff9f)) {
                        width += 9
                    }
                    else {
                        //汉字宽度
                        width += 15.97
                    }
                }
            }
            return width
        },

        /**
         * 计算学期天数
         * @param date1
         * @param date2
        */
        countSemDays() {
            this.semDays = []
            if (this.schoolSetting.period[this.curPriodIndex].semesters.length > 0) {
                let count = 365
                let index = 0
                let year = new Date().getFullYear()
                for (let i = 0; i < this.schoolSetting.period[this.curPriodIndex].semesters.length; i++) {
                    if (i == (this.schoolSetting.period[this.curPriodIndex].semesters.length - 1)) {
                        index = i
                        break
                    } else {
                        let sDate = year + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i].month + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i].day
                        let eDate = year + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i + 1].month + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i + 1].day
                        let d = this.getDays(sDate, eDate)
                        count -= d
                        //this.$set(this.schoolSetting.period[this.curPriodIndex].semesters[i], 'days', d ? d : 365)
                        this.semDays.push(d ? d : 365)
                    }
                }
                //this.$set(this.schoolSetting.period[this.curPriodIndex].semesters[index], 'days', count ? count : 365)
                this.semDays.push(count ? count : 365)
            }
        },
        /**
         * 计算两个日期的天数
         * @param date1
         * @param date2
         */
        getDays(date1, date2) {
            var date1Str = date1.split("-");//将日期字符串分隔为数组,数组元素分别为年.月.日
            //根据年 . 月 . 日的值创建Date对象
            var date1Obj = new Date(date1Str[0], (date1Str[1] - 1), date1Str[2]);
            var date2Str = date2.split("-");
            var date2Obj = new Date(date2Str[0], (date2Str[1] - 1), date2Str[2]);
            var t1 = date1Obj.getTime();
            var t2 = date2Obj.getTime();
            var dateTime = 1000 * 60 * 60 * 24; //每一天的毫秒数
            var minusDays = Math.floor(((t2 - t1) / dateTime));//计算出两个日期的天数差
            var days = Math.abs(minusDays);//取绝对值
            return days;
        },
        confirmCampus() {
            if (this.selectedCampusIndex !== -1) {
                this.$set(this.schoolSetting.period[this.curPriodIndex], 'campusId', this.schoolSetting.campuses[this.selectedCampusIndex].id)
                //this.schoolSetting.period[this.curPriodIndex].campusId = this.schoolSetting.campuses[this.selectedCampusIndex].id
                this.selectedCampusIndex = -1
            }
        },
        //添加校区
        addCampus() {
            //不限制校区数量的设置
            // if (this.schoolSetting.campuses.length >= 2) {
            //     this.$Message.error({
            //         background: true,
            //         content: this.$t('schoolBaseInfo.campusWarning')
            //     })
            // } else {
            this.schoolSetting.campuses.push({
                name: this.$t('schoolBaseInfo.setCampus'),
                id: Math.uuid()
            })
            this.$nextTick(() => {
                setTimeout(() => {
                    this.editCamIndex = this.schoolSetting.campuses.length - 1
                }, 200)
            })
            // }
        },
        setCampus() {
            this.editPrdIndex = -1
            if (this.$access.ability('admin', 'schoolSetting-upd').validateAll) {
                this.campusStatus = true
            } else {
                this.$Message.warning(this.$t('schoolBaseInfo.authWarning'))
            }
        },

        //选择学期
        chooseSemester(index) {
            if (index != this.curSemIndex) {
                this.editSemIndex = -1
                this.curSemIndex = index
            }
        },
        //选择学段
        choosePeriod(index) {
            this.curSemIndex = 0
            this.curPriodIndex = index
            for (let item in this.schoolSetting.campuses) {
                if (this.schoolSetting.campuses[item].campusId == this.schoolSetting.period[this.curPriodIndex].campusId) {
                    this.selectedCampusIndex = item
                    break
                }
            }
            //计算天数
            if (this.schoolSetting.period[this.curPriodIndex].semesters.length > 0) {
                this.semDays = []
                if (!this.schoolSetting.period[this.curPriodIndex].semesters[0].days) {
                    let count = 365
                    let index = 0
                    let year = new Date().getFullYear()
                    for (let i = 0; i < this.schoolSetting.period[this.curPriodIndex].semesters.length; i++) {
                        if (i == (this.schoolSetting.period[this.curPriodIndex].semesters.length - 1)) {
                            index = i
                            break
                        } else {
                            let sDate = year + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i].month + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i].day
                            let eDate = year + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i + 1].month + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i + 1].day
                            let d = this.getDays(sDate, eDate)
                            count -= d
                            //this.$set(this.schoolSetting.period[this.curPriodIndex].semesters[i], 'days', d)
                            this.semDays.push(d)
                        }
                    }
                    //this.$set(this.schoolSetting.period[this.curPriodIndex].semesters[index], 'days', count)
                    this.semDays.push(count)
                }
            }

        },
        //保存数据
        saveData() {
            this.handleData()
            this.isLoading = true
            this.$api.schoolSetting.schoolSettingSaveOrUpdate(this.schoolSetting).then(
                (res) => {
                    if (!res.error) {
                        this.$Message.success(this.$t('schoolBaseInfo.ssTips3'))
                        this.updated = false

                        let schoolStr = localStorage.getItem('school_profile')
                        if (schoolStr) {
                            schoolStr = decodeURIComponent(schoolStr, "utf-8")
                            let schoolJson = JSON.parse(schoolStr)
                            schoolJson.school_base = this.schoolSetting
                            this.$store.dispatch('user/setSchoolProfile', schoolJson)
                        } else {
                            this.$store.dispatch('user/getSchoolProfile')
                        }

                    }
                },
                (err) => {
                    console.log(err)
                    this.$Message.error(this.$t('schoolBaseInfo.saveErr'))
                }
            ).finally(() => {
                setTimeout(() => {
                    this.isLoading = false
                }, 400)
            })
        },
        getSchoolBaseData() {
            this.isLoading = true
            this.$store.dispatch('user/getSchoolProfile').then(
                (res) => {
                    if (res) {
                        this.isInit = true
                        this.schoolSetting = JSON.parse(JSON.stringify(res.school_base))
                        //计算学期天数
                        if (this.schoolSetting.period[this.curPriodIndex].semesters.length > 0) {
                            this.semDays = []
                            if (!this.schoolSetting.period[this.curPriodIndex].semesters[0].days) {
                                let count = 365
                                let index = 0
                                let year = new Date().getFullYear()
                                for (let i = 0; i < this.schoolSetting.period[this.curPriodIndex].semesters.length; i++) {
                                    if (i == (this.schoolSetting.period[this.curPriodIndex].semesters.length - 1)) {
                                        index = i
                                        break
                                    } else {
                                        let sDate = year + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i].month + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i].day
                                        let eDate = year + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i + 1].month + '-' + this.schoolSetting.period[this.curPriodIndex].semesters[i + 1].day
                                        let d = this.getDays(sDate, eDate)
                                        count -= d
                                        this.semDays.push(d)
                                    }
                                }
                                this.semDays.push(count)
                            }
                        }
                    } else {
                        this.getLocalDefaultData()
                        this.isInit = true
                        this.schoolSetting.period[0].grades = JSON.parse(JSON.stringify(this.dataDefault.grades))
                        this.schoolSetting.period[0].subjects = JSON.parse(JSON.stringify(this.dataDefault.subjects))
                    }
                },
                (err) => {
                    this.getLocalDefaultData()
                    this.isInit = true
                    this.schoolSetting.period[0].grades = JSON.parse(JSON.stringify(this.dataDefault.grades))
                    this.schoolSetting.period[0].subjects = JSON.parse(JSON.stringify(this.dataDefault.subjects))
                }
            ).finally(() => {
                setTimeout(() => {
                    this.isLoading = false
                }, 500)
            })
        },
        handleData() {
            for (let i = 0; i < this.schoolSetting.period.length; i++) {
                this.schoolSetting.period[i].gradeCount = this.schoolSetting.period[i].grades.length
                this.schoolSetting.period[i].semesterCount = this.schoolSetting.period[i].semesters.length
                this.schoolSetting.period[i].subjectCount = this.schoolSetting.period[i].subjects.length
            }
        },
        guid() {
            function S4() {
                return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
            }
            return (S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4())
        },
        addSubject() {
            // this.schoolSetting.period[this.curPriodIndex].subjects.push({
            //     name: this.$t('schoolBaseInfo.presetSubject') + (this.schoolSetting.period[this.curPriodIndex].subjects.length + 1),
            //     id: this.guid()
            // })
            // this.editSubStatus = true
            this.addSubStatus = true
        },
        //添加专业
        addMajor() {
            // 初始化字段
            if (!this.schoolSetting.period[this.curPriodIndex].majors) {
                this.schoolSetting.period[this.curPriodIndex].majors = []
            }
            this.schoolSetting.period[this.curPriodIndex].majors.push({
                name: "",
                id: this.guid()
            })
            this.etMajorIndex = this.schoolSetting.period[this.curPriodIndex].majors.length - 1
        },
        //删除专业
        delMajor(index) {
            this.$Modal.confirm({
                title: this.$t('schoolBaseInfo.delMajorTitle'),
                content: this.$t('schoolBaseInfo.delete') + this.schoolSetting.period[this.curPriodIndex].majors[index].name + this.$t('schoolBaseInfo.delContent'),
                onOk: () => {
                    this.schoolSetting.period[this.curPriodIndex].majors.splice(index, 1)
                }
            })
        },
        addGrade() {
            this.schoolSetting.period[this.curPriodIndex].grades.push((this.schoolSetting.period[this.curPriodIndex].grades.length + 1) + this.$t('schoolBaseInfo.persetGrade'))
            // this.editGraStatus = true
            this.etGradeIndex = this.schoolSetting.period[this.curPriodIndex].grades.length - 1
        },
        addPeriod() {
            //暂未对接授权系统，默认最多设置三个学制/学院
            if (this.schoolSetting.period.length >= 3) {
                this.$Message.error({
                    background: true,
                    content: this.$t('schoolBaseInfo.campusWarning'),
                    duration: 2
                })
            } else {
                this.schoolSetting.period.push({
                    name: this.$t('schoolBaseInfo.presetPeriod') + (this.schoolSetting.period.length + 1),
                    id: this.guid(),
                    campusId: '',
                    gradeCount: 0,
                    semesterCount: 0,
                    subjectCount: 0,
                    semesters: JSON.parse(JSON.stringify(this.dataDefault.semesters)),
                    grades: JSON.parse(JSON.stringify(this.dataDefault.grades)),
                    subjects: JSON.parse(JSON.stringify(this.dataDefault.subjects)),
                    analysis: {
                        income: 10,
                        touch: 10,
                        eugenics: 10,
                        type: this.$GLOBAL.EXAM_TYPE()
                    }
                })
                this.choosePeriod(this.schoolSetting.period.length - 1)
                this.$nextTick(() => {
                    setTimeout(() => {
                        this.editPrdIndex = this.curPriodIndex
                    }, 200)
                })
            }
        },
        addExamType() {
            if (!this.schoolSetting.period[this.curPriodIndex].analysis.type) {
                this.schoolSetting.period[this.curPriodIndex].analysis.type = []
            }
            this.schoolSetting.period[this.curPriodIndex].analysis.type.push({
                id: this.guid(),
                name: this.$t('schoolBaseInfo.examHolder')
            })
            this.editAnaStatus = true
        },
        // 添加学期
        addSemester() {
            this.addSemStatus = true
            // let semLen = this.schoolSetting.period[this.curPriodIndex].semesters.length
            // if (semLen < this.TERM_MAX_LENGTH) {
            //     let defMonth = semLen == 0 ? 1 : this.schoolSetting.period[this.curPriodIndex].semesters[semLen - 1].month + 1
            //     this.schoolSetting.period[this.curPriodIndex].semesters.push({
            //         name: this.$t('schoolBaseInfo.persetSemester') + (this.schoolSetting.period[this.curPriodIndex].semesters.length + 1),
            //         month: defMonth,
            //         day: 26,
            //         id: this.guid()
            //     })
            //     this.countSemDays()
            //     this.$nextTick(() => {
            //         setTimeout(() => {
            //             this.curSemIndex = this.schoolSetting.period[this.curPriodIndex].semesters.length - 1
            //             this.editSemIndex = this.curSemIndex
            //         }, 200)
            //     })
            // } else {
            //     this.$Message.info(this.$t('schoolBaseInfo.ssTips7'))
            // }
        },
        getLocalDefaultData() {
            let data = require('@/static/baseDataDefault.json')
            let lang = window.localStorage.getItem('local')
            let result = data.filter(item => {
                return item.lang == lang
            })
            this.dataDefault = result.length > 0 ? result[0] : data[0]
        },
        //根据语言读取时区列表
        getTimeZoneList() {
            let lang = window.localStorage.getItem('local')
            if (lang.indexOf('CN') != -1 || lang.indexOf('cn') != -1) {
                this.timeZoneList = require('@/static/time-zone/timeCN.json')
            } else if (lang.indexOf('TW') != -1 || lang.indexOf('tw') != -1) {
                this.timeZoneList = require('@/static/time-zone/timeTW.json')
            } else {
                this.timeZoneList = require('@/static/time-zone/timeEN.json')
            }
        }
    },
    watch: {
        schoolSetting: {
            handler(newValue, oldValue) {
                if (this.isInit) {
                    this.isInit = false
                } else {
                    this.updated = true
                }
            },
            deep: true
        }
    },
    created() {
        this.getLocalDefaultData()
        this.initData()
        this.getSchoolBaseData()
        this.getTimeZoneList()
        this.getMonthList()
        //设置默认tab
        let tab = sessionStorage.getItem("setTab")
        this.tab = tab || this.tab

        //默认校徽
        this.defBadge = require('@/assets/icon/default_school.png')
    },
    beforeRouteLeave(to, from, next) {
        sessionStorage.setItem("setTab", this.tab)
        if (this.updated) {
            let config = {
                title: this.$t('schoolBaseInfo.saveWarning'),
                content: this.$t('schoolBaseInfo.ssTips8'),
                okText: this.$t('schoolBaseInfo.leaveText'),
                onOk: () => {
                    next()
                },
                onCancel: () => {
                    next(false)
                }
            }
            this.$Modal.confirm(config)
        } else {
            next()
        }
    },
    mounted() {
        this.colorList = ['#F16C6A', '#68CDF1', '#7C4DFF', '#00796B', '#D32F2F', '#0288D1', '#D32F2F', '#00796B', '#7C4DFF', '#0288D1']
        this.schoolSas = JSON.parse(decodeURIComponent(localStorage.school_profile, "utf-8")).blob_sas
    },
    computed: {
        //计算时区设置宽度
        tzWidth() {
            if (this.schoolSetting.timeZone && this.schoolSetting.timeZone.label) {
                return this.getWidth(0, this.schoolSetting.timeZone.label)
            } else {
                return 150
            }
        },
        snWitdh() {
            if (this.schoolSetting && this.schoolSetting.name) {
                let width = 20
                for (let i = 0; i < this.schoolSetting.name.length; i++) {
                    let c = this.schoolSetting.name.charCodeAt(i);
                    //单字节宽度
                    if ((c >= 0x0001 && c <= 0x007e) || (0xff60 <= c && c <= 0xff9f)) {
                        width += 12
                    }
                    else {
                        //汉字宽度
                        width += 19
                    }
                }
                return width
            } else {
                return 150
            }
        },
        dayList() {
            let mon = this.schoolSetting.period[this.curPriodIndex].semesters[this.curSemIndex].month
            let arr = []
            if (mon == 2) {
                arr = [...new Array(29).keys()]
            } else if (mon == 4 || mon == 6 || mon == 9 || mon == 11) {
                arr = [...new Array(30).keys()]
            } else {
                arr = [...new Array(31).keys()]
            }
            let lang = window.localStorage.getItem('local')
            if (lang.indexOf('CN') != -1 || lang.indexOf('cn') != -1) {
                return arr.map((item) => {
                    return (item + 1) + '日'
                })
            } else if (lang.indexOf('TW') != -1 || lang.indexOf('tw') != -1) {
                return arr.map((item) => {
                    return (item + 1) + '日'
                })
            } else {
                return arr.map((item) => {
                    return item + 1
                })
            }
        },
        editIconStatus() {
            if (this.schoolSetting.period.length > 0) {
                return true
            } else {
                return false
            }
        },
        //处理公共学科池 (学科暂未添加类型字段，这里暂时选出所有学科)
        generalSubList() {
            if (this.schoolSetting.period) {
                let arr = []
                let ids = []
                this.schoolSetting.period.forEach((pdItem, pdIndex) => {
                    pdItem.subjects.forEach((subItem, subIndex) => {
                        if (subItem.type == 1 && ids.indexOf(subItem.name) == -1) {
                            arr.push(subItem)
                            ids.push(subItem.name)
                        }
                    })
                })
                return arr
            } else {
                return []
            }
        },
        // 设置入学期提示
        startWarning() {
            let flag = true
            if (this.schoolSetting.period && this.schoolSetting.period[this.curPriodIndex].semesters) {
                this.schoolSetting.period[this.curPriodIndex].semesters.forEach(item => {
                    if (item.start == 1) {
                        flag = false
                    }
                })
            } else {
                flag = false
            }
            return flag
        }

    }
}
</script>

<style lang="less" scoped>
@import "./NewSystemSetting.less";
</style>
<style lang="less">
.semester-name-label .ivu-input-wrapper {
    vertical-align: top;
}
.input-line-height {
    .ivu-input {
        line-height: 32px;
    }
}
.school-name .ivu-input[disabled] {
    font-size: 20px !important;
}
.time-zone-select .ivu-icon-ios-arrow-down:before {
    display: none;
}

.time-zone-select .ivu-select-selection {
    border-color: transparent;
}

.time-zone-select:hover .ivu-select-selection {
    border-color: #606060;
}

.time-zone-select:hover .ivu-icon-ios-arrow-down:before {
    display: inline-block;
}
.school-name .ivu-input-disabled {
    color: white !important;
    margin-top: -4px;
    font-weight: 800;
}

.ghost {
    opacity: 0;
    background: #c8ebfb;
}
.semester-name-label .ivu-input[disabled] {
    font-size: 14px !important;
    color: white;
}
.setting-scroll > .__panel > .__view {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
}
.attr-content .ivu-input-number-disabled .ivu-input-number-input {
    cursor: text;
}
.custom-radio {
    .ivu-select-selection {
        background: transparent;
        border-color: #363738;
        color: #a6a6a6;
    }

    .ivu-checkbox-wrapper {
        margin-left: 40px;
        margin-top: 5px;
        color: #a6a6a6;
    }

    .ivu-checkbox {
        margin-right: 5px;
    }

    .ivu-radio-wrapper {
        margin-right: 20px;
        color: white;
    }

    .ivu-radio-inner {
        width: 18px;
        height: 18px;
        border-radius: 4px;
        background-color: #0f0f0f;
        border-color: #4d4d4d;
        border-width: 1px;
        margin-right: 5px;
        &::after {
            content: "";
            display: block;
            width: 10px;
            height: 16px;
            border-right: #ffffff solid 3px;
            border-bottom: #ffffff solid 3px;
            transform: rotate(35deg);
            position: absolute;
            top: -4px;
            left: 4px;
            border-radius: 0;
            background-color: transparent;
            border-color: #0094ff;
        }
    }

    .ivu-checkbox-inner {
        width: 18px;
        height: 18px;
        border-radius: 4px;
        background-color: #0f0f0f;
        border-color: #4d4d4d;
        border-width: 1px;
        margin-right: 5px;
    }

    .ivu-checkbox-checked .ivu-checkbox-inner {
        width: 18px;
        height: 18px;
        border-radius: 4px;
        background-color: #0f0f0f;
        border-color: #4d4d4d;
        border-width: 1px;
        margin-right: 5px;
        &::after {
            content: "";
            display: block;
            width: 10px;
            height: 16px;
            border-right: #ffffff solid 3px;
            border-bottom: #ffffff solid 3px;
            transform: rotate(35deg);
            position: absolute;
            top: -4px;
            left: 4px;
            border-radius: 0;
            background-color: transparent;
            border-color: #0094ff;
        }
    }
}
.grade-name .ivu-input {
    text-align: center;
}
</style>