<template>
  <d2-container class="page" id="enterMajor">
    <el-card class="box-card" body-style="max-height: 180px;">
      <center>
        <div>
          <img :src="isEnroled?'./image/step/4.png':stepImg">
        </div>
      </center>
    </el-card>
    <el-tabs value="first">
      <el-tab-pane label="填报专业及考区" v-if="stdReg.std_source" name="first">
        <center>
          <div style="width:500px">
            <el-form ref="stdRegInfo" :model="stdRegInfo" :rules="stdRegInfoRule" label-width="80px">
              <el-row>
                <el-col :span="24" v-if="String(stdRegInfo.old_major_id)">
                  <el-form-item label="老专业">
                    <div style="text-align:left">
                    &nbsp;&nbsp;&nbsp;&nbsp;{{old_major_name}}
                    </div>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                    <el-form-item label="考生来源" prop="std_source">
                      <el-select size="mini" clearable v-model="stdRegInfo.std_source" filterable placeholder="请选择考生来源" @change="std_sourceChange">
                          <el-option label="社会考生" value="1"></el-option>
                          <el-option label="助学考生" value="3"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="专业" prop="major_id">
                   <el-select size="medium" v-model="stdRegInfo.major_id" filterable clearable placeholder="请选择专业" @change="majorChange" >
                     <el-option  v-for="item in majorArray" :key="item.id" :label="item.major_code+' | '+item.major_name" :value="item.id"></el-option>
                    
                  </el-select>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
 
              <el-col :span="24">
                  <el-form-item label="主考院校" >
                    <span v-if="stdReg.std_source == 1">{{school_name}}</span>
                    <el-select v-if="stdReg.std_source == 3" size="medium" v-model="stdRegInfo.school_id" placeholder="请选择主考院校" >
                      <el-option v-for="item in orgArray_std_source_3" :key="item.org_code+' | '+item.org_name" :label="item.org_code+' | '+item.org_name" :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
        </center>
        <center>
        <div style="margin-top:10px">
          <el-button type="primary" @click="save()">提交保存</el-button>

          <el-button type="primary" @click="goUrl('/enrol')">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;报考&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</el-button>
        </div>
      </center>
      </el-tab-pane>
        <div v-if="!stdReg.std_source" style="margin-top:40px">
          <center>
            <el-button type="primary" @click="goUrl('personalInfo')">去完善个人信息</el-button>
          </center>

        </div>
    </el-tabs>
    <el-dialog title="提示" width="400px" :visible.sync="OkDialogVisible">
      &nbsp;&nbsp;&nbsp;&nbsp;您的准考证号是： <font style="color:red"><span style="font-weight:600;font-size:26px">{{ticket_no_new}}</span></font> 请记录准考证号信息，
      如忘记，可以在个人信息里面查询准考证号!你可以同时通过身份证号或准考证号登录系统.
        <center>
          <el-button type="primary" @click="closeWin()">关闭</el-button>
        </center>
    </el-dialog>
  </d2-container>
</template>

<script>
import { mapState, mapActions } from "vuex";

export default {
  components: {},
  computed: {
    stepImg: function() {
      if (!this.stdReg) return "";
      let uploadedPic = (this.stdReg.photo_url)?true:false;
      let enterMajor = ((this.stdReg.major_id + "")  || (this.stdReg.major_id == undefined))?false:true;
      //图片未上传 专业未报考
      if (!uploadedPic && !enterMajor) {
        return "./image/step/2.png";
      }
      //图片已经上传 专业未报考
      if (uploadedPic && !enterMajor) {
        return "./image/step/3.png";
      }
      //图片已经上传 专业已报考
      if (uploadedPic && enterMajor) {
        return "./image/step/4.png";
      }
    },
    ...mapState({
      stdReg: state => state.enrol.StdReg,
      dict: state => state.enrol.dict,
      isEnroled:state => state.enrol.isEnroled
    }),
    // activeMajorList() {
    //   let majorArray = this.dict["majorArray"];
    //   return (
    //     this.$options.filters["dataArrayFilter"](majorArray, {
    //       status: 1
    //     })
    //   );
    // },
  },
  data() {
    return {
      // timeControl:{},
      socialMajorList: null,
      ticket_no_new: null,
      OkDialogVisible: false,
      majorArray: [],
      stdRegInfo: {
        major_id: "",
        school_id:"",
        std_source:""
        // exam_area_id: "",
      },
      stdRegInfoRule:{
        major_id:[
          { required: true, message: '请选择专业', trigger: 'blur' },
        ],
        std_source:[
          { required: true, message: '请选择考生来源', trigger: 'blur' },
        ],
        // school_id:[
        //   { required: true, message: '请选择主考院校', trigger: 'blur' },
        // ],
        // exam_area_id:[
        //   { required: true, message: '请选择考区', trigger: 'blur' },
        // ],
      },
      orgArray_std_source_3 : [],
      school_name:null,
      old_major_name: null
    };
  },
  async mounted() {
    // this.OkDialogVisible = true;
    // this.ticket_no_new = "123123123123";
    //初始化数据
    let loading = this.showLoading();
    let _this = this;
    let stdReg = {};
    
    if(this.stdReg.std_name == "Ghost"){
      let res = await this.$http.post("/std/stdRegInfo/get.htm");
      stdReg = res.data.entity;
     
    } else{
      stdReg = this.stdReg
    }
      
    if(!String(stdReg.std_source)){
      this.hideLoading(loading);
      this.alert("请先在个人信息完善基本信息填写【考生来源】后再填报专业信息!", "信息提示", {
          confirm:function(){
            _this.goUrl("/personalInfo");
          }
        });
      return;
    }
    
    // let res = await this.$http.post("/std/stdRegInfo/getSocialMajorList.htm");
    // this.socialMajorList = res.data.array;

    this.majorArray = this.dict["majorArray"];

    let res = await this.$http.post("/std/stdRegInfo/getStdMajor.htm");
    let stdMajor = res.data.entity;

    let stdMajorArray = this.$options.filters["dataArrayFilter"](this.majorArray, {
      id: stdMajor.id
    });

    if(stdMajorArray.length == 0){
      this.majorArray.push(stdMajor);
    }

    // if(stdReg.std_source == 1){
    //    res = await this.$http.post("/std/stdRegInfo/getOrgBySocialMajor.htm",
    //     this.Qs.stringify({
    //         major_id: stdReg.major_id,
    //       }));
    //     this.socialSchoolArray = res.data.array;
    // }
    this.stdRegInfo.major_id = stdReg.major_id || "";
    // this.stdRegInfo.exam_area_id = stdReg.exam_area_id || "";
    this.stdRegInfo.school_id = stdReg.school_id || "";
    this.stdRegInfo.std_source = String(stdReg.std_source);
    // let listres = await this.$http.post("/std/stdEnrol/list.htm");
    // this.timeControl = listres.data.map.timeControl;
    this.majorChange(stdMajor.id);
    this.initOldMajor(stdReg.old_major_id);
    this.hideLoading(loading);
  },
  methods: {
    async majorChange(major_id){
      console.log("major_id:"+major_id);
        if(this.stdRegInfo.std_source == 3 && this.orgArray_std_source_3.length == 0){
          //助学考生加载主考院校数据下拉
          let res = await this.$http.post("/std/cfOrganization/listOrderBy.htm",
          this.Qs.stringify({
            org_type: 1,
          }));

          this.orgArray_std_source_3 = res.data.array;
          return;
        }

      // if(this.stdReg.std_source == 1){
        let loading =this.showLoading();
        // let major = this.dict['socialSchoolArray'].find((item)=>{ return item.major_id == major_id;});
        // let res = await this.$http.post("/std/stdRegInfo/getOrgBySocialMajor.htm",
        let res = await this.$http.post("/std/cfOrganization/querySchoolListByMajorId.htm",
        this.Qs.stringify({
            major_id: major_id,
          }));
        this.stdRegInfo.school_id = "";
        let schoolArray = res.data.array;
        if(schoolArray.length == 1) {
          this.$nextTick(() => {
            // this.stdRegInfo.school_id = this.schoolArray[0].id;
            this.school_name = schoolArray[0].org_code +"-"+schoolArray[0].org_name;
          })
        }
        this.hideLoading(loading);
      // }

    },
    //初始话
    async initOldMajor(major_id){
      let res = await this.$http.post("/pl/plMajor/get.htm",
        this.Qs.stringify({
            major_id: major_id,
          }));
        this.old_major_name = res.data.entity.major_code + "-" + res.data.entity.major_name;

    },
    async save(){
      //验证个人信息是否完善
      if (!this.stdReg) return "";
      let uploadedPic = (this.stdReg.photo_url)?true:false;
      // let enterMajor = ((this.stdReg.major_id + "")  || (this.stdRegstdReg.major_id == undefined))?false:true;
      
      if(!(uploadedPic && String(this.stdReg.std_source))){
        this.confirm("个人信息未完善,暂时不具备报考条件,去完善个人信息?","提示",{confirm:()=>{
          this.goUrl("/personalInfo");
        }})
        return;
      }

      if(this.stdRegInfo.std_source == 3 && !String(this.stdRegInfo.school_id)){
        this.alert("助学考生主考院校为必填项");
        return;
      }

      this.$refs['stdRegInfo'].validate(async (valid) =>  {
            if (valid) {
               let res = await this.$http.post("/std/stdRegInfo/editMajor.htm",
               this.Qs.stringify({
                    id: this.stdReg.id,
                    major_id: this.stdRegInfo.major_id,
                    // school_id: this.stdRegInfo.school_id,
                    // exam_area_id: this.stdRegInfo.exam_area_id
                    std_id:this.stdReg.id,
                    std_source:this.stdReg.std_source,
                  }));
              if(res.data.success){
                //准考证 生成提示
                if(!this.stdReg.ticket_no && res.data.map.stdReg.ticket_no){
                  this.ticket_no_new = res.data.map.stdReg.ticket_no;
                  this.OkDialogVisible = true;
                  // this.alert("您的准考证号是:" + res.data.entity.ticket_no+"请记录准考证号信息，如忘记，可以在个人信息里面查询准考证号!你可以同时通过身份证号或准考证号登录系统,")
                }else{
                  this.alert("专业修改信息提交成功","信息提示")
                }
                this.updateStdReg(res.data.map.stdReg);
                this.updateStdMajor(res.data.map.stdMajor);
              }else{
                this.alert(res.data.errorMsg,"错误提示")
              }
            }
        });
    },

    closeWin(){
      this.OkDialogVisible = false;
    }
  }
};
</script>

<style lang="scss">
#enterMajor{
  .el-select{
    width:100%
  }

  .el-tabs__item{
    .is-top{
      .is-active{
      font-size: 16px;
      }
    }
  } 
  .el-dialog__body{
    padding-top: 0px !important;
  }
}
</style>
