Merge remote-tracking branch 'origin/master'

src/components/hk/monitorHK.vue

@@ -1,7 +1,5 @@
 <template class="divPlugin0">
-<!--  <div id="divPlugin" class="video-player">-->
     <div id="divPluginMonitorScreen" class="divPlugin"></div>
-<!--  </div>-->
 </template>
 <script>
 
@@ -95,26 +93,6 @@ export default {
       console.log("isInteger22", isInteger(parseInt(this.num)))
       this.iWndowType = Math.sqrt(this.num);
 
-      // 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;
       console.log("🚀 开始初始化插件 >> ", that.g_iWndIndex);
@@ -127,9 +105,6 @@ export default {
           that.g_iWndIndex = parseInt($(xmlDoc).find("SelectWnd").eq(0).text(), 10);
           var szInfo = "当前选择的窗口编号：" + that.g_iWndIndex;
           this.dangqianchuangkou = that.g_iWndIndex
-          // console.log("窗口：",this.dangqianchuangkou)
-          // this.$emit('change1', this.dangqianchuangkou);
-          // console.log(szInfo)
         },
         cbDoubleClickWnd: function (iWndIndex, bFullScreen) {
           var szInfo = "当前放大的窗口编号：" + that.iWndIndex;
@@ -154,10 +129,7 @@ export default {
         h = document.body.clientWidth / (2200 / 1080)
         w = document.body.clientWidth
       }
-
-      console.log("1: ", w, h)
-      console.log("2: ", w / 2.43, h / 3.05)
-
+      console.log("w：h: ", w / 2.43, h / 3.05)
       // 检查插件是否最新
       //   if (-1 == WebVideoCtrl.I_CheckPluginVersion()) {
       //     alert("检测到新的插件版本，请双击WebComponents.exe插件，进行升级！");
@@ -177,23 +149,6 @@ export default {
         window.addEventListener("resize", that.handleResize);
       });
       console.log("🚀 插入完成");
-
-      // WebVideoCtrl.I_InsertOBJECTPlugin("divPluginMonitorScreen");
-
-      // setTimeout(() => {
-      //   WebVideoCtrl.I_Resize(
-      //
-      //       // 1135/(this.zoom/1.25),
-      //       // 590/(this.zoom/1.25)
-      //       // w/2.43,
-      //       // h/3.05
-      //       w/5,
-      //       h/6
-      //
-      //   );
-      // }, 100);
-      // window.addEventListener('resize', this.handleResize);
-      // this.clickLogin();
     },
     async getLoginParams() {
       var loginParams = {};
@@ -254,12 +209,10 @@ export default {
       ).catch(error => {
         // 捕获错误并获取错误代码
         const errorCode = error.errorCode;
-        console.log(errorCode);
+        // console.log(errorCode);
         if (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);
@@ -270,11 +223,7 @@ export default {
             } else
               console.log("🚀 通道号无效 >> ", loginParam.ip, loginParam.channelName);
           })
-
-
         }
-
-
       });
       ;
     },
@@ -402,7 +351,8 @@ export default {
         // 捕获错误并获取错误代码
         const errorCode = error.errorCode;
         console.log("errorCode",errorCode);
-        if (errorCode == 1000) {//继续播放
+        if (errorCode == 1000) {
+          // return false
         }
       })
     },
@@ -423,9 +373,7 @@ export default {
         console.log(uniqueArr);
         for (let index = 0; index < uniqueArr.length; index++) {
           this.singleLogin(uniqueArr[index], index);
-        }
-
-        // 完成登录操作后调用resolve
+        }// 完成登录操作后调用resolve
         resolve();
       });
     },
@@ -497,7 +445,6 @@ export default {
     initPlay(data, index, oChannels) {
       let szIP = data.ip; //ip地址
       //循环16次是因为插件分屏最大为4x4（可以根据情况而定）
-
       WebVideoCtrl.I_StartRealPlay(szIP, {
         iStreamType: 1,
         iChannelID: oChannels.id,//按格式修改
@@ -520,13 +467,15 @@ export default {
         iChannelID: iChannelID,
       });
     },
-    stopPlayVideo() {
+
+    stopPlayVideo() {//暂停播放一个视频
       WebVideoCtrl.I_Stop({
         iWndIndex: this.dangqianchuangkou,
       });
     },
-    stopallPlayVideo(a) {
-      // parseInt(myString)
+
+    stopallPlayVideo(a) {//暂停播放多个视频
+      // parseInt(myString) //istring转换int
       console.log("里边的a为：",a)
       a.forEach(function(element) {
         console.log(element);
@@ -535,37 +484,11 @@ export default {
           iWndIndex: parseInt(element),
         });
       });
-
-
-      // WebVideoCtrl.I_Stop({
-      //   iWndIndex: this.dangqianchuangkou,
-      // });
-      // this.I_StopAllPlay = function () {
-      //   let oPromise = new Promise(async function (resolve, reject) {
-      //     m_pluginOBJECT.JS_StopRealPlayAll().then(() => {
-      //       m_wndSet.length = 0;
-      //       resolve()
-      //     }, () => {
-      //       reject(_oUnKnownError)
-      //     })
-      //   });
-      //   return oPromise
-      // };
-
     },
 
-
-
-    pausePlayVideo(){
-      WebVideoCtrl.I_Pause( {
-        // iWndIndex: this.dangqianchuangkou,
-        iWndIndex: [0,1],
-      });
-    }
   },
-  //因为项目中需求，总公司要查看所有子公司的监控，所以做了个监听来切换查看各个子公司的监控
-  watch: {
 
+  watch: {
     currentnum:{
       handler(val, oldval) {
         console.log("watchnum11:",this.currentnum, this.num)
@@ -579,6 +502,7 @@ export default {
         console.log("chooseData6662:", val, oldval)
       },
     },
+
     chooseData: {
       handler(val, oldval) {
         console.log("chooseData666:", this.chooseData)
@@ -590,7 +514,6 @@ export default {
       handler(val, oldval) {
         console.log("watchnum21:", this.currentnum, this.num)
         console.log("watchnum22:", val, oldval)
-        // this.initPlugin()
         WebVideoCtrl.I_ChangeWndNum(Math.sqrt(this.num))
 
         let that = this;
@@ -606,10 +529,9 @@ export default {
             // console.log(szInfo)
           },
         })
-
       }
-
     },
+
     companyVideoData: {
       handler(val, oldval) {
         console.log("watchnum121:",this.currentnum, this.num)
@@ -634,20 +556,11 @@ export default {
           WebVideoCtrl.I_ChangeWndNum(4)
         }
         this.$emit('button-value', this.num);
-
-        // WebVideoCtrl.I_ChangeWndNum(Math.sqrt(this.num))
-        // if (oldval) {
-          // for (let i = 0; i < 16; i++) {
-          //   WebVideoCtrl.I_Stop(i); //停止正在播放的页面
-          // }
-          // this.$emit("func", "");
-          // WebVideoCtrl.I_Logout(oldval.ip);
-          // this.clickLogin(this.companyVideoData);
-        // }
       },
       // immediate: true, //关键
       // deep: true,
     },
+
     videoType: {
       handler(val, oldval) {
         if (oldval) {
@@ -658,15 +571,11 @@ export default {
       immediate: true, //关键
       deep: true,
     },
+
   },
 };
 </script>
 <style scoped>
-.video-player {
-
-  width: 120%;
-  height: 120%;
-}
 .divPlugin0 {
   pointer-events: none;
 }

src/views/historicTaskScreen.vue

@@ -337,8 +337,8 @@
                             :page-size="this.danweiweidu.pageSize"
                             :page-sizes="[5,10,15,20]"
                             layout="total, prev, pager, next, sizes"
-                            @current-change="onCurrentPageChange_grade"
-                            @size-change="onPageSizeChange_grade" >
+                            @current-change="onCurrentPageChange_system_grade"
+                            @size-change="onPageSizeChange_system_grade" >
 <!--                            @prev-click="previousPage"-->
 <!--                            @next-click="nextPage"-->
                         </el-pagination>
@@ -350,9 +350,6 @@
                         :style="{  top: participantScoreFlag ? '-15px' : '2px' }"
                     ></div>
 
-
-
-
                   </div>
                   <div style="position: relative;">
                     <div style="font-size:12px;" class="new_style_grade">成绩分布</div>
@@ -482,18 +479,82 @@
                 <div class="num_subject_box_new">
                   <div style="margin-bottom:20px;">
                     <div style="font-size:12px;">成绩统计</div>
+                    <div>
+                      <el-row type="flex" justify="end" style="margin-top: -20px;margin-right: -20px;">
+                        <el-pagination
+                            small
+                            :pager-count="5"
+                            :total="this.xitongweidu.length"
+                            :current-page="this.xitongweidu.currentPage"
+                            :page-size="this.xitongweidu.pageSize"
+                            :page-sizes="[5,10,15,20]"
+                            layout="total, prev, pager, next, sizes"
+                            @current-change="onCurrentPageChange_system_grade"
+                            @size-change="onPageSizeChange_system_grade" >
+                        </el-pagination>
+                      </el-row>
+                    </div>
                     <div
-                        id="subjectGradeStatistics"
+                        id="taskGradeStatisticsOfSystem"
                         style=" left:5px; width:430px; height:180px;  "
                         :style="{  top: participantScoreFlag ? '-15px' : '2px' }"
                     ></div>
                   </div>
                   <div style="position: relative;">
                     <div style="font-size:12px;" class="new_style_grade">成绩分布</div>
-                    <div id="subjectGradeDistribute" style="height: 160px; width:430px;  bottom: 55px; position: relative; left:5px;"></div>
+<!--                    <div id="subjectGradeDistribute" style="height: 160px; width:430px;  bottom: 55px; position: relative; left:5px;"></div>-->
+                    <div id="systemGradeDistribute" style="height: 160px; width:430px;  bottom: 55px; position: relative; left:5px;"></div>
                   </div>
                 </div>
               </div>
+
+<!--              <div class="unit_map_box">-->
+<!--                <div class="map_more_box" style="align-items: flex-start;">-->
+<!--                  <div class="task_list_header" style="font-size:16px; margin-bottom: 10px;">-->
+<!--                    <el-image-->
+<!--                        style="width: 30px; height: 22px; margin-right:6px;"-->
+<!--                        :src="require('../assets/img/rightIcon.svg')"-->
+<!--                        fit="contain"-->
+<!--                    >-->
+<!--                    </el-image>-->
+<!--                    系统维度统计-->
+<!--                  </div>-->
+<!--                  <el-select-->
+<!--                      v-model="systemSubGradeValue"-->
+<!--                      placeholder="切换系统名称"-->
+<!--                      style="width:43%;"-->
+<!--                      @change="changeSystemSubGrade"-->
+<!--                      filterable-->
+<!--                  >-->
+<!--                    <el-option-->
+<!--                        v-for="item in systemOptionForTask"-->
+<!--                        :key="item.value"-->
+<!--                        :label="item.label"-->
+<!--                        :value="item.value"-->
+<!--                    >-->
+<!--                    </el-option>-->
+<!--                  </el-select>-->
+<!--                </div>-->
+<!--                <div class="num_subject_box_new">-->
+<!--                  <div style="margin-bottom:20px;">-->
+<!--                    <div style="font-size:12px;">成绩统计</div>-->
+<!--                    -->
+<!--                    <div-->
+<!--                        id="subjectGradeStatistics"-->
+<!--                        style=" left:5px; width:430px; height:180px;  "-->
+<!--                        :style="{  top: participantScoreFlag ? '-15px' : '2px' }"-->
+<!--                    ></div>-->
+<!--                  </div>-->
+<!--                  <div style="position: relative;">-->
+<!--                    <div style="font-size:12px;" class="new_style_grade">成绩分布</div>-->
+<!--                    <div id="subjectGradeDistribute" style="height: 160px; width:430px;  bottom: 55px; position: relative; left:5px;"></div>-->
+<!--                  </div>-->
+<!--                </div>-->
+<!--              </div>-->
+
+
+
+
               <div class="commandMonitoring">
                 <div class="task_outer_cotnainer_status">
                   <div class="map_more_box">
@@ -781,6 +842,16 @@ export default {
         pageSize:15,
         paged:true,
       },
+      xitongweidu:{
+        data: [],
+        length:0,
+        xitong_name:[],
+        xitong_grade:[],
+        currentPage:1,
+        totalPage:0,
+        pageSize:15,
+        paged:true,
+      },
       scalseNum: 10, //缩放比例
       showOperationSpace: false,
       currentFlowInstance: undefined,
@@ -809,6 +880,8 @@ export default {
       myChart7:'',
       myChart8:'',
       myChart9:'',
+      myChart10:'',
+      myChart11:'',
       scrollTableConfig:{
         header: ['课目名称', '指令分类', '特情注入', '指令内容', '模训系统', '时间'],
         waitTime:1500,
@@ -1583,6 +1656,10 @@ export default {
             }
           })
           this.systemSubGradeValue = this.systemOptionForTask[0].value
+          // 获取某个任务下单位参与与课目人员的的成绩统计
+          this.getSystemSubjectPeopleScore(this.wholeOutTaskId,this.systemSubGradeValue)
+          // 获取某个任务下单位参与与课目人员的的成绩分布
+          this.getSystemSubjectPeopleDistribution(this.wholeOutTaskId,this.systemSubGradeValue)
         }
       }
     },
@@ -1610,7 +1687,10 @@ export default {
       this.getUnitSubjectPeopleScore(this.wholeOutTaskId,this.unitSubGradeValue)
       // 获取某个任务下单位参与与课目人员的的成绩分布
       this.getUnitSubjectPeopleDistribution(this.wholeOutTaskId,this.unitSubGradeValue)
-
+      // 获取某个任务下单位参与与课目人员的的成绩统计
+      this.getSystemSubjectPeopleScore(this.wholeOutTaskId,this.systemSubGradeValue)
+      // 获取某个任务下单位参与与课目人员的的成绩分布
+      this.getSystemSubjectPeopleDistribution(this.wholeOutTaskId,this.systemSubGradeValue)
       // 建立指令websocket 链接
       this.initInstructWebsoket()
       // console.log('this.taiYuanMapData :>> ', this.taiYuanMapData);
@@ -1907,10 +1987,16 @@ export default {
     // 切换一个系统查看课目的分数
     changeSystemSubGrade(){
       console.log('ckx debug systemSubGradeValue ', this.systemSubGradeValue )
+      // // 获取某个任务下单位参与与课目人员的的成绩统计
+      // this.getSystemSubjectPeopleScore(this.wholeOutTaskId,this.unitSubGradeValue)
+      // this.getSystemSubjectPeopleScore(this.wholeOutTaskId,this.systemSubGradeValue)
+      // // 获取某个任务下单位参与与课目人员的的成绩分布
+      // this.getUnitSubjectPeopleDistribution(this.wholeOutTaskId,this.unitSubGradeValue)
+      // this.getSystemSubjectPeopleDistribution(this.wholeOutTaskId,this.systemSubGradeValue)
       // 获取某个任务下单位参与与课目人员的的成绩统计
-      this.getSystemSubjectPeopleScore(this.wholeOutTaskId,this.unitSubGradeValue)
+      this.getSystemSubjectPeopleScore(this.wholeOutTaskId,this.systemSubGradeValue)
       // 获取某个任务下单位参与与课目人员的的成绩分布
-      this.getUnitSubjectPeopleDistribution(this.wholeOutTaskId,this.unitSubGradeValue)
+      this.getSystemSubjectPeopleDistribution(this.wholeOutTaskId,this.systemSubGradeValue)
     },
 
     // 获取某一个任务课目状态占比
@@ -1980,44 +2066,127 @@ export default {
         this.danweiweidu.totalPage=Math.ceil(this.danweiweidu.totalPage);
         console.log("数据量，页面数据量，当前页面,页面数",value.length,this.danweiweidu.pageSize,this.danweiweidu.currentPage,this.danweiweidu.totalPage)
         // this.initEchartsSubjectGradeStatistics(category, value)
-        this.updateChart();
-
+        // this.updateChart();
+        this.updateChart(0);
       } else {
         this.$message.error(errorMessage)
       }
     },
-    previousPage() {
-      console.log("向前",this.danweiweidu.currentPage)
-      if (this.danweiweidu.currentPage > 1) {
-        this.danweiweidu.currentPage--;
-        this.updateChart();
+    // 获取某个任务下系统参与课目人员的的成绩统计
+    async getSystemSubjectPeopleScore(taskId,systemId){
+      let params={}
+      const res = await request(`/dt_screen/rest/v2/statistics/${taskId}/system/${systemId}/participantScore`, 'get', params, false)
+      const { errorCode, errorMessage, success,data } = res.data;
+      if (success) {
+        const { category, value  } = data
+
+        this.xitongweidu.xitong_name = category
+        this.xitongweidu.xitong_grade = value
+
+        value.forEach(item=>Number(item))
+        if(category.length){
+          this.participantScoreFlag=false
+        }else {
+          this.participantScoreFlag=true
+        }
+        this.updatekeyOther=new Date().getTime()
+
+        // console.log("name and grade: ", this.danweiweidu.danwei_name,this.danweiweidu.danwei_grade)
+        this.xitongweidu.length=value.length
+        this.xitongweidu.totalPage= (value.length)/(this.xitongweidu.pageSize)
+        this.xitongweidu.totalPage=Math.ceil(this.xitongweidu.totalPage);
+        console.log("数据量，页面数据量，当前页面,页面数",value.length,this.danweiweidu.pageSize,this.danweiweidu.currentPage,this.danweiweidu.totalPage)
+        // this.initEchartsSubjectGradeStatistics(category, value)
+        this.updateChart(1);
+      } else {
+        this.$message.error(errorMessage)
       }
     },
-    nextPage() {
-      console.log("向后",this.danweiweidu.currentPage)
-      if (this.danweiweidu.currentPage < this.danweiweidu.totalPage) {
-        this.danweiweidu.currentPage++;
-        this.updateChart();
+    // previousPage() {
+    //   console.log("向前",this.danweiweidu.currentPage)
+    //   if (this.danweiweidu.currentPage > 1) {
+    //     this.danweiweidu.currentPage--;
+    //     this.updateChart();
+    //   }
+    // },
+    previousPage(type) {
+      if (type === 0) {
+        if (this.danweiweidu.currentPage > 1) {
+          this.danweiweidu.currentPage--;
+          this.updateChart(0);
+        }
+      }
+      if (type === 1) {
+        if (this.xitongweidu.currentPage > 1) {
+          this.xitongweidu.currentPage--;
+          this.updateChart(1);
+        }
       }
     },
-    updateChart() {
-      const start = (this.danweiweidu.currentPage - 1) * this.danweiweidu.pageSize;
-      const end = start + this.danweiweidu.pageSize;
-      // 获取当前页需要显示的数据
-      // const pageData = this.value.slice(start, end);
-      const pageData1 = this.danweiweidu.danwei_name.slice(start, end);
-      const pageData2 = this.danweiweidu.danwei_grade.slice(start, end);
-      // 更新echarts的data选项，设置为当前页的数据
-      console.log("数据",pageData1, pageData2)
-      this.initEchartsSubjectGradeStatistics(pageData1, pageData2)
+    // nextPage() {
+    //   console.log("向后",this.danweiweidu.currentPage)
+    //   if (this.danweiweidu.currentPage < this.danweiweidu.totalPage) {
+    //     this.danweiweidu.currentPage++;
+    //     this.updateChart();
+    //   }
+    // },
+    nextPage(type) {
+      if (type === 0) {
+        if (this.danweiweidu.currentPage < this.danweiweidu.totalPage) {
+          this.danweiweidu.currentPage++;
+          this.updateChart(0);
+        }
+      }
+      if (type === 1) {
+        if (this.xitongweidu.currentPage < this.xitongweidu.totalPage) {
+          this.xitongweidu.currentPage++;
+          this.updateChart(0);
+        }
+      }
     },
+    // updateChart() {
+    //   const start = (this.danweiweidu.currentPage - 1) * this.danweiweidu.pageSize;
+    //   const end = start + this.danweiweidu.pageSize;
+    //   // 获取当前页需要显示的数据
+    //   // const pageData = this.value.slice(start, end);
+    //   const pageData1 = this.danweiweidu.danwei_name.slice(start, end);
+    //   const pageData2 = this.danweiweidu.danwei_grade.slice(start, end);
+    //   // 更新echarts的data选项，设置为当前页的数据
+    //   console.log("数据",pageData1, pageData2)
+    //   this.initEchartsSubjectGradeStatistics(pageData1, pageData2)
+    // },
+    updateChart(type) {
+      if (type === 0) {
+        const start = (this.danweiweidu.currentPage - 1) * this.danweiweidu.pageSize;
+        const end = start + this.danweiweidu.pageSize;
+        // 获取当前页需要显示的数据
+        // const pageData = this.value.slice(start, end);
+        const pageData1 = this.danweiweidu.danwei_name.slice(start, end);
+        const pageData2 = this.danweiweidu.danwei_grade.slice(start, end);
+        // 更新echarts的data选项，设置为当前页的数据
+        console.log("数据",pageData1, pageData2)
+        this.initEchartsSubjectGradeStatistics(pageData1, pageData2)
+      }
+      if (type === 1) {
+        const start = (this.xitongweidu.currentPage - 1) * this.xitongweidu.pageSize;
+        const end = start + this.xitongweidu.pageSize;
+        // 获取当前页需要显示的数据
+        // const pageData = this.value.slice(start, end);
+        const pageData1 = this.xitongweidu.xitong_name.slice(start, end);
+        const pageData2 = this.xitongweidu.xitong_grade.slice(start, end);
+        // 更新echarts的data选项，设置为当前页的数据
+        console.log("数据",pageData1, pageData2)
+        this.initEchartsTaskMemberGradeOfSystem(pageData1, pageData2)
+      }
 
+    },
     onCurrentPageChange_grade (newCurrentPage) {
       this.danweiweidu.currentPage=newCurrentPage
       console.log("1:  ",newCurrentPage )//当前页面
       console.log("2:  ",this.danweiweidu.pageSize )
       console.log("3:  ",this.oldPage)
       this.updateChart()
+      this.updateChart(0)
     },
     /**
      * 表格分页每页显示数量变化
@@ -2028,9 +2197,20 @@ export default {
       this.danweiweidu.pageSize = newPageSize;
       this.danweiweidu.currentPage = 1
       this.updateChart()
+      this.updateChart(0)
 
     },
 
+    onCurrentPageChange_system_grade (newCurrentPage) {
+      this.xitongweidu.currentPage=newCurrentPage
+      this.updateChart(1)
+    },
+    onPageSizeChange_system_grade (newPageSize) {
+      this.xitongweidu.pageSize = newPageSize;
+      this.xitongweidu.currentPage = 1
+      this.updateChart(1)
+    },
+
     // 获取全部任务分布
     async getAllTaskDistribution(){
       let params={}
@@ -2055,7 +2235,28 @@ export default {
         this.$message.error(errorMessage)
       }
     },
-
+// 获取某个任务下系统参与课目人员的的成绩分布
+    async getSystemSubjectPeopleDistribution(taskId, systemId){
+      let params={}
+      const res = await request(`/dt_screen/rest/v2/statistics/${taskId}/system/${systemId}/participantScore/distribution`, 'get', params, false)
+      const { errorCode, errorMessage, success,data } = res.data;
+      if (success) {
+        console.log('获取某个任务下单位参与与课目人员的的成绩分布', data);
+        const { category, value  } = data
+        let alldistributionData=[]
+        if(category.length){
+          category.forEach((item,index)=>{
+            alldistributionData.push({
+              name: item,
+              value: value[index]
+            })
+          })
+          this.initEchartsSystemgradeDistribute(alldistributionData)
+        }
+      } else {
+        this.$message.error(errorMessage)
+      }
+    },
     // 获取某个任务下单位参与与课目人员的的成绩分布
     async getUnitSubjectPeopleDistribution(taskId,unitId){
       let params={}
@@ -2533,7 +2734,116 @@ export default {
         that.myChart5.resize();
       })
     },
+// 获取某个任务下系统参与与课目人员的的成绩分布
+    initEchartsSystemgradeDistribute(chartData){
+      if(this.myChart11 !=null && this.myChart11  != "" && this.myChart11  != undefined){
+        this.myChart11.dispose();
+      }
+      this.myChart11  = echarts.init(document.getElementById('systemGradeDistribute'));
+      var option = {
+        xAxis: {
+          type: 'category',
+          splitLine: {
+            show:false
+          },
+          axisLine: {
+            //  改变x轴颜色
+            show: true,
+            lineStyle: {
+              color: "#AEE6FC",
+            }
+          },
+          axisLabel: {
+            //  改变x轴字体颜色和大小
+            show: true,
+            textStyle: {
+              color: 'AEE6FC',
+              fontSize: 12,
+            },
+            rotate:'25'
+          },
+        },
+        grid: {
+          top:'10',
+          left: '15',
+          right: '15',
+          bottom:'55',
+          containLabel: true
+        },
+        yAxis: {
+          type: 'value',
+          splitLine: {
+            show:false
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLine: {
+            show: true,
+            lineStyle: {
+              color: "#AEE6FC",
+            }
+          },
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: "#AEE6FC",
+              fontSize:12
+            }
+          },
+          minInterval:1
+        },
+        series: [
+          {
+            symbolSize: (params) => {
+              // let markSize = Math.sqrt(params[1]) * 3;
+              // markSize = markSize < 12 ? 12 : markSize;
+              let markSize = 12;
+              return markSize;
+            },
+            symbol: 'circle',
+            data: ((data) => {
+              var arr = [];
+              data.forEach((items) => {
+                var itemName = items.name;
+                var itemValue = items.value;
+                var itemStyle = 15;
+                var itemTitle = items.title;
+                arr.push([itemName, itemValue, itemStyle, itemTitle]);
+              });
+              return arr;
+            })(chartData),
+
+            type: 'scatter',
+            label: {
+              show: true, // 是否显示标签
+              formatter: function(params) { // 标签内容的格式化模板
+                return  params.value[1]; // 数值显示格式示例
+              },
+              position: 'right', // 标签位置，可以设置为 'top'、'bottom'、'left'、'right' 或具体的像素值
+              fontSize: 10, // 标签字体大小
+              color: '#55d2c3', // 标签字体颜色
+              // backgroundColor: '#fff', // 标签背景色
+              // borderColor: '#999', // 标签边框颜色
+              // borderWidth: 1, // 标签边框宽度
+              // borderRadius: 4 // 标签边框圆角半径
+            },
+            itemStyle: {
+              normal: {
+                color: '#FFF8A5',
+              },
+            },
+          },
+        ]
+      };
 
+      this.myChart11.setOption(option);
+      let that =this
+      window.addEventListener('resize',function () {//执行
+        console.log('ckx debug that.myChart5 ', )
+        that.myChart11.resize();
+      })
+    },
     // 获取某个任务下单位参与与课目人员的的成绩分布
     initEchartsSubjectgradeDistribute(chartData){
       if(this.myChart9 !=null && this.myChart9  != "" && this.myChart9  != undefined){
@@ -2860,7 +3170,118 @@ export default {
         that.myChart8.resize();
       })
     },
+    // 获取某个任务下系统参与课目人员的的成绩统计
+    initEchartsTaskMemberGradeOfSystem(category, value){
+      if(this.myChart10 !=null && this.myChart10  != "" && this.myChart10  != undefined){
+        this.myChart10.dispose();
+      }
+      this.myChart10  = echarts.init(document.getElementById('taskGradeStatisticsOfSystem'));
 
+      var option = {
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'none',
+            crossStyle: {
+              color: '#999'
+            }
+          },
+          textStyle: {
+            fontSize: 11 // 字体大小
+          },
+          confine: true
+        },
+        grid: {
+          top:'20',
+          left: '5',
+          right: '15',
+          bottom:'53',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          data: category,
+          splitLine:{
+            show:false
+          },
+          axisLabel: {//x轴文字的配置
+            show: true,
+            textStyle: {
+              color: "#AEE6FC",
+              fontSize:8
+            },
+            rotate:'25'
+          },
+          axisLine: { //x轴线的颜色以及宽度
+            show: true,
+            lineStyle: {
+              color: "#AEE6FC",
+            }
+          }
+        },
+        yAxis: {
+          type: 'value',
+          splitLine:{
+            show:false
+          },
+          axisLabel: {//x轴文字的配置
+            show: true,
+            textStyle: {
+              color: "#AEE6FC",
+              fontSize:10
+            }
+          },
+          axisLine: { //x轴线的颜色以及宽度
+            show: true,
+            lineStyle: {
+              color: "#AEE6FC",
+            }
+          },
+          minInterval:1
+        },
+        series: [
+          {
+            data: value,
+            type: 'bar',
+            barWidth: 14,
+            itemStyle:{
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0, color: '#47F3E7' // 0% 处的颜色
+                }, {
+                  offset: 1, color: '#22E3CA' // 100% 处的颜色
+                }],
+                global: false // 缺省为 false
+              }
+
+            }
+          }
+        ]
+      };
+      // console.log("11",value.length)
+      // console.log("22",option.series[0].barWidth)//14
+      // console.log("33",option.xAxis.axisLabel.textStyle.fontSize)//8
+
+      // 修改柱状图的宽度和字体大小
+      if(value.length>15){
+        option.series[0].barWidth = 12; // 修改柱状图的宽度为20像素
+        option.xAxis.axisLabel.textStyle.fontSize = 6; // 修改x轴标签的字体大小为12像素
+      }
+
+      // console.log("44",value.length)
+      // console.log("55",option.series[0].barWidth)//14
+      // console.log("66",option.xAxis.axisLabel.textStyle.fontSize)//8
+      this.myChart10.setOption(option);
+      let that =this
+      window.addEventListener('resize',function () {//执行
+        that.myChart10.resize();
+      })
+    },
     // 某个任务全部课目状态占比
     initEchartsSubjectStatus(allTaskStatusData){
       if(this.myChart7 !=null && this.myChart7  != "" && this.myChart7  != undefined){

src/views/monitorScreen.vue

@@ -21,7 +21,7 @@
               <el-radio-group v-model="selectedScreen" size="mini" @change="selectChange">
                 <el-radio-button label=1></el-radio-button>
                 <el-radio-button label=4></el-radio-button>
-<!--                <el-radio-button label="6"></el-radio-button>-->
+<!--                <el-radio-button label=5></el-radio-button>-->
                 <el-radio-button label=9></el-radio-button>
                 <el-radio-button label=16></el-radio-button>
               </el-radio-group>
@@ -169,7 +169,6 @@ export default {
       }],
       selectedScreen: 1,
       selectWindow:0,
-
       bofangyuan:{
         window:0,
         data:[],
@@ -286,8 +285,95 @@ export default {
       console.log("播放2",this.bigcamaraData)
       this.bigData=this.bigcamaraData
     },
+    checkWindow(){
+      let that = this
+      console.log("this.selectWindow1",this.selectWindow)
+      let xuanzhongchuangkou = this.selectWindow
+      //播放前先停止当前窗口播放其他视频
+      this.bigcamaraData.data.forEach(function(obj,index) {
+        console.log(index);
+        // console.log(obj);
+        console.log(obj.windowList);
+        if (obj.windowList.length != 0) {
+          obj.windowList.forEach(function (obj, index) {
+            console.log("camaraData序号，数值",index,obj);
+            if (parseInt(obj) == xuanzhongchuangkou) {//该窗口已播放视频
+              console.log("cardData该窗口已播放视频",this,that);
+              that.$refs.hkbigCamara.stopPlayVideo()
+              //删除窗口显示
+              that.bigcamaraData.data[index].windowList = that.bigcamaraData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+              // if(that.$refs.hkbigCamara.stopPlayVideo()){
+              //   that.bigcamaraData.data[index].windowList = that.bigcamaraData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+              // }
+
+
+            }
+          })
+        }
+      }),
+
+      this.bigcardData.data.forEach(function(obj,index) {
+        console.log(index);
+        // console.log(obj);
+        console.log(obj.windowList);
+        if(obj.windowList.length!=0){
+          obj.windowList.forEach(function(obj,index) {
+            console.log("cardData序号，数值",index,obj);
+            if(parseInt(obj)==xuanzhongchuangkou){//该窗口已播放视频
+              console.log("cardData该窗口已播放视频",this,that);
+              that.$refs.hkbigCamara.stopPlayVideo() //暂停播放该视频
+              //删除窗口显示
+              that.bigcardData.data[index].windowList = that.bigcardData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+              // if(that.$refs.hkbigCamara.stopPlayVideo()){
+              //   that.bigcardData.data[index].windowList = that.bigcardData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+              // }
+            }
+          })
+        }
+      });
+    },
+
     begin_bigcamaraData (a) {
+      // let that = this
       if(this.bigcamaraData.data[a.$index].windowList.length<6) {
+        // console.log("this.selectWindow1",this.selectWindow)
+        // let xuanzhongchuangkou = this.selectWindow
+        // //播放前先停止当前窗口播放其他视频
+        // this.bigcamaraData.data.forEach(function(obj,index) {
+        //   console.log(index);
+        //   // console.log(obj);
+        //   console.log(obj.windowList);
+        //   if (obj.windowList.length != 0) {
+        //     obj.windowList.forEach(function (obj, index) {
+        //       console.log("camaraData序号，数值",index,obj);
+        //       if (parseInt(obj) == xuanzhongchuangkou) {//该窗口已播放视频
+        //         console.log("cardData该窗口已播放视频",this,that);
+        //         that.$refs.hkbigCamara.stopPlayVideo()
+        //         //删除窗口显示
+        //         that.bigcamaraData.data[index].windowList = that.bigcamaraData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+        //       }
+        //     })
+        //   }
+        // }),
+        //
+        // this.bigcardData.data.forEach(function(obj,index) {
+        //   console.log(index);
+        //   // console.log(obj);
+        //   console.log(obj.windowList);
+        //   if(obj.windowList.length!=0){
+        //     obj.windowList.forEach(function(obj,index) {
+        //       console.log("cardData序号，数值",index,obj);
+        //       if(parseInt(obj)==xuanzhongchuangkou){//该窗口已播放视频
+        //         console.log("cardData该窗口已播放视频",this,that);
+        //         that.$refs.hkbigCamara.stopPlayVideo() //暂停播放该视频
+        //         //删除窗口显示
+        //         that.bigcardData.data[index].windowList = that.bigcardData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+        //       }
+        //     })
+        //   }
+        // });
+        this.checkWindow()
+
         console.log("a", a)
         console.log("a.index", a.$index)
         console.log(" this.bigcamaraData", this.bigcamaraData)
@@ -310,19 +396,17 @@ export default {
         // 将对象添加到数组中
         myArray.push(this.bofangyuan);
         console.log(myArray);
-        this.$refs.hkbigCamara.login(myArray)
-        // .catch(error => {
+        if(this.$refs.hkbigCamara.login(myArray)){
+          this.bigcamaraData.data[a.$index].windowList.push(this.selectWindow.toString())
+          this.bigcamaraData.data[a.$index].windowList = [...new Set(this.bigcamaraData.data[a.$index].windowList)]
+          this.bigcamaraData.data[a.$index].windowList.sort((a, b) => a - b);
+        }
+        // this.$refs.hkbigCamara.login(myArray).catch(error => {
         //       // 捕获错误并获取错误代码
         //       const errorCode = error.errorCode;
         //       console.log(errorCode);
         //       if (errorCode == 2001) {//继续播放
-
-        // this.bigcamaraData.data[a.$index].windowList.push(' ')
-        this.bigcamaraData.data[a.$index].windowList.push(this.selectWindow.toString())
-        this.bigcamaraData.data[a.$index].windowList = [...new Set(this.bigcamaraData.data[a.$index].windowList)]
-        this.bigcamaraData.data[a.$index].windowList.sort((a, b) => a - b);
       }
-
     },
     stopone_bigcamaraData(a){
       this.$refs.hkbigCamara.stopPlayVideo()
@@ -343,7 +427,45 @@ export default {
       this.bigcardData.data[a.$index].windowList.splice(0, this.bigcardData.data[a.$index].windowList.length)
     },
     begin_bigcardData (a) {
+      // let that = this
       if(this.bigcardData.data[a.$index].windowList.length<6){
+        // console.log("this.selectWindow",this.selectWindow)
+        // let xuanzhongchuangkou = this.selectWindow
+        // //播放前先停止当前窗口播放其他视频
+        // this.bigcamaraData.data.forEach(function(obj,index) {
+        //   console.log(index);
+        //   // console.log(obj);
+        //   console.log(obj.windowList);
+        //   if (obj.windowList.length != 0) {
+        //     obj.windowList.forEach(function (obj, index) {
+        //       console.log("camaraData序号，数值",index,obj);
+        //       if (parseInt(obj) == xuanzhongchuangkou) {//该窗口已播放视频
+        //         console.log("cardData该窗口已播放视频",this,that);
+        //         that.$refs.hkbigCamara.stopPlayVideo()
+        //         //删除窗口显示
+        //         that.bigcamaraData.data[index].windowList = that.bigcamaraData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+        //       }
+        //     })
+        //   }
+        // }),
+        // this.bigcardData.data.forEach(function(obj,index) {
+        //   console.log(index);
+        //   // console.log(obj);
+        //   console.log(obj.windowList);
+        //   if(obj.windowList.length!=0){
+        //     obj.windowList.forEach(function(obj,index) {
+        //       console.log("cardData序号，数值",index,obj);
+        //       if(parseInt(obj)==xuanzhongchuangkou){//该窗口已播放视频
+        //         console.log("cardData该窗口已播放视频",this,that);
+        //         that.$refs.hkbigCamara.stopPlayVideo() //暂停播放该视频
+        //         //删除窗口显示
+        //         that.bigcardData.data[index].windowList = that.bigcardData.data[index].windowList.filter((element) => element !== that.selectWindow.toString());
+        //       }
+        //     })
+        //   }
+        // });
+        this.checkWindow()
+
         console.log("a",a)
         console.log("a.index",a.$index)
         console.log(" this.bigcardData", this.bigcardData)
@@ -366,22 +488,12 @@ export default {
         // 将对象添加到数组中
         myArray.push(this.bofangyuan);
         console.log(myArray);
-        this.$refs.hkbigCamara.login(myArray)
-
-
-        // console.log("播放报错",this.$refs.hkbigCamara.login(myArray)[Symbol.toStringTag]);
-
-
-
-
-
-        // this.bigcardData.data[a.$index].windowList.push(' ')
-        this.bigcardData.data[a.$index].windowList.push(this.selectWindow.toString())
-        this.bigcardData.data[a.$index].windowList = [...new Set(this.bigcardData.data[a.$index].windowList)]
-        this.bigcardData.data[a.$index].windowList.sort((a, b) => a - b);
+        if(this.$refs.hkbigCamara.login(myArray)){
+          this.bigcardData.data[a.$index].windowList.push(this.selectWindow.toString())
+          this.bigcardData.data[a.$index].windowList = [...new Set(this.bigcardData.data[a.$index].windowList)]
+          this.bigcardData.data[a.$index].windowList.sort((a, b) => a - b);
+        }
       }
-
-
     },
     /**
      * 表格排序字段变化

src/views/taskScreen.vue

@@ -268,7 +268,7 @@
                 </div>
                 <!-- <div class="video_body2"><HKVideo2  :companyVideoData="mainVideoData" :videoType="2"></HKVideo2></div> -->
                 <div class="task_outer_cotnainer_status">
-                  <hkv v-if="HKCardShow" :companyVideoData="cardData" ref="hkv"/>
+                  <hkv v-if="HKCardShow" :companyVideoData="hebingjiankongData" ref="hkv"/>
                   <div class="center_no_data" v-if="false">
                     <el-image
                       style="width: 100px; height: 100px; margin-right: 6px"
@@ -415,6 +415,7 @@ export default {
       currentSubject: '',
       camaraData:[],
       cardData:[],
+      hebingjiankongData:[],
       cardName:[],
       cardSrc:[]
     };
@@ -915,6 +916,7 @@ export default {
       this.currentSubject = subjectName;
       this.camaraData = [];
       this.cardData = [];
+      this.hebingjiankongData = [];
       const res = await request("/dt_screen/rest/v2/video/videos/getSubjectUrls", "post", params, false);
       let index = 0;
       // this.SubjectInfo1=params.subjectName
@@ -936,6 +938,7 @@ export default {
           channelName: res.data.data[item].channelName
         };
          this.camaraData.push(data);
+         this.hebingjiankongData.push(data);
       }
 
       setTimeout(() => {
@@ -963,16 +966,10 @@ export default {
           channelName: res1.data.data[item].channelName
         };
          this.cardData.push(data);
+        this.hebingjiankongData.push(data);
       }
       console.log('cardData :>> ', this.cardData);
-      // setTimeout(() => {
-
-      //   for(let index = 0; index < this.cardSrc.length;index++)
-      //   {
-      //     this.cardData.push(this.resolveUrl(this.cardSrc[index]))
-      //   }
-      // }, 1000);
-
+      console.log('hebingjiankongData :>> ', this.hebingjiankongData);
     },
     resolveUrl(url){
       if(url ==''){