app

src/App.vue

@@ -1,7 +1,10 @@
 <template>
-	<div id="app" :class="{appNoWidth:$route.path == '/data' || $route.path == '/note' || $route.path == '/works'}">
-		<!-- <div class="app_head" :class="{stuWidth:$route.path == '/student'}"> -->
-		<!-- <div class="logo" @click="goTo('/course')"></div>
+  <div
+    id="app"
+    :class="{appNoWidth:$route.path == '/data' || $route.path == '/note' || $route.path == '/works'}"
+  >
+    <!-- <div class="app_head" :class="{stuWidth:$route.path == '/student'}"> -->
+    <!-- <div class="logo" @click="goTo('/course')"></div>
       <span style="margin-left: 10px; color: #fff; font-weight: 600" @click="goTo('/course')"
         >PBL项目管理平台</span
       >
@@ -21,299 +24,297 @@
             >退出</el-button
           >
         </div>
-      </div> -->
-		<!-- </div> -->
-		<div :class="{gHeight: $route.path == '/Grid'}" style="width:100%;height:100%">
-			<!-- main 内容 -->
-			<keep-alive v-if="$route.meta.keepAlive">
-				<!-- 这里是会被缓存的视图组件 -->
-				<router-view
-					v-if="$route.meta.keepAlive"
-					:class="{ pb_body: isShowNav }"
-				/>
-			</keep-alive>
-			<!-- 这里是不被缓存的视图组件 -->
-			<router-view
-				v-if="!$route.meta.keepAlive"
-				:class="{ pb_body: isShowNav }"
-			/>
+    </div>-->
+    <!-- </div> -->
+    <div
+      :class="{gHeight: $route.path == '/Grid'}"
+      style="width:100%;height:100%"
+      :style="{overflow: $route.path == '/liveRoom'?'hidden':''}"
+    >
+      <!-- main 内容 -->
+      <keep-alive v-if="$route.meta.keepAlive">
+        <!-- 这里是会被缓存的视图组件 -->
+        <router-view v-if="$route.meta.keepAlive" :class="{ pb_body: isShowNav }" />
+      </keep-alive>
+      <!-- 这里是不被缓存的视图组件 -->
+      <router-view v-if="!$route.meta.keepAlive" :class="{ pb_body: isShowNav }" />
 
-			<!-- 底部导航 -->
-			<!-- <footer-nav
+      <!-- 底部导航 -->
+      <!-- <footer-nav
 				v-if="isShowNav"
 				:luyou="this.$store.state.luyou"
-			></footer-nav> -->
-		</div>
-	</div>
+      ></footer-nav>-->
+    </div>
+  </div>
 </template>
 
 <script>
-	// import leftBar from "./components/tools/leftBar";
-	import { Message } from "element-ui";
-	export default {
-		name: "App",
-		data() {
-			return {
-				isShowNav: true, // 是否显示导航 Tab
-				navTabs: [
-					"/class",
-					"/course",
-					"/data",
-					"/notice",
-					"/student",
-					"/works",
-					"/worksDetail",
-					"/course/courseDetail",
-					"/library",
-					"/classRoom",
-					"/liveRoom",
-					// "/course/addCourse",
-					// "/ask",
-					// "/ask/askList",
-				], // 导航
-			};
-		},
-		// components: {
-		//   "footer-nav": leftBar,
-		// },
-		created: function () {
-			this.routerP();
-			// this.getnCount();
-			setInterval(() => {
-				// this.getnCount();
-			}, 60000);
-		},
-		methods: {
-			isLogin() {
-				const loading = this.$loading.service({
-					background: "rgba(255, 255, 255)",
-					target: document.querySelector("body"),
-				});
-				var _isLogin = this.$cookies.get("tlogin");
-				var userInfo = this.$cookies.get("teacherInfo");
-				// if (_isLogin == "1" && userInfo) {
-				loading.close();
-				this.$store.commit("update", ["isLogin", true]);
-				// var info = JSON.parse(window.sessionStorage.getItem("userInfo"));
-				this.$store.commit("update", ["userInfo", userInfo]);
-				let router_path = this.$route.path;
-				if (router_path == "/") {
-					this.$router.push("/course");
-				}
-				// } else {
-				//   this.$store.commit("update", ["isLogin", false]);
-				//   Message({
-				//     message: "未登录，请登录",
-				//     type: "warning",
-				//   });
-				//   setTimeout(() => {
-				//     loading.close();
-				//     this.$router.push("/login");
-				//   }, 2000);
-				// }
-			},
-			getnCount() {
-				let params = {
-					bid: this.$store.state.userInfo.userid,
-				};
-				this.ajax
-					.get(this.$store.state.api + "getNcount", params)
-					.then((res) => {
-						console.log(res);
-						if (res.data[0].length > 0) {
-							this.$store.commit("update", ["nCount", res.data[0][0].num]);
-						} else {
-							this.$store.commit("update", ["nCount", 0]);
-						}
-					})
-					.catch((err) => {
-						console.error(err);
-					});
-			},
-			routerP() {
-				const { navTabs } = this.$data;
-				let router_path = this.$route.path;
-				console.log(router_path);
-				if (router_path != "/login") {
-					this.isLogin();
-				}
-				var a = 0;
-				for (var i = 0; i < navTabs.length; i++) {
-					if (router_path == navTabs[i]) {
-						this.isShowNav = true;
-						a = 1;
-						break;
-					}
-				}
-				if (a == 0) {
-					this.isShowNav = false;
-				}
-			},
-			exit() {
-				sessionStorage.clear();
-				this.$cookies.remove("tlogin");
-				this.$cookies.remove("teacherInfo");
-				this.$store.commit("update", ["isLogin", false]);
-				this.$store.commit("update", ["userInfo", {}]);
-				Message({
-					message: "退出成功",
-					type: "success",
-				});
-				this.$router.push("/login");
-			},
-			goTo(path) {
-				this.$router.push(path);
-			},
-		},
-		watch: {
-			$route(to, from) {
-				const { navTabs } = this.$data;
-				const toPath = to.path;
-				const fromName = from.name;
-				var a = 0;
-				for (var i = 0; i < navTabs.length; i++) {
-					if (toPath == navTabs[i]) {
-						this.isShowNav = true;
-						a = 1;
-						break;
-					}
-				}
-				if (a == 0) {
-					this.isShowNav = false;
-				}
-			},
-		},
-	};
+// import leftBar from "./components/tools/leftBar";
+import { Message } from "element-ui";
+export default {
+  name: "App",
+  data() {
+    return {
+      isShowNav: true, // 是否显示导航 Tab
+      navTabs: [
+        "/class",
+        "/course",
+        "/data",
+        "/notice",
+        "/student",
+        "/works",
+        "/worksDetail",
+        "/course/courseDetail",
+        "/library",
+        "/classRoom",
+        "/liveRoom",
+        // "/course/addCourse",
+        // "/ask",
+        // "/ask/askList",
+      ], // 导航
+    };
+  },
+  // components: {
+  //   "footer-nav": leftBar,
+  // },
+  created: function () {
+    this.routerP();
+    // this.getnCount();
+    setInterval(() => {
+      // this.getnCount();
+    }, 60000);
+  },
+  methods: {
+    isLogin() {
+      const loading = this.$loading.service({
+        background: "rgba(255, 255, 255)",
+        target: document.querySelector("body"),
+      });
+      var _isLogin = this.$cookies.get("tlogin");
+      var userInfo = this.$cookies.get("teacherInfo");
+      // if (_isLogin == "1" && userInfo) {
+      loading.close();
+      this.$store.commit("update", ["isLogin", true]);
+      // var info = JSON.parse(window.sessionStorage.getItem("userInfo"));
+      this.$store.commit("update", ["userInfo", userInfo]);
+      let router_path = this.$route.path;
+      if (router_path == "/") {
+        this.$router.push("/course");
+      }
+      // } else {
+      //   this.$store.commit("update", ["isLogin", false]);
+      //   Message({
+      //     message: "未登录，请登录",
+      //     type: "warning",
+      //   });
+      //   setTimeout(() => {
+      //     loading.close();
+      //     this.$router.push("/login");
+      //   }, 2000);
+      // }
+    },
+    getnCount() {
+      let params = {
+        bid: this.$store.state.userInfo.userid,
+      };
+      this.ajax
+        .get(this.$store.state.api + "getNcount", params)
+        .then((res) => {
+          console.log(res);
+          if (res.data[0].length > 0) {
+            this.$store.commit("update", ["nCount", res.data[0][0].num]);
+          } else {
+            this.$store.commit("update", ["nCount", 0]);
+          }
+        })
+        .catch((err) => {
+          console.error(err);
+        });
+    },
+    routerP() {
+      const { navTabs } = this.$data;
+      let router_path = this.$route.path;
+      console.log(router_path);
+      if (router_path != "/login") {
+        this.isLogin();
+      }
+      var a = 0;
+      for (var i = 0; i < navTabs.length; i++) {
+        if (router_path == navTabs[i]) {
+          this.isShowNav = true;
+          a = 1;
+          break;
+        }
+      }
+      if (a == 0) {
+        this.isShowNav = false;
+      }
+    },
+    exit() {
+      sessionStorage.clear();
+      this.$cookies.remove("tlogin");
+      this.$cookies.remove("teacherInfo");
+      this.$store.commit("update", ["isLogin", false]);
+      this.$store.commit("update", ["userInfo", {}]);
+      Message({
+        message: "退出成功",
+        type: "success",
+      });
+      this.$router.push("/login");
+    },
+    goTo(path) {
+      this.$router.push(path);
+    },
+  },
+  watch: {
+    $route(to, from) {
+      const { navTabs } = this.$data;
+      const toPath = to.path;
+      const fromName = from.name;
+      var a = 0;
+      for (var i = 0; i < navTabs.length; i++) {
+        if (toPath == navTabs[i]) {
+          this.isShowNav = true;
+          a = 1;
+          break;
+        }
+      }
+      if (a == 0) {
+        this.isShowNav = false;
+      }
+    },
+  },
+};
 </script>
 
 <style>
-	* {
-		margin: 0;
-		padding: 0;
-	}
-	body {
-		font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
-			"Microsoft YaHei", "微软雅黑", Arial, sans-serif;
-	}
-	#app {
-		height: 100%;
-		width: 100%;
-		background: #e6eaf0;
-		/* min-width: 1380px; */
-		min-width: 1250px;
-	}
-	
-	.appNoWidth{
-		min-width: unset !important;
-		display: inline-block !important;
-		min-width: 550px;
-	}
+* {
+  margin: 0;
+  padding: 0;
+}
+body {
+  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
+    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+}
+#app {
+  height: 100%;
+  width: 100%;
+  background: #e6eaf0;
+  /* min-width: 1380px; */
+  min-width: 1250px;
+}
 
-	.app_head {
-		height: 67.5px;
-		width: 100%;
-		background-color: rgb(61, 103, 188);
-		display: flex;
-		align-items: center;
-		min-width: 1000px;
-	}
-	.logo {
-		height: 48px;
-		width: 73px;
-		background: url("./assets/logo.png");
-		background-size: 100% 100%;
-		margin-left: 20px;
-	}
-	.pb_body {
-		margin: 20px;
-		width: 98%;
-		min-width: 745px;
-		/* display: inline-block; */
-		height: 95%;
-		min-height: 750px;
-		background: #fff;
-		border-radius: 5px;
-		/* position: absolute; */
-	}
-	.pb_head {
-		font-size: 26px;
-		/* font-weight: 600; */
-		width: 95%;
-		margin: 10px auto;
-		padding: 10px 5px;
-		border-bottom: 1px solid #eee;
-	}
-	.pb_content {
-		/* height: 100%; */
-	}
-	.pb_content_body {
-		width: 94%;
-		margin: 10px auto;
-		/* overflow: auto;
+.appNoWidth {
+  min-width: unset !important;
+  display: inline-block !important;
+  min-width: 550px;
+}
+
+.app_head {
+  height: 67.5px;
+  width: 100%;
+  background-color: rgb(61, 103, 188);
+  display: flex;
+  align-items: center;
+  min-width: 1000px;
+}
+.logo {
+  height: 48px;
+  width: 73px;
+  background: url("./assets/logo.png");
+  background-size: 100% 100%;
+  margin-left: 20px;
+}
+.pb_body {
+  margin: 20px;
+  width: 98%;
+  min-width: 745px;
+  /* display: inline-block; */
+  height: 95%;
+  min-height: 750px;
+  background: #fff;
+  border-radius: 5px;
+  /* position: absolute; */
+}
+.pb_head {
+  font-size: 26px;
+  /* font-weight: 600; */
+  width: 95%;
+  margin: 10px auto;
+  padding: 10px 5px;
+  border-bottom: 1px solid #eee;
+}
+.pb_content {
+  /* height: 100%; */
+}
+.pb_content_body {
+  width: 94%;
+  margin: 10px auto;
+  /* overflow: auto;
 	  height: calc(100% - 120px); */
-	}
-	.user_head {
-		display: flex;
-		align-items: center;
-		margin-left: auto;
-		margin-right: 20px;
-		font-size: 18px;
-		font-weight: 600;
-	}
-	.user_head .user_name {
-		color: #fff;
-		margin-right: 10px;
-	}
-	.user_head div {
-		display: flex;
-		align-items: center;
-		cursor: pointer;
-	}
-	.user_head .exitI {
-		background-image: url("./assets/exit.png");
-		width: 25px;
-		height: 25px;
-		background-size: 100% 100%;
-		margin-top: 1px;
-		line-height: 25px;
-		vertical-align: text-top;
-		background-repeat: no-repeat;
-	}
-	.noticeBox {
-		position: relative;
-		margin-right: 10px;
-	}
+}
+.user_head {
+  display: flex;
+  align-items: center;
+  margin-left: auto;
+  margin-right: 20px;
+  font-size: 18px;
+  font-weight: 600;
+}
+.user_head .user_name {
+  color: #fff;
+  margin-right: 10px;
+}
+.user_head div {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+.user_head .exitI {
+  background-image: url("./assets/exit.png");
+  width: 25px;
+  height: 25px;
+  background-size: 100% 100%;
+  margin-top: 1px;
+  line-height: 25px;
+  vertical-align: text-top;
+  background-repeat: no-repeat;
+}
+.noticeBox {
+  position: relative;
+  margin-right: 10px;
+}
 
-	.user_head .noticeI {
-		background-image: url("./assets/icon/noticeA.png");
-		width: 25px;
-		height: 25px;
-		background-size: 100% 100%;
-		margin-top: 1px;
-		line-height: 25px;
-		vertical-align: text-top;
-		background-repeat: no-repeat;
-		cursor: pointer;
-	}
-	.noticeBox span {
-		position: absolute;
-		background: red;
-		width: 15px;
-		height: 15px;
-		border-radius: 30px;
-		color: #fff;
-		text-align: center;
-		font-size: 12px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		top: -3px;
-		right: -3px;
-	}
-	.stuWidth {
-		min-width: 1180px;
-	}
-	.gHeight{
-		height: 100%;
-	}
+.user_head .noticeI {
+  background-image: url("./assets/icon/noticeA.png");
+  width: 25px;
+  height: 25px;
+  background-size: 100% 100%;
+  margin-top: 1px;
+  line-height: 25px;
+  vertical-align: text-top;
+  background-repeat: no-repeat;
+  cursor: pointer;
+}
+.noticeBox span {
+  position: absolute;
+  background: red;
+  width: 15px;
+  height: 15px;
+  border-radius: 30px;
+  color: #fff;
+  text-align: center;
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  top: -3px;
+  right: -3px;
+}
+.stuWidth {
+  min-width: 1180px;
+}
+.gHeight {
+  height: 100%;
+}
 </style>

src/components/pages/components/answerData.vue

@@ -0,0 +1,141 @@
+<template>
+  <div class="data_body">
+    <div class="title">
+      <span>问答数量</span>
+    </div>
+    <div style="width: 100%">
+      <!-- <img src="../../assets/dataimage/1.png" style="width:90%" /> -->
+      <div id="charts_canvas" class="echart" style="width: 100%; height: 100%; margin: 0 0 0 1rem"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ["problemJson"],
+  data() {
+    return {
+      chartObj: null,
+      ooption: {
+        xdata: ["A", "B", "C", "D"],
+        sdata: [],
+      },
+      option: {
+        tooltip: {
+          trigger: "item",
+        },
+        grid: {
+          left: "1%",
+          bottom: "10%",
+          top: "15%",
+          containLabel: true,
+        },
+        yAxis: {
+          type: "value",
+          boundaryGap: [0, 1],
+          minInterval: 1,
+          axisLine: {
+            onZero: false,
+          },
+        },
+        xAxis: {
+          type: "category",
+          data: [],
+          axisLabel: {
+            textStyle: {
+              color: "#000",
+            },
+          },
+        },
+
+        series: [
+          {
+            type: "bar",
+            data: [],
+            showBackground: true,
+            barWidth: "50px",
+            label: {
+              show: true,
+              position: "top",
+              color: "#2e2e2e",
+            },
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    setChart(option) {
+      // 雷达图显示的标签
+      let newPromise = new Promise((resolve) => {
+        resolve();
+      });
+      //然后异步执行echarts的初始化函数
+      newPromise.then(() => {
+        const chartObj = this.$echarts.init(
+          //劳动课程
+          this.$el.querySelector("#charts_canvas")
+        );
+        this.option.xAxis.data = option.xdata;
+        this.option.series[0].data = option.sdata;
+        // 初始化雷达图
+        this.chartObj = chartObj;
+        this.chartObj.setOption(this.option);
+      });
+    },
+  },
+  watch: {
+    problemJson(val) {
+      this.ooption = {
+        xdata: ["A", "B", "C", "D"],
+        sdata: [],
+      };
+
+      this.ooption.sdata[0] = this.problemJson.A;
+      this.ooption.sdata[1] = this.problemJson.B;
+      this.ooption.sdata[2] = this.problemJson.C;
+      this.ooption.sdata[3] = this.problemJson.D;
+      if (!this.chartObj) {
+        this.setChart(this.ooption);
+      } else {
+        this.option.yAxis.data = this.ooption.xdata;
+        this.option.series[0].data = this.ooption.sdata;
+        this.chartObj.setOption(this.option);
+      }
+    },
+  },
+  mounted() {
+    this.ooption.sdata[0] = this.problemJson.A;
+    this.ooption.sdata[1] = this.problemJson.B;
+    this.ooption.sdata[2] = this.problemJson.C;
+    this.ooption.sdata[3] = this.problemJson.D;
+    this.setChart(this.ooption);
+    var _this = this;
+    window.addEventListener("resize", () => {
+      if (_this.chartObj) {
+        _this.chartObj.resize();
+      }
+    });
+  },
+};
+</script>
+
+<style scoped>
+.data_body {
+  height: 500px;
+  display: flex;
+  position: relative;
+  border-radius: 5px;
+  /* border: 1px solid #eee; */
+  margin: 10px auto;
+  box-sizing: border-box;
+  padding: 10px;
+  width: 95%;
+  background: #fff;
+}
+.data_body .title {
+  position: absolute;
+  top: 20px;
+  left: 20px;
+}
+</style>

src/components/pages/liveRoom.vue

@@ -8,52 +8,70 @@
     "
   >
     <!-- <div class="pb_content_body" style="height: 100%">
-    </div> -->
+    </div>-->
     <div class="blackBottom">
-      <div style="color: #fff; line-height: 45px; padding-left: 15px">
-        人工智能风车实践课程
-      </div>
+      <div style="color: #fff; line-height: 45px; padding-left: 15px">人工智能风车实践课程</div>
     </div>
     <div class="isNoOther">
-      <div class="imgMiddle" :class="a == true ? 'imghalf' : 'imgMiddle'">
-        <img src="../../assets/icon/kc1.png" alt="" />
+      <div class="imgMiddle" :class="type !== 0 ? 'imghalf' : 'imgMiddle'">
+        <!-- <img src="../../assets/icon/kc1.png" alt /> -->
+        <iframe
+          style="width:100%;height:100%;border:none;"
+          src="https://view.officeapps.live.com/op/view.aspx?src=https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/05_IoT%E5%B0%8F%E8%BD%A6%E4%B8%8E%E7%89%A9%E6%B5%81%E5%B0%8F%E8%BD%A61656484402500.pptx"
+        ></iframe>
       </div>
-      <div v-if="a == true" style="background: #d0d6e4; width: 40%">
-        <div style="background: #fff; width: 96%; margin: 10px auto">
-          <div
-            style="color: #bfbfbf; padding: 15px 0 20px 25px; font-size: 20px"
-          >
-            答题查看
-          </div>
-          <div class="answerBox" v-if="b == false">
-            <div class="answerTimuBox" v-for="item in 20" :key="item">
+      <div
+        v-if="type == 1 || type == 2"
+        style="background: #d0d6e4;height:100%; min-width: 40%;max-width: 40%;overflow:auto;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 class="answerBox" v-if="type == 1">
+            <div class="answerTimuBox" v-for="item in 1" :key="item">
               <div>{{ item }}、风车是怎么运行的？</div>
-              <el-button style="margin-right: 30px" @click="showMember(item)"
-                >开始答题</el-button
-              >
+              <el-button style="margin-right: 30px" @click="showMember(item)">开始答题</el-button>
             </div>
           </div>
           <div class="answerBox" v-else>
-            <div class="memberBox">
-              <div v-for="item in 40" :key="item" @click="whoAnswer(item)">
-                张克松
-              </div>
+            <div class="memberBox" v-if="answerType == 1">
+              <div
+                :class="{pAnswer:item.is == 2}"
+                v-for="(item,index) in studentArray"
+                :key="index"
+              >{{item.name}}</div>
+            </div>
+            <div class="memberBox" v-else>
+              <div
+                :class="{pAnswer:item.is == 2}"
+                v-for="(item,index) in studentArray2"
+                :key="index"
+                @click="whoAnswer(item,index)"
+              >{{item.name}}</div>
             </div>
-            <div style="color: #948bdc; padding-top: 15px">正在答题......</div>
-            <div class="viewSta" @click="lookData">查看数据统计</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>
-      <div v-if="c == true" style="background: #d0d6e4; width: 40%">
+      <div
+        v-if="type == 3"
+        style="background: #d0d6e4height:92%;; min-width: 40%;max-width: 40%;overflow:auto;padding: 0px 0 50px;"
+      >
         <div style="background: #fff; width: 96%; margin: 10px auto">
           <div style="color: #bfbfbf; padding: 15px 0 20px 25px">数据统计</div>
           <div style="padding-left: 25px">
-            目前A选项4票、B选项8票、C选项2票、D选项2票
+            目前A选项
+            <span class>{{answerJson.A}}票</span>、B选项
+            <span>{{answerJson.B}}票</span>、C选项
+            <span>{{answerJson.C}}票</span>、D选项
+            <span>{{answerJson.D}}票</span>
+          </div>
+          <div class="szt">
+            <!-- <img src="../../assets/szt.png" alt /> -->
+            <AnswerData :problemJson="answerJson"></AnswerData>
           </div>
-          <div class="szt"><img src="../../assets/szt.png" alt="" /></div>
           <span slot="footer" class="dialog-footer sztFooter">
-            <el-button @click="clearChoose">取 消</el-button>
-            <el-button type="primary">确定</el-button>
+            <el-button type="primary" @click="type = 2">返回</el-button>
           </span>
         </div>
       </div>
@@ -62,7 +80,7 @@
     <div class="blackBottomB">
       <div class="blackButton" @click="answerWork">开始答题</div>
       <div class="blackButton">查看工具</div>
-      <div class="blackButton">选择学生回答</div>
+      <div class="blackButton" @click="checkStudentAnswer">选择学生回答</div>
     </div>
     <el-dialog
       title="选择答题"
@@ -72,9 +90,9 @@
       :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"
+      >是否让“{{answerStudent}}”同学进行单独答题？</div>
       <div
         style="
           width: 200px;
@@ -88,9 +106,7 @@
           cursor: pointer;
         "
         @click="dialogVisible = false"
-      >
-        确定
-      </div>
+      >确定</div>
     </el-dialog>
   </div>
 </template>
@@ -98,9 +114,9 @@
 <script>
 import "../../common/aws-sdk-2.235.1.min";
 import EditorBar from "../../components/tools/wangEnduit";
-import CourseProblem from "./components/courseProblem";
+import AnswerData from "./components/answerData";
 export default {
-  components: { EditorBar, CourseProblem },
+  components: { EditorBar, AnswerData },
   data() {
     return {
       isLoading: false,
@@ -109,10 +125,64 @@ export default {
       oid: this.$route.query.oid,
       mr: require("../../assets/icon/kc1.png"),
       timu: [],
-      a: false,
-      b: false,
-      c: false,
+      // a: false,
+      // b: false,
+      // c: false,
+      type: 0,
+      answerType: 1,
       dialogVisible: false,
+      studentArray: [
+        { name: "张可松", is: 1 },
+        { name: "陈佳佳", is: 1 },
+        { name: "许琦基", is: 1 },
+        { name: "洛维奇", is: 1 },
+        { name: "罗伟", is: 1 },
+        { name: "李孝雄", is: 1 },
+        { name: "李琪琪", is: 1 },
+        { name: "黄子韬", is: 1 },
+        { name: "张嘉琪", is: 1 },
+        { name: "陈家", is: 1 },
+        { name: "张可", is: 1 },
+        { name: "庄小小", is: 1 },
+        { name: "梁思成", is: 1 },
+        { name: "房小玲", is: 1 },
+        { name: "李卫涛", is: 1 },
+        { name: "李玫儿", is: 1 },
+        { name: "张可梦", is: 1 },
+        { name: "李琦", is: 1 },
+        { name: "梁惠", is: 1 },
+        { name: "许佳琪", is: 1 },
+      ],
+      studentArray2: [
+        { name: "张可松", is: 1 },
+        { name: "陈佳佳", is: 1 },
+        { name: "许琦基", is: 1 },
+        { name: "洛维奇", is: 1 },
+        { name: "罗伟", is: 1 },
+        { name: "李孝雄", is: 1 },
+        { name: "李琪琪", is: 1 },
+        { name: "黄子韬", is: 1 },
+        { name: "张嘉琪", is: 1 },
+        { name: "陈家", is: 1 },
+        { name: "张可", is: 1 },
+        { name: "庄小小", is: 1 },
+        { name: "梁思成", is: 1 },
+        { name: "房小玲", is: 1 },
+        { name: "李卫涛", is: 1 },
+        { name: "李玫儿", is: 1 },
+        { name: "张可梦", is: 1 },
+        { name: "李琦", is: 1 },
+        { name: "梁惠", is: 1 },
+        { name: "许佳琪", is: 1 },
+      ],
+      askCount: 0,
+      answerJson: {
+        A: 0,
+        B: 0,
+        C: 0,
+        D: 0,
+      },
+      answerStudent: "",
     };
   },
   methods: {
@@ -140,22 +210,15 @@ export default {
     handleClose(done) {
       done();
     },
-    handleRemove(file, fileList) {
-      console.log(file, fileList);
-    },
-    onExceed() {
-      this.$message.error("课程海报仅支持上传一张，请删除后再进行上传");
-    },
     //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) {
@@ -171,52 +234,82 @@ export default {
         }
       }
     },
-    searchCourse() {
-      this.page = 1;
+    randomNum(minNum, maxNum) {
+      switch (arguments.length) {
+        case 1:
+          return parseInt(Math.random() * minNum + 1, 10);
+          break;
+        case 2:
+          return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
+          break;
+        default:
+          return 0;
+          break;
+      }
     },
-    // deleteCourse(cid) {
-    //   const loading = this.openLoading(
-    //     document.querySelector(".student_table")
-    //   );
-    //   this.isLoading = true;
-    //   let params = {
-    //     cid: cid,
-    //   };
-    //   this.ajax
-    //     .get(this.$store.state.api + "deleteCourse", params)
-    //     .then((res) => {
-    //       loading.close();
-    //       this.isLoading = false;
-    //       this.$message.success("删除成功");
-    //     })
-    //     .catch((err) => {
-    //       console.error(err);
-    //     });
-    // },
+
     answerWork() {
-      if (this.a == false) {
-        this.a = true;
-      } else {
-        this.a = false;
+      this.type = 1;
+      this.answerType = 1;
+    },
+    checkStudentAnswer() {
+      for (var i = 0; i < this.studentArray.length; i++) {
+        this.studentArray2[i].is = 1;
       }
+      this.type = 2;
+      this.answerType = 2;
     },
     showMember(i) {
-      this.b = true;
+      this.type = 2;
+      let _this = this;
+      setTimeout(() => {
+        for (var i = 0; i < 10; i++) {
+          var a = _this.randomNum(0, _this.studentArray.length - 1);
+          _this.studentArray[a].is = 2;
+        }
+        this.askCount = 0;
+        for (var i in _this.studentArray) {
+          if (_this.studentArray[i].is == 2) {
+            _this.askCount++;
+          }
+        }
+        i = 0;
+        this.answerJson = {
+          A: 0,
+          B: 0,
+          C: 0,
+          D: 0,
+        };
+        for (var i = 0; i < _this.askCount; i++) {
+          var a = _this.randomNum(0, 3);
+          if (a === 0) {
+            _this.answerJson.A++;
+          } else if (a === 1) {
+            _this.answerJson.B++;
+          } else if (a === 2) {
+            _this.answerJson.C++;
+          } else if (a === 3) {
+            _this.answerJson.D++;
+          }
+        }
+      }, 2000);
     },
-    whoAnswer(i) {
+    whoAnswer(item, index) {
+      if (this.answerType != 2) {
+        return;
+      }
+      for (var i = 0; i < this.studentArray.length; i++) {
+        this.studentArray2[i].is = 1;
+      }
+      this.studentArray2[index].is = 2;
+      this.answerStudent = item.name;
       this.dialogVisible = true;
     },
     lookData() {
-      this.c = true;
-      this.a = false;
-    },
-    search() {
-      this.page = 1;
+      this.type = 3;
     },
   },
-  created() {
-    this.page = 1;
-  },
+  created() {},
 };
 </script>
 
@@ -259,7 +352,7 @@ export default {
 }
 
 .blackBottomB {
-  position: absolute;
+  position: sticky;
   bottom: 0px;
   left: 0px;
   display: flex;
@@ -303,8 +396,10 @@ export default {
 }
 .answerBox {
   padding-left: 25px;
-  max-height: 800px;
-  overflow: auto;
+  padding: 25px;
+  box-sizing: border-box;
+  /* max-height: 800px;
+  overflow: auto; */
 }
 .answerTimuBox {
   display: flex;
@@ -331,6 +426,11 @@ export default {
   margin: 0 15px 15px 0;
   cursor: pointer;
 }
+
+.memberBox .pAnswer {
+  background: rgb(227, 117, 154);
+}
+
 .viewSta {
   background: rgb(97, 97, 97);
   color: #bebebe;
@@ -343,7 +443,7 @@ export default {
   cursor: pointer;
 }
 .szt {
-  width: 450px;
+  width: 100%;
   margin: 20px auto;
 }
 .sztFooter {