From 4a6ea361b6105060ec7aedfa0e0c873554ffd1e3 Mon Sep 17 00:00:00 2001
From: gongjiale <942894820@qq.com>
Date: Tue, 29 Nov 2022 13:51:02 +0800
Subject: [PATCH] Merge branch 'hi-ucs-dev' of
 http://192.168.124.50:3000/wuhongjian/hi-ucs into hi-ucs-dev

# Conflicts:
#	front/src/views/assertReport/components/ReservoirBottom.vue
#	front/src/views/assertReport/components/ReservoirRight.vue
#	front/src/views/assertReport/components/ReservoirThumbnail.vue
#	front/src/views/assertReport/index.vue
---
 .../components/ReservoirBottom.vue            | 303 +++++++++---------
 front/src/views/assertReport/image/xing2.png  | Bin 0 -> 442 bytes
 .../components/DataResources.vue              |  12 +-
 front/src/views/home/components/H5Player.vue  | 141 +++-----
 .../views/home/infrastructureApplication.vue  |  24 +-
 .../src/views/home/infrastructurePageXha.vue  |  13 +-
 6 files changed, 240 insertions(+), 253 deletions(-)
 create mode 100644 front/src/views/assertReport/image/xing2.png

diff --git a/front/src/views/assertReport/components/ReservoirBottom.vue b/front/src/views/assertReport/components/ReservoirBottom.vue
index a36c5414..d859b3b6 100644
--- a/front/src/views/assertReport/components/ReservoirBottom.vue
+++ b/front/src/views/assertReport/components/ReservoirBottom.vue
@@ -1,169 +1,168 @@
 
 <template>
-    <div class="right-survey">
-  
-      <div class="platform-overview-bottom">
-        <div class="top"><span class="title">资源汇聚总量</span></div>
-        <div class="jiesheng"> <img src="../image/xing1.png" /><span style="padding-left:2px;">共{{total}}项 </span><img src="../image/xing1.png" /></div>
-        <div class="bottom">
-         
-          <div
-            v-for="(item, index) in servicesNum"
-            :key="index"
-            class="component-services-content-right-left-content-son"
-          >
-            <p>{{ item.type }}</p>
-            <p class="num">{{ item.count }}</p>
-          </div>
+  <div class="right-survey">
+
+    <div class="platform-overview-bottom">
+      <div class="top"><span class="title">资源汇聚总量</span></div>
+      <div class="jiesheng"> <img src="../image/xing2.png" /><span style="padding-left:2px;">共{{total}}项 </span><img src="../image/xing2.png" /></div>
+      <div class="bottom">
+       
+        <div
+          v-for="(item, index) in servicesNum"
+          :key="index"
+          class="component-services-content-right-left-content-son"
+        >
+          <p>{{ item.type }}</p>
+          <p class="num">{{ item.count }}</p>
         </div>
       </div>
     </div>
-  </template>
-  
-  <script>
-    import {
-      selectTotal
-    } from '@/api/assertReport'
-  export default {
-   
-    components: {},
-  
-    mounted() {
-      this.selectAllTotal()
-    },
-    data() {
-      //这里存放数据
-      return {
-       total:'',
-        servicesNum: [],
-      }
-    },
-  
-    methods: {
+  </div>
+</template>
 
-      selectAllTotal(){
-        selectTotal().then((res) => {
-          let result=res.data.data.total
-          let now=[]
-          let num=0;  
-          for(let i=0;i<result.length;i++){
-            if(result[i].type!=='知识库'){
-              now.push(result[i])
-              num=num+Number(result[i].count)
-            }
-          } 
-         this.servicesNum=now
-         this.total=num
-        })
-      }
+<script>
+  import {
+    selectTotal
+  } from '@/api/assertReport'
+export default {
+ 
+  components: {},
+
+  mounted() {
+    this.selectAllTotal()
+  },
+  data() {
+    //这里存放数据
+    return {
+     total:'',
+      servicesNum: [],
+    }
+  },
+
+  methods: {
+
+    selectAllTotal(){
+      selectTotal().then((res) => {
+        let result=res.data.data.total
+        let now=[]
+        let num=0;  
+        for(let i=0;i<result.length;i++){
+          if(result[i].type!=='知识库'){
+            now.push(result[i])
+            num=num+Number(result[i].count)
+          }
+        } 
+       this.servicesNum=now
+       this.total=num
+      })
+    }
+}
+}
+</script>
+<style lang='less' scoped>
+  @keyframes turn {
+  0% {
+    border-image: linear-gradient(to right, #003194, #00ffea) 1;
   }
+  25% {
+    border-image: linear-gradient(to bottom, #003194, #00ffea) 1;
   }
-  </script>
-  <style lang='less' scoped>
-    @keyframes turn {
-    0% {
-      border-image: linear-gradient(to right, #003194, #00ffea) 1;
-    }
-    25% {
-      border-image: linear-gradient(to bottom, #003194, #00ffea) 1;
-    }
-    50% {
-      border-image: linear-gradient(to left, #003194, #00ffea) 1;
-    }
-    75% {
-      border-image: linear-gradient(to top, #003194, #00ffea) 1;
-    }
-    100% {
-      border-image: linear-gradient(to right, #003194, #00ffea) 1;
-    }
+  50% {
+    border-image: linear-gradient(to left, #003194, #00ffea) 1;
   }
-  .jiesheng{
-    margin:8px 8px;
+  75% {
+    border-image: linear-gradient(to top, #003194, #00ffea) 1;
+  }
+  100% {
+    border-image: linear-gradient(to right, #003194, #00ffea) 1;
+  }
+}
+.jiesheng{
+  margin:8px 8px;
+    text-align: center;
+  color: #f4fcfe; border-color: #107bb0;
+    box-shadow: 1px 1px 5px 1px RGB(16, 123, 176, 0.8) inset
+    }
+.top5-content::-webkit-scrollbar {
+  width: 6px;
+  /*height: 4px;*/
+}
+
+.top5-content::-webkit-scrollbar-thumb {
+  background-color: #00deff;
+}
+.map-search-result::-webkit-scrollbar-track,
+.top5-content::-webkit-scrollbar-track {
+  background-color: #424748;
+}
+@keyframes topup50 {
+  from {
+    top: 50%;
+  }
+  to {
+    top: -100%;
+  }
+}
+.right-survey {
+
+  height: 100%;
+  color: #f0fafa;
+  font-size: 18px;
+  display: flex;
+  flex-direction: column;
+
+
+  .platform-overview-bottom {
+    margin-top: 20px;
+    width: 100%;
+    height: 1.78rem;
+    background: rgba(0, 108, 188, 0.2);
+    border-radius: 2px;
+    border: 1px solid rgba(0, 108, 188, 0.7);
+    text-decoration: none;
+    outline: none;
+    -webkit-transition: all 100ms ease-out;
+    -moz-transition: all 100ms ease-out;
+    transition: all 100ms ease-out;
+    .top {
+      font-size: 24px;
+      background: url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
+      background-size: 100% 100%;
       text-align: center;
-    color: #f4fcfe; border-color: #107bb0;
-      box-shadow: 1px 1px 5px 1px RGB(16, 123, 176, 0.8) inset
-      }
-  .top5-content::-webkit-scrollbar {
-    width: 6px;
-    /*height: 4px;*/
-  }
-  
-  .top5-content::-webkit-scrollbar-thumb {
-    background-color: #00deff;
-  }
-  .map-search-result::-webkit-scrollbar-track,
-  .top5-content::-webkit-scrollbar-track {
-    background-color: #424748;
-  }
-  @keyframes topup50 {
-    from {
-      top: 50%;
+
     }
-    to {
-      top: -100%;
-    }
-  }
-  .right-survey {
-  
-    height: 100%;
-    color: #f0fafa;
-    font-size: 18px;
-    display: flex;
-    flex-direction: column;
-  
-  
-    .platform-overview-bottom {
+    .bottom {
       margin-top: 20px;
-      width: 100%;
-      height: 1.78rem;
-      background: rgba(0, 108, 188, 0.2);
-      border-radius: 2px;
-      border: 1px solid rgba(0, 108, 188, 0.7);
-      text-decoration: none;
-      outline: none;
-      -webkit-transition: all 100ms ease-out;
-      -moz-transition: all 100ms ease-out;
-      transition: all 100ms ease-out;
-      .top {
-        font-size: 24px;
-        background: url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
-        background-size: 100% 100%;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 0px 10px;
+      .component-services-content-right-left-content-son {
+        background: url('~@/assets/capabilityCloud/Component_services_snum.png')
+          no-repeat;
+        background-size: 1.1rem 0.59rem;
+        background-position: center;
         text-align: center;
-  
-      }
-      .bottom {
-        margin-top: 20px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        padding: 0px 10px;
-        .component-services-content-right-left-content-son {
-          background: url('~@/assets/capabilityCloud/Component_services_snum.png')
-            no-repeat;
-          background-size: 1.1rem 0.59rem;
-          background-position: center;
-          text-align: center;
-       
-          & > p:first-child {
-            color: #ffffff;
-            font-size: 0.16rem;
-            line-height: 0.16rem;
-            margin-bottom: 0.12rem;
-          }
-          & > p:last-child {
-            color: #1ef6f5;
-            font-size: 0.28rem;
-            line-height: 0.28rem;
-            padding-bottom: 0.24rem;
-            margin: 10px 45px;
-          }
+     
+        & > p:first-child {
+          color: #ffffff;
+          font-size: 0.16rem;
+          line-height: 0.16rem;
+          margin-bottom: 0.12rem;
+        }
+        & > p:last-child {
+          color: #1ef6f5;
+          font-size: 0.28rem;
+          line-height: 0.28rem;
+          padding-bottom: 0.24rem;
+          margin: 10px 45px;
         }
       }
     }
-    .platform-overview-bottom:hover {
-    border: 2px solid;
-    animation: turn 5s linear infinite;
   }
-  }
-  </style>
-  
\ No newline at end of file
+  .platform-overview-bottom:hover {
+  border: 2px solid;
+  animation: turn 5s linear infinite;
+}
+}
+</style>
diff --git a/front/src/views/assertReport/image/xing2.png b/front/src/views/assertReport/image/xing2.png
new file mode 100644
index 0000000000000000000000000000000000000000..b5fd56e79092da226030f3cdc49e47ee3de3e538
GIT binary patch
literal 442
zcmV;r0Y(0aP)<h;3K|Lk000e1NJLTq000#L000#T1^@s6sTZY|00001b5ch_0Itp)
z=>Px$bV)=(R5(wy)xAmsK@^7J_r$_N3!_(%LTeFXqlFhCSQ^<)#2+lwSel5P(M~P0
z8`Q!=y$K6NFujGj13@FAfgt2amL%kNXANXws`=*O%$Z?U7{Dh%O?6n1IQK#Ffl$pd
zO^7E1TP&_ka4^*24q*{^p~Q@AQTBt4sOGRx+y){Xip754sNOQf7X={Fgp~LtB5S<$
zf_*DhmlI&SW3iAGi&Z14r%W)+BvKp76tLv8%^QSQl!7<P6l9b4YTm0<9nuIX)2SNg
zl>>>B9vtdbo8t&2X{@GqBQs*L*VukNr!Hr}dLQt)*lg6-b)3GsTmsAgfUm?R)|~Hp
zrPSpCm<s?uip_j`t~=`Rfe<#LN>SpB8&S<LLYQwOSPv8#l_WpD+t(~nLOcgXE6hrQ
zya|mF;-UquU24sdLP@vGRalXPcestO^Yk5d5RSb>4QsEu1y^<@?!6H{Xtk$fM1#EY
k)xQCs<c&QI+)JO}ADGo~7RVAF>Hq)$07*qoM6N<$f*3x&;Q#;t

literal 0
HcmV?d00001

diff --git a/front/src/views/capabilityCloud/components/DataResources.vue b/front/src/views/capabilityCloud/components/DataResources.vue
index b4dba74f..4ec3d64a 100644
--- a/front/src/views/capabilityCloud/components/DataResources.vue
+++ b/front/src/views/capabilityCloud/components/DataResources.vue
@@ -1,8 +1,8 @@
 <!--
  * @Author: hisense.liangjunhua
  * @Date: 2022-06-19 10:15:33
- * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-06-27 12:52:18
+ * @LastEditors: hisense.wuhongjian
+ * @LastEditTime: 2022-11-28 16:23:25
  * @Description: 告诉大家这是什么
 -->
 <template>
@@ -50,10 +50,10 @@
       name: '总申请次数',
       num: '',
     },
-    {
-      name: '满足率',
-      num: '',
-    },
+    // {
+    //   name: '满足率',
+    //   num: '',
+    // },
   ])
   // 右侧数据
   const assignRankings = ref([
diff --git a/front/src/views/home/components/H5Player.vue b/front/src/views/home/components/H5Player.vue
index 1d008d7f..2d249f80 100644
--- a/front/src/views/home/components/H5Player.vue
+++ b/front/src/views/home/components/H5Player.vue
@@ -2,7 +2,7 @@
 海康H5Player
 -->
 <template>
-  <div :id="videoId" style="width: 800px; height: 600px; z-index: 9999"></div>
+  <div :id="videoId" ref="video333" style="width: 800px; height: 600px"></div>
 </template>
 <script>
   // const IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
@@ -41,6 +41,7 @@
         mseSupport: MSE_IS_SUPPORT,
         // tabActive: MSE_IS_SUPPORT ? 'mse' : 'decoder',
         tabActive: 'decoder',
+        videoDom: {},
         urls: {
           realplay: 'ws://10.19.147.22:559/EUrl/q2jQie4',
           talk: 'wss://10.41.163.126:6014/proxy/10.41.163.126:559/EUrl/6gFx47S',
@@ -70,18 +71,13 @@
     },
     created() {},
     mounted() {
-      this.init()
+      // this.init()
       mybus.emit('closeLoading', true)
       this.createPlayer()
-      this.arrangeWindow()
+      // this.arrangeWindow()
       if (this.unStopable) {
-        this.videoPlay(this.videoUrl, 0)
-      } else {
         this.realplay(this.videoUrl, 0)
       }
-      //videoUrl this.realplay(this.videoUrl,0);//循环传过来的数组进行播放，index根据选中的个数
-
-      //this.realplay('wss://10.134.135.44:6014/proxy/10.10.20.14:559/openUrl/y3mFfcA',0);
     },
     watch: {
       videoUrl: {
@@ -120,15 +116,18 @@
           //szId: 'player'+this.index,
           szId: this.videoId,
           szBasePath: '/util/', //引入静态资源地址，我这里静态资源在public/js文件存放，所以设置为js
-          iMaxSplit: 4,
-          iWidth: '800px',
-          iCurrentSplit: 4,
-          openDebug: true,
-          oStyle: {
-            borderSelect: '#FFCC00',
-          },
+          // iMaxSplit: 4,
+          // iWidth: '800px',
+          // iCurrentSplit: 4,
+          // openDebug: true,
+          // oStyle: {
+          //   borderSelect: '#FFCC00',
+          // },
         })
         let that = this
+        that.videoDom = that.$refs.video333.querySelector('video') || {}
+        // that.videoDom.autoplay = false
+
         // 事件回调绑定
         this.player.JS_SetWindowControlCallback({
           windowEventSelect: function (iWndIndex) {
@@ -138,8 +137,8 @@
           pluginErrorHandler: function (iWndIndex, iErrorCode, oError) {
             //插件错误回调
             console.log('pluginError callback: ', iWndIndex, iErrorCode, oError)
-            message.error('取流异常,请稍后尝试')
-            mybus.emit('closeLoading', false)
+            // message.error('取流异常,请稍后尝试')
+            // mybus.emit('closeLoading', false)
           },
           windowEventOver: function (iWndIndex) {
             //鼠标移过回调
@@ -159,16 +158,26 @@
           },
           firstFrameDisplay: function (iWndIndex, iWidth, iHeight) {
             //首帧显示回调
-            console.log(
-              'firstFrame loaded callback: ',
-              iWndIndex,
-              iWidth,
-              iHeight
-            )
-            // 如果是录像播放，首帧绘制完成后停止
-            if (!that.realTime) {
-              that.pausePlay(iWndIndex)
-            }
+            // console.log(
+            //   'firstFrame loaded callback: ',
+            //   iWndIndex,
+            //   iWidth,
+            //   iHeight
+            // )
+            // // 如果是录像播放，首帧绘制完成后停止
+            // if (!that.realTime) {
+              // that.pausePlay(iWndIndex)
+
+              setTimeout(()=>{
+                console.log('为何暂停会失效？？？')
+                that.videoDom.pause()
+              }, 4000)
+
+              // that.player.JS_Visibilitychange()
+              var canvas = that.$refs.video333.querySelector('canvas');
+              var context = canvas.getContext('2d');
+              context.save();
+            // }
             mybus.emit('closeLoading', false)
           },
           performanceLack: function () {
@@ -191,67 +200,29 @@
       // 初始化结束
       // 视频预览
       realplay(playURL, index1) {
+        let that = this
         this.realTime = false
         mybus.emit('closeLoading', true)
         setTimeout(() => {
           mybus.emit('closeLoading', false)
         }, 3000)
+        this.player.JS_Stop(0)
         this.mode = 0 //解码方式：0普通模式 1高级模式
         const { player, mode, urls } = this
-        // playURL = this.realplay
         console.log('视频播放地址', playURL)
-        // const startTime = {
-        //   startTime: ,
-        // }
-        // const endTime = {
-        //   endTime: ,
-        // }
-        player
-          .JS_Play(
-            playURL,
-            { playURL, mode },
-            index1,
-            '2022-11-22T10:00:00Z',
-            '2022-11-22T11:00:00Z'
-          )
-          .then(
-            () => {
-              console.log('realplay success')
-            },
-            (e) => {
-              console.error(e)
-              // message.error('错误代码:' + e)
-            }
-          )
-      },
-      // 实时播放
-      videoPlay(playURL, index1) {
-        let that = this
-        this.realTime = true
-        mybus.emit('closeLoading', true)
-        setTimeout(() => {
-          mybus.emit('closeLoading', false)
-        }, 3000)
-        if (!that.unStopable) {
-          message.warning('预览将在约6s后停止')
-          setTimeout(() => {
-            that.stopAllPlay()
-          }, 6000)
-        }
-        this.mode = 0 //解码方式：0普通模式 1高级模式
-        const { player, mode, urls } = this
-        // playURL = this.realplay
-        console.log('视频播放地址', playURL)
-        // const startTime = {
-        //   startTime: ,
-        // }
-        // const endTime = {
-        //   endTime: ,
-        // }
         player.JS_Play(playURL, { playURL, mode }, index1).then(
           () => {
-            console.log('realplay success')
-            // 预览时6s停止播放
+            // console.log('暂停视频流')
+            mybus.emit('closeLoading', false)
+            // that.videoDom.muted = false
+            console.log('视频DOM', player)
+            //     that.videoDom.addEventListener('play',function(){
+            //     console.log("触发暂停");
+            //     that.videoDom.pause()
+            // });
+            setTimeout(() => {
+              that.videoDom.pause()
+            }, 0)
           },
           (e) => {
             console.error(e)
@@ -272,20 +243,6 @@
           }
         )
       },
-      // 暂停单个视频
-      pausePlay(index) {
-        let that = this
-        this.player.JS_Pause(index).then(
-          () => {
-            console.log('暂停成功')
-          },
-          (e) => {
-            console.error(e)
-            // 暂停失败切换为实时播放
-            that.videoPlay(that.videoUrl, 0)
-          }
-        )
-      },
     },
     beforeUnmount() {
       console.log('关闭所有视频')
diff --git a/front/src/views/home/infrastructureApplication.vue b/front/src/views/home/infrastructureApplication.vue
index 16103708..13ee5cf1 100644
--- a/front/src/views/home/infrastructureApplication.vue
+++ b/front/src/views/home/infrastructureApplication.vue
@@ -2,7 +2,7 @@
  * @Author: Light
  * @Date: 2022-11-18 11:53:43
  * @LastEditors: Light
- * @LastEditTime: 2022-11-28 16:45:50
+ * @LastEditTime: 2022-11-29 11:50:25
  * @Description: 告诉大家这是什么
 -->
 <template>
@@ -28,7 +28,27 @@
           </a-list-item>
         </template>
         <template #header>
-          <div class="title">待申请列表</div>
+          <div class="title">
+            待申请列表
+            <a
+              style="
+                display: inline-block;
+                width: 60px;
+                height: 18px;
+                line-height: 18px;
+                text-align: center;
+                background: #1890ff;
+                border-radius: 3px;
+                font-size: 12px;
+                color: rgb(255, 255, 255);
+                cursor: pointer;
+                margin-left: 10px;
+              "
+              href="/static/download/InstallRootCert.exe"
+            >
+              证书下载
+            </a>
+          </div>
         </template>
         <template #footer>
           <a-button type="primary" @click="showApply">一键申请</a-button>
diff --git a/front/src/views/home/infrastructurePageXha.vue b/front/src/views/home/infrastructurePageXha.vue
index af23767d..7acd9a99 100644
--- a/front/src/views/home/infrastructurePageXha.vue
+++ b/front/src/views/home/infrastructurePageXha.vue
@@ -409,7 +409,8 @@
         v-loading="spinningHome"
         element-loading-text="Loading..."
         element-loading-svg-view-box="-10, -10, 50, 50"
-        element-loading-background="rgba(122, 122, 122, 0.8)"
+        element-loading-background="rgba(122, 122, 122, 0.9)"
+        :element-loading-svg="svg"
       >
         <video-surveillance></video-surveillance>
       </div>
@@ -714,6 +715,16 @@
   const spinning = ref(true)
   const whoShow1 = ref(whoShow)
   const isXiHaiAn = whoShow1.value.itShowXiHaiAn
+  const svg = `
+        <path class="path" d="
+          M 30 15
+          L 28 17
+          M 25.61 25.61
+          A 15 15, 0, 0, 1, 15 30
+          A 15 15, 0, 1, 1, 27.99 7.5
+          L 15 15
+        " style="stroke-width: 4px; fill: rgba(0, 0, 0, 0)"/>
+      `
   const options = reactive({
     width: '912px', //播放器宽度
     height: '513px', //播放器高度