|
@@ -6,8 +6,14 @@
|
|
|
<div class="title">{{ `(${option[checkJson.type].name})` + checkJson.title }}</div>
|
|
|
<div class="choices">
|
|
|
<div class="choice" v-for="(item, index) in checkJson.array" :key="index">
|
|
|
- <div class="choice_c" v-if="checkJson.type == 2"><el-checkbox v-model="checkJson.answer2" :label="index" :disabled="checktype == 2"></el-checkbox><span @click="check(checkJson.type,index)">{{ item.option }}</span></div>
|
|
|
- <div class="choice_c" v-if="checkJson.type == 1"><el-radio v-model="checkJson.answer2[0]" :label="index" :disabled="checktype == 2"></el-radio><span @click="check(checkJson.type,index)">{{ item.option }}</span></div>
|
|
|
+ <div class="choice_c" v-if="checkJson.type == 2"><el-checkbox v-model="checkJson.answer2" :label="index"
|
|
|
+ :disabled="checktype == 2"></el-checkbox><span
|
|
|
+ :class="{ right: see && cJson.answer.indexOf(index) != -1 }"
|
|
|
+ @click="check(checkJson.type, index)">{{ item.option }}</span></div>
|
|
|
+ <div class="choice_c" v-if="checkJson.type == 1"><el-radio v-model="checkJson.answer2[0]" :label="index"
|
|
|
+ :disabled="checktype == 2"></el-radio><span
|
|
|
+ :class="{ right: see && cJson.answer.indexOf(index) != -1 }"
|
|
|
+ @click="check(checkJson.type, index)">{{ item.option }}</span></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -23,6 +29,10 @@ export default {
|
|
|
checktype: {
|
|
|
type: Number,
|
|
|
default: 1
|
|
|
+ },
|
|
|
+ see: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
}
|
|
|
},
|
|
|
data() {
|
|
@@ -31,12 +41,12 @@ export default {
|
|
|
1: { name: '单选题' },
|
|
|
2: { name: '多选题' }
|
|
|
},
|
|
|
- checkJson:undefined
|
|
|
+ checkJson: undefined
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
checkJson: {
|
|
|
- handler(newValue){
|
|
|
+ handler(newValue) {
|
|
|
this.$emit('update:cJson', newValue)
|
|
|
},
|
|
|
deep: true
|
|
@@ -46,23 +56,23 @@ export default {
|
|
|
depthCopy(s) {
|
|
|
return JSON.parse(JSON.stringify(s));
|
|
|
},
|
|
|
- check(type,index){
|
|
|
- if(this.checktype == 2){
|
|
|
+ check(type, index) {
|
|
|
+ if (this.checktype == 2) {
|
|
|
return;
|
|
|
}
|
|
|
- if(type == 2){
|
|
|
- if(this.checkJson.answer2.indexOf(index) == -1){
|
|
|
+ if (type == 2) {
|
|
|
+ if (this.checkJson.answer2.indexOf(index) == -1) {
|
|
|
this.checkJson.answer2.push(index)
|
|
|
- }else{
|
|
|
- this.checkJson.answer2.splice(this.checkJson.answer2.indexOf(index),1)
|
|
|
+ } else {
|
|
|
+ this.checkJson.answer2.splice(this.checkJson.answer2.indexOf(index), 1)
|
|
|
}
|
|
|
- }else if(type == 1){
|
|
|
+ } else if (type == 1) {
|
|
|
this.checkJson.answer2[0] = index
|
|
|
}
|
|
|
this.$forceUpdate()
|
|
|
}
|
|
|
},
|
|
|
- mounted(){
|
|
|
+ mounted() {
|
|
|
this.checkJson = this.cJson ? this.depthCopy(this.cJson) : undefined
|
|
|
}
|
|
|
}
|
|
@@ -73,46 +83,54 @@ export default {
|
|
|
width: 100%;
|
|
|
position: relative;
|
|
|
}
|
|
|
-.mask{
|
|
|
+
|
|
|
+.mask {
|
|
|
position: absolute;
|
|
|
height: 100%;
|
|
|
width: 100%;
|
|
|
z-index: 2;
|
|
|
}
|
|
|
-.choice_box {
|
|
|
-
|
|
|
-}
|
|
|
+
|
|
|
+.choice_box {}
|
|
|
|
|
|
.choice_box>.title {
|
|
|
font-weight: bold;
|
|
|
width: 100%;
|
|
|
word-break: break-all;
|
|
|
}
|
|
|
+
|
|
|
.choice_box>.choices {
|
|
|
- margin-top:10px;
|
|
|
- padding: 0 10px;
|
|
|
+ margin-top: 10px;
|
|
|
+ padding: 0 10px;
|
|
|
}
|
|
|
-.choice_box>.choices >.choice{
|
|
|
+
|
|
|
+.choice_box>.choices>.choice {
|
|
|
word-break: break-all;
|
|
|
}
|
|
|
-.choice_box>.choices >.choice + .choice{
|
|
|
+
|
|
|
+.choice_box>.choices>.choice+.choice {
|
|
|
margin-top: 5px;
|
|
|
}
|
|
|
-.choice_box>.choices >.choice > .choice_c{
|
|
|
+
|
|
|
+.choice_box>.choices>.choice>.choice_c {
|
|
|
display: flex;
|
|
|
}
|
|
|
-.choice_box>.choices >.choice > .choice_c > span{
|
|
|
+
|
|
|
+.choice_box>.choices>.choice>.choice_c>span {
|
|
|
/* margin-left: 10px; */
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
-.choice_box>.choices >.choice > .choice_c > .el-checkbox{
|
|
|
+
|
|
|
+.choice_box>.choices>.choice>.choice_c>.el-checkbox {
|
|
|
margin-top: 4px;
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
-.choice_box>.choices >.choice > .choice_c > .el-radio{
|
|
|
+
|
|
|
+.choice_box>.choices>.choice>.choice_c>.el-radio {
|
|
|
margin-top: 4px;
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
+
|
|
|
.choice_c>>>.el-checkbox__label {
|
|
|
display: none;
|
|
|
}
|
|
@@ -121,28 +139,28 @@ export default {
|
|
|
display: none;
|
|
|
}
|
|
|
|
|
|
-.choice_c .right{
|
|
|
+.choice_c .right {
|
|
|
color: #efa030;
|
|
|
}
|
|
|
-.choice_c .right::after{
|
|
|
+
|
|
|
+.choice_c .right::after {
|
|
|
content: '(正确答案)';
|
|
|
}
|
|
|
|
|
|
-.choice_box>.choices >.choice >>> .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after{
|
|
|
+.choice_box>.choices>.choice>>>.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
|
|
|
border-color: #fff !important;
|
|
|
}
|
|
|
|
|
|
-.choice_box>.choices >.choice >>> .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner{
|
|
|
+.choice_box>.choices>.choice>>>.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
|
|
|
background-color: #409EFF !important;
|
|
|
border-color: #409EFF !important;
|
|
|
}
|
|
|
|
|
|
-.choice_box>.choices >.choice >>> .el-radio__input.is-disabled.is-checked .el-radio__inner{
|
|
|
+.choice_box>.choices>.choice>>>.el-radio__input.is-disabled.is-checked .el-radio__inner {
|
|
|
background-color: #409EFF !important;
|
|
|
border-color: #409EFF !important;
|
|
|
}
|
|
|
|
|
|
-.choice_box>.choices >.choice >>> .el-radio__input.is-disabled.is-checked .el-radio__inner::after{
|
|
|
+.choice_box>.choices>.choice>>>.el-radio__input.is-disabled.is-checked .el-radio__inner::after {
|
|
|
background-color: #fff !important;
|
|
|
-}
|
|
|
-</style>
|
|
|
+}</style>
|