|
|
@@ -96,7 +96,7 @@
|
|
|
选择工具
|
|
|
</div>
|
|
|
<div class="answerBox" v-if="steps == 1">
|
|
|
- <div>
|
|
|
+ <!-- <div>
|
|
|
<span class="timuButton">题目</span>
|
|
|
<span style="letter-spacing: 3px; line-height: 35px"
|
|
|
>小明有3本不同的语文书，2本不同的数学书，4本不同的英语书，小明整理书架时，要把这些书放在同一层，且相同科目的书要相邻摆放，问共有多少种摆放方式？</span
|
|
|
@@ -110,7 +110,49 @@
|
|
|
<span slot="footer" class="dialog-footer sztFooter">
|
|
|
<el-button type="primary" @click="answerQue">确定</el-button>
|
|
|
</span>
|
|
|
- <div class="nextStepOne" @click="answerWork">下一步</div>
|
|
|
+ <div class="nextStepOne" @click="answerWork">下一步</div> -->
|
|
|
+ <div class="answerBox" v-if="steps == 1">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ "
|
|
|
+ v-for="item in 1"
|
|
|
+ :key="item"
|
|
|
+ >
|
|
|
+ <div class="choose_style">
|
|
|
+ <!-- {{
|
|
|
+ item
|
|
|
+ }}、小明有3本不同的语文书，2本不同的数学书，4本不同的英语书，小明整理书架时，要把这些书放在同一层，且相同科目的书要相邻摆放，问共有多少种摆放方式？-->
|
|
|
+ <span
|
|
|
+ @click="isChooseActive(1)"
|
|
|
+ :class="typeC.indexOf(1) != -1 ? 'isChoose' : ''"
|
|
|
+ >A</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ @click="isChooseActive(2)"
|
|
|
+ :class="typeC.indexOf(2) != -1 ? 'isChoose' : ''"
|
|
|
+ >B</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ @click="isChooseActive(3)"
|
|
|
+ :class="typeC.indexOf(3) != -1 ? 'isChoose' : ''"
|
|
|
+ >C</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ @click="isChooseActive(4)"
|
|
|
+ :class="typeC.indexOf(4) != -1 ? 'isChoose' : ''"
|
|
|
+ >D</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-button style="margin: 0 auto" @click="showMember(item)"
|
|
|
+ >开始答题</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="answerBox" v-if="steps == 2">
|
|
|
<div class="toolList">
|
|
|
@@ -340,6 +382,7 @@ export default {
|
|
|
noneBtnImg: false,
|
|
|
proVisible: false,
|
|
|
progress: 0,
|
|
|
+ typeC: [],
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -413,6 +456,24 @@ export default {
|
|
|
answerQue() {
|
|
|
this.dialogVisible = true;
|
|
|
},
|
|
|
+ isChooseActive(t) {
|
|
|
+ if (this.typeC.length == 0) {
|
|
|
+ this.typeC.push(t);
|
|
|
+ } else {
|
|
|
+ if (this.typeC.indexOf(t) != -1) {
|
|
|
+ this.typeC.splice(this.typeC.indexOf(t), 1);
|
|
|
+ } else {
|
|
|
+ this.typeC.push(t);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ showMember(i) {
|
|
|
+ if (this.typeC.length > 0) {
|
|
|
+ this.steps = 2;
|
|
|
+ } else {
|
|
|
+ this.$message.error("至少选择一个答案！");
|
|
|
+ }
|
|
|
+ },
|
|
|
addImg(e) {
|
|
|
var el = e.currentTarget;
|
|
|
el.getElementsByTagName("input")[0].click();
|
|
|
@@ -799,4 +860,30 @@ export default {
|
|
|
.logoLive {
|
|
|
width: 35px;
|
|
|
}
|
|
|
+.choose_style {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ margin: 10px 0 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.choose_style span {
|
|
|
+ background: #f8f9ff;
|
|
|
+ color: #677fff;
|
|
|
+ border: 1px solid #95b5ff;
|
|
|
+ padding: 15px 20px;
|
|
|
+ font-size: 25px;
|
|
|
+ border-radius: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.choose_style span + span {
|
|
|
+ margin-left: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.isChoose {
|
|
|
+ color: #fff !important;
|
|
|
+ background: #5e78fa !important;
|
|
|
+}
|
|
|
</style>
|
zengyicheng