<template>
  <d2-container class="page" id="enrol_guid_index_scoped">
    <div v-if="enrolCurStep=='category'">
      <el-tabs value="category">
        <el-tab-pane label="请选择报考大类" name="category">
          <center>
          <el-row>
            <el-col :span="24">
              <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
                <div class="el-table__body-wrapper is-scrolling-none">
                  <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                    <tbody>
                      <tr class="el-table__row"  v-for="(category, index) in categoryArray" :key="index" @click="goMajorByCategory(category)">
                        <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                          <span style="float: left; margin-left: 15px"><img style="height:15px" :src="category.imgUrl">&nbsp;&nbsp;{{category.category_name}}</span>
                          <span style="float: right; padding: 3px 25px" type="text">
                            选择此大类
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>      
            </el-col>


          </el-row>
          <!-- <el-row>
          <div style="margin-top:10px">
            <el-button type="primary">确定 </el-button>
          </div>
          </el-row> -->
          </center>
        </el-tab-pane>
      </el-tabs>
    </div>    
    
    <div v-else-if="enrolCurStep=='major'">
      <el-tabs value="major">
        <el-tab-pane label="请根据需要报考的专业" name="major">
          <center>
          <el-row>
            <el-col :span="24">
              <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
                <div class="el-table__body-wrapper is-scrolling-none">
                  <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                    <tbody>
                      <tr class="el-table__row" v-if="major.major_status=='Active'"   v-for="(major, index) in majorArray" :key="index" @click="goAspectByMajor(major)">
                        <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                          <span class="cell">&nbsp;&nbsp;{{major.major_name}}</span>
                          <span style="float: right; padding: 3px 25px" type="text">
                            选择此专业
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>      
            </el-col>


          </el-row>
          </center>
        </el-tab-pane>
      </el-tabs>    
    </div>

    <div v-else-if="enrolCurStep=='aspect'">
      <el-tabs value="aspect">
        <el-tab-pane label="查询招考方向" name="aspect">
          <center>
          <el-row>
            <el-col :span="24">
              <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
                <div class="el-table__body-wrapper is-scrolling-none">
                  <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                    <tbody>
                      <tr class="el-table__row"  v-for="(aspect, index) in aspectArray" :key="index" @click="goSubjectByAspect(aspect)">
                        <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                          <span class="cell">&nbsp;&nbsp;{{aspect.aspect_name}}</span>
                          <span style="float: right; padding: 3px 25px" type="text">
                            选择此招考方向
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>      
            </el-col>

          </el-row>
          </center>
        </el-tab-pane>
      </el-tabs>      
    </div>

    <div v-else-if="enrolCurStep=='subject'">
     <el-tabs value="subject">
      <el-tab-pane label="科目信息" name="subject">
        <center>
        <el-row>
          <el-col :span="24">
            <center>
              <div class="title">
                【{{getAspectName(aspect)}}】<br>
              {{FrameParam.ExamBatchStatus=='Active'?'初试':'考试'}}科目  
              </div>
            </center>
            <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
              <div class="el-table__body-wrapper is-scrolling-none">
                <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                  <tbody>
                    <tr class="el-table__row"  v-for="(subject, index) in subjectMap['SubjectArray_1']" :key="index">
                      <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                        <span class="cell"><span style="font-size:13px">&nbsp;&nbsp;{{subject.subject_name}}&nbsp;&nbsp;<el-tag size="mini">{{subject.subject_type | subjectType}}</el-tag></span>
                        <span v-if="subject.variety_id">&nbsp;【{{subject.variety_name}}】</span>
                        <span v-if="subject.master_flag">&nbsp;【{{subject.master_name}}】</span></span>
                        <span style="padding: 3px 25px">
                          <span style="float: right;" type="text" v-if="subject.subject_group" @click="goGroup(subject)">
                            选择科目
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                          <span style="float: right;" type="text" v-if="subjectMap['VarietyArray_'+subject.subject_id]" @click="goSubjectVariety(subject)">
                            选择乐器/舞种
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                          <span style="float: right;" type="text" v-if="subject.master_group" @click="goSubjectMaster(subject)">
                            选择主副项
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </span>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>      
          </el-col>

        </el-row>
        <el-row>
          <div style="margin-top:10px">
            <el-button-group>
              <el-button type="primary" @click="confirmSubject()">确定考试科目 </el-button>
              <el-button type="primary" @click="enrolCurStep = 'aspect'">报考其他招考方向 </el-button>
            </el-button-group>
          </div>
        </el-row>
        </center>
      </el-tab-pane>    
     </el-tabs> 
    </div>  

    <div v-else-if="enrolCurStep=='group'">
     <el-tabs value="group">
      <el-tab-pane label="科目信息" name="group">
        <center>
        <el-row>
          <el-col :span="24">
            <center>
              <div class="title">
                选择 【{{subject.subject_group}}】 科目
              </div>
            </center>
            <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
              <div class="el-table__body-wrapper is-scrolling-none">
                <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                  <tbody>
                    <tr class="el-table__row"  v-for="(item, index) in subjectMap['SubjectGroup_1_'+subject.subject_group]" :key="index">
                      <td rowspan="1" colspan="1" class="el-table_47_column_197">
                        <span class="cell"><span style="">&nbsp;&nbsp;{{item.subject_name}}</span></span>
                        <span style="padding: 3px 25px">
                          <span style="float: right;" type="text" v-if="item.subject_group" @click="chooseGroup(item)">
                            选择此科目
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </span>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>      
          </el-col>

        </el-row>
        </center>
      </el-tab-pane>    
     </el-tabs>     
    </div>

    <div v-else-if="enrolCurStep=='subjectVariety'">
      <el-tabs value="subjectVariety">
        <el-tab-pane label="请选择科目乐器/舞种" name="subjectVariety">
          <center>
            <div class="title">
              【{{subject.subject_name}}】乐器/舞种
            </div>
          </center>
         <center>
          <el-row>
            <el-col :span="24">
              <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
                <div class="el-table__body-wrapper is-scrolling-none">
                  <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                    <tbody>
                      <tr class="el-table__row"  
                          v-for="(variety, index) in subjectMap['VarietyArray_'+subject.subject_id]"
                          :key="index"
                          @click="chooseSubjectVariety(variety)">
                        <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                          <span style="float: left; margin-left: 15px">&nbsp;&nbsp;{{variety.variety_name}}</span>
                          <span style="float: right; padding: 3px 25px" type="text">
                            选择此乐器/舞种
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>      
            </el-col>


          </el-row>
         </center>
        </el-tab-pane>
      </el-tabs>    
    </div>

    <div v-else-if="enrolCurStep=='subjectMaster'">
      <el-tabs value="subjectMaster">
        <el-tab-pane label="请选择科目主副项" name="subjectMaster">
          <center>
            <div class="title">
              【{{subject.subject_name}}】主副项
            </div>
          </center>
         <center>
          <el-row>
            <el-col :span="24">
              <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
                <div class="el-table__body-wrapper is-scrolling-none">
                  <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                    <tbody>
                      <tr class="el-table__row"  
                        v-for="(group, index) in MasterGroupArray"
                        :key="index"
                        @click="chooseSubjectGroup(group)">
                        <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                          <span style="float: left; margin-left: 15px">&nbsp;&nbsp;{{group.name}}</span>
                          <span style="float: right; padding: 3px 25px" type="text">
                            选择此项
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>      
            </el-col>


          </el-row>
         </center>
        </el-tab-pane>
      </el-tabs>
    </div> 

    <div v-else-if="enrolCurStep=='confirm'" >
      <el-tabs value="confirm">
        <el-tab-pane label="报考信息" name="confirm">
          <el-row>
              <el-col :span="4">
                &nbsp;
              </el-col>
              <el-col :span="16">
                <div class="el-table el-table--fit el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 100%;">
                  <el-card class="box-card" style="background-color: rgb(217, 237, 247);">
                    <div slot="header" class="clearfix">
                      <span>确定报考信息</span>
                    </div>
                    <div class="el-table__body-wrapper is-scrolling-none">
                      <table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%;">
                        <tbody>
                          <tr class="el-table__row">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">招考方向：{{aspect.aspect_name}}</div>
                            </td>
                          </tr>
                          <tr class="el-table__row" v-if="aspect.aspect_desc">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">招考说明：{{aspect.aspect_desc}}</div>
                            </td>
                          </tr>
                          <tr class="el-table__row" v-if="aspect.variety_id!=undefined">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">乐器/舞种：
                                {{aspect.variety_name}}
                              </div>
                            </td>
                          </tr>
                          <tr class="el-table__row">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">初试曲目：
                                <p v-for="(tracks, index) in tracksArray" :key="index">{{index+1}}.&nbsp;{{tracks.tracks_name}}</p>
                              </div>
                            </td>
                          </tr>
                          <tr class="el-table__row">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">考点名称：{{agent.agent_name  }}</div>
                            </td>
                          </tr>
                          <tr class="el-table__row">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">考点地址：{{agent.agent_addr}}</div>
                            </td>
                          </tr>
                          <tr class="el-table__row">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">开考日期：
                              {{agent.aspect_exam_date==undefined?'待定，请留意官方通知':agent.aspect_exam_date}}
                              </div>
                            </td>
                          </tr>
                          <tr class="el-table__row">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">报名考试费：
                              <span class='redBold'> &yen;{{(
                                agent.agent_province==FrameParam.DefaultProvinceId?
                                aspect.fee.amount_1:
                                (aspect.fee.out_amount_1==undefined?
                                  aspect.fee.amount_1:
                                  aspect.fee.out_amount_1))/100}}
                                  </span>

                              </div>
                            </td>
                          </tr>
                          <tr class="el-table__row" v-if="aspect.once_flag=='Active'">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">考试科目：
                                <span v-for="(item, index) in subjectMap['SubjectArray_2']" :key="index">
                                  {{index==0?'':'、'}}{{item.subject_name}}
                                </span>
                              </div>
                            </td>
                          </tr>
                          <tr class="el-table__row" v-for="(batch, index) in subjectMap.BatchArray" v-if="aspect.once_flag!='Active'" :key="index">
                            <td class="el-table_47_column_197  ">
                              <div class="cell">{{FrameParam.ExamBatchStatus=='Active'?batch.s01:'考试'}}科目：
                                <span v-for="(item, index) in subjectMap['SubjectArray_'+batch.i01]" :key="index">
                                  {{(index==0)?'':(item.subject_id=='1814'?'与':'、')}}
                                  {{item.subject_name}}
                                </span>
                              </div>
                            </td>
                          </tr>
                        </tbody>
                      </table><!----><!---->
                      <center>
                        <el-button-group>
                          <el-button type="primary" @click="confirmEnrol">确定报考该招考方向 </el-button>
                          <el-button @click="enrolCurStep = 'agent'">选择其他考点 </el-button>
                          <el-button @click="enrolCurStep = 'aspect'">报考其他招考方向 </el-button>
                        </el-button-group>
                      </center>
                    </div><!----><!----><!----><!---->
                    <div class="el-table__column-resize-proxy" style="display: none;"></div>
                  </el-card>
                </div>          
              </el-col>
              <el-col :span="4">
                &nbsp;
              </el-col>
          </el-row>
        </el-tab-pane>
      </el-tabs>
    </div>

    <div v-else-if="enrolCurStep=='tracks'">
      <div v-for="(variety ,index) in varietyTracksMap.VarietyArray" :key="index">
        <center>
          <div class="title">{{variety.variety_name}}</div>
        </center>
        <el-table
          v-loading="loading"
          :data="list"
          style="width: 100%">
          <el-table-column
            prop="choose_type"
            label="限定类型"
            width="180">
            <template slot-scope="scope">
              {{scope.row.choose_type | trackChooseType}}
            </template>
          </el-table-column>
          <el-table-column
            prop="tracks_name"
            label="曲目名称"
            width="180">
            <template slot-scope="scope">
              <span v-if="item.choose_type!='User'">{{scope.row.tracks_name}}</span>
              <el-input v-model="scope.row.tracks_name" placeholder="请输入内容"></el-input>
            </template>            
          </el-table-column>
        </el-table>
      </div>

      <div class=" text-right" v-show="chooseTracks == undefined">
        <button class="btn btn-info" type=" button" @click="goAgent()">下一步</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <button class="btn btn-default" type="button"  @click="enrolCurStep='category'">重新选择报考大类</button>

        <el-button type="primary" @click="goAgent()">下一步</el-button>
        <el-button type="default" @click="goCategory()">重新选择报考大类</el-button>
      </div>

      <div v-show="chooseTracks == undefined">
        <el-table
          v-loading="loading"
          :data="list"
          style="width: 100%">
          <el-table-column
            prop="tracks_code"
            label="曲目代码"
            width="180">
          </el-table-column>
          <el-table-column
            prop="tracks_name"
            label="曲目名称" 
            width="180">
          </el-table-column>
          <el-table-column
            prop="tracks_type"
            label="曲目类别" 
            width="180">
          </el-table-column>
          <el-table-column
            prop="tracks_author"
            label="曲目作者" 
            width="180">
          </el-table-column>
          <el-table-column
            prop="tracks_source"
            label="曲目来源" 
            width="180">
          </el-table-column>
          <el-table-column
            prop="tracks_source"
            label="曲目来源" 
            width="180">
            <template slot-scope="scope">
              <el-button type="primary" @click="choooseVarietyTracks(scope.row)">选择</el-button>
            </template>   
          </el-table-column>
        </el-table>   
        <div>
          <div class="text-left">
            <el-input v-model="queryTracksText" placeholder="请输入查询条件"></el-input>
            <el-button type="primary" @click="goSearchTracks(0)">查询曲目</el-button>
          </div>   
          <div class="text-right">
            <a 
              href="javascript:;"
              class="weui-btn weui-btn_mini weui-btn_default"
              @click='goSearchTracks(0,10)' v-if="tracksPage.index!=0">首页</a> 
            <a
              href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default"
              @click='goSearchTracks((tracksPage.index-1)*10,10)'
              v-if='tracksPage.index!=0'>上一页</a> 
            <a 
              href="javascript:;"
              class="weui-btn weui-btn_mini weui-btn_default"
              @click='goSearchTracks((tracksPage.index+1)*10,10)'
              v-if='tracksPage.index!=(tracksPage.count-1)'>下一页</a> 
            <a
              href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default"
              @click='goSearchTracks((tracksPage.count-1)*10,10)'
              v-if='tracksPage.index!=(tracksPage.count-1)'>尾页</a>  
            &nbsp;&nbsp; 第{{TracksPage.index}}页/共{{TracksPage.count}}页
          </div>   

        </div>
    </div>

    </div>
    <div v-else-if="enrolCurStep=='tracksChoose'">

    </div>

    <div v-else-if="enrolCurStep=='agent'">
      <el-tabs value="agent">
        <el-tab-pane label="请选择考区" name="agent">
          <center>
          <el-row>
            <el-col :span="24">
              <div class="el-table el-table--fit el-table--border el-table--striped el-table--enable-row-hover el-table--enable-row-transition" style="width: 95%;">
                <div class="el-table__body-wrapper is-scrolling-none">
                  <table cellspacing="0" cellpadding="0" border="0"  class="el-table__body" style="width: 100%;">
                    <tbody>
                      <tr class="el-table__row"  v-for="(item, index) in agentArray" :key="index" @click="chooseAgent(item)">
                        <td rowspan="1" colspan="1" class="el-table_47_column_197  ">
                          <span class="cell">&nbsp;&nbsp;{{item.agent_name}}</span>
                          <span style="float: right; padding: 3px 25px" type="text">
                            选择此考区
                            <i class="el-icon-arrow-right" style="font-size:20px"></i>
                          </span>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>     
              <el-button-group>
                <el-button type="primary" @click="enrolCurStep = 'aspect'">报考其他招考方向 </el-button>
              </el-button-group> 
            </el-col>

          </el-row>
          </center>
        </el-tab-pane>
      </el-tabs>    
    </div> 

    <div v-else-if="enrolCurStep=='success'">
      <center>
        <el-row>
          <el-col :span="4">&nbsp;</el-col>
          <el-col :span="16">
            <el-card>
              <h3><span style="color:green"><i class="el-icon-success" style="font-size: 30px;color:green;margin-right:10px"></i>报考信息已提交</span></h3><br>
              <h4 style="margin-top:0px">
                招考方向【{{getAspectName(aspect)}}】报考信息已提交，交费时间截止至 【<span
                  class="redBold">{{agent.enrol_end_time}}</span>】，<br>
                  <font color="red">
                    为确保报考信息生效，请尽快完成交费，未在规定规定时间内完成交费的，视为放弃报考。
                  </font>
              </h4>
              <el-button-group>
                <el-button type="primary" @click="goUrl('')">前往交费 </el-button>
                <el-button @click="goUrl('index')">稍后交费 </el-button>
              </el-button-group>
            </el-card>
          </el-col>
          <el-col :span="4"></el-col>
        </el-row>


      </center>
          
    </div>
  </d2-container>
</template>

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

export default {
  components: {},
  computed: {
    ...mapState({
      stdReg: state => state.enrol.StdReg,
      step: state => state.enrol.step,
      FrameParam: state => state.enrol.FrameParam
    })
  },
  data() {
    return {
      enrolCurStep: "",

      categoryArray: null,
      category: {},

      majorArray: null,
      major: {},

      aspectArray: null,
      aspect: {},
      aspectMap: {},

      variety: null,

      subject: null,
      subjectMap: {},

      varietyTracksMap: {},
      tracksArray: [],

      agentArray: null,
      agent: null,

      enrolId: "",
      MasterGroupArray : [ {
        name : '主项',
        value : 'Active'
        }, {
          name : '副项',
          value : 'InActive'
        } 
      ],
      currentTracks: null,
      tracksPage: null,
      tracks_query_params:{
        tracks_query: null
      },
    };
  },
  async mounted() {
    this.goCategory();
  },
  methods: {
    //选择大类
    async goCategory(){
      let res = await this.$http.post("/enrol/conf/category/list.htm");
      let list = [];
      _.forEach(res.data.array, item => {
        item["imgUrl"] = `/image/theme/sys/category/${item.category_code}.png`;
        list.push(item);
      });
      this.enrolCurStep = "category";
      this.categoryArray = list;
      if (this.categoryArray.length == 1) {
        this.category = this.categoryArray[0];
        if (this.FrameParam.SchoolCode == "njdz") {
          this.enrolCurStep = "aspect";
        } else {
          this.enrolCurStep = "major";
        }
      }
    },

    //选择大类跳转专业
    async goMajorByCategory(item) {
      this.category = item;
      this.enrolCurStep = "major";
      let res = await this.$http.post(
        "/enrol/gobal/conf/category/major.htm",
        this.Qs.stringify({
          category_id: this.category.category_id
        }),
        this.$http.headers.FORM
      );
      this.majorArray = res.data.array;
    },

    //选择专业跳转方向
    async goAspectByMajor(item) {
      this.major = item;
      this.enrolCurStep = "aspect";
      let res = await this.$http.post(
        "/enrol/gobal/conf/major/aspect.htm",
        this.Qs.stringify({
          major_id: this.major.major_id
        }),
        this.$http.headers.FORM
      );
      this.aspectMap = res.data.map;
      this.aspectArray = res.data.map.AspectArray;
    },

    //选择方向跳转科目
    async goSubjectByAspect(item) {
      this.aspect = item;
      this.variety = this.aspectMap["VarietyArray_" + item.aspect_id][0] || {};

      this.enrolCurStep = "subject";

      let res = await this.$http.post(
        "/enrol/conf/aspect/subject/list.htm",
        this.Qs.stringify({
          aspect_id: this.aspect.aspect_id,
          variety_id: this.variety.variety_id
        }),
        this.$http.headers.FORM
      );
      this.subjectMap = res.data.map;
      if (this.subjectMap["SubjectArray_1"][0].subject_id == "0000") {
        // 一次考试到底
        this.aspect.once_flag = "Active";
        this.goAgent();
      }
    },

    goGroup(item) {
      this.subject = item;
      this.currentSubject = item;
      this.enrolCurStep = "group";
    },
    chooseGroup(subject) {
      let cloneSubjectMap = _.cloneDeep(this.subjectMap);
      _.forEach(cloneSubjectMap["SubjectArray_1"], sb => {
        if (sb.subject_group == subject.subject_group) {
          sb.subject_id = subject.subject_id;
          sb.subject_name = subject.subject_name;
        }
      });
      this.subjectMap = cloneSubjectMap;

      this.enrolCurStep = "subject";
    },

    goSubjectVariety(item) {
      this.subject = item;
      this.currentSubject = item;
      this.enrolCurStep = "subjectVariety";
    },
    chooseSubjectVariety(){
      let _this = this;
      let cloneSubjectMap = _.cloneDeep(this.subjectMap);
      _.forEach(cloneSubjectMap['SubjectArray_1'], function(sb) {
        if (sb.master_group == _this.subject.master_group) {
          if (_this.subject.subject_id == sb.subject_id) {
            sb.master_flag = group.value;
            sb.master_name = group.name;
          } else {
            if (group.value == 'InActive') {
              sb.master_flag = 'Active';
              sb.master_name = '主项';
            } else {
              sb.master_flag = 'InActive';
              sb.master_name = '副项';
            }
          }
        }
      });
      this.subjectMap = cloneSubjectMap;
      this.enrolCurStep = "subject";

      // this.setCurStepData(this.curStep,"",{
      //   "subjectMap":cloneSubjectMap,
      //   "subjectInited": true
      // });
      // this.goNextStep("subject");
    },

    goSubjectMaster(item) {
      this.subject = item;
      this.currentSubject = item;
      this.enrolCurStep = "subjectMaster";
    },
    chooseSubjectGroup(){
      let _this = this;
      let cloneSubjectMap = _.cloneDeep(this.subjectMap);
      _.forEach(cloneSubjectMap['SubjectArray_1'], function(sb) {
        if (sb.master_group == _this.subject.master_group) {
          if (_this.subject.subject_id == sb.subject_id) {
            sb.master_flag = group.value;
            sb.master_name = group.name;
          } else {
            if (group.value == 'InActive') {
              sb.master_flag = 'Active';
              sb.master_name = '主项';
            } else {
              sb.master_flag = 'InActive';
              sb.master_name = '副项';
            }
          }
        }
      });
      this.subjectMap = cloneSubjectMap;
      this.enrolCurStep = "subject";
      // this.setCurStepData(this.curStep,"",{
      //   "subjectMap":cloneSubjectMap,
      //   "subjectInited": true
      // });
      // this.goNextStep("subject");
    },

    choooseVarietyTracks(tracks){
      let currentTracks = this.currentTracks;
        for (let i = 0; i < this.varietyTracksMap['VarietyTracksArray_' + currentTracks.variety_id].length; i++) {
          let temp = this.varietyTracksMap['VarietyTracksArray_' + currentTracks.variety_id][i];
          if (currentTracks.tracks_order == temp.tracks_order)
            continue;
          if (tracks.tracks_id == temp.tracks_id) {
            this.alert('不能选择相同的曲目，请重新选择');
            return;
          }
        }
        _.extend(this.currentTracks, tracks);
        this.enrolCurStep = "tracks"
    },
    async goSearchTracks(start, limit){
      // this.enrol_id = this.$route.params.enrol_id;
      // this.showLoading();
      const res = await this.$http.post(
        "/enrol/conf/variety/tracks/list.htm",
        this.Qs.stringify({
          "start": start == undefined ? 0 : start,
          "limit": limit == undefined ? 10 : limit,
          variety_id : this.currentTracks.variety_id,
          query : this.tracks_query_params.tracks_query
        }),
        this.$http.headers.FORM
      );
      // this.hideLoading();
      if(res.data.errorMsg){
        // this.hideLoading();
        this.alert(res.data.errorMsg);
        return false;
      }
      this.tracksPage = res.data.page;
    },

    async goAgent() {
      this.enrolCurStep = "agent";
      let res = await this.$http.post(
        "/enrol/gobal/conf/agent.htm",
        this.Qs.stringify({
          category_id: this.category.category_id,
          aspect_id: this.aspect.aspect_id
        }),
        this.$http.headers.FORM
      );
      this.agentArray = res.data.array;
    },
    chooseAgent(item) {
      this.agent = item;
      this.enrolCurStep = "confirm";
    },

    async confirmSubject() {
      let array = new Array();
      // 显示曲目
      for (
        let index = 0;
        index < this.subjectMap["SubjectArray_1"].length;
        index++
      ) {
        let sb = this.subjectMap["SubjectArray_1"][index];
        // 判断多选一是否已经选择
        if (sb.subject_id == undefined) {
          this.alert(
            "请为多选一的科目【" + sb.subject_group + "】选择一个科目！",
            "错误提示"
          );
          return;
        }
        // 判断品种id是否选择
        if (
          this.subjectMap["VarietyArray_" + sb.subject_id] &&
          sb.variety_id == undefined
        ) {
          this.alert(
            "请为科目【" + sb.subject_name + "】选择一个乐器/舞种！",
            "错误提示"
          );
          return;
        }
        // 判断主副项目是否选择
        if (sb.master_group != undefined && sb.master_flag == undefined) {
          this.alert(
            "请为科目【" + sb.subject_name + "】选择主副项！",
            "错误提示"
          );
          return;
        }
        // 判断是否要选择曲目
        if (sb.variety_id != undefined) {
          array.push(sb.variety_id);
        }
      }

      let VarietyTracksMap;
      if (array.length > 0) {
        let res = await this.$http.post(
          "/enrol/conf/variety/tracks/config.htm",
          this.Qs.stringify({
            variety_ids: array.join(",")
          }),
          this.$http.headers.FORM
        );
        VarietyTracksMap = res.data.map;
        this.varietyTracksMap = VarietyTracksMap;
        this.enrolCurStep = "subject";

        if (res.data.map.VarietyArray.length == 0) {
          this.goAgent();
        } else {
          this.enrolCurStep = "tracks";
          //TODO
        }
      } else {
        this.goAgent();
      }
    },

    async confirmEnrol() {
      // this.showLoading();
      let _this = this;

      let subjects = [];
      this.subjectMap["SubjectArray_1"].map(item => {
        subjects.push(item);
      });
      let entity = {
        std_id: this.stdReg.std_id,
        aspect_id: this.aspect.aspect_id,
        agent_id: this.agent.agent_id,
        subject_json: JSON.stringify(subjects),
        tracks_json: JSON.stringify(this.tracksArray)
      };
    
      if (this.variety != undefined) {
        entity.variety_id = this.variety.variety_id;
        // entity.variety_name = this.variety.variety_name;
      }
      const res = await this.$http.post(
        "/enrol/std/enrol/save.htm",
        this.Qs.stringify(entity),
        this.$http.headers.FORM
      );

      if (res.data.errorMsg) {
        // this.hideLoading();
        // this.confirm({
        //   content: res.data.errorMsg,
        //   onConfirm() {
        //     _this.goUrl("/home");
        //  }
        // });

        this.alert(res.data.errorMsg, "信息提示", {
          // confirm:function(){
          //   _this.goUrl("/home");
          // }
        });
        return false;
      }
      // this.hideLoading();
      // this.setCurStepData(this.curStep,res.data.entity, null)
      this.enrolId = res.data.entity;
      // this.goNextStep(this.nextStep);
      this.enrolCurStep = "success";
    }
  }
};
</script>

<style lang="scss">
#enrol_guid_index_scoped {
  .el-card__body {
    padding: 9px !important;
  }
  .el-card__header {
    padding: 11px 20px;
  }
  .cell {
    margin-left: 10px;
    border-bottom: 1px;
  }
  .el-table td,
  .el-table th {
    padding: 5px 0;
  }
  .el-card__header {
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 10px;
    padding-left: 20px;
  }
  .el-card__body {
    padding: 0px;
  }
  .redBold {
    color: red;
    font-size: 15px;
    font-weight: 200;
    font-weight: bold;
  }
  .el-button-group {
    margin-top: 10px;
  }
  .el-button {
    margin-right: 10px;
  }
  .title{
    color: #409EFF;
    margin-bottom: 15px;
  }
}
</style>
