Browse Source

Merge branch 'master' of https://git.cocorobo.cn/CocoRoboLabs/pbl-teacher-table

zengyicheng 2 years ago
parent
commit
9da02d7aa3
1 changed files with 64 additions and 88 deletions
  1. 64 88
      src/components/pages/liveRoom.vue

+ 64 - 88
src/components/pages/liveRoom.vue

@@ -13,18 +13,13 @@
         "
       >
         <div class="logoLive">
-          <img src="../../assets/icon/logo.png" alt="" />
-        </div>
-        <div style="color: #fff; line-height: 45px; padding-left: 15px">
-          人工智能风车实践课程
+          <img src="../../assets/icon/logo.png" alt />
         </div>
+        <div style="color: #fff; line-height: 45px; padding-left: 15px">人工智能风车实践课程</div>
       </div>
     </div>
     <div class="isNoOther">
-      <div
-        class="imgMiddle"
-        :class="type !== 0 || steps > 0 ? 'imghalf' : 'imgMiddle'"
-      >
+      <div class="imgMiddle" :class="type !== 0 || steps > 0 ? 'imghalf' : 'imgMiddle'">
         <!-- <img src="../../assets/icon/kc1.png" alt /> -->
         <iframe
           style="width: 100%; height: 100%; border: none"
@@ -42,25 +37,21 @@
           padding: 0px 0 50px;
         "
       >
-        <div
-          style="background: #fff; height: 92%; width: 96%; margin: 10px auto"
-        >
-          <div
-            style="color: #bfbfbf; padding: 15px 0 20px 25px; font-size: 20px"
-          >
-            答题查看
-          </div>
+        <div style="background: #fff; height: 92%; width: 96%; margin: 10px auto">
+          <div style="color: #bfbfbf; padding: 15px 0 20px 25px; font-size: 20px">答题查看</div>
 
           <div class="answerBox" v-if="type == 1">
             <div class="answerTimuBox" v-for="item in 1" :key="item">
-              <div>
-                {{
+              <div class="choose_style">
+                <!-- {{
                   item
-                }}、小明有3本不同的语文书,2本不同的数学书,4本不同的英语书,小明整理书架时,要把这些书放在同一层,且相同科目的书要相邻摆放,问共有多少种摆放方式?
+                }}、小明有3本不同的语文书,2本不同的数学书,4本不同的英语书,小明整理书架时,要把这些书放在同一层,且相同科目的书要相邻摆放,问共有多少种摆放方式?-->
+                <span>A</span>
+                <span>B</span>
+                <span>C</span>
+                <span>D</span>
               </div>
-              <el-button style="margin: 0 auto" @click="showMember(item)"
-                >开始答题</el-button
-              >
+              <el-button style="margin: 0 auto" @click="showMember(item)">开始答题</el-button>
             </div>
           </div>
           <div class="answerBox" v-else>
@@ -69,9 +60,7 @@
                 :class="{ pAnswer: item.is == 2 }"
                 v-for="(item, index) in studentArray"
                 :key="index"
-              >
-                {{ item.name }}
-              </div>
+              >{{ item.name }}</div>
             </div>
             <div class="memberBox" v-else>
               <div
@@ -79,19 +68,10 @@
                 v-for="(item, index) in studentArray2"
                 :key="index"
                 @click="whoAnswer(item, index)"
-              >
-                {{ 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">
-              查看数据统计
+              >{{ 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>
         </div>
       </div>
@@ -139,37 +119,23 @@
             text-align: center;
             margin-bottom: 20px;
           "
-        >
-          选择工具
-        </div>
+        >选择工具</div>
         <div class="toolList">
           <div class="tools">
             <div>
-              <img
-                src="../../assets/icon/mindNetwork.png"
-                alt=""
-                @click="addTool(7)"
-              />
+              <img src="../../assets/icon/mindNetwork.png" alt @click="addTool(7)" />
             </div>
             <div>思维网格</div>
           </div>
           <div class="tools">
             <div>
-              <img
-                src="../../assets/icon/whiteBoard.png"
-                alt=""
-                @click="addTool(1)"
-              />
+              <img src="../../assets/icon/whiteBoard.png" alt @click="addTool(1)" />
             </div>
             <div>电子白板</div>
           </div>
           <div class="tools">
             <div>
-              <img
-                src="../../assets/icon/note.png"
-                alt=""
-                @click="addTool(2)"
-              />
+              <img src="../../assets/icon/note.png" alt @click="addTool(2)" />
             </div>
             <div>便签</div>
           </div>
@@ -185,13 +151,7 @@
         <div class="blackButton" @click="checkStudentAnswer">选择学生回答</div>
         <div class="blackButton" @click="dialogVisible1 = true">查看作业</div>
       </div>
-      <div
-        class="blackButton"
-        style="margin-right: 10px"
-        @click="dialogVisible2 = true"
-      >
-        查看报告
-      </div>
+      <div class="blackButton" style="margin-right: 10px" @click="dialogVisible2 = true">查看报告</div>
     </div>
     <el-dialog
       title="选择答题"
@@ -201,9 +161,9 @@
       :before-close="handleClose"
       class="dialog_diy"
     >
-      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">
-        是否让“{{ answerStudent }}”同学进行单独答题?
-      </div>
+      <div
+        style="text-align: center; padding: 20px 0 50px 0; font-size: 18px"
+      >是否让“{{ answerStudent }}”同学进行单独答题?</div>
       <div
         style="
           width: 200px;
@@ -217,9 +177,7 @@
           cursor: pointer;
         "
         @click="dialogVisible = false"
-      >
-        确定
-      </div>
+      >确定</div>
     </el-dialog>
     <el-dialog
       :visible.sync="dialogVisible1"
@@ -228,9 +186,7 @@
       :before-close="handleClose"
       class="dialog_diy"
     >
-      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">
-        正在开发中!
-      </div>
+      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">正在开发中!</div>
       <div
         style="
           width: 200px;
@@ -244,9 +200,7 @@
           cursor: pointer;
         "
         @click="dialogVisible1 = false"
-      >
-        确定
-      </div>
+      >确定</div>
     </el-dialog>
     <el-dialog
       :visible.sync="dialogVisible2"
@@ -255,9 +209,7 @@
       :before-close="handleClose"
       class="dialog_diy"
     >
-      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">
-        课程结束后才有报告!
-      </div>
+      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">课程结束后才有报告!</div>
       <div
         style="
           width: 200px;
@@ -271,9 +223,7 @@
           cursor: pointer;
         "
         @click="dialogVisible2 = false"
-      >
-        确定
-      </div>
+      >确定</div>
     </el-dialog>
   </div>
 </template>
@@ -389,14 +339,13 @@ export default {
     },
     //uuid生成
     guid() {
-      return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
-        /[xy]/g,
-        function (c) {
-          var r = (Math.random() * 16) | 0,
-            v = c == "x" ? r : (r & 0x3) | 0x8;
-          return v.toString(16);
-        }
-      );
+      return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (
+        c
+      ) {
+        var r = (Math.random() * 16) | 0,
+          v = c == "x" ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+      });
     },
     time() {
       if (!this.now) {
@@ -690,4 +639,31 @@ export default {
 .anserBoxCss >>> .el-radio__inner {
   border-radius: 0px !important;
 }
+
+.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;
+}
+
+.choose_style .active {
+  color: #fff;
+  background: #5e78fa;
+}
 </style>