[SCREEN] video

src/components/hk/hkCamara.vue

@@ -34,7 +34,7 @@ export default {
       xmlDocData: {},
       g_iWndIndex: 0, //可以不用设置这个变量，有窗口参数的接口中，不用传值，开发包会默认使用当前选择窗口
       videoNum: "",
-      wndNum: 2
+      wndNum: 1
     };
   },
   created() {},
@@ -71,7 +71,7 @@ export default {
       console.log("🚀 开始初始化插件 >> ", that.g_iWndIndex);
       WebVideoCtrl.I_InitPlugin({
         bWndFull: true,
-        iWndowType: that.wndNum,
+        iWndowType: 1,
         bDebugMode: true,
         cbSelWnd: function (xmlDoc) {
           that.g_iWndIndex = parseInt($(xmlDoc).find("SelectWnd").eq(0).text(), 10);
@@ -83,7 +83,13 @@ export default {
         WebVideoCtrl.I_Resize(
           600 / (this.zoom / 1.25),
           240 / (this.zoom / 1.25)
-        )
+        ).then(() => {
+          console.log("🚀 data >> ", that.companyVideoData);
+          this.getLoginParams().then((res) => {
+            console.log("🚀 解析完 >> ", res);
+            this.login(res);
+          });
+        })
         window.addEventListener("resize", that.handleResize);
       });
       console.log("🚀 插入完成");
@@ -176,7 +182,7 @@ export default {
                   channelName: name,
                 })
               });
-              console.log("🚀 获取模拟通道成功 >> ",);
+              console.log("🚀 获取模拟通道成功 >> ", channels);
               resolve(channels);
             },
             error: function(oError) {
@@ -204,7 +210,7 @@ export default {
                   channelName: name,
                 })
               });
-              console.log("🚀 获取数字通道成功 >> ",);
+              console.log("🚀 获取数字通道成功 >> ", channels);
               resolve(channels);
             },
             error: function(oError) {
@@ -231,7 +237,7 @@ export default {
                   })
                 }
               });
-              console.log("🚀 获取零通道成功 >> ",);
+              console.log("🚀 获取零通道成功 >> ", channels);
               resolve(channels);
             },
             error: function(oError) {
@@ -388,13 +394,37 @@ export default {
     companyVideoData: {
       handler(val, oldVal) {
         if (oldVal.length !== 0) {
+          console.log("🚀 oldVal >> ", oldVal);
+          for (const item of oldVal) {
+            if (item !== undefined) {
+              console.log("🚀 退出登录 >> ", item.ip);
+              WebVideoCtrl.I_Logout(item.ip)
+            }
+          }
           for (let i = 0; i < this.wndNum; i++) {
             WebVideoCtrl.I_Stop(i);
+            console.log("🚀 关闭 >> ", i);
           }
           this.getLoginParams().then((res) => {
             console.log("🚀 解析完 >> ", res);
             this.login(res);
           });
+
+          // WebVideoCtrl.I_StopAllPlay().then(() => {
+          //   console.log("🚀 监控全关 >> ", );
+          //   this.getLoginParams().then((res) => {
+          //     console.log("🚀 解析完 >> ", res);
+          //     this.login(res);
+          //   });
+          // })
+          // for (let i = 0; i < this.wndNum; i++) {
+          //   WebVideoCtrl.I_Stop(i);
+          //   console.log("🚀 关闭 >> ", i);
+          // }
+          // this.getLoginParams().then((res) => {
+          //   console.log("🚀 解析完 >> ", res);
+          //   this.login(res);
+          // });
           //
         }
       }

src/components/hk/hkv.vue

@@ -30,10 +30,11 @@ export default {
       iProtocol: 1,
       bZeroChannel: false,
       xmlDocData: {},
-      g_iWndIndex: 0, //可以不用设置这个变量，有窗口参数的接口中，不用传值，开发包会默认使用当前选择窗口
+      g_iWndIndex: -1, //可以不用设置这个变量，有窗口参数的接口中，不用传值，开发包会默认使用当前选择窗口
       videoNum: "",
       deviceId: [],
       refreshMark: true,
+      wndNum: 4,
     };
   },
   created() {},
@@ -98,11 +99,14 @@ export default {
         WebVideoCtrl.I_Resize(
           380 / (this.zoom / 1.25),
           260 / (this.zoom / 1.25)
-        )
-        this.$emit("init", true);
-        console.log("🚀 采集卡麒麟 >> ", );
+        ).then(() => {
+          console.log("🚀 data >> ", that.companyVideoData);
+          this.getLoginParams().then((res) => {
+            console.log("🚀 解析完 >> ", res);
+            this.login(res);
+          });
+        })
         window.addEventListener("resize", that.handleResize);
-
       });
       console.log("🚀 插入完成");
     },
@@ -125,11 +129,19 @@ export default {
       // for (const loginParam of Object.values(loginParams)) {
       //   await that.doLogin(loginParam)
       // }
-      await Promise.all(
+      var windowIndex = 0;
+      Object.values(loginParams).forEach((item) => {
+        item["windowIndex"] = windowIndex;
+        windowIndex += 1;
+      })
+      const loginResultList =  await Promise.all(
         Object.values(loginParams).map(async (loginParam) => {
-          await that.doLogin(loginParam);
+          const result = await that.doLogin(loginParam);
+          console.log("🚀 result >> ", result);
+          return result;
         })
-      )
+      );
+      console.log("🚀 results >> ", loginResultList);
     },
     async doLogin(loginParam) {
       console.log("🚀 loginPara >> ", loginParam);
@@ -153,13 +165,28 @@ export default {
               console.log("🚀 获得id >> ", channelId);
               if (channelId !== null) {
                 console.log("🚀 获得id >> ", channelId);
-                that.startPlay(loginParam.ip, channelId);
+                that.startPlay(loginParam.ip, channelId, loginParam.windowIndex);
               } else
                 console.log("🚀 通道号无效 >> ", loginParam.ip, loginParam.channelName);
             })
           },
-          error: function () {
-            console.log("login error");
+          error: function (oError) {
+            if (oError.errorCode === 2001) {
+              that.doGetChannelInfo(loginParam.ip).then((channels) => {
+                var s = JSON.stringify(channels);
+
+                console.log("tezt", JSON.stringify(channels), channels.length, channels[0], channels[0].channelId, channels[0]["channelId"])
+                // console.log("🚀 通道列表 >> ", loginParam.ip, channels, channels.length, s[0]["channelName"]);
+                var channelId = that.getChannelIdByName(loginParam.channelName, channels);
+                console.log("🚀 获得id >> ", channelId);
+                if (channelId !== null) {
+                  console.log("🚀 获得id >> ", channelId);
+                  that.startPlay(loginParam.ip, channelId, loginParam.windowIndex);
+                } else
+                  console.log("🚀 通道号无效 >> ", loginParam.ip, loginParam.channelName);
+              })
+            } else
+              console.log("🚀 登录失败 >> ", loginParam.ip, loginParam.Port);
           },
         }
       );
@@ -194,7 +221,7 @@ export default {
                   channelName: name,
                 })
               });
-              console.log("🚀 获取模拟通道成功 >> ",);
+              console.log("🚀 获取模拟通道成功 >> ", channels);
               resolve(channels);
             },
             error: function(oError) {
@@ -222,7 +249,7 @@ export default {
                   channelName: name,
                 })
               });
-              console.log("🚀 获取数字通道成功 >> ",);
+              console.log("🚀 获取数字通道成功 >> ", channels);
               resolve(channels);
             },
             error: function(oError) {
@@ -249,7 +276,7 @@ export default {
                   })
                 }
               });
-              console.log("🚀 获取零通道成功 >> ",);
+              console.log("🚀 获取零通道成功 >> ", channels);
               resolve(channels);
             },
             error: function(oError) {
@@ -275,15 +302,15 @@ export default {
           });
       })
     },
-    startPlay(ip, channelId) {
-      console.log("🚀 开始播放 >> ", ip, channelId);
-      WebVideoCtrl.I_StartRealPlay(ip, {
-        iStreamType: 1,
-        iChannelID: channelId,
-        iWndIndex: 0,
-      }).then(() => {
-        this.$emit("init", true);
-        console.log("🚀 采集卡麒麟 >> ", );
+    startPlay(ip, channelId, windowIndex) {
+      // this.g_iWndIndex = this.g_iWndIndex + 1;
+      WebVideoCtrl.I_Stop(windowIndex).then(() => {
+        console.log("🚀 开始播放 >> ", ip, channelId, windowIndex);
+        WebVideoCtrl.I_StartRealPlay(ip, {
+          iStreamType: 1,
+          iChannelID: channelId,
+          iWndIndex: windowIndex
+        })
       })
     },
     clickLogin() {
@@ -407,14 +434,36 @@ export default {
   watch: {
     companyVideoData: {
       handler(val, oldVal) {
+        console.log("🚀 val >> ", val, oldVal);
         if (oldVal.length !== 0) {
+          console.log("🚀 oldVal >> ", oldVal);
+          for (const item of oldVal) {
+            if (item !== undefined) {
+              console.log("🚀 退出登录 >> ", item.ip);
+              WebVideoCtrl.I_Logout(item.ip)
+            }
+          }
           for (let i = 0; i < this.wndNum; i++) {
             WebVideoCtrl.I_Stop(i);
+            console.log("🚀 关闭 >> ", i);
           }
           this.getLoginParams().then((res) => {
             console.log("🚀 解析完 >> ", res);
             this.login(res);
           });
+          // for (let i = 0; i < this.wndNum; i++) {
+          //   WebVideoCtrl.I_Stop(i);
+          //   console.log("🚀 关闭 >> ", i);
+          //   WebVideoCtrl.I_StopAllPlay ()
+          // }
+          // WebVideoCtrl.I_StopAllPlay().then(() => {
+          //   console.log("🚀 采集卡全关 >> ", );
+          //   this.getLoginParams().then((res) => {
+          //     console.log("🚀 解析完 >> ", res);
+          //     this.login(res);
+          //   });
+          // })
+
           //
         }
       },

src/components/hk/monitorHK.vue

@@ -1,11 +1,6 @@
 <template>
   <div class="video-player">
     <div id="divPlugin2" class="divPlugin"></div>
-    <!-- <div id="divPlugin" class="divPlugin" ref="divPlugin" v-if="plugin">
-        </div> -->
-    <!-- <div class="down" v-else>
-            <a href="http://jbfsys.oss-cn-beijing.aliyuncs.com/download/VideoWebPlugin-1564128302790.exe">下载</a>
-        </div> -->
   </div>
 </template>
 <script>
@@ -38,33 +33,33 @@ export default {
   },
   created() {},
   mounted() {
-const uniqueArr = [];
-const uniqueSet = new Set();
-
-this.companyVideoData.forEach(obj => {
-  if (obj !== undefined&&obj !== null) {
-    const key = JSON.stringify(obj);
-    if (!uniqueSet.has(key)) {
-      uniqueSet.add(key);
-      uniqueArr.push(obj);
-    }
-  }
-});
-   this.videoData = uniqueArr;
-
-   console.log('this.videoData :>> ', this.videoData);
+    // const uniqueArr = [];
+    // const uniqueSet = new Set();
+    //
+    // this.companyVideoData.forEach(obj => {
+    //   if (obj !== undefined&&obj !== null) {
+    //     const key = JSON.stringify(obj);
+    //     if (!uniqueSet.has(key)) {
+    //       uniqueSet.add(key);
+    //       uniqueArr.push(obj);
+    //     }
+    //   }
+    // });
+    // this.videoData = uniqueArr;
+    //
+    // console.log('this.videoData :>> ', this.videoData);
     this.videoInitPlugin();
   },
-      beforeUnmount() {
+  beforeUnmount() {
     window.removeEventListener('resize', this.handleResize);
   },
   destroyed() {
     this.$router.go(0);
   },
   methods: {
-     handleResize() {
+    handleResize() {
       this.zoom = window.devicePixelRatio;
-        setTimeout(() => {
+      setTimeout(() => {
         console.log('this.zoom :>> ', this.zoom);
         WebVideoCtrl.I_Resize(1135/(this.zoom/1.25), 590/(this.zoom/1.25));
         // let divw = $('.divPlugin').width();
@@ -84,27 +79,27 @@ this.companyVideoData.forEach(obj => {
     },
     //插件初始化
     initPlugin() {
-        let videoNum = this.videoData.length;
-        if(videoNum == 0){
-            return;
-        }
-        else if(videoNum ==1){
-            this.iWndowType = 1;
-        }
-        else if(videoNum>1&&videoNum<5){
-            this.iWndowType = 2;
-        }
-        else if(videoNum>=5&&videoNum<10){
-            this.iWndowType = 3;
-        }
-        else if(videoNum>=10&&videoNum<=16){
-            this.iWndowType = 4;
-        }
-        else{
-            return;
-        }
-        console.log('videoNum :>> ', videoNum);
-        console.log('this.iWndowType :>> ', this.iWndowType);
+      let videoNum = this.videoData.length;
+      if(videoNum == 0){
+        return;
+      }
+      else if(videoNum ==1){
+        this.iWndowType = 1;
+      }
+      else if(videoNum>1&&videoNum<5){
+        this.iWndowType = 2;
+      }
+      else if(videoNum>=5&&videoNum<10){
+        this.iWndowType = 3;
+      }
+      else if(videoNum>=10&&videoNum<=16){
+        this.iWndowType = 4;
+      }
+      else{
+        return;
+      }
+      console.log('videoNum :>> ', videoNum);
+      console.log('this.iWndowType :>> ', this.iWndowType);
       var that = this;
       WebVideoCtrl.I_InitPlugin({
         bWndFull: true, //是否支持单窗口双击全屏，默I_CheckPluginInstall
@@ -116,25 +111,25 @@ this.companyVideoData.forEach(obj => {
       WebVideoCtrl.I_InsertOBJECTPlugin("divPlugin2");
 
       // 检查插件是否最新
-    //   if (-1 == WebVideoCtrl.I_CheckPluginVersion()) {
-    //     alert("检测到新的插件版本，请双击WebComponents.exe插件，进行升级！");
-    //     // return;
-    //   }
+      //   if (-1 == WebVideoCtrl.I_CheckPluginVersion()) {
+      //     alert("检测到新的插件版本，请双击WebComponents.exe插件，进行升级！");
+      //     // return;
+      //   }
       setTimeout(() => {
         WebVideoCtrl.I_Resize(1135/(this.zoom/1.25), 590/(this.zoom/1.25));
       }, 100);
-     window.addEventListener('resize', this.handleResize);
+      window.addEventListener('resize', this.handleResize);
       this.clickLogin();
     },
     clickLogin() {
-    
+
       for(let index = 0;index < this.videoData.length;index++){
         this.singleLogin(this.videoData[index],index)
       }
     },
     singleLogin(Data,index){
-        setTimeout(() => {
-      
+      setTimeout(() => {
+
         var that = this;
         WebVideoCtrl.I_Login(
           Data.ip,
@@ -201,13 +196,13 @@ this.companyVideoData.forEach(obj => {
     initPlay(data,index,oChannels) {
       let szIP = data.ip; //ip地址
       //循环16次是因为插件分屏最大为4x4（可以根据情况而定）
-        
-        WebVideoCtrl.I_StartRealPlay(szIP, {
-          iStreamType: 1,
-          iChannelID: oChannels.id,
-          iWndIndex: index,
-        });
-     
+
+      WebVideoCtrl.I_StartRealPlay(szIP, {
+        iStreamType: 1,
+        iChannelID: oChannels.id,
+        iWndIndex: index,
+      });
+
     },
     // 点击查看具体哪个监控
     startRealPlay(oChannels) {

src/views/historicTaskScreen.vue

@@ -249,6 +249,9 @@
                             <div class="subject_list_name">
                               {{  item.subjectName ||'-'  }}
                             </div>
+                            <div class="SubjectNumber_style" style="color: #F1D73A;">
+                              {{ item.overallScore || '-' }}
+                            </div>
                             <div class="orgainzers">
                               参与人员：{{  item.participatingPeople && item.participatingPeople.join(',') || '-' }}
                             </div>
@@ -377,7 +380,7 @@
                           {{ subjectNumbers }}
                         </div>
                       </div>
-                      <div class="subject_number_box" v-if="currentTaskGrade">
+                      <div class="subject_number_box">
                         <div class="subject_num_left_style" >
                           <el-image
                             style="width: 45px; height: 45px;margin-right:1px;"
@@ -1100,7 +1103,7 @@ export default {
           // 获取任务的指令信息
           this.getinstructList(data[0].taskId)
           // 获取一个任务的课目数量
-          this.getTaskSubjectNum(data[0].taskId)
+          // this.getTaskSubjectNum(data[0].taskId)
           // 获取某一个任务的全部课目状态占比
           this.getAllSubjectDetail(data[0].taskId)
           // // 获取某个任务下单位参与与课目人员的的成绩统计
@@ -1183,7 +1186,7 @@ export default {
       // 获取任务的指令信息
       this.getinstructList(this.wholeOutTaskId)
       // 获取一个任务的课目数量
-      this.getTaskSubjectNum(this.wholeOutTaskId)
+      // this.getTaskSubjectNum(this.wholeOutTaskId)
       // 获取某一个任务的全部课目状态占比
       this.getAllSubjectDetail(this.wholeOutTaskId)
       // 获取某个任务下单位参与与课目人员的的成绩统计
@@ -1197,21 +1200,24 @@ export default {
 
     // 获取任务地图的信息
     async getMapDetail(taskId){
-      let params={}
-      const res = await request(`/dt_screen/rest/v1/participatingUnit/list/${taskId}`, 'get', params, false)
+      let params={
+        taskId: taskId
+      }
+      // const res = await request(`/dt_screen/rest/v1/participatingUnit/list/${taskId}`, 'get', params, false)
+      const res = await request(`/dt_screen/rest/v2/task/listParticipatingUnit`, 'post', params, false)
       const { errorCode, errorMessage, success,data } = res.data;
       if (success) {
         console.log('获取地图的信息', data);
         if(data.length){
           // this.taiYuanMapData={}
           data.forEach((item)=>{
-            item.participatingSubjects= item.participatingSubjects
+            // item.participatingSubjects= item.participatingSubjects
             this.taiYuanMapData[item.participantUnitName]=[item.longitude,item.dimension]
             this.taiYuanDatas.push([
               {
                 value:0,
                 name:item.participantUnitName,
-                participatingSubjects: item.participatingSubjects,
+                // participatingSubjects: item.participatingSubjects,
                 dimension: item.dimension,
                 longitude: item.longitude
               }
@@ -1229,18 +1235,18 @@ export default {
     },
 
     // 获取一个任务的课目数量
-    async getTaskSubjectNum(taskId){
-      let params={}
-      const res = await request(`/dt_screen/rest/v1/subject/subjectNum/task/${taskId}/`, 'get', params, false)
-      const { errorCode, errorMessage, success,data } = res.data;
-      if (success) {
-        console.log('获取一个任务的课目数量', data);
-        this.subjectNumbers=data
-
-      } else {
-        this.$message.error(errorMessage)
-      }
-    },
+    // async getTaskSubjectNum(taskId){
+    //   let params={}
+    //   const res = await request(`/dt_screen/rest/v1/subject/subjectNum/task/${taskId}/`, 'get', params, false)
+    //   const { errorCode, errorMessage, success,data } = res.data;
+    //   if (success) {
+    //     console.log('获取一个任务的课目数量', data);
+    //     this.subjectNumbers=data
+    //
+    //   } else {
+    //     this.$message.error(errorMessage)
+    //   }
+    // },
 
     // 获取任务的课目信息
     async getSubjectList(taskId){
@@ -1257,7 +1263,42 @@ export default {
       if (success) {
         console.log('获取任务的课目信息', data);
         this.subjectDatas=data
-
+        this.subjectNumbers=data.length
+        let statusData1 = {
+          name: "待执行",
+          value: this.subjectDatas.reduce((acc, obj) => {
+            if (obj.status == "待执行") {
+              return acc + 1;
+            } else {
+              return acc;
+            }
+          }, 0),
+        };
+        let statusData2 = {
+          name: "执行中",
+          value: this.subjectDatas.reduce((acc, obj) => {
+            if (obj.status == "执行中") {
+              return acc + 1;
+            } else {
+              return acc;
+            }
+          }, 0),
+        };
+        let statusData3 = {
+          name: "已完成",
+          value: this.subjectDatas.reduce((acc, obj) => {
+            if (obj.status == "已完成") {
+              return acc + 1;
+            } else {
+              return acc;
+            }
+          }, 0),
+        };
+        let allTaskStatusData = [];
+        allTaskStatusData.push(statusData1);
+        allTaskStatusData.push(statusData2);
+        allTaskStatusData.push(statusData3);
+        this.initEchartsSubjectStatus(allTaskStatusData)
       } else {
         this.$message.error(errorMessage)
       }
@@ -1334,7 +1375,7 @@ export default {
         let tempData=[]
 
         data.forEach((item)=>{
-           tempData.push([item.subjectName,item.sort,item.situation,item.context, item.system,item.time])
+          tempData.push([item.subjectName, item.name, item.situation, item.content, item.system,item.time])
         })
         this.scrollTableConfig.data=tempData
         this.updatekey=new Date().getTime()
@@ -1452,27 +1493,27 @@ export default {
     },
 
     // 获取某一个任务课目状态占比
-    async getAllSubjectDetail(taskId){
-      let params={}
-      const res = await request(`/dt_screen/rest/v1/statistics/${taskId}/subjectStatus`, 'get', params, false)
-      const { errorCode, errorMessage, success,data } = res.data;
-      if (success) {
-        console.log('获取全部任务状态占比', data);
-        const { category, value  } = data
-        let allTaskStatusData=[]
-        if(category.length){
-          category.forEach((item,index)=>{
-            allTaskStatusData.push({
-              name: item,
-              value: value[index]
-            })
-          })
-          this.initEchartsSubjectStatus(allTaskStatusData)
-        }
-      } else {
-        this.$message.error(errorMessage)
-      }
-    },
+    // async getAllSubjectDetail(taskId){
+    //   let params={}
+    //   const res = await request(`/dt_screen/rest/v1/statistics/${taskId}/subjectStatus`, 'get', params, false)
+    //   const { errorCode, errorMessage, success,data } = res.data;
+    //   if (success) {
+    //     console.log('获取全部任务状态占比', data);
+    //     const { category, value  } = data
+    //     let allTaskStatusData=[]
+    //     if(category.length){
+    //       category.forEach((item,index)=>{
+    //         allTaskStatusData.push({
+    //           name: item,
+    //           value: value[index]
+    //         })
+    //       })
+    //       this.initEchartsSubjectStatus(allTaskStatusData)
+    //     }
+    //   } else {
+    //     this.$message.error(errorMessage)
+    //   }
+    // },
 
     // 全部任务分数统计
     async getAllTaskScore(){

src/views/monitorScreen.vue

@@ -1,56 +1,56 @@
 <template>
-    <v-scale-screen width="2200" height="1080">
-	    <div  class="task_screen_cotainer">
-            <div class="task_header">训练态势监控大屏</div>
-            <div class="exit_box_hanlde">
-                <el-image
-                    @click="showFull"
-                    style="width: 20px; height: 20px; margin-right:6px; margin-top: -10px;"
-                    :src="require('../assets/img/small.svg')"
-                    fit="contain"
-                    class="moreBtn_style"
-                >
-                </el-image>
-            </div>
-            <div class="monitor_video_box">
-                <div class="full_video_box">
-                    <div class="video_title_new">监控名称</div>
-                    <!-- <video  id="videoPlayerTask" class="video-js" muted></video> -->
-                    <MonitorHK :companyVideoData="videoData" v-if="isShow"/>
-                </div>
-                <div class="full_video_list">
-                    <!-- <div>
-                        <div class="video_title_new_child">
-                            <div>监控名称</div>
-                            <div class="play_to_full">大屏播放</div>
-                        </div>
-                        <video id="videoPlayer_first" class="video-js" muted></video>
-                    </div> -->
-                    <!-- <div>
-                        <div class="video_title_new_child">
-                            <div>监控名称</div>
-                            <div class="play_to_full">大屏播放</div>
-                        </div>
-                        <video id="videoPlayer_second" class="video-js" muted></video>
-                    </div> -->
-                    <!-- <div>
-                        <div class="video_title_new_child">
-                            <div>监控名称</div>
-                            <div class="play_to_full">大屏播放</div>
-                        </div>
-                        <video id="videoPlayer_third" class="video-js" muted></video>
-                    </div> -->
-                    <!-- <div>
-                        <div class="video_title_new_child">
-                            <div>监控名称</div>
-                            <div class="play_to_full">大屏播放</div>
-                        </div>
-                        <video id="videoPlayer_fourth" class="video-js" muted></video>
-                    </div> -->
-                </div>
-            </div>
+  <v-scale-screen width="2200" height="1080">
+    <div  class="task_screen_cotainer">
+      <div class="task_header">训练态势监控大屏</div>
+      <div class="exit_box_hanlde">
+        <el-image
+          @click="showFull"
+          style="width: 20px; height: 20px; margin-right:6px; margin-top: -10px;"
+          :src="require('../assets/img/small.svg')"
+          fit="contain"
+          class="moreBtn_style"
+        >
+        </el-image>
+      </div>
+      <div class="monitor_video_box">
+        <div class="full_video_box">
+          <div class="video_title_new">监控名称</div>
+          <!-- <video  id="videoPlayerTask" class="video-js" muted></video> -->
+          <MonitorHK :companyVideoData="videoData" v-if="isShow"/>
         </div>
-    </v-scale-screen>
+        <div class="full_video_list">
+          <!-- <div>
+              <div class="video_title_new_child">
+                  <div>监控名称</div>
+                  <div class="play_to_full">大屏播放</div>
+              </div>
+              <video id="videoPlayer_first" class="video-js" muted></video>
+          </div> -->
+          <!-- <div>
+              <div class="video_title_new_child">
+                  <div>监控名称</div>
+                  <div class="play_to_full">大屏播放</div>
+              </div>
+              <video id="videoPlayer_second" class="video-js" muted></video>
+          </div> -->
+          <!-- <div>
+              <div class="video_title_new_child">
+                  <div>监控名称</div>
+                  <div class="play_to_full">大屏播放</div>
+              </div>
+              <video id="videoPlayer_third" class="video-js" muted></video>
+          </div> -->
+          <!-- <div>
+              <div class="video_title_new_child">
+                  <div>监控名称</div>
+                  <div class="play_to_full">大屏播放</div>
+              </div>
+              <video id="videoPlayer_fourth" class="video-js" muted></video>
+          </div> -->
+        </div>
+      </div>
+    </div>
+  </v-scale-screen>
 </template>
 <script>
 import * as echarts from 'echarts';
@@ -60,161 +60,161 @@ import sacleBox from '../components/sacle-box/index'
 import { request } from '../utils/request';
 var uploadedDataURL = require('../../public/json/taiyuan.json')
 import './taskScreen.css'
-import Videojs from "video.js"; // 引入Videojs 
+import Videojs from "video.js"; // 引入Videojs
 
 import MonitorHK from '../components/hk/monitorHK.vue';
 export default {
-    name: 'monitorScreen',
-    components:{
-        myFlylineChartEnhanced,
-        sacleBox,
-        myscrollBoard,
-      
-        MonitorHK
-    },
-    props: {
+  name: 'monitorScreen',
+  components:{
+    myFlylineChartEnhanced,
+    sacleBox,
+    myscrollBoard,
+
+    MonitorHK
+  },
+  props: {
     videoData: {
       type: Array
     },
   },
-    data() {
-        return {
-			
-            dataSrc:'https://cctvwbndbd.a.bdydns.com/cctvwbnd/cctv1_2/index.m3u8?BR=single',
-			playerList:[],
-            isShow: false
-               
-            
-        }
-    },
-    methods:{
-		
-        showFull(){
-            this.$router.push('/taskScreen')
-        },
-
-        // 初始化视频
-        initVideo(nowPlayVideoUrl,id,isAuto) {
-			let that =this
-            // 这些options属性也可直接设置在video标签上，见 muted
-            let options = {
-                autoplay: isAuto, // 设置自动播放
-                controls: true, // 显示播放的控件
-                sources: [
-                    // 注意，如果是以option方式设置的src,是不能实现 换台的 (即使监听了nowPlayVideoUrl也没实现)
-                    {
-                        src: nowPlayVideoUrl,
-                        type: "application/x-mpegURL" // 告诉videojs,这是一个hls流
-                    }
-                ]
-            };
-            // videojs的第一个参数表示的是，文档中video的id
-			const myPlyer= Videojs(id, options, function onPlayerReady() {
-                console.log("onPlayerReady 中的this指的是：", this); // 这里的this是指Player,是由Videojs创建出来的实例
-                console.log(myPlyer === this); // 这里返回的是true
-            });
-			this.playerList.push(myPlyer)
-        }
-
-            
+  data() {
+    return {
+
+      dataSrc:'https://cctvwbndbd.a.bdydns.com/cctvwbnd/cctv1_2/index.m3u8?BR=single',
+      playerList:[],
+      isShow: false
+
+
+    }
+  },
+  methods:{
+
+    showFull(){
+      this.$router.push('/taskScreen')
     },
-    created(){ 
+
+    // 初始化视频
+    initVideo(nowPlayVideoUrl,id,isAuto) {
+      let that =this
+      // 这些options属性也可直接设置在video标签上，见 muted
+      let options = {
+        autoplay: isAuto, // 设置自动播放
+        controls: true, // 显示播放的控件
+        sources: [
+          // 注意，如果是以option方式设置的src,是不能实现 换台的 (即使监听了nowPlayVideoUrl也没实现)
+          {
+            src: nowPlayVideoUrl,
+            type: "application/x-mpegURL" // 告诉videojs,这是一个hls流
+          }
+        ]
+      };
+      // videojs的第一个参数表示的是，文档中video的id
+      const myPlyer= Videojs(id, options, function onPlayerReady() {
+        console.log("onPlayerReady 中的this指的是：", this); // 这里的this是指Player,是由Videojs创建出来的实例
+        console.log(myPlyer === this); // 这里返回的是true
+      });
+      this.playerList.push(myPlyer)
+    }
+
+
+  },
+  created(){
 //   this.videoData = this.$route.query.videoData;
 //   console.log(this.$route.query.videoData);
-this.videoData = JSON.parse(this.$route.query.videoData);
-    },
-    mounted(){
-     setTimeout(() => {
-         this.isShow = true;
-          }, 1000);
-        
-  
-        // this.initVideo(this.dataSrc,'videoPlayerTask',true)
-        // this.initVideo(this.dataSrc,'videoPlayer_first',false)
-        // this.initVideo(this.dataSrc,'videoPlayer_second',false)
-        // this.initVideo(this.dataSrc,'videoPlayer_third',false)
-        // this.initVideo(this.dataSrc,'videoPlayer_fourth',false)
-    },
-	beforeDestroy() {
-		if(this.playerList.length){
-			this.playerList.forEach((item)=>{
-				item.dispose()
-			})
-		}
-    },
+    this.videoData = JSON.parse(this.$route.query.videoData);
+  },
+  mounted(){
+    setTimeout(() => {
+      this.isShow = true;
+    }, 1000);
+
+
+    // this.initVideo(this.dataSrc,'videoPlayerTask',true)
+    // this.initVideo(this.dataSrc,'videoPlayer_first',false)
+    // this.initVideo(this.dataSrc,'videoPlayer_second',false)
+    // this.initVideo(this.dataSrc,'videoPlayer_third',false)
+    // this.initVideo(this.dataSrc,'videoPlayer_fourth',false)
+  },
+  beforeDestroy() {
+    if(this.playerList.length){
+      this.playerList.forEach((item)=>{
+        item.dispose()
+      })
+    }
+  },
 }
 </script>
 <style scoped>
 .monitor_video_box {
-    display: flex;
-    align-items: flex-start;
-    color: #fff;
-    height: 100%;
-    width: 100%;
-    padding: 10px;
-    box-sizing: border-box;
+  display: flex;
+  align-items: flex-start;
+  color: #fff;
+  height: 100%;
+  width: 100%;
+  padding: 10px;
+  box-sizing: border-box;
 }
 .full_video_box {
-    width: 80%;
-    height: 100%;
-    /* border:1px solid red; */
-    padding: 10px;
-    box-sizing: border-box;
-    background-image:url('../assets/img/opitty.png');
-    background-repeat:no-repeat;
-    background-size:100% 100%;
-    margin-right: 15px;
+  width: 80%;
+  height: 100%;
+  /* border:1px solid red; */
+  padding: 10px;
+  box-sizing: border-box;
+  background-image:url('../assets/img/opitty.png');
+  background-repeat:no-repeat;
+  background-size:100% 100%;
+  margin-right: 15px;
 }
 .full_video_list {
-    width: 20%;
-    height: 100%;
-    /* border:1px solid yellow; */
-    padding:17px 10px 10px 10px;
-    box-sizing: border-box;
-    background-image:url('../assets/img/opitty.png');
-    background-repeat:no-repeat;
-    background-size:100% 100%;
+  width: 20%;
+  height: 100%;
+  /* border:1px solid yellow; */
+  padding:17px 10px 10px 10px;
+  box-sizing: border-box;
+  background-image:url('../assets/img/opitty.png');
+  background-repeat:no-repeat;
+  background-size:100% 100%;
 }
 
 .video_title_new {
-    font-size: 18px;
-    font-weight: 600;
-    margin: 10px 0;
+  font-size: 18px;
+  font-weight: 600;
+  margin: 10px 0;
 }
 .exit_box_hanlde {
-   display: flex;
-   justify-content: end;
-   padding-right: 4px;
+  display: flex;
+  justify-content: end;
+  padding-right: 4px;
 }
 
 #videoPlayerTask {
-    width: 100%;
-    height: 95%;
+  width: 100%;
+  height: 95%;
 }
 
 #videoPlayer_first {
-   width: 419px;
-   height: 182px;
-    margin-right: 10px;
-    margin-bottom: 10px;
+  width: 419px;
+  height: 182px;
+  margin-right: 10px;
+  margin-bottom: 10px;
 }
 
 #videoPlayer_second {
-   width: 419px;
-   height: 182px;
-    margin-bottom: 10px;
+  width: 419px;
+  height: 182px;
+  margin-bottom: 10px;
 }
 
 #videoPlayer_third {
-    width: 419px;
-   height: 182px;
-    margin-right: 10px;
-    margin-bottom: 10px;
+  width: 419px;
+  height: 182px;
+  margin-right: 10px;
+  margin-bottom: 10px;
 }
 
 #videoPlayer_fourth {
-    width: 419px;
-   height: 182px;
+  width: 419px;
+  height: 182px;
 }
 
 </style>

src/views/situationScreen.vue

@@ -255,6 +255,9 @@
                             <div class="subject_list_name">
                               {{  item.subjectName ||'-'  }}
                             </div>
+                            <div class="SubjectNumber_style" style="color: #F1D73A;">
+                              {{ item.overallScore || '-' }}
+                            </div>
                             <div class="orgainzers">
                               参与人员：{{  item.participatingPeople && item.participatingPeople.join(',') || '-' }}
                             </div>
@@ -383,7 +386,7 @@
                           {{ subjectNumbers }}
                         </div>
                       </div>
-                      <div class="subject_number_box" v-if="currentTaskGrade">
+                      <div class="subject_number_box">
                         <div class="subject_num_left_style" >
                           <el-image
                             style="width: 45px; height: 45px;margin-right:1px;"
@@ -684,6 +687,7 @@
                   :cell-style="changeCellStyle"
                   stripe
                   :border="true"
+                  height="400"
                 >
                   <el-table-column align="center"   property="participantName" label="姓名" max-width="350"></el-table-column>
                   <el-table-column align="center" property="score" label="成绩" max-width="300"></el-table-column>
@@ -1110,9 +1114,9 @@ export default {
           // 获取任务的指令信息
           this.getinstructList(data[0].taskId)
           // 获取一个任务的课目数量
-          this.getTaskSubjectNum(data[0].taskId)
+          // this.getTaskSubjectNum(data[0].taskId)
           // 获取某一个任务的全部课目状态占比
-          this.getAllSubjectDetail(data[0].taskId)
+          // this.getAllSubjectDetail(data[0].taskId)
           // // 获取某个任务下单位参与与课目人员的的成绩统计
           // this.getUnitSubjectPeopleScore(data[0].taskId,this.unitSubGradeValue)
           // // 获取某个任务下单位参与与课目人员的的成绩分布
@@ -1193,9 +1197,9 @@ export default {
       // 获取任务的指令信息
       this.getinstructList(this.wholeOutTaskId)
       // 获取一个任务的课目数量
-      this.getTaskSubjectNum(this.wholeOutTaskId)
+      // this.getTaskSubjectNum(this.wholeOutTaskId)
       // 获取某一个任务的全部课目状态占比
-      this.getAllSubjectDetail(this.wholeOutTaskId)
+      // this.getAllSubjectDetail(this.wholeOutTaskId)
       // 获取某个任务下单位参与与课目人员的的成绩统计
       this.getUnitSubjectPeopleScore(this.wholeOutTaskId,this.unitSubGradeValue)
       // 获取某个任务下单位参与与课目人员的的成绩分布
@@ -1207,21 +1211,24 @@ export default {
 
     // 获取任务地图的信息
     async getMapDetail(taskId){
-      let params={}
-      const res = await request(`/dt_screen/rest/v1/participatingUnit/list/${taskId}`, 'get', params, false)
+      let params={
+        taskId: taskId
+      }
+      // const res = await request(`/dt_screen/rest/v1/participatingUnit/list/${taskId}`, 'get', params, false)
+      const res = await request(`/dt_screen/rest/v2/task/listParticipatingUnit`, 'post', params, false)
       const { errorCode, errorMessage, success,data } = res.data;
       if (success) {
         console.log('获取地图的信息', data);
         if(data.length){
           // this.taiYuanMapData={}
           data.forEach((item)=>{
-            item.participatingSubjects= item.participatingSubjects
+            // item.participatingSubjects= item.participatingSubjects
             this.taiYuanMapData[item.participantUnitName]=[item.longitude,item.dimension]
             this.taiYuanDatas.push([
               {
                 value:0,
                 name:item.participantUnitName,
-                participatingSubjects: item.participatingSubjects,
+                // participatingSubjects: item.participatingSubjects,
                 dimension: item.dimension,
                 longitude: item.longitude
               }
@@ -1239,18 +1246,18 @@ export default {
     },
 
     // 获取一个任务的课目数量
-    async getTaskSubjectNum(taskId){
-      let params={}
-      const res = await request(`/dt_screen/rest/v1/subject/subjectNum/task/${taskId}/`, 'get', params, false)
-      const { errorCode, errorMessage, success,data } = res.data;
-      if (success) {
-        console.log('获取一个任务的课目数量', data);
-        this.subjectNumbers=data
-
-      } else {
-        this.$message.error(errorMessage)
-      }
-    },
+    // async getTaskSubjectNum(taskId){
+    //   let params={}
+    //   const res = await request(`/dt_screen/rest/v1/subject/subjectNum/task/${taskId}/`, 'get', params, false)
+    //   const { errorCode, errorMessage, success,data } = res.data;
+    //   if (success) {
+    //     console.log('获取一个任务的课目数量', data);
+    //     this.subjectNumbers=data
+    //
+    //   } else {
+    //     this.$message.error(errorMessage)
+    //   }
+    // },
 
     // 获取任务的课目信息
     async getSubjectList(taskId){
@@ -1267,7 +1274,42 @@ export default {
       if (success) {
         console.log('获取任务的课目信息', data);
         this.subjectDatas=data
-
+        this.subjectNumbers=data.length
+        let statusData1 = {
+          name: "待执行",
+          value: this.subjectDatas.reduce((acc, obj) => {
+            if (obj.status == "待执行") {
+              return acc + 1;
+            } else {
+              return acc;
+            }
+          }, 0),
+        };
+        let statusData2 = {
+          name: "执行中",
+          value: this.subjectDatas.reduce((acc, obj) => {
+            if (obj.status == "执行中") {
+              return acc + 1;
+            } else {
+              return acc;
+            }
+          }, 0),
+        };
+        let statusData3 = {
+          name: "已完成",
+          value: this.subjectDatas.reduce((acc, obj) => {
+            if (obj.status == "已完成") {
+              return acc + 1;
+            } else {
+              return acc;
+            }
+          }, 0),
+        };
+        let allTaskStatusData = [];
+        allTaskStatusData.push(statusData1);
+        allTaskStatusData.push(statusData2);
+        allTaskStatusData.push(statusData3);
+        this.initEchartsSubjectStatus(allTaskStatusData)
       } else {
         this.$message.error(errorMessage)
       }
@@ -1344,7 +1386,7 @@ export default {
         let tempData=[]
 
         data.forEach((item)=>{
-                   tempData.push([item.subjectName,item.sort,item.situation,item.context, item.system,item.time])
+          tempData.push([item.subjectName, item.name, item.situation, item.content, item.system,item.time])
         })
         this.scrollTableConfig.data=tempData
         this.updatekey=new Date().getTime()
@@ -1462,27 +1504,27 @@ export default {
     },
 
     // 获取某一个任务课目状态占比
-    async getAllSubjectDetail(taskId){
-      let params={}
-      const res = await request(`/dt_screen/rest/v1/statistics/${taskId}/subjectStatus`, 'get', params, false)
-      const { errorCode, errorMessage, success,data } = res.data;
-      if (success) {
-        console.log('获取全部任务状态占比', data);
-        const { category, value  } = data
-        let allTaskStatusData=[]
-        if(category.length){
-          category.forEach((item,index)=>{
-            allTaskStatusData.push({
-              name: item,
-              value: value[index]
-            })
-          })
-          this.initEchartsSubjectStatus(allTaskStatusData)
-        }
-      } else {
-        this.$message.error(errorMessage)
-      }
-    },
+    // async getAllSubjectDetail(taskId){
+    //   let params={}
+    //   const res = await request(`/dt_screen/rest/v1/statistics/${taskId}/subjectStatus`, 'get', params, false)
+    //   const { errorCode, errorMessage, success,data } = res.data;
+    //   if (success) {
+    //     console.log('获取全部任务状态占比', data);
+    //     const { category, value  } = data
+    //     let allTaskStatusData=[]
+    //     if(category.length){
+    //       category.forEach((item,index)=>{
+    //         allTaskStatusData.push({
+    //           name: item,
+    //           value: value[index]
+    //         })
+    //       })
+    //       this.initEchartsSubjectStatus(allTaskStatusData)
+    //     }
+    //   } else {
+    //     this.$message.error(errorMessage)
+    //   }
+    // },
 
     // 全部任务分数统计
     async getAllTaskScore(){

src/views/taskScreen.vue

@@ -201,7 +201,7 @@
                   ></el-image>
                 </div>
                 <div class="video_title">{{ camaraName[0] }}</div>
-                <hk-camara  v-if="HKCamaraShow" :companyVideoData="camaraData" @init="HKCardInit" />
+                <hk-camara  v-if="HKCamaraShow" :companyVideoData="camaraData" @init="HKCardInit" ref="hkCard"/>
               </div>
               <div class="commandMonitoring_task">
                 <div class="map_more_box">
@@ -320,7 +320,7 @@ export default {
       websocketBpmn: null, //建立的连接
       updatekey:'1',
       scrollTableConfig:{
-        header: ['课目名称', '指令分类', '特情注入', '指令内容', '模训系统', '时间'],
+        header: ['课目名称', '指令名称', '特情注入', '指令内容', '模训系统', '时间'],
         waitTime:1500,
         data: [],
         columnWidth: [80],
@@ -365,7 +365,6 @@ export default {
   methods:{
     HKCardInit(){
       this.HKCardShow = true;
-      console.log("🚀 test >> ", this.HKCardShow);
     },
     jumpToHistory() {
       // this.$refs.hk.$destroy();
@@ -471,6 +470,8 @@ export default {
     },
     // 切换任务
     async changeTask() {
+      this.camaraData = []
+      this.cardData = []
       this.systemSubjectId = "";
       this.unitSubjectValue = "";
       this.isReady = false;
@@ -530,9 +531,10 @@ export default {
         this.instructList=data
         let tempData=[]
         data.forEach((item)=>{
-          tempData.push([item.subjectName,item.sort,item.situation,item.context, item.system,item.time])
+          tempData.push([item.subjectName, item.name, item.situation, item.content, item.system,item.time])
         })
         this.scrollTableConfig.data=tempData
+        console.log("🚀 data >> ", this.scrollTableConfig.data);
         this.updatekey=new Date().getTime()
 
       } else {
@@ -878,14 +880,15 @@ export default {
       data.channelName = "test1";
       return data;
     },
-    async changeVideo(subjectName) {
+    changeVideo(subjectName) {
       if (subjectName == '')
         return;
       if(subjectName != this.currentSubject) {
         this.currentSubject = subjectName;
-        this.$refs.hkv.stopAll();
-        this.camaraData = [];
-        this.cardData = [];
+        // this.$refs.hkv.stopAll();
+        // this.$refs.hkCard.stopAll();
+        this.camaraData = []
+        this.cardData = []
         this.initUrl(subjectName);
       }
     }