10-23

src/api/exam.js

@@ -72,4 +72,14 @@ export function commitPaper(paper) {
         data: paper
     })
         .then(res => res.data)
-}
+}
+
+//获取单张组合试卷
+export function getIssuePaperById(id) {
+    return axios.get('/issuePaper/get',{
+        params: {
+            id: id,
+        }
+    })
+    .then(res => res.data);
+}

src/components/controlMainPage/IssuePaperList.vue

@@ -297,7 +297,7 @@ export default {
       })
     },
     checkPaper(id){
-
+      this.$router.push({ path: "/ctrlApp/ctrlMainPage/issueQuestions/" + id })
     }
   }
 }

src/components/controlMainPage/issuePaperList/IQuestionList.vue

@@ -0,0 +1,256 @@
+<style src="@/components/doTest/doTest.scss" lang="scss" scoped></style>
+<style lang="scss" scoped>
+.index-area,.change-area{
+  display: inline-block;
+  vertical-align: top;
+  height: 100%;
+}
+.index-area{
+  width: 60px;
+  border-right: solid 1px #e6e6e6;
+  overflow: auto;
+  /deep/.el-collapse-item__header{
+    padding-left: 5px;
+  }
+  /deep/.el-collapse-item__content{
+    padding-bottom: 0;
+  }
+  ul{
+    margin-bottom: 0;
+    cursor: pointer;
+    li{
+      text-align: center;
+      padding: 5px 0;
+      &:hover,&.choose{
+        background: #e6e6e6;
+      }
+    }
+  }
+}
+.change-area{
+  width: calc(100% - 60px);
+  &>div{
+    display: inline-block;
+    vertical-align: top;
+    padding: 15px;
+    textarea{
+      width: 100%;
+      min-height: 50px;
+      margin: 10px;
+      font-size: 16px;
+      &:first-child{
+        min-height: 200px;
+      } 
+    }
+  }
+  .material-part{
+    width: 400px;
+  }
+  .question-part{
+    width: 100%;
+    &.halfScreen{
+      width: calc(100% - 400px);
+    }
+  }
+}
+/deep/.el-drawer__header{
+  background: #fafafa;
+  padding: 30px;
+  margin-bottom: 0; 
+}
+/deep/.el-drawer__body{
+  height: calc(100% - 60px);
+}
+.dialog-style{
+  div{
+    text-align: center;
+    margin: 5px;
+    /deep/ .el-input{
+      display: inline-block;
+      width: 200px;
+    }
+  }
+}
+</style>
+<template>
+<div>
+  <div class="index-area">
+    <el-collapse v-model="currentSection" accordion>
+      <el-collapse-item v-for="(item,index) in indexRange" :key="index" :title="'M' + String(index + 1)" :name="index + 1">
+        <ul>
+          <li v-for="(ques,i) in paper.issues" :key="i" v-show="currentSection == ques.section || currentSection == ques.section * -1" 
+          :class="{'choose':currentQuestion == i}" @click="changePage(i)">{{i+1}}</li>
+        </ul>
+      </el-collapse-item>
+    </el-collapse>
+  </div>
+  <div class="change-area">
+    <div class="material-part" v-if="indexRange[currentSection - 1].hasLites">
+
+    </div>
+    <div class="question-part" :class="{'halfScreen':indexRange[currentSection - 1].hasLites}">
+      <textarea v-model="paper.issues[currentQuestion].content"></textarea>
+      <textarea v-for="answer in paper.issues[currentQuestion].options" :key="answer.id" v-model="answer.content"></textarea>
+      <br/><br/>
+      <div>
+        答案：<el-checkbox v-for="(answer,index) in paper.issues[currentQuestion].options" :key="index" v-model="answer.correct">{{allOptionList[answer.oindex]}}</el-checkbox>
+      </div>
+      <br/><br/>
+      <el-button @click="drawer = true" type="primary">查看</el-button>
+      <!-- <el-button @click="updateQuestion" type="danger">保存</el-button> -->
+    </div>
+  </div>
+  <el-drawer
+    :visible.sync="drawer"
+    :size="'900px'"
+    :show-close="false"
+    v-if="currentSection != ''">
+    <div class="exam">
+      <div class="material-part" v-if="indexRange[currentSection - 1].hasLites">
+          <div class="triangle-top"><span>材</span><span>料</span></div>
+          <div>
+              <div v-html="paper.issues[currentQuestion].content" class="material-html"></div>
+          </div>
+      </div>
+      <div class="scroll-part" :class="{'halfScreen':indexRange[currentSection - 1].hasLites}">
+          <div class="content-part">
+              <div class="question-area">
+                  <div class="triangle-top"><span>#{{currentQuestion - indexRange[currentSection - 1].min + 1}}</span></div>
+                  <div class="question-html">
+                      <div v-html="paper.issues[currentQuestion].content" class="content-html"></div>
+                  </div>
+              </div>
+              <div>
+                  <div class="answer-area2" v-for="answer in paper.issues[currentQuestion].options" :key="answer.id">
+                      <div :class="{'correct':answer.choose}">
+                          <i :class="{'multiChooseType':paper.issues[currentQuestion].correctNum > 1}">
+                              <img src="@/images/doTest/tick-up.png" v-if="answer.choose">
+                          </i>
+                          <label>{{allOptionList[answer.oindex]}}</label>
+                      </div>
+                      <div v-html="answer.content" class="answer-html" ref="htmlContent">
+                      </div>
+                  </div>
+              </div>
+          </div>
+      </div>
+      <div class="page-part">
+          <button @click="changePage(currentQuestion - 1)">
+              <span id="preLeft"><img src="@/images/doTest/pre.png"></span>
+              <label>上一题</label>
+          </button>
+          <button @click="changePage(currentQuestion + 1)">
+              <label>下一题</label>
+              <span id="nextRight"><img src="@/images/doTest/next.png"></span>
+          </button>
+      </div>
+    </div>
+  </el-drawer>
+  <el-dialog
+    title="提示"
+    :visible.sync="visibleDelete"
+    width="200px">
+    <p class="center-text">确认删除?</p>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="visibleDelete = false">取 消</el-button>
+      <el-button type="primary" >确 定</el-button>
+    </span>
+  </el-dialog>
+</div>
+</template>
+
+<script>
+import { getIssuePaperById , updateQuestion } from "@/api/exam";
+import { OPTION_LIST } from '@/services/constant';
+
+export default {
+  name: 'IssueQuestions',
+  components: {
+  },
+  data () {
+      return {
+        paper: {            //整张试卷数据
+            issues: [{}],
+        },
+        currentQuestion: 0,
+        currentSection: 1,
+        indexRange:[{min: 0,max: 1,hasLites:false}],
+        allOptionList: OPTION_LIST,
+        drawer:false,
+        visibleDelete:false,
+      }
+  },
+  created() {
+    const oScript = document.createElement('script');
+    oScript.type = 'text/javascript';
+    oScript.src = 'mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML';
+    document.body.appendChild(oScript);
+    this.getQuestion(this.$route.params.pid,0);
+  },
+  methods: {
+    getQuestion(pid,index){
+      getIssuePaperById(pid).then((result) => {
+        if(result.result){
+          Object.assign(this.paper,result.t);
+          this.setIndexRange();
+          this.changePage(index);
+        }
+        else{
+          this.$message('获取试卷失败');
+        }
+      })
+    },
+    setIndexRange() {
+        this.indexRange = [];
+        let tempNum = 0,minNum = 0,maxNum = 0;
+        this.paper.issues.forEach((item,index) => {
+          if(index == 0) {tempNum = item.section;}
+          else {
+            if(item.section == tempNum){
+                maxNum++;
+            }
+            else{
+                this.indexRange.push({ min: minNum, max: maxNum})
+                minNum = index;
+                maxNum = index;
+                tempNum = item.section;
+            }
+            if(index == this.paper.issues.length - 1){
+              this.indexRange.push({ min: minNum,max: maxNum})
+            }
+          }
+        });
+        this.indexRange = this.indexRange.map(item => {
+          item.hasLites = this.paper.issues[item.min].lites?true:false
+          return item;
+        })
+    },
+    changePage(page) {
+      if(page >= 0 && page < this.paper.issues.length){
+        this.currentQuestion = page;
+        setTimeout(() => {
+            MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
+        },100);
+      }
+    },
+    // updateQuestion(){
+    //   let answer = this.paper.issues[this.currentQuestion].options.filter(option => {
+    //     return option.correct
+    //   }).map((option) => {
+    //     return this.allOptionList[option.oindex]
+    //   }).join(',');
+    //   this.paper.issues[this.currentQuestion].answer = answer;
+
+    //   console.log(this.paper.issues[this.currentQuestion]);
+
+    //   updateQuestion(this.paper.issues[this.currentQuestion]).then((result) => {
+    //     alert(result.result?'修改成功':'修改失败');
+    //     this.getQuestion(this.$route.params.pid,this.currentQuestion);
+    //   })
+    //   .catch(()=>{
+    //     alert('修改失败');
+    //   })
+    // },
+  },
+}
+</script>

src/router/index.js

@@ -28,6 +28,7 @@ const PaperListSimple = () => import(/* webpackChunkName: "group-controlApp"*/'@
 const DocList = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/controlMainPage/DocList');
 const QuestionList = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/controlMainPage/docList/QuestionList');
 const IssuePaperList = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/controlMainPage/IssuePaperList');
+const IssueQuestions = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/controlMainPage/issuePaperList/IQuestionList');
 const UserList = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/controlMainPage/UserList');
 const FirstEdition = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/report/FirstEdition');
 const PDFTest = () => import(/* webpackChunkName: "group-controlApp"*/'@/components/report/PDFTest');
@@ -164,6 +165,10 @@ export default new Router({
                 path: 'questionList/:pid',
                 name: 'QuestionList',
                 component: QuestionList
+            },{
+                path: 'issueQuestions/:pid',
+                name: 'IssueQuestions',
+                component: IssueQuestions
             }],
         },{
             path: 'firstEdition/:pid/:uid',