<template>
  <d2-container class="page">
    <el-tabs value="first">
      <el-tab-pane label="毕业预测" name="first">
        <!-- <el-tooltip content="毕业预测（用于过滤出专业下课程通过情况，未考表示课程未通过课程，数据仅供参考）" placement="bottom" effect="light"> -->
        毕业预测：<i class="fa fa-question-circle-o" style="color:#E28700" title="毕业预测（用于过滤出专业下课程通过情况，未考表示课程未通过课程，数据仅供参考）"></i>&nbsp;&nbsp;

        <!-- </el-tooltip> -->
        <!-- question-circle-o" -->
        <el-select size="medium" v-model="selected_major_id" filterable clearable placeholder="请选择专业" >
            <el-option label="-请选择-" value=""></el-option>
            <el-option v-for="item in majorList" :key="item.id" :label="item.major_name" :value="item.id"></el-option>
        </el-select>
        &nbsp;&nbsp;
        成绩是否合格:
        <el-select size="medium" v-model="is_pass" filterable clearable placeholder="成绩是否合格" >
            <el-option  label="全部" value=""></el-option>
            <el-option  label="是" value="1"></el-option>
            <el-option  label="否" value="0"></el-option>
        </el-select>
        &nbsp;&nbsp;<el-button type="primary" @click="query()">确定</el-button>
        <div><font style="color:red;font-size:16px;font-weight:530">注意: 本查询只涉及历史统考与合成成绩,不含助学考生的校考与毕业论文成绩.</font></div>

        <div style="margin-top:10px;margin-buttom:10px">准考证号:{{stdReg.ticket_no}}&nbsp;&nbsp;&nbsp;&nbsp;姓名:{{stdReg.std_name}}&nbsp;&nbsp;&nbsp;&nbsp;身份证号:{{stdReg.cert_no? stdReg.cert_no.replace(/^(.{6})(?:\w+)(.{4})$/, "\$1********\$2"):""}}</div>
        <el-table
          v-loading="loading"
          :data="scoreList"
          style="width: 100%">
          <el-table-column
            type="index"
            label="序号"
            width="50">
          </el-table-column>

          
          <el-table-column
            prop="year_code"
            label="考试年月"
            width="100">
          </el-table-column>
          <el-table-column
            prop="ticket_no"
            label="准考证号"
            width="120">
          </el-table-column>
          <el-table-column
            prop="course_code"
            label="课程代码"
            width="100">
          </el-table-column>
          <el-table-column
            prop="course_name"
            label="课程名称"
            width="300">
          </el-table-column>
          <el-table-column
            prop="final_score"
            label="成绩"
            width="120">
              <template slot-scope="scope">
                <span v-if="scope.row.final_score == '998' || scope.row.final_score == '999'">
                  免考
                </span>
                <span v-if="scope.row.final_score == '887' || scope.row.final_score == '888'">
                  课程顶替
                </span>
                <span  v-if="scope.row.final_score != '887' && scope.row.final_score != '888' && scope.row.final_score != '998' && scope.row.final_score != '999'">
                  <span v-if="scope.row.final_score == '-9'">
                    缺考
                  </span>
                  <span v-else-if="scope.row.final_score == '-3'">
                    违纪
                  </span>
                  <span v-else-if="scope.row.final_score == '-2'">
                    免考
                  </span>
                  <span v-else-if="scope.row.final_score == '-1'">
                    舞弊
                  </span>
                  <span v-else-if="scope.row.final_score == '200'">
                    免考
                  </span>
                  <span v-else-if="scope.row.final_score == '201'">
                    及格
                  </span>
                  <span v-else-if="scope.row.final_score == '202'">
                    中等
                  </span>
                  <span v-else-if="scope.row.final_score == '203'">
                    良好
                  </span>
                  <span v-else-if="scope.row.final_score == '204'">
                    优秀
                  </span>
                  <span v-else>
                   {{scope.row.final_score}}
                  </span>

                </span>
              </template>
          </el-table-column>

          <el-table-column
            prop="score_source"
            label="成绩性质"
            width="100">
              <template slot-scope="scope">
                <span v-if="scope.row.score_source == 7">
                  合成
                </span>
                <span v-if="scope.row.score_source == 8">
                  合成
                </span>
                <span v-if="scope.row.score_source == 9">
                  合成
                </span>
                <span v-if="scope.row.score_source == 1">
                  统考
                </span>
                <span v-if="scope.row.score_source == 5">
                  免考
                </span>
                 <span v-if="scope.row.score_source == 6">
                  转入
                </span>
                <span v-if="scope.row.score_source == 14">
                  违规
                </span>
                <span v-if="scope.row.score_source == 15">
                  作弊
                </span>
              </template>
          </el-table-column>
          <el-table-column
            prop="out_remark"
            label="备注"
            width="100">
          </el-table-column>
          <!-- <el-table-column
            prop=""
            label="性质"
            width="250">
             <template slot-scope="scope">
               <span v-if="scope.row.final_score != scope.row.origin_score">
                  合成
                </span>
                <span v-if="scope.row.final_score == scope.row.origin_score">
                  非合成
                </span>
             </template>
          </el-table-column> -->
        </el-table>
      </el-tab-pane>
    </el-tabs>
  </d2-container>
</template>

<script>
import { mapState, mapActions } from "vuex";
import { json } from "body-parser";

export default {
  computed: {
    ...mapState({
      stdReg: state => state.enrol.StdReg,
      StdImageArray: state => state.enrol.StdImageArray,
      FrameParam: state => state.enrol.FrameParam
    }),
    photo_url() {
      this.randomNum = new Date().getTime();
      return `${window.uploadServerUrl}${this.stdReg.photo_url}?${
        this.randomNum
      }`;
    }
  },

  data() {
    return {
      loading: false,
      majorList: null,
      scoreList: [],

      selected_major_id: "",
      is_pass: "1"
    };
  },

  async mounted() {
    this.loading = true;
    this.init();
    this.loading = false;
  },
  methods: {
    //初始化专业
    async init() {
      let res = await this.$http.post(
        "/kj/kjUnifiedScoreDetail/init.htm",
        {},
        this.$http.headers.FORM
      );
      this.majorList = res.data.map.majorList;
      // if(this.majorList.length >= 0)
      //   this.selected_major_id = this.majorList[0].id;
      this.$nextTick(() => {
          this.query();
      });
    },
    async query() {
      //if(!String(this.selected_major_id)){
     //  this.alert("请选择[专业]!");
     //   return;
     // }
      // if(!String(this.is_pass)){
      //   this.alert("请选择[成绩是否合格]!");
      //   return;
      // }
      this.loading = true;
      let res = await this.$http.post(
        "/kj/kjUnifiedScoreDetail/listByStd.htm",
        this.Qs.stringify({
          std_id: this.stdReg.id,
          major_id: this.selected_major_id,
          isPass: this.is_pass
        }),
        this.$http.headers.FORM
      );
      let scoreList = res.data.array;
      for (let index = 0; index < scoreList.length; index++) {
        let item = scoreList[index];
        item.final_score = String(item.final_score);
        
      }
      this.scoreList = scoreList;
      this.loading = false;
    }
  }
};
</script>

<style lang="scss" scoped>
@import "~@/assets/style/public.scss";
</style>
