12454

api/main.py

@@ -10,13 +10,26 @@ import time
 app = Flask(__name__)
 client = MongoClient("mongodb://localhost:27019/")
 db = client["back"]
-collection = db["users"]
+usercollection = db["users"]
+zuobicollection = db["zuobi"]
 # sockitIo解决跨域问题
 app.config["SECRET_KEY"] = "secret!"
 socketio = SocketIO(app, cors_allowed_origins="*")
 # 存储连接的客户端的房间号
 clients = []
 adminSid = ""
+# 初始化考试状态
+studentStatus = {}
+
+
+def dealStudentStatus():
+    global studentStatus
+    userObj = usercollection.find({"isExit": 1, "isAdmin": 0})
+    for studentItem in userObj:
+        studentStatus[str(studentItem["_id"])] = False
+
+
+dealStudentStatus()
 
 
 @socketio.on("connect", namespace="/ws/video")
@@ -46,9 +59,71 @@ def on_disconnect():
 def handle_video_frame(message):
     # 广播视频帧给老师
     global adminSid
+    global studentStatus
     # print(f"Received video frame from {message['userId']}")
-    socketio.emit("teacherVideo", message, to=adminSid, namespace="/ws/video")
-    #
+    socketio.emit(
+        "teacherVideo" + message["userId"], message, to=adminSid, namespace="/ws/video"
+    )
+    if studentStatus[message["userId"]]:
+        print(f"学生{message['userId']}已作弊", f"{studentStatus[message['userId']]}")
+
+
+@socketio.on("talk", namespace="/ws/video")
+def handle_talk(message):
+    # 说话实时传输给老师
+    global adminSid
+    # print(f"Received video frame from {message['userId']}")
+    socketio.emit(
+        "teacherTalk" + message["userId"], message, to=adminSid, namespace="/ws/video"
+    )
+    zuobiItem = {
+        "userId": message["userId"],
+        "msg": message["data"],
+        "type": "talk",
+        "create_at": time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(time.time())),
+        "update_at": time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(time.time())),
+        "isExit": 1,
+    }
+    addzuobi(zuobiItem)
+
+
+@socketio.on("sendMsg", namespace="/ws/video")
+def handle_msg(message):
+    # 说话实时传输给老师
+    global adminSid
+    # print(f"Received video frame from {message['userId']}")
+    socketio.emit(
+        "teacherMsg" + message["userId"], message, to=adminSid, namespace="/ws/video"
+    )
+    zuobiItem = {
+        "userId": message["userId"],
+        "msg": message["data"],
+        "type": "qustion",
+        "create_at": time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(time.time())),
+        "update_at": time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(time.time())),
+        "isExit": 1,
+    }
+    addzuobi(zuobiItem)
+
+
+@socketio.on("answerMsg", namespace="/ws/video")
+def handle_answer_msg(message):
+    sid = ""
+    for item in clients:
+        if item["id"] == message["userId"]:
+            sid = item["sid"]
+    socketio.emit(
+        "studentMsg" + message["userId"], message, to=sid, namespace="/ws/video"
+    )
+    zuobiItem = {
+        "userId": message["userId"],
+        "msg": message["data"],
+        "type": "answer",
+        "create_at": time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(time.time())),
+        "update_at": time.strftime("%Y-%m-%d %H:%M:%S", time.localtime(time.time())),
+        "isExit": 1,
+    }
+    addzuobi(zuobiItem)
 
 
 # md5加密
@@ -60,10 +135,10 @@ def md5_encrypt(data):
 
 # 初始化数据
 def initData():
-    admin = collection.find_one({"isAdmin": 1, "isExit": 1})
+    admin = usercollection.find_one({"isAdmin": 1, "isExit": 1})
     if admin is None:
-        # 学校名称、学校代号、专业名称、专业代号、年级、班级、学生姓名、学号、密码、成绩、作弊情况（作弊类型、作弊时间、作弊图片）、考试类型、考试科目、考试时间段、考试链接、是否是管理员、是否删除、创建时间、更新时间
-        # xuexiaomingcheng、xuexiaodaihao、zhuanyemingcheng、zhuanyedaihao、nianji、banji、xueshengxingming、xuehao、mima、chengji、zuobiqingkuang（zuobileixing、zuobishijian、zuobitupian）、kaoshileixing、kaoshikemu、kaoshishijianduan、kaoshilianjie、isAdmin、isExit、chuangjianshijian、gengxinshijian
+        # 学校名称、学校代号、专业名称、专业代号、年级、班级、学生姓名、学号、考生图片、密码、成绩、考试类型、考试科目、考试时间段、考试链接、是否是管理员、是否删除、创建时间、更新时间
+        # xuexiaomingcheng、xuexiaodaihao、zhuanyemingcheng、zhuanyedaihao、nianji、banji、xueshengxingming、xuehao、kaoshengtupian、mima、chengji、zuobiqingkuang（zuobileixing、zuobishijian、zuobitupian）、kaoshileixing、kaoshikemu、kaoshishijianduan、kaoshilianjie、isAdmin、isExit、chuangjianshijian、gengxinshijian
         user = {
             "xuexiaomingcheng": "",
             "xuexiaodaihao": "",
@@ -73,19 +148,23 @@ def initData():
             "banji": "",
             "xueshengxingming": "老师",
             "xuehao": "0000",
+            "kaoshengtupian": "",
             "mima": md5_encrypt("0000"),
             "chengji": "",
-            "zuobiqingkuang": [],
             "kaoshileixing": "",
             "kaoshikemu": "",
             "kaoshishijianduan": "",
             "kaoshilianjie": "",
             "isAdmin": 1,
             "isExit": 1,
-            "chuangjianshijian": "",
-            "gengxinshijian": "",
+            "chuangjianshijian": time.strftime(
+                "%Y-%m-%d %H:%M:%S", time.localtime(time.time())
+            ),
+            "gengxinshijian": time.strftime(
+                "%Y-%m-%d %H:%M:%S", time.localtime(time.time())
+            ),
         }
-        collection.insert_one(user)
+        usercollection.insert_one(user)
         print("管理账号'老师'已被初始化新建")
     else:
         print(f"管理账号'{admin['xueshengxingming']}'已存在")
@@ -94,7 +173,7 @@ def initData():
 # 判断是否是管理员
 def isAdmin(id):
     mongoId = ObjectId(id)
-    userObj = collection.find_one({"_id": mongoId, "isExit": 1})
+    userObj = usercollection.find_one({"_id": mongoId, "isExit": 1})
     # 检查 userObj 是否为 None
     if userObj is None:
         return False
@@ -103,6 +182,28 @@ def isAdmin(id):
     return bool(adminBool)
 
 
+# 开始检测
+@app.route("/startCheck", methods=["post"])
+def startCheck():
+    global studentStatus
+    resData = request.data
+    userJson = json.loads(resData)
+    print(f"学生{userJson['_id']}开始检测", studentStatus[userJson["_id"]])
+    studentStatus[userJson["_id"]] = True
+    print(f"学生{userJson['_id']}开始检测", studentStatus[userJson["_id"]])
+    return {"code": 200, "msg": "开始检测", "list": [], "hasError": False}
+
+
+# 停止检测
+@app.route("/stopCheck", methods=["post"])
+def stopCheck():
+    global studentStatus
+    resData = request.data
+    userJson = json.loads(resData)
+    studentStatus[userJson["_id"]] = False
+    return {"code": 200, "msg": "停止检测", "list": [], "hasError": False}
+
+
 # 用户登录
 @app.route("/userLogin", methods=["post"])
 def login():
@@ -112,14 +213,11 @@ def login():
         return {"code": 200, "msg": "请填写信息后登录", "list": [], "hasError": True}
     # 获取到POST过来的数据，转为json形式
     userJson = json.loads(resData)
-    res = collection.find_one({"xuehao": userJson["xuehao"], "mima": userJson["mima"]})
+    res = usercollection.find_one(
+        {"xuehao": userJson["xuehao"], "mima": userJson["mima"]}
+    )
     if res is None:
         return {"code": 200, "msg": "暂无此用户", "list": [], "hasError": True}
-    # serialized_data = []
-    # for item in data:
-    #     item["_id"] = str(item["_id"])  # 将ObjectId转换为字符串
-    #     serialized_data.append(item)
-    # 将ObjectId转换为字符串
     res["_id"] = str(res["_id"])
     return {"code": 200, "msg": "登陆成功", "list": [res], "hasError": False}
 
@@ -128,9 +226,6 @@ def login():
 @app.route("/addUser", methods=["post"])
 def insert_data():
     resData = request.data
-    # 检测是否有数据
-    if not resData:
-        return {"code": 200, "msg": "无数据", "list": [], "hasError": True}
     # 获取到POST过来的数据，转为json形式
     userJson = json.loads(resData)
     admin = isAdmin(userJson["id"])
@@ -162,7 +257,8 @@ def insert_data():
                 "%Y-%m-%d %H:%M:%S", time.localtime(time.time())
             ),
         }
-        collection.insert_one(userItem)
+        usercollection.insert_one(userItem)
+        dealStudentStatus()
         return "新增成功"
 
 
@@ -170,14 +266,11 @@ def insert_data():
 @app.route("/getUser", methods=["post"])
 def query_data():
     resData = request.data
-    # 检测是否有数据
-    if not resData:
-        return {"code": 200, "msg": "请填写信息后登录", "list": [], "hasError": True}
     # 获取到POST过来的数据，转为json形式
     userJson = json.loads(resData)
     admin = isAdmin(userJson["id"])
     if admin:
-        users = collection.find()
+        users = usercollection.find()
         serialized_data = []
         for item in users:
             item["_id"] = str(item["_id"])  # 将ObjectId转换为字符串
@@ -190,7 +283,7 @@ def query_data():
         }
     else:
         mongoId = ObjectId(userJson["id"])
-        userObj = collection.find_one({"_id": mongoId, "isExit": 1})
+        userObj = usercollection.find_one({"_id": mongoId, "isExit": 1})
         userObj["_id"] = str(userObj["_id"])  # 将ObjectId转换为字符串
         return {
             "code": 200,
@@ -204,9 +297,6 @@ def query_data():
 @app.route("/updateUser", methods=["post"])
 def update_data():
     resData = request.data
-    # 检测是否有数据
-    if not resData:
-        return {"code": 200, "msg": "无数据", "list": [], "hasError": True}
     # 获取到POST过来的数据，转为json形式
     userJson = json.loads(resData)
     admin = isAdmin(userJson["id"])
@@ -229,7 +319,7 @@ def update_data():
                 "%Y-%m-%d %H:%M:%S", time.localtime(time.time())
             ),
         }
-        collection.update_one(
+        usercollection.update_one(
             {"_id": ObjectId(userJson["userid"])},
             {"$set": userItem},
         )
@@ -240,9 +330,6 @@ def update_data():
 @app.route("/delUser", methods=["post"])
 def delete_data():
     resData = request.data
-    # 检测是否有数据
-    if not resData:
-        return {"code": 200, "msg": "无数据", "list": [], "hasError": True}
     # 获取到POST过来的数据，转为json形式
     userJson = json.loads(resData)
     admin = isAdmin(userJson["id"])
@@ -250,7 +337,7 @@ def delete_data():
         serialized_data = []
         for item in userJson["ids"]:
             serialized_data.append(ObjectId(item))  # 将ObjectId转换为字符串
-        collection.delete_many({"_id": {"$in": serialized_data}})
+        usercollection.delete_many({"_id": {"$in": serialized_data}})
         return "删除成功"
 
 
@@ -258,14 +345,11 @@ def delete_data():
 @app.route("/updatePassword", methods=["post"])
 def updatePassword():
     resData = request.data
-    # 检测是否有数据
-    if not resData:
-        return {"code": 200, "msg": "无数据", "list": [], "hasError": True}
     # 获取到POST过来的数据，转为json形式
     userJson = json.loads(resData)
     admin = isAdmin(userJson["id"])
     if admin:
-        collection.update_one(
+        usercollection.update_one(
             {"_id": ObjectId(userJson["userid"])},
             {
                 "$set": {"mima": md5_encrypt(userJson["mima"])},
@@ -274,6 +358,58 @@ def updatePassword():
     return {"code": 200, "msg": "修改成功", "list": [], "hasError": False}
 
 
+def addzuobi(zuobiItem):
+    zuobicollection.insert_one(zuobiItem)
+
+
+# 删除作弊
+@app.route("/delzuobi", methods=["post"])
+def delzuobi():
+    resData = request.data
+    # 获取到POST过来的数据，转为json形式
+    userJson = json.loads(resData)
+    admin = isAdmin(userJson["id"])
+    if admin:
+        serialized_data = []
+        for item in userJson["ids"]:
+            serialized_data.append(ObjectId(item))  # 将ObjectId转换为字符串
+        zuobicollection.delete_many({"_id": {"$in": serialized_data}})
+        return "删除成功"
+
+
+# 查询作弊
+@app.route("/getzuobi", methods=["post"])
+def getzuobi():
+    resData = request.data
+    # 获取到POST过来的数据，转为json形式
+    userJson = json.loads(resData)
+    admin = isAdmin(userJson["id"])
+    if admin:
+        users = zuobicollection.find()
+        serialized_data = []
+        for item in users:
+            item["_id"] = str(item["_id"])  # 将ObjectId转换为字符串
+            serialized_data.append(item)
+        return {
+            "code": 200,
+            "msg": "查询成功",
+            "list": serialized_data,
+            "hasError": False,
+        }
+    else:
+        users = zuobicollection.find({"userId": userJson["id"], "isExit": 1})
+        serialized_data = []
+        for item in users:
+            item["_id"] = str(item["_id"])  # 将ObjectId转换为字符串
+            serialized_data.append(item)
+        return {
+            "code": 200,
+            "msg": "查询成功",
+            "list": serialized_data,
+            "hasError": False,
+        }
+
+
 if __name__ == "__main__":
     initData()
     # app.run(debug=True)

front/package.json

@@ -11,6 +11,7 @@
     "@element-plus/icons-vue": "^2.3.1",
     "axios": "^1.6.6",
     "dayjs": "^1.11.10",
+    "echarts": "^5.5.1",
     "element-plus": "^2.5.3",
     "lodash": "^4.17.21",
     "md5": "^2.3.0",

front/src/api/student.js

@@ -1,7 +1,7 @@
 import _axios from "@/plugins/axios";
 
 //修改用户
-export function updateUser(data) {
+export function updateUser(data = {}) {
   return _axios({
     url: `/v1/updateUser`,
     method: "POST",
@@ -9,7 +9,7 @@ export function updateUser(data) {
   });
 }
 //查找用户
-export function getUser(data) {
+export function getUser(data = {}) {
   return _axios({
     url: `/v1/getUser`,
     method: "POST",
@@ -17,10 +17,35 @@ export function getUser(data) {
   });
 }
 //修改密码
-export function updatePassword(data) {
+export function updatePassword(data = {}) {
   return _axios({
     url: `/v1/updatePassword`,
     method: "POST",
     data: { id: localStorage.getItem("userId"), ...data },
   });
 }
+//开始检测
+export function startCheck() {
+  return _axios({
+    url: `/v1/startCheck`,
+    method: "POST",
+    data: { _id: localStorage.getItem("userId") },
+  });
+}
+//停止检测
+export function stopCheck() {
+  return _axios({
+    url: `/v1/stopCheck`,
+    method: "POST",
+    data: { _id: localStorage.getItem("userId") },
+  });
+}
+
+//查找作弊信息
+export function getzuobi(data = {}) {
+  return _axios({
+    url: `/v1/getzuobi`,
+    method: "POST",
+    data: { id: localStorage.getItem("userId"), ...data },
+  });
+}

front/src/api/teacher.js

@@ -1,7 +1,7 @@
 import _axios from "@/plugins/axios";
 
 //登录、注册
-export function loginFun(data) {
+export function loginFun(data = {}) {
   return _axios({
     url: `/v1/userLogin`,
     method: "POST",
@@ -11,7 +11,7 @@ export function loginFun(data) {
 
 
 //增加用户
-export function addUser(data) {
+export function addUser(data = {}) {
   return _axios({
     url: `/v1/addUser`,
     method: "POST",
@@ -20,7 +20,7 @@ export function addUser(data) {
 }
 
 //删除用户
-export function delUser(data) {
+export function delUser(data = {}) {
   return _axios({
     url: `/v1/delUser`,
     method: "POST",
@@ -28,7 +28,7 @@ export function delUser(data) {
   });
 }
 //修改用户
-export function updateUser(data) {
+export function updateUser(data = {}) {
   return _axios({
     url: `/v1/updateUser`,
     method: "POST",
@@ -36,7 +36,7 @@ export function updateUser(data) {
   });
 }
 //查找用户
-export function getUser(data) {
+export function getUser(data = {}) {
   return _axios({
     url: `/v1/getUser`,
     method: "POST",
@@ -44,7 +44,7 @@ export function getUser(data) {
   });
 }
 //修改密码
-export function updatePassword(data) {
+export function updatePassword(data = {}) {
   return _axios({
     url: `/v1/updatePassword`,
     method: "POST",

front/src/main.js

@@ -10,7 +10,7 @@ import dayjs from "dayjs";
 import "@/assets/css/base.css";
 //全局引入element-plus所有图标
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
-
+import 'element-plus/dist/index.css'
 const app = createApp(App);
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
   app.component(key, component)

front/src/views/login.vue

@@ -59,15 +59,25 @@ export default {
       let formData = this.dealForm()
       let res = await loginFun(formData)
       if (!res.hasError) {
-        ElMessage.success(res.msg);
         localStorage.setItem("userId", this.$_.get(res, ["list", 0, "_id"], ""))
         localStorage.setItem("userName", this.$_.get(res, ["list", 0, "xueshengxingming"], ""))
         localStorage.setItem("isAdmin", this.$_.get(res, ["list", 0, "isAdmin"], 0))
         if (this.$_.get(res, ["list", 0, "isAdmin"], 0)) {
           this.$router.push("/teacher")
         } else {
-          this.$router.push(localStorage.getItem("routerFullPath"))
-          localStorage.removeItem("routerFullPath")
+          console.log(78744, localStorage.getItem("routerFullPath"))
+          let idStr = localStorage.getItem("routerFullPath") || ""
+          let id = this.$_.split(idStr, "/")[2]
+          if (this.$_.get(res, ["list", 0, "_id"], "") === id) {
+            ElMessage.success(res.msg);
+            this.$router.push(localStorage.getItem("routerFullPath"))
+            localStorage.removeItem("routerFullPath")
+          } else {
+            ElMessage.error("请登录自己的考试信息");
+            localStorage.removeItem("userId")
+            localStorage.removeItem("userName")
+            localStorage.removeItem("isAdmin")
+          }
         }
       } else {
         ElMessage.error(res.msg);

front/src/views/student.vue

@@ -23,7 +23,9 @@
         </p>
         <template #footer>
           <el-button type="primary" @click="connectTeacher">联系老师</el-button>
-
+          <el-button type="primary" @click="startExam">考前检测</el-button>
+          <el-button type="primary" @click="startCheckExam">开始考试</el-button>
+          <el-button type="primary" @click="stopCheckExam">结束考试</el-button>
         </template>
       </el-card>
     </el-col>
@@ -32,15 +34,27 @@
         <template #header>
           <div>
             <span>实时作弊信息</span>
+            <!-- <el-button type="primary" @click="getzuobiList">获取作弊信息</el-button> -->
           </div>
         </template>
-        <p>
+        <p v-for="(zuobiItem, zuobiIndex) in zuobiPList" :key="zuobiIndex">
+          <span>
+            {{ zuobiItem.label }}
+          </span>:
           <span>
-            实时作弊信息
+            {{ (zuobiObj[zuobiItem.prop] || []).length }}
           </span>
-          <el-button type="primary" @click="startExam">开始考试</el-button>
         </p>
       </el-card>
+      <el-card>
+        <template #header>
+          <div>
+            <span>作弊饼状图</span>
+            <!-- <el-button type="primary" @click="getzuobiList">获取作弊信息</el-button> -->
+          </div>
+        </template>
+        <div id="studentZuobiEcharts"></div>
+      </el-card>
     </el-col>
     <el-col :span="12">
       <video ref="videoEL" class="canvasClass" playsinline></video>
@@ -48,9 +62,13 @@
   </el-row>
 </template>
 <script>
+import * as echarts from 'echarts';
 import _ from "lodash";
 import {
   getUser, //获取user信息
+  startCheck,//开始检测
+  stopCheck,//停止检测
+  getzuobi,//获取作弊信息
 } from "@/api/student";
 import { ElMessage, ElMessageBox } from 'element-plus'
 import io from 'socket.io-client';
@@ -103,6 +121,11 @@ export default {
           prop: "xuehao",
           type: "text"
         },
+        {
+          lable: "考生图片",
+          prop: "kaoshengtupian",
+          type: "text"
+        },
         {
           lable: "考试类型",
           prop: "kaoshileixing",
@@ -121,6 +144,24 @@ export default {
       ],
       userData: {},
       socket: null,
+      zuobiPList: [
+        {
+          label: "提问次数",
+          prop: "qustion"
+        },
+        {
+          label: "回答次数",
+          prop: "answer"
+        },
+        {
+          label: "举手次数",
+          prop: "jushou"
+        }
+      ],
+      zuobiList: [],
+      zuobiObj: {},
+      zuobiInterval: null,
+      studentEcharts: null,
     };
   },
   watch: {},
@@ -129,6 +170,12 @@ export default {
     this.userId = _.get(this.$route, ["params", "id"], "")
     await this.getUser()
     await this.initWebSocket();
+    let echartsDom = document.getElementById('studentZuobiEcharts');
+    this.studentEcharts = echarts.init(echartsDom)
+    this.zuobiInterval = setInterval(async () => {
+      await this.getzuobiList()
+    }, 3000);
+
   },
   methods: {
     async getUser() {
@@ -142,15 +189,79 @@ export default {
       this.socket.on('connect', () => {
         console.log('Connected to server');
       });
-      this.socket.on('message', (data) => {
-        console.log(78454, data)
+      console.log(78444, `studentMsg${this.userId}`)
+      this.socket.on(`studentMsg${this.userId}`, (data) => {
+        console.log(78875454477, data)
+        let msg = _.get(data, ['data'], "")
+        let answer = _.split(msg, "@@@")
+        ElMessage({
+          message: `老师回答：${answer[1]}`,
+          type: "success",
+        });
+        // 在这里处理接收到的学生端谈话信息
       });
     },
     async connectTeacher() {
-      console.log(78744, this.socketMsg)
-      this.socket.emit('sendMsg', { sid: this.socketMsg.id, id: this.userId, msg: "我有问题" });
+      ElMessageBox.prompt(``, `提出疑问`, {
+        confirmButtonText: '发送',
+        cancelButtonText: '取消'
+      })
+        .then(({ value }) => {
+          this.socket.emit('sendMsg', { userId: this.userId, data: value });
+          ElMessage({
+            type: 'success',
+            message: `已提出疑问:${value}`,
+          })
+        })
+        .catch(() => {
+        })
+    },
+    // 开始检测
+    async startCheckExam() {
+      startCheck()
+    },
+    // 考试结束
+    async stopCheckExam() {
+      stopCheck()
+      this.stopVideoStream()
+      this.closeWebSocket()
     },
     async startExam() {
+      let that = this
+      if ('webkitSpeechRecognition' in window) {
+        console.log("Speech Recognition Supported");
+        // 创建一个新的SpeechRecognition对象
+        let recognition = new webkitSpeechRecognition();
+        // 设置语言，例如中文('zh-CN')
+        recognition.lang = 'zh-CN';
+        // 是否连续听写，默认为false, 连续为true
+        recognition.continuous = false;
+        // 是否在结果中包含中间的识别结果，默认为false
+        recognition.interimResults = false;
+        // 开始监听语音输入
+        recognition.start();
+        // 当有语音识别结果时触发此事件
+        recognition.onresult = function (event) {
+          let result = event.results[event.results.length - 1][0].transcript;
+          console.log('用户说了: ' + result);
+          ElMessage({
+            message: `您正在说说：${result}`,
+            type: "error",
+          });
+          that.socket.emit('talk', { userId: that.userId, data: result });
+          // 在这里处理识别到的文字，比如显示在页面上或执行其他操作
+        };
+        // 如果语音识别服务遇到错误，会触发此事件
+        recognition.onerror = function (event) {
+          console.error('语音识别错误:', event.error);
+        };
+        // 用户结束说话后停止监听
+        recognition.onend = function () {
+          console.log('语音识别已停止');
+          // 可根据需要决定是否重新开始监听
+          recognition.start();
+        };
+      }
       try {
         let device = {}
         let devices = await navigator.mediaDevices.enumerateDevices()
@@ -200,10 +311,62 @@ export default {
         this.socket.disconnect();
       }
     },
+    // 获取作弊信息
+    async getzuobiList() {
+      let res = await getzuobi()
+      this.zuobiList = res.list
+      this.zuobiObj = _.groupBy(this.zuobiList, 'type')
+      console.log(78444, res)
+      let option = {
+        tooltip: {
+          trigger: 'item'
+        },
+        legend: {
+          top: '5%',
+          left: 'center'
+        },
+        series: [
+          {
+            name: 'Access From',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              borderRadius: 10,
+              borderColor: '#fff',
+              borderWidth: 2
+            },
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: 40,
+                fontWeight: 'bold'
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data: [
+              { value: 1048, name: 'Search Engine' },
+              { value: 735, name: 'Direct' },
+              { value: 580, name: 'Email' },
+              { value: 484, name: 'Union Ads' },
+              { value: 300, name: 'Video Ads' }
+            ]
+          }
+        ]
+      };
+      this.studentEcharts.setOption(option)
+    }
   },
   beforeUnmount() {
     this.stopVideoStream();
     this.closeWebSocket();
+    clearInterval(this.zuobiInterval)
   },
 };
 </script>
@@ -213,4 +376,9 @@ export default {
   width: 600px;
   height: 600px;
 }
+
+#studentZuobiEcharts {
+  width: 400px;
+  height: 400px;
+}
 </style>

front/src/views/teacher.vue

@@ -212,21 +212,23 @@ export default {
   watch: {},
   computed: {},
   async mounted() {
-    this.dealTableHeader()
-    this.dealFormHeader()
-    await this.init();
-    await this.initWebSocket()
-    await this.initCanvas()
-
+    if (localStorage.getItem("userId")) {
+      this.dealTableHeader()
+      this.dealFormHeader()
+      await this.init();
+      await this.initWebSocket()
+      await this.initCanvas()
+    }
   },
   methods: {
+    // 处理表格
     dealTableHeader() {
       this.tableHeader = _.filter(this.localComponent, o => {
         o.minWidth = o.label.length * 17 + 5
         return o.tableShow
       })
     },
-    // 处理
+    // 处理表头
     dealFormHeader() {
       this.formHeaderLocal = []
       this.formDataLocal = {}
@@ -260,6 +262,7 @@ export default {
       this.formHeader = _.cloneDeep(this.formHeaderLocal)
       this.formDisabled = false;
     },
+    // 关闭模态框
     closeDialog(addDialog) {
       addDialog.show = false;
     },
@@ -353,7 +356,7 @@ export default {
         });
       })
     },
-    // 
+    // 初始化画布
     async initCanvas() {
       for (let i = 0; i < this.tableData.length; i++) {
         let element = this.tableData[i];
@@ -371,17 +374,65 @@ export default {
         console.log('Connected to server');
         console.log(879784, this.socket.id)
       });
-      this.socket.on('teacherVideo', (data) => {
-        // 在这里处理接收到的视频帧
-        let blob = this.dataURLToBlob(data.data);
-        let urlCreator = window.URL || window.webkitURL;
-        let imageUrl = urlCreator.createObjectURL(blob);
-        let image = new Image();
-        image.onload = () => {
-          this.canvasObj[`context${data.userId}`].drawImage(image, 0, 0, image.width, image.height, 0, 0, 300, 150);
-        };
-        image.src = imageUrl;
-      });
+      //监听视频帧并渲染
+      for (let index = 0; index < this.tableData.length; index++) {
+        let element = this.tableData[index];
+        this.socket.on(`teacherVideo${element._id}`, (data) => {
+          // 在这里处理接收到的视频帧
+          let blob = this.dataURLToBlob(data.data);
+          let urlCreator = window.URL || window.webkitURL;
+          let imageUrl = urlCreator.createObjectURL(blob);
+          let image = new Image();
+          image.onload = () => {
+            this.canvasObj[`context${data.userId}`].drawImage(image, 0, 0, image.width, image.height, 0, 0, 300, 150);
+          };
+          image.src = imageUrl;
+        });
+
+      }
+      //监听说话信息并提示
+      for (let index = 0; index < this.tableData.length; index++) {
+        let element = this.tableData[index];
+        this.socket.on(`teacherTalk${element._id}`, (data) => {
+          let userId = _.get(data, ['userId'], "")
+          let msg = _.get(data, ['data'], "")
+          let stedentItem = _.find(this.tableData, o => o._id === userId)
+          ElMessage({
+            message: `${stedentItem.xueshengxingming}说：${msg}`,
+            type: "error",
+          });
+          console.log(78744, stedentItem, msg)
+          // 在这里处理接收到的学生端谈话信息
+        });
+      }
+      //监听疑问信息并处理
+      for (let index = 0; index < this.tableData.length; index++) {
+        let element = this.tableData[index];
+        this.socket.on(`teacherMsg${element._id}`, (data) => {
+          let userId = _.get(data, ['userId'], "")
+          let msg = _.get(data, ['data'], "")
+          let stedentItem = _.find(this.tableData, o => o._id === userId)
+          ElMessageBox.prompt(`${stedentItem.xueshengxingming}问：${msg}`, `疑问`, {
+            confirmButtonText: 'OK',
+            cancelButtonText: 'Cancel'
+          })
+            .then(({ value }) => {
+              ElMessage({
+                type: 'success',
+                message: `已回答${value}`,
+              })
+              this.socket.emit('answerMsg', { userId: stedentItem._id, data: `${msg}@@@${value}` });
+            })
+            .catch(() => {
+              ElMessage({
+                type: 'info',
+                message: 'Input canceled',
+              })
+              this.socket.emit('answerMsg', { userId: stedentItem._id, data: `${msg}@@@ ` });
+            })
+          // 在这里处理接收到的学生端疑问信息
+        });
+      }
     },
     stopVideoStream() {
       if (this.videoStream) {