考试增加对图片的支持

This commit is contained in:
daihh
2022-12-23 16:53:23 +08:00
parent c12a58558d
commit 9aa7d6bcf7

View File

@@ -11,8 +11,7 @@
<ul>
<li>考试时长: {{ testPaper.testDuration }}分钟</li>
<li>及格线: {{ testPaper.passLine }}</li>
<li v-if="testPaper.entranceTime">开始时间:
{{ testPaper.entranceTime }}</li>
<li v-if="testPaper.entranceTime">开始时间:{{ testPaper.entranceTime }}</li>
<li v-if="testPaper.times">尝试次数: {{ testPaper.times }}</li>
<li v-if="testPaper.deadlineTime">结束时间: {{ testPaper.deadlineTime }}</li>
</ul>
@@ -72,7 +71,10 @@
<div v-if="judge.length > 0">
<div class="question-type">判断题</div>
<div v-for="(question, i) in judge" :key="question.id" class="question-info">
<div>{{ i + 1 }}{{ question.title }} {{question.defaultScore}}</div>
<div>
<div> {{ i + 1 }}{{ question.title }} {{question.defaultScore}}</div>
<div v-if="question.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+question.images"/> </div>
</div>
<div>
<div class="question-option">
<el-radio v-model="question.userAnswer" label="true">正确</el-radio>
@@ -86,12 +88,14 @@
<div v-if="single.length > 0">
<div class="question-type">单选题</div>
<div v-for="(question, i) in single" :key="question.id" class="question-info">
<div>{{ i + 1 + judge.length }}{{ question.title }}{{question.defaultScore}}</div>
<div>
<div>{{ i + 1 + judge.length }}{{ question.title }}{{question.defaultScore}}</div>
<div v-if="question.images" class="qimg"><img class="qimg-fit" object-fit="contain" :src="imageBaseUrl+question.images"/> </div>
</div>
<div>
<div class="question-option" v-for="(option, j) in question.optionList" :key="option.id">
<el-radio v-model="question.userAnswer":label="option.id">
{{ numberToLetter(j+1) }}{{ option.content }}
</el-radio>
<el-radio v-model="question.userAnswer":label="option.id">{{ numberToLetter(j+1) }}{{ option.content }}</el-radio>
<div v-if="option.images" class="qimg"><img class="qimg-fit" object-fit="contain" :src="imageBaseUrl+option.images"/></div>
</div>
</div>
</div>
@@ -100,12 +104,14 @@
<div class="question-type">多选题</div>
<div v-for="(question, i) in multiple" :key="question.id" class="question-info">
<div>
{{ i + 1 + judge.length + single.length }}{{ question.title }}{{question.defaultScore}}
<div> {{ i + 1 + judge.length + single.length }}{{ question.title }}{{question.defaultScore}}</div>
<div v-if="question.images"><img class="img-fit" :src="imageBaseUrl+question.images"/> </div>
</div>
<div>
<el-checkbox-group v-model="question.userAnswer">
<div class="question-option" v-for="(option, j) in question.optionList" :key="option.id">
<el-checkbox :label="option.id">{{ numberToLetter(j + 1) }}{{ option.content }}</el-checkbox>
<el-checkbox :label="option.id">{{ numberToLetter(j + 1) }}{{ option.content }}</el-checkbox>
<div v-if="option.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+option.images"/></div>
</div>
</el-checkbox-group>
</div>
@@ -122,11 +128,14 @@
<el-button type="primary" @click="closeTest()">关闭</el-button>
</div>
</div>
<div v-if="showPaperAnser === true">
<div v-if="showPaperAnser === true">
<div v-if="judge.length > 0" style="margin-top:20px">
<div class="question-type">判断题</div>
<div v-for="(question, i) in judge" :key="question.id" class="question-info">
<div>{{ i + 1 }}{{ question.title }} {{question.defaultScore}}</div>
<div>
<div>{{ i + 1 }}{{ question.title }} {{question.defaultScore}}</div>
<div v-if="question.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+question.images"/> </div>
</div>
<div>
<div class="question-option">
<el-radio v-model="question.userAnswer" disabled :label="true">正确</el-radio>
@@ -143,10 +152,15 @@
<div v-if="single.length > 0">
<div class="question-type">单选题</div>
<div v-for="(question, i) in single" :key="question.id" class="question-info">
<div>{{ i + 1 + judge.length }}{{ question.title }}{{question.defaultScore}}</div>
<div>
<div> {{ i + 1 + judge.length }}{{ question.title }}{{question.defaultScore}}</div>
<div v-if="question.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+question.images"/> </div>
</div>
<div>
<div class="question-option" v-for="(option, j) in question.optionList" :key="option.id">
<el-radio disabled v-model="question.userAnswer" :label="option.id" >{{ numberToLetter(j+1) }}{{ option.content }}</el-radio>
<el-radio disabled v-model="question.userAnswer" :label="option.id" >
{{ numberToLetter(j+1) }}{{ option.content }}</el-radio>
<div v-if="option.images" class="qimg"> <img class="qimg-fit":src="imageBaseUrl+option.images"/></div>
</div>
</div>
<p v-if="testPaper.showAnswer">正确答案:<span v-for="(item,a) in question.optionList" :key="a">{{item.isAnswer?numberToLetter(a+1):''}}</span></p>
@@ -157,13 +171,14 @@
<div class="question-type">多选题</div>
<div v-for="(question, i) in multiple" :key="question.id" class="question-info">
<div>
{{ i + 1 + judge.length + single.length }}{{ question.title }}{{question.defaultScore}}
<div> {{ i + 1 + judge.length + single.length }}{{ question.title }}{{question.defaultScore}}</div>
<div v-if="question.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+question.images"/> </div>
</div>
<div>
<el-checkbox-group v-model="question.userAnswer">
<div class="question-option" v-for="(option, j) in question.optionList" :key="option.id">
<el-checkbox disabled
:label="option.id">{{ numberToLetter(j + 1) }}{{ option.content }}</el-checkbox>
<el-checkbox disabled :label="option.id">{{ numberToLetter(j + 1) }}{{ option.content }}</el-checkbox>
<div v-if="option.images" class="qimg"> <img class="qimg-fit" :src="imageBaseUrl+option.images"/></div>
</div>
</el-checkbox-group>
</div>
@@ -178,11 +193,15 @@
<el-dialog title="查看试卷" append-to-body :visible.sync="viewUserPapereShow" width="70%" custom-class="g-dialog">
<div style="padding: 10px; font-size: 20px" class="upaper">
<div v-for="(ditem,didx) in paperDetailData" :key="didx" class="upaper-item">
<div class="upaper-item-q">{{didx +1}}.{{getTypeName(ditem.type)}}{{ditem.title}}</div>
<div class="upaper-item-q">
<div> {{didx +1}}.{{getTypeName(ditem.type)}}{{ditem.title}}</div>
<div v-if="ditem.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+ditem.images"/> </div>
</div>
<div class="upaper-item-opts" style="padding-left: 20px;">
<div v-for="(opt,optIdx) in ditem.optionList" :key="optIdx" class="upaper-item-opt" :class="{'upaper-item-opt-user':ditem.userOptIdxs.indexOf(optIdx)>-1}">
<div>
<div>{{numberToLetter(optIdx+1)}}, {{opt.content}}</div>
<div v-if="opt.images" class="qimg"><img class="qimg-fit" :src="imageBaseUrl+opt.images"/> </div>
</div>
<div>
<span v-if="ditem.userOptIdxs.indexOf(optIdx)>-1 && ditem.correctOptIdxs.indexOf(optIdx)>-1" style="color: #00aa00;font-size: 25px; "></span>
@@ -239,6 +258,7 @@ export default {
data() {
return {
loading:0,
imageBaseUrl:process.env.VUE_APP_FILE_BASE_URL,
toScoreTow,
examId:'',//考试的id
taskId:'',//考试任务的id
@@ -305,7 +325,7 @@ export default {
if(this.$route.query.refType){
this.refType = this.$route.query.refType;
}
if(this.examId) {
this.loadData()
}else{
@@ -966,7 +986,7 @@ export default {
}
.test-info {
// text-align: center;
width: 500px;
width: 600px;
margin: 0 auto;
background: #eee;
border-radius: 16px;
@@ -986,6 +1006,15 @@ export default {
margin: 0 20px;
}
}
.qimg{
padding-left: 30px;
width:100%;
.qimg-fit{
width:100%;
object-fit:scale-down
}
}
.question-type {
font-weight: 500;
font-size: 20px;