<template>
  <div class="analysis-contianer" :style="{minHeight:windowHeight+'px'}" v-if="loaded">
    <div class="analysis-contianer-inner">
      <!-- 头部标题 -->
      <div class="collectBank-box__head">
        <!-- <div class="paper-header-sumbit" @click="save">提交</div> -->
        <van-nav-bar :title="paper_title" left-arrow @click-left="onClickLeft()" class="van-nav-new"/>
      </div>
      <swiper :options="swiperOption" v-if="anliysisList.length">
        <swiper-slide v-for="(item,i) in anliysisList" :key="i">
          <analysis-item :item="item" :level="1"/>
          <div class="score-input" v-if="item.tktype!=6">
            自己评分<van-field v-model="item.new_score" placeholder="请输入分数" class="score-box" @input="JudgeScore(item)"/>
          </div>
          <div v-if="item.tktype==6">
            <div v-for="(child,c) in item.tkinfo.childtk" :key="c">
              <!--组合题部分-->
              <analysis-item
                :item="child"
                :number="`${c+1})`"
                :class="c < item.tkinfo.childtk.length-1 && 'ktj-line'"
              />
              <div class="score-input">
                自己评分<van-field v-model="child.new_score" placeholder="请输入分数" class="score-box" @input="JudgeScore(child)"/>
              </div>
            </div>
          </div>
        </swiper-slide>
      </swiper>
      <Nodata v-else/>
    </div>
    <div class="save-btn">
      <div class="paper-header-sumbit" @click="save">提交</div>
    </div>
  </div>
</template>

<script>
import { PaperSubjective,SubmitGrade } from "@/api/paper";
import AnalysisItem from "./PaperComponent/AnalysisItem";

export default {
  /**试卷解析 */
  name: "PaperAnalysis",
  components: {
    AnalysisItem
  },
  data() {
    return {
      loaded: false,
      windowHeight: window.innerHeight,
      swiperOption: {
        slidesPerView: 1,
        spaceBetween: 0,
        autoHeight: true
      },
      /**答题id */
      answerId: this.$route.query.answerid,
      /**
       * 解析列表
       */
      anliysisList: [],
      paper_title:this.$route.query.title,
    };
  },
  activated() {
    document.title = this.$route.query.title||'自己评分'
    this.anliysisList = [];
    
    let params = {
      answerid: this.answerId,
      paperid:this.$route.query.paperid,
    };
    this.$showLoading();
    PaperSubjective(params).then(res => {
      
      if (res.result) {
        let _anliysisList = [];
        res.data.map(item => {
          if (item.tktype == 6) {
            item.tkinfo.childtk.map(child => {
              /**即时显示答题对错状态 */
              child.showAnswerStatus = true;
              /**禁止改变答案 */
              child.changeAnswer = false;
            });
          }
          /**即时显示答题对错状态 */
          item.showAnswerStatus = true;
          /**禁止改变答案 */
          item.changeAnswer = false;
          _anliysisList.push(item);
        });
        this.anliysisList = _anliysisList;
      }else{
        this.$toast(res.msg).then(() => {
          this.$router.back();
        });
      }
      this.loaded = true;
      this.$hideLoading();
    });
  },
  methods:{
    /**
     * 判断分值
     */
    JudgeScore(item){
      if(Number(item.new_score)>Number(item.score)){
        this.$toast('分值不能超过题目总分')
        item.new_score = item.score
      }
    },
    /**
     * 保存评分
     */
    save(){
      let scorelist=[]
      this.anliysisList.map(item=>{
        let userscore = []
        if(item.tktype==6){
            item.tkinfo.childtk.map((citem,c)=>{
                if(citem.new_score){
                    citem.userscore = citem.new_score
                }
                userscore.push({
                    tkid:c,
                    userscore:citem.userscore
                })
            })
        }else{
            if(item.new_score){
                item.userscore = item.new_score
            }
            userscore.push(item.userscore)
        }
        scorelist.push({
            tkid:item.tkid,
            userscore:userscore
        })
      })
      let data = {
        paperid:this.$route.query.paperid,
        answerid:this.answerId,
        scorelist:scorelist
      }
      this.$showLoading("正在提交");
      SubmitGrade(data).then(res=>{
        this.$hideLoading();
        if(res.result){
          this.$toast("提交成功", "success").then(() => {
              this.$router.push({
                path: "/exam/result",
                query: {
                  id: this.answerId,
                  type:this.$route.query.type,
                  paperid:this.$route.query.paperid,
                  categoryid:this.$route.query.categoryid,
                  title:this.paper_title
                }
            })
          })
        }else{
          this.$toast(res.msg)
        }
      })
    },
    /**返回上一页 */
    onClickLeft() {
      this.$router.go(-1);
    },
  }
};
</script>
<style scoped>
.van-icon-arrow-left {
  color: #4d4c4c !important;
}
.analysis-contianer {
  /* background: #fff; */
  padding-bottom: 2.5rem;
  box-sizing: border-box;
}
.analysis-contianer-inner{
  padding: 0 15px;
  background: #fff;
}
.score-input{
  font-size: 14px;
  margin-bottom: 20px;
}
.score-input .score-box{
  border: 1px solid #ddd;
  display: inline-block;
  width: 30%;
  border-radius: 5px;
  overflow: hidden;
  vertical-align: middle;
  margin-left: 10px;
}
.paper-header-sumbit {
  float: right;
  padding: 0 20px;
  background: #ff795c;
  color: #fff;
  height: 26px;
  line-height: 26px;
  font-size: 12px;
  border-radius: 2px;
  position: relative;
  z-index: 100;
  margin-top: 10px;
}
.save-btn{
  background: #fff;
  height: 2rem;
  position:fixed;
  width: 100%;
  bottom: 0;
  max-width: 480px;
  padding: 0.35rem 0.5rem;
  box-sizing: border-box;
  z-index: 10;
}
.save-btn .paper-header-sumbit{
  margin-top: 0;
}
</style>