<template>
    <div>
    <!-- 阅卷设置 -->
    <el-dialog title="阅卷设置" :visible.sync="remarkSetVisibleTmp" width="80%" @close="closeRemarkDialog">
      <el-tabs v-model="activeSetName" @tab-click="handleClick">
        <el-tab-pane label="客观题设置" name="1">
            <el-form :inline="true" v-model="addQueForm">
                <el-form-item label="题号">
                  <el-input size="mini" v-model="addQueForm.fQno"></el-input>
                </el-form-item>
                <el-form-item label="至">
                  <el-input size="mini" v-model="addQueForm.tQno"></el-input>
                </el-form-item>
                <el-form-item label="分数">
                  <el-input size="mini" v-model="addQueForm.score"></el-input>
                </el-form-item>
                <el-form-item>
                  <el-button size="mini" type="warning" @click="addQues">设置</el-button>
                </el-form-item>
                <el-form-item>
                  <el-button size="mini" type="primary" @click="saveObjectiveQue">保存</el-button>
                </el-form-item>
              </el-form>
              <el-table :data="objectiveQueList">
                  <el-table-column label="序号" prop="qno" width="60px">
                    <template slot-scope="scope">
                      {{scope.$index+1}}
                    </template>
                  </el-table-column>
                  <el-table-column label="题号" prop="qno" width="60px"></el-table-column>
                  <el-table-column label="点选答案" prop="score" width="360px">
                    <template slot-scope="scope">
                      <el-tag v-for="item in ansOptionList" :key="item.label" type="success"
                        :effect="scope.row.stdAns.indexOf(item.value)==-1?'plain':'dark'" @click="setStdAns(scope.row,item)"
                        size="small">
                        {{ item.label }}
                      </el-tag>
                    </template>
                  </el-table-column>
                  <el-table-column label="输入答案" prop="score">
                    <template slot-scope="scope">
                      <el-input v-model="scope.row.stdAns" size="mini" />
                    </template>
                  </el-table-column>
                  <el-table-column label="满分" prop="qtype">
                    <template slot-scope="scope">
                      <el-input type="number" v-model="scope.row.score" size="mini" />
                    </template>
                  </el-table-column>
                  <el-table-column label="部分分" prop="partScore">
                    <template slot-scope="scope">
                      <el-input type="number" v-model="scope.row.partScore" size="mini" />
                    </template>
                  </el-table-column>
              </el-table>
        </el-tab-pane>
        <el-tab-pane label="主观题设置" name="2">
          <el-form :inline="true" v-model="addQueForm">
            <el-form-item label="题号">
              <el-input size="mini" v-model="addQueForm.fQno"></el-input>
            </el-form-item>
            <el-form-item label="至">
              <el-input size="mini" v-model="addQueForm.tQno"></el-input>
            </el-form-item>
            <el-form-item label="分数">
              <el-input size="mini" v-model="addQueForm.score"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button size="mini" type="warning" @click="addQues">设置</el-button>
            </el-form-item>
            <el-form-item>
              <el-button size="mini" type="primary" @click="saveSubjectiveQue">保存</el-button>
            </el-form-item>
          </el-form>
          <el-table :data="subjectiveQueList">
              <el-table-column label="序号" prop="qno" width="60px">
                <template slot-scope="scope">
                  {{scope.$index+1}}
                </template>
              </el-table-column>
              <el-table-column label="题号" prop="qno"></el-table-column>
              <el-table-column label="分数" prop="std_score">
                  <template slot-scope="scope">
                    <el-input size="mini" v-model="scope.row.std_score" />
                  </template>
              </el-table-column>
              <el-table-column label="查看切图" prop="qtype">
                <template slot-scope="scope">
                  <el-button type="text">查看</el-button>
                </template>
              </el-table-column>
              <el-table-column label="单双评" prop="mark_mode">
                <template slot-scope="scope">
                    <el-select v-model="scope.row.mark_mode" size="mini">
                      <el-option label="单评" value="单评">单评</el-option>
                      <el-option label="双评" value="双评">双评</el-option>
                      <el-option label="多评" value="多评">多评</el-option>
                    </el-select>
                </template>
              </el-table-column>
              <el-table-column label="双评阈值" prop="mark_diffmax">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.mark_diffmax" type="text" size="mini"></el-input>
                </template>
              </el-table-column>
              <el-table-column label="小题设置" prop="score">
                <template slot-scope="scope">
                  <span style="color:#67c23a;" v-if="scope.row.sub_que_list.length>1">已设置</span>
                  <span v-else>未设置</span>  
                  <i class="el-icon-setting" @click="setSubQue(scope.row,scope.$index)"></i>
                </template>
              </el-table-column>
              <el-table-column label="给分点" prop="score">
                <template slot-scope="scope">
                  <span style="color:#67c23a;" v-if="scope.row.mark_points.mark_points">已设置</span>
                  <span v-else>未设置</span>  
                  <i class="el-icon-setting" @click="setMarkPoints(scope.row,scope.$index)"></i>
                </template>
              </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="分配阅卷员" name="3">
            <el-form :inline="true" v-model="addQueForm">
              <el-form-item>
                <el-button size="mini" type="primary" @click="saveSubjectiveQue">全选</el-button>
              </el-form-item>
              <el-form-item>
                <el-button size="mini" @click="saveSubjectiveQue">全不选</el-button>
              </el-form-item>
              <el-form-item>
                <el-button size="mini" type="primary" @click="saveSubjectiveQue">保存设置</el-button>
              </el-form-item>
            </el-form>
            <el-table :data="subjectiveMarkTeacherList">
                <el-table-column label="教工号" prop="phone" width="80px"></el-table-column>
                <el-table-column label="姓名" prop="realname" width="80px"></el-table-column>
                <el-table-column label="阅卷权限" prop="role_name" width="300px">
                    <el-checkbox-group v-model="checkList">
                      <el-checkbox label="科目组长"></el-checkbox>
                      <el-checkbox label="评卷仲裁"></el-checkbox>
                      <el-checkbox label="评卷教师"></el-checkbox>
                    </el-checkbox-group>
                </el-table-column>
                <el-table-column label="试题分配" prop="qtype">
                    <el-checkbox-group v-model="checkList">
                      <el-checkbox v-for="(item,index) in subjectiveQueList" :label="item.qno"></el-checkbox>
                    </el-checkbox-group>
                </el-table-column>
            </el-table>
        </el-tab-pane>
      </el-tabs>
      <!--小题设置-->
      <el-dialog title="小题设置" :visible.sync="subQueSetVisible" width="50%" @close="closeSubQueDialog" append-to-body>
          <el-table :data="curSubQueList">
              <el-table-column label="序号" prop="qno" width="60px">
                <template slot-scope="scope">
                  {{scope.$index+1}}
                </template>
              </el-table-column>
              <el-table-column label="题号" prop="qno">
                  <template slot-scope="scope">
                    <el-input size="mini" v-model="scope.row.qno" />
                  </template>
              </el-table-column>
              <el-table-column label="分数" prop="std_score">
                  <template slot-scope="scope">
                    <el-input size="mini" v-model="scope.row.std_score" />
                  </template>
              </el-table-column>
              <el-table-column label="阈值" prop="mark_diffmax">
                  <template slot-scope="scope">
                    <el-input size="mini" v-model="scope.row.mark_diffmax" />
                  </template>
              </el-table-column>
          </el-table>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="saveSubQue" size="mini">确定</el-button>
            <el-button type="" @click="closeSubQueDialog" size="mini">取消</el-button>
          </div>
      </el-dialog>
      <!--给分点设置-->
      <el-dialog title="给分点设置" :visible.sync="markPointsSetVisible" width="50%" @close="closeSubQueDialog" append-to-body>
          <el-row :gutter="20">
            <el-col :span="6">
              <el-select v-model="curMarkPoints.mark_type">
                <el-option label="步长值" value="step"></el-option>
                <el-option label="给分点" value="points"></el-option>
              </el-select>
            </el-col>
            <el-col :span="18">
              <el-input v-model="curMarkPoints.mark_points" />
            </el-col>
          </el-row>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="saveMarkPoints" size="mini">确定</el-button>
            <el-button type="" @click="closeMarkPointsDialog" size="mini">取消</el-button>
          </div>
      </el-dialog>
    </el-dialog>
    </div>
</template>

<script>
export default {
    compnets:{},
    props:["remarkSetVisible","taskId","paperId"],
    data(){
        return {
            activeSetName: "1",
            addQueForm:{},
            objectiveQueList:[],
            subjectiveQueList:[],
            subjectiveMarkTeacherList:[],
            checkList:[],
            remarkSetVisibleTmp:this.remarkSetVisible,
            curTaskId:this.taskId,
            curPaperId:this.paperId,
            ansOptionList: [{
              label: "A",
              value: "A",
              flag: 0
            },
            {
              label: "B",
              value: "B",
              flag: 0
            },
            {
              label: "C",
              value: "C",
              flag: 0
            },
            {
              label: "D",
              value: "D",
              flag: 0
            },
            {
              label: "E",
              value: "E",
              flag: 0
            },
            {
              label: "F",
              value: "F",
              flag: 0
            },
            {
              label: "G",
              value: "G",
              flag: 0
            }
          ],
          subQueSetVisible:false,
          curSubQueList:[],
          curRowIndex:0,
          curMarkPoints:{mark_type:"step"},
          markPointsSetVisible:false,
        }
    },
    watch:{
        remarkSetVisible(){
            this.remarkSetVisibleTmp = this.remarkSetVisible
            this.curTaskId = this.taskId
            this.curPaperId = this.paperId
            this.getPaperPieces(this.activeSetName,this.curPaperId,this.curTaskId)
        },
    },
    methods:{
        closeRemarkDialog() {
            this.remarkSetVisibleTmp = false;
            this.$emit("close")
            this.fileList = []
        },
        closeSubQueDialog(){
            this.subQueSetVisible = false;
        },
        closeMarkPointsDialog(){
            this.markPointsSetVisible = false;
        },
        handleClick(){
          this.getPaperPieces(this.activeSetName,this.curPaperId,this.curTaskId);
          this.getMarkPaperTeachers();
        },
        addQues(){

        },
        getPaperPieces(quetype,paper_id,task_id){
          this.$api.getStdQueList({"quetype":quetype,"paper_id":paper_id,"task_id":task_id}).then(res=>{
            if(quetype==1){
              // this.objectiveQueList = [];
              // res.data.data.forEach((item,index)=>{
              //   item.forEach((iitem,iindex)=>{
              //     this.objectiveQueList.push(iitem)
              //   })
              // })
              this.objectiveQueList = res.data.data;
            }else{
              this.subjectiveQueList = res.data.data;
            }
          })
        },
        // 获取阅卷老师列表
        getMarkPaperTeachers(){
          this.$api.getSchoolUser().then(res=>{
            this.subjectiveMarkTeacherList = res.data.data;
          })
        },
        setStdAns(row, item) {
          let orgAns = row.stdAns.split(",")
          orgAns = orgAns.filter((item) => {
            return item.length > 0
          })
          if (orgAns.indexOf(item.value) == -1) {
            orgAns.push(item.value)
          } else {
            orgAns.splice(orgAns.indexOf(item.value), 1)
          }
          row.stdAns = orgAns.join(",")
        },
        setSubQue(row,index){
          this.subQueSetVisible = true;
          if(row.sub_que_list && row.sub_que_list.length>0){
            this.curSubQueList = row.sub_que_list;
          }else{
            let subQueList = []
            row.qno.split("-").forEach((item,index)=>{
              subQueList.push({
                qno:item,
                std_score:0,
                mark_diffmax:0
              })
            })
            this.curSubQueList = subQueList;
          }
          this.curRowIndex = index
        },
        setMarkPoints(row,index){
          this.markPointsSetVisible = true;
          if(row.mark_points.mark_points){
            this.curMarkPoints = row.mark_points;
          }else{
            this.curMarkPoints = {"mark_type":"step"}
          }
        },
        saveSubQue(){
          this.subjectiveQueList[this.curRowIndex].sub_que_list = this.curSubQueList;
          this.subQueSetVisible = false
        },
        saveMarkPoints(){
          this.subjectiveQueList[this.curRowIndex].mark_points = this.curMarkPoints;
          this.markPointsSetVisible = false
        },
        saveObjectiveQue(){
          this.$api.saveTaskObjectiveQue({task_id:this.curTaskId,paper_id:this.curPaperId,objectiveQueList:this.objectiveQueList}).then(res=>{
              if(!res.data.code){
                this.msgSuccess("成功!");
                this.getPaperPieces(this.activeSetName,this.curPaperId,this.curTaskId)
              }
          })
        },
        saveSubjectiveQue(){
          this.$api.saveSubjectiveQue({paper_id:this.curPaperId,subjectiveQueList:this.subjectiveQueList}).then(res=>{
              if(!res.data.code){
                this.msgSuccess("成功!");
                this.getPaperPieces(this.activeSetName,this.curPaperId,this.curTaskId)
              }
          })
        },
    },
    created(){
      console.log(this.curTaskId,333333333333)

    }
}
</script>
<style lang="scss">
    
</style>