修改工具样式

src/components/pages/liveRoom.vue

@@ -21,10 +21,7 @@
       </div>
     </div>
     <div class="isNoOther">
-      <div
-        class="imgMiddle"
-        :class="type !== 0 || steps > 0 || pageBlock > 0 ? 'imghalf' : 'imgMiddle'"
-      >
+      <div class="imgMiddle" :class="isBlock > 0 ? 'imghalf' : 'imgMiddle'">
         <!-- <img src="../../assets/icon/kc1.png" alt /> -->
         <!-- <iframe
           style="width: 100%; height: 100%; border: none"
@@ -37,7 +34,6 @@
         ></pdf>
       </div>
       <div
-        v-if="type == 1 || type == 2"
         style="
           background: #d0d6e4;
           height: 100%;
@@ -46,6 +42,7 @@
           overflow: auto;
           padding: 0px 0 50px;
         "
+        v-if="isBlock == 1 || isBlock == 2 || isBlock == 6"
       >
         <div
           style="background: #fff; height: 92%; width: 96%; margin: 10px auto"
@@ -56,7 +53,7 @@
             答题查看
           </div>
 
-          <div class="answerBox" v-if="type == 1">
+          <div class="answerBox" v-if="isBlock == 1">
             <div class="answerTimuBox" v-for="item in 1" :key="item">
               <div class="choose_style">
                 <!-- {{
@@ -72,8 +69,8 @@
               >
             </div>
           </div>
-          <div class="answerBox" v-else>
-            <div class="memberBox" v-if="answerType == 1">
+          <div class="answerBox" v-if="isBlock == 2 || isBlock == 6">
+            <div class="memberBox" v-if="isBlock == 2">
               <div
                 :class="{ pAnswer: item.is == 2 }"
                 v-for="(item, index) in studentArray"
@@ -82,7 +79,7 @@
                 {{ item.name }}
               </div>
             </div>
-            <div class="memberBox" v-else>
+            <div class="memberBox" v-if="isBlock == 6">
               <div
                 :class="{ pAnswer: item.is == 2 }"
                 v-for="(item, index) in studentArray2"
@@ -92,20 +89,16 @@
                 {{ item.name }}
               </div>
             </div>
-            <div
-              style="color: #948bdc; padding-top: 15px"
-              v-if="answerType == 1"
-            >
-              正在答题......
-            </div>
-            <div class="viewSta" @click="lookData" v-if="answerType == 1">
-              查看数据统计
-            </div>
+            <div style="color: #948bdc; padding-top: 15px" v-if="isBlock == 2">正在答题......</div>
+            <div class="viewSta" @click="isBlock = 3" v-if="isBlock == 2">查看数据统计</div>
+            <span slot="footer" class="dialog-footer sztFooter" v-if="isBlock == 6">
+            <el-button type="primary" @click="isBlock = 0">关闭</el-button>
+            <!-- <el-button type="primary" @click="isBlock = 2">返回</el-button> -->
+          </span>
           </div>
         </div>
       </div>
       <div
-        v-if="type == 3"
         style="
           background: #d0d6e4;
           height: 92%;
@@ -114,6 +107,7 @@
           overflow: auto;
           padding: 0px 0 50px;
         "
+        v-if="isBlock == 3"
       >
         <div
           style="
@@ -123,7 +117,7 @@
             position: relative;
           "
         >
-          <div class="close" @click="(steps = 0), (type = 0),answerType = 0">
+          <div class="close" @click="isBlock = 0">
             <img src="../../assets/icon/close.png" alt />
           </div>
           <div style="color: #bfbfbf; padding: 15px 0 20px 25px">数据统计</div>
@@ -139,8 +133,8 @@
             <AnswerData :problemJson="answerJson"></AnswerData>
           </div>
           <span slot="footer" class="dialog-footer sztFooter">
-            <el-button type="primary" @click="type = 0">下一步</el-button>
-            <el-button type="primary" @click="type = 2">返回</el-button>
+            <el-button type="primary" @click="isBlock = 0">关闭</el-button>
+            <el-button type="primary" @click="isBlock = 2">返回</el-button>
           </span>
         </div>
       </div>
@@ -155,7 +149,7 @@
           position: relative;
           margin: 10px 15px;
         "
-        v-if="toolsList.length > 0"
+        v-if="isBlock == 5"
       >
         <!-- <div
           style="
@@ -209,6 +203,7 @@
           >
             作业评价
           </div>
+          <div class="nextStepOne" @click="isBlock = 0">关闭</div>
         </div>
         <div v-else style="height: 100%; width: 100%">
           <div
@@ -286,8 +281,8 @@
           >
             <div>分小组</div>
           </div>
+          <div class="nextStepOne" @click="nextTool">下一步</div>
         </div>
-        <div class="nextStepOne" @click="nextTool">下一步</div>
         <!-- <div v-if="toolCount == 0" style="height: 90%">
           <iframe
             style="width: 100%; height: 100%; border: none"
@@ -320,7 +315,7 @@
           position: relative;
           margin: 10px 15px;
         "
-        v-if="steps == 2"
+        v-if="isBlock == 4"
       >
         <div
           style="
@@ -349,16 +344,24 @@
             </div>
           </div>
         </div>
-        <div class="returnButton" @click="(steps = 0), (type = 0)">返回</div>
+        <div class="returnButton" @click="isBlock = 0">关闭</div>
       </div>
     </div>
 
     <div class="blackBottomB">
       <div style="display: flex">
-        <div class="blackButton" @click="answerWork" v-if="pageBlock == 3">开始答题</div>
-        <!-- <div class="blackButton" @click="(steps = 1), (type = 0)">查看工具</div> -->
-        <div class="blackButton" @click="checkStudentAnswer" v-if="pageBlock == 8">选择学生回答</div>
-        <div class="blackButton" @click="(steps = 2), (type = 0)" v-if="pageBlock == 11 || pageBlock == 12 ">查看作业</div>
+        <div class="blackButton" @click="answerWork" v-if="steps == 3">
+          开始答题
+        </div>
+        <div
+          class="blackButton"
+          @click="isBlock = 5"
+          v-if="4 <= steps && steps <= 12 && steps != 8 && steps != 11 && steps != 12"
+        >
+          查看工具
+        </div>
+        <div class="blackButton" @click="checkStudentAnswer" v-if="steps == 8">选择学生回答</div>
+        <div class="blackButton" @click="isBlock = 4" v-if="steps == 11 || steps == 12">查看作业</div>
       </div>
       <!-- <div
         class="blackButton"
@@ -474,10 +477,8 @@ export default {
       // a: false,
       // b: false,
       // c: false,
-      type: 0,
       steps: 0,
-      pageBlock:0,
-      answerType: 1,
+      isBlock: 0,
       dialogVisible: false,
       dialogVisible1: false,
       dialogVisible2: false,
@@ -636,16 +637,11 @@ export default {
       }
     },
     nextTool() {
-      if (this.toolsList[0].tools.length > 1) {
-        if (this.howTools < this.toolsList[0].tools.length - 1) {
-          this.howTools++;
-        } else if (this.howTools == this.toolsList[0].tools.length - 1) {
-          this.toolsList = [];
-        }
-      } else {
-        this.toolsList = [];
+      if (this.howTools < this.toolsList[0].tools.length - 1) {
+        this.howTools++;
+      } else if (this.howTools == this.toolsList[0].tools.length - 1) {
+        this.isBlock = 0;
       }
-
       // if (this.toolCount < 2) {
       //   this.toolCount++;
       // } else {
@@ -655,21 +651,17 @@ export default {
       // }
     },
     answerWork() {
-      this.type = 1;
-      this.answerType = 1;
-      this.steps = 0;
+      this.isBlock = 1;
     },
     checkStudentAnswer() {
+      this.isBlock = 6;
       for (var i = 0; i < this.studentArray.length; i++) {
         this.studentArray2[i].is = 1;
       }
-      this.steps = 0;
-      this.type = 2;
-      this.answerType = 2;
     },
     showMember(i) {
-      this.type = 2;
       let _this = this;
+      this.isBlock = 2;
       setTimeout(() => {
         for (var i = 0; i < 10; i++) {
           var a = _this.randomNum(0, _this.studentArray.length - 1);
@@ -703,9 +695,6 @@ export default {
       }, 2000);
     },
     whoAnswer(item, index) {
-      if (this.answerType != 2) {
-        return;
-      }
       for (var i = 0; i < this.studentArray.length; i++) {
         this.studentArray2[i].is = 1;
       }
@@ -713,14 +702,8 @@ export default {
       this.answerStudent = item.name;
       this.dialogVisible = true;
     },
-    lookData() {
-      this.type = 3;
-    },
     howPage(page) {
       this.howTools = 0;
-      this.type = 0;
-      this.steps = 0;
-      this.answerType = 0;
       if (this.toolsList.length > 0) {
         this.toolsList = [];
         this.toolsList.push({ tools: this.tools[page - 1].tools });
@@ -738,7 +721,8 @@ export default {
       this.ajax
         .post(this.$store.state.api + "updatePptPage", params)
         .then((res) => {
-          this.pageBlock = page;
+          this.steps = page;
+          this.isBlock = 0;
           if (page == 3) {
             this.howPage(page);
           } else if (page == 4) {