no message

src/api/user/index.ts

@@ -6,6 +6,10 @@ enum API {
   USERINFO_URL = "/wanzai/api/driver/getUserPage",
   // 获取学生历史出勤数据 接口地址
   STUDENTATTENDANCE_URL = "/wanzai/api/smartAttendance/historicalAttendance",
+
+  // 获取雷达图筛选框学期数组
+  SEMESTERINFO_URL = "/wanzai/api/smartSemester/getSmartSemester",
+
   // 获取学生各科成绩的平均分 接口地址
   SCOREINFO_URL = "/wanzai/api/smartScore/averageScore",
   // 获取教师寄语 接口地址
@@ -37,6 +41,9 @@ export const reqGetUserInfo = (data: any) =>
 export const reqGetStudentAttendance = (data: any) =>
   request.get(API.STUDENTATTENDANCE_URL, { params: data });
 
+// 获取雷达图筛选框学期数组
+export const reqGetSemesterInfo = () => request.get(API.SEMESTERINFO_URL);
+
 // 获取学生各科成绩的平均分
 export const reqGetScoreInfo = (data: any) =>
   request.get(API.SCOREINFO_URL, { params: data });

src/components/school/schoolRight.vue

@@ -79,10 +79,14 @@
         <span class="more" @click="handleCheckMore">查看更多 ></span>
       </div>
       <div class="video">
-        <div class="video_box" v-for="(item, index) in 4" :key="index">
-          <img
-            src="https://materials.cdn.bcebos.com/images/107505592/68889f5dbf4bd8d8ef0cd11f98b5adea.jpeg"
-          />
+        <div class="video_box" v-for="(item, index) in videoList" :key="index">
+          <div class="box_mask">无信号</div>
+          <div
+            v-show="item.isShow"
+            class="box_video"
+            :id="index + 'Watch'"
+          ></div>
+          <div class="box_name">{{ item.title }}</div>
         </div>
       </div>
     </div>
@@ -90,7 +94,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from "vue";
+import { ref, onMounted, onUnmounted } from "vue";
 import { useRouter } from "vue-router";
 import { countUpNum } from "@/utils/countUpNum";
 import { reqGetSmartWarning } from "@/api/school/index";
@@ -124,6 +128,40 @@ const currentPage = ref(1);
 // 每页多少条
 const pageCount = ref(10);
 
+// 监控列表
+const videoList = ref<any>([
+  {
+    show: false,
+    title: "大门口1",
+    url: "ws://172.16.7.203:8081/1ive/c70_1.1ive.flv",
+    timer: null,
+  },
+  {
+    show: false,
+    title: "大门口2",
+    url: "ws://172.16.7.203:8081/1ive/c68_1.1ive.flv",
+    timer: null,
+  },
+  {
+    show: false,
+    title: "前操场1",
+    url: "ws://172.16.7.203:8081/1ive/c118_1.1ive.flv",
+    timer: null,
+  },
+  {
+    show: false,
+    title: "前操场2",
+    url: "ws://172.16.7.203:8081/1ive/c120_1.1ive.flv",
+    timer: null,
+  },
+]);
+
+// 延时器实例数组
+const timerList = ref<any>([]);
+
+// 监控实例数组
+const playerList = ref<any>([]);
+
 onMounted(() => {
   // 让数字动起来
   getCountUpNum();
@@ -132,7 +170,17 @@ onMounted(() => {
   getSmartWarning();
 
   // 登录获取监控权限
-  getVideoLogin();
+  // getVideoLogin();
+
+  // 初始化监控
+  initVideo();
+});
+
+onUnmounted(() => {
+  // 销毁WasmPlayer实例
+  destroyVideos();
+  // 销毁延时器实例
+  destroyTimers();
 });
 
 // 获取预警推送信息
@@ -157,15 +205,43 @@ const getVideoLogin = async () => {
   // });
   // console.log(res);
 
-  const res = await axios({
-    url: "http://172.16.7.203:8083/av_ja/videoAdmin/login",
-    method: "post",
-    data: {
-      username: "admin",
-      password: "admin.123456",
-    },
+  // const res = await axios({
+  //   url: "http://172.16.7.203:8083/av_ja/videoAdmin/login",
+  //   method: "post",
+  //   data: {
+  //     username: "admin",
+  //     password: "admin.123456",
+  //   },
+  // });
+  // console.log(res);
+};
+
+const initVideo = () => {
+  videoList.value.forEach((ele: any, index: number) => {
+    let player = new WasmPlayer(null, index + "Watch", (a: any) => {
+      // a表示当前播放的状态
+      if (a === "videoTimestamp") {
+        ele.isShow = true;
+      } else {
+        // 开启一个延时10秒的延时器
+        if (!ele.timer) {
+          (ele.timer as any) = setTimeout(() => {
+            //  如果isShow为false表示播放失败，此时断开连接节约性能
+            if (!ele.isShow) {
+              player.destroy();
+            }
+
+            // 收集延时器实例方便后面销毁
+            timerList.value.push(ele.timer);
+          }, 10000);
+        }
+      }
+    });
+    player.play(ele.url, 1);
+
+    // 收集监控实例方便后面销毁
+    playerList.value.push(player);
   });
-  console.log(res);
 };
 
 // 查看更多按钮回调
@@ -173,6 +249,20 @@ const handleCheckMore = () => {
   router.push("/more");
 };
 
+// 销毁WasmPlayer实例
+const destroyVideos = () => {
+  playerList.value.forEach((ele: any) => {
+    ele.destroy();
+  });
+};
+
+// 销毁延时器实例
+const destroyTimers = () => {
+  timerList.value.forEach((ele: any) => {
+    clearTimeout(ele);
+  });
+};
+
 // 让数字动起来
 const getCountUpNum = () => {
   countUpNum(deviceDom.value, deviceNum.value);
@@ -293,13 +383,38 @@ const getCountUpNum = () => {
       height: 320px;
 
       .video_box {
+        position: relative;
         width: 198px;
         height: 134px;
         border-radius: 5px;
 
-        img {
+        .box_mask {
+          position: absolute;
+          top: 0;
+          width: 100%;
+          height: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          font-size: 16px;
+          background-color: #000;
+        }
+
+        .box_video {
+          width: 198px;
+          height: 134px;
+          background-color: rgba($color: #000000, $alpha: 0.3);
+        }
+
+        .box_name {
+          position: absolute;
+          top: 0;
+          left: 0;
+          padding-left: 26px;
           width: 100%;
-          border-radius: 5px;
+          height: 30px;
+          font-size: 16px;
+          background-color: rgba($color: #fff, $alpha: 0.1);
         }
       }
     }

src/components/student/studentCenter.vue

@@ -4,6 +4,21 @@
     <div class="top">
       <div class="top_chart" ref="radarChart"></div>
 
+      <div class="top_select">
+        <el-select
+          v-model="examName"
+          placeholder="请选择学期"
+          @change="handleChange"
+        >
+          <el-option
+            v-for="(item, index) in optionsExam"
+            :key="index"
+            :label="(item as any).name"
+            :value="(item as any).id"
+          />
+        </el-select>
+      </div>
+
       <!-- 教师寄语区域 -->
       <div class="top_msg">
         <div class="msg_title">教师寄语</div>
@@ -82,6 +97,7 @@ import {
   reqGetScoreInfo,
   reqGetTeacherMsg,
   reqGetTrackData,
+  reqGetSemesterInfo,
 } from "@/api/user/index";
 // 引入解密函数
 import { decryptDes } from "@/utils/des";
@@ -109,6 +125,12 @@ const teacherMsg = ref("");
 // 轨迹数组数据
 const trackList = ref<any>([]);
 
+// 当前选择的学期
+const examName = ref("");
+
+// 成绩统计学期筛选框数组
+const optionsExam = ref<any>([]);
+
 onMounted(() => {
   const obj = JSON.parse(decodeURIComponent($route.query.obj as string));
   userInfo.value = obj;
@@ -116,18 +138,35 @@ onMounted(() => {
   // 获取用户id
   userId.value = obj.id;
 
-  // 获取学生各科成绩的平均分
-  getScoreInfo();
+  // 获取雷达图学期数组
+  getSemesterInfo();
+
   // 获取教师寄语信息
   getTeacherMsg();
   // 获取日常轨迹
   getTrackData();
 });
 
+// 获取雷达图学期数组
+const getSemesterInfo = async () => {
+  const res = await reqGetSemesterInfo();
+  // console.log(res);
+  if ((res as any).code == 200) {
+    const result = JSON.parse(decryptDes(res.data));
+    // console.log(result);
+    optionsExam.value = result;
+    examName.value = optionsExam.value[0].id;
+
+    // 获取学生各科成绩的平均分
+    getScoreInfo();
+  }
+};
+
 // 获取学生各科成绩的平均分
 const getScoreInfo = async () => {
   const res = await reqGetScoreInfo({
     userId: userId.value,
+    semesterId: examName.value,
   });
   // console.log(res);
   if ((res as any).code == 200) {
@@ -224,6 +263,14 @@ const initRaChart = () => {
 
   myRaChart.setOption(options);
 };
+
+// 筛选框切换回调
+const handleChange = () => {
+  myRaChart.dispose();
+  typeList.value = [];
+  valueList.value = [];
+  getScoreInfo();
+};
 </script>
 
 <style lang="scss" scoped>
@@ -236,6 +283,7 @@ const initRaChart = () => {
   color: #fff;
 
   .top {
+    position: relative;
     height: 530px;
     background-image: url(@/assets/images/box-bg6.png);
     background-size: 100% 100%;
@@ -244,6 +292,13 @@ const initRaChart = () => {
       height: 407px;
     }
 
+    .top_select {
+      position: absolute;
+      top: 0;
+      left: 80px;
+      width: 200px;
+    }
+
     .top_msg {
       margin: auto;
       padding: 0 18px;
@@ -507,4 +562,15 @@ const initRaChart = () => {
   border-radius: 3px;
   background-color: rgba(2, 27, 41, 0.8);
 }
+
+// 修改select背景颜色
+::v-deep(.el-input__wrapper) {
+  background: transparent;
+  background-color: rgba(48, 75, 95, 0.5);
+}
+
+// 修改select筛选框文字颜色
+::v-deep(.el-input__inner) {
+  color: #fff;
+}
 </style>

src/components/student/studentRight.vue

@@ -42,12 +42,12 @@
       <div class="box_form form">
         <el-table :data="tableData">
           <el-table-column
-            prop="time"
+            prop="term"
             label="考评时间"
             align="center"
             width="150"
           />
-          <el-table-column prop="leave" label="考评等级" align="center" />
+          <el-table-column prop="scoreNum" label="考评等级" align="center" />
         </el-table>
       </div>
     </div>
@@ -91,40 +91,7 @@ const subjectList = ref<any>([]);
 const valueList = ref<any>([]);
 
 // 考评记录数组
-const tableData = [
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-  {
-    time: "2020-2021秋季",
-    leave: "A",
-  },
-];
+const tableData = ref<any>([]);
 
 onMounted(() => {
   const obj = JSON.parse(decodeURIComponent($route.query.obj as string));
@@ -166,6 +133,7 @@ const getEvaluateData = async () => {
   if ((res as any).code == 200) {
     const result = JSON.parse(decryptDes(res.data));
     // console.log(result);
+    tableData.value = result;
   }
 };
 
@@ -250,7 +218,7 @@ const initBarChart = () => {
       {
         data: valueList.value,
         type: "bar",
-        barWidth: "60%",
+        barWidth: "20%",
         label: {
           show: true,
           position: "top",