Merge branch 'hi-ucs-dev' of http://124.222.94.39:3000/wuhongjian/hi-ucs into hi-ucs-dev

front/public/static/config/basicConfig.js

@@ -2,13 +2,13 @@
  * @Author: hisense.wuhongjian
  * @Date: 2020-07-07 16:03:23
  * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-11-27 23:42:04
+ * @LastEditTime: 2022-11-29 11:21:41
  * @Description: 系统静态参数配置
  */
 var _global = {}
 var CONFIGITEM = {
-  // version: 'qingdao', //青岛
+  version: 'qingdao', //青岛
-  version: 'xihaian', // 西海岸
+  // version: 'xihaian', // 西海岸
   // version: 'dev', // 开发
   // version: 'zhanTingDev', // 展厅dev (2022-09-13:姜永超让添加)
   // version: 'qingdao', // 测试

front/src/api/assertReport.js

@@ -1,3 +1,10 @@
+/*
+ * @Author: hisense.wuhongjian
+ * @Date: 2022-11-28 16:43:10
+ * @LastEditors: hisense.wuhongjian
+ * @LastEditTime: 2022-11-29 11:35:36
+ * @Description: 告诉大家这是什么
+ */
 import request from '@/utils/request'
 //获取中间地图
 export function getDistrictFundStatement() {

front/src/views/assertReport/components/ReservoirBottom.vue

@@ -1,7 +1,5 @@
-
 <template>
   <div class="right-survey">
-  
     <div class="platform-overview-bottom">
       <div class="top"><span class="title">资源汇聚总量</span></div>
       <div class="bottom">
@@ -19,11 +17,8 @@
 </template>
 
 <script>
-    import {
+  import { selectTotal } from '@/api/assertReport'
-      selectTotal
-    } from '@/api/assertReport'
   export default {
-   
     components: {},
 
     mounted() {
@@ -32,22 +27,22 @@
     data() {
       //这里存放数据
       return {
-       
         servicesNum: [],
       }
     },
 
     methods: {
-
       selectAllTotal() {
         selectTotal().then((res) => {
-         this.servicesNum=res.data.data.total
+          this.servicesNum = res.data.data.total.filter(
+            (item) => item.type !== '知识库'
+          )
         })
-      }
+      },
-  }
+    },
   }
 </script>
-  <style lang='less' scoped>
+<style lang="less" scoped>
   @keyframes turn {
     0% {
       border-image: linear-gradient(to right, #003194, #00ffea) 1;
@@ -86,14 +81,12 @@
     }
   }
   .right-survey {
-  
     height: 100%;
     color: #f0fafa;
     font-size: 18px;
     display: flex;
     flex-direction: column;
 
-  
     .platform-overview-bottom {
       margin-top: 20px;
       width: 100%;
@@ -108,10 +101,10 @@
       transition: all 100ms ease-out;
       .top {
         font-size: 24px;
-        background: url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
+        background: url('~@/assets/capabilityCloud/infrastructure_title.png')
+          no-repeat;
         background-size: 100% 100%;
         text-align: center;
-  
       }
       .bottom {
         margin-top: 20px;
@@ -148,4 +141,3 @@
     }
   }
 </style>
-  

front/src/views/assertReport/components/ReservoirRight.vue

@@ -1,4 +1,3 @@
-
 <template>
   <div class="right-survey">
     <!--最上面 部门排行榜-->
@@ -7,7 +6,7 @@
       <div class="bottom1">
         <div class="bottom-item">
           <div class="inner-title">
-            <p style="width: 220px">市级部门共享贡献资金排行</p>
+            <p style="width: 220px">市级部门共享节省资金排行</p>
           </div>
           <div class="left-list">
             <div class="left-list1">排行</div>
@@ -87,7 +86,7 @@
         </div> -->
         <div class="bottom-item">
           <div class="inner-title">
-            <p style="width: 220px">市级部门审评节省资金排行</p>
+            <p style="width: 220px">市级部门申请节省资金排行</p>
           </div>
           <div class="left-list">
             <div class="left-list1">排行</div>
@@ -115,7 +114,7 @@
       <div class="bottom2">
         <div class="bottom-item">
           <div class="inner-title">
-            <p style="width: 220px">区市部门共享贡献资金排行</p>
+            <p style="width: 220px">区市部门共享节省资金</p>
           </div>
           <div class="left-list">
             <div class="left-list1">序号</div>
@@ -146,7 +145,7 @@
         </div>
         <div class="bottom-item">
           <div class="inner-title">
-            <p style="width: 220px">区市部门申请节省资金排行</p>
+            <p style="width: 220px">区市部门申请节省资金</p>
           </div>
           <div class="left-list">
             <div class="left-list1">序号</div>
@@ -205,7 +204,7 @@ import {
   export default {
     components: {},
     created() {},
-  destroyed() {},
+    unmounted() {},
 
     mounted() {
       this.getgetProvideDeptFund()
@@ -314,7 +313,7 @@ export default {
     },
   }
 </script>
-<style lang='less' scoped>
+<style lang="less" scoped>
   @keyframes turn {
     0% {
       border-image: linear-gradient(to right, #003194, #00ffea) 1;
@@ -373,17 +372,19 @@ export default {
       transition: all 100ms ease-out;
       .top {
         font-size: 24px;
-      background: url('~@/assets/capabilityCloud/infrastructure_title.png')  no-repeat;
+        background: url('~@/assets/capabilityCloud/infrastructure_title.png')
+          no-repeat;
         background-size: 100% 100%;
         text-align: center;
       }
       .bottom1 {
         margin-top: 10px;
         width: 100%;
-      display: table;
+        // display: flex;
         justify-content: space-between;
         align-items: center;
-      height: 1.8rem;
+        height: 2.5rem;
+        overflow-y: auto;
         .bottom-item {
           width: 98%;
         }
@@ -395,7 +396,7 @@ export default {
         display: table;
         justify-content: space-between;
         align-items: center;
-      height: 4.0rem;
+        height: 4rem;
         .bottom-item {
           width: 48%;
         }
@@ -503,7 +504,8 @@ export default {
       transition: all 100ms ease-out;
       .top {
         font-size: 24px;
-      background: url('~@/assets/capabilityCloud/infrastructure_title.png')  no-repeat;
+        background: url('~@/assets/capabilityCloud/infrastructure_title.png')
+          no-repeat;
         background-size: 100% 100%;
         text-align: center;
       }

front/src/views/assertReport/components/ReservoirThumbnail.vue

@@ -1,8 +1,8 @@
 <!--
 * @Author: hisense.xiaoshangqing
 * @Date: 2022-7-26 10:00:48
-* @LastEditors: xiaoshangqing
+ * @LastEditors: hisense.wuhongjian
-* @LastEditTime: 2022-07-27 16:56:55
+ * @LastEditTime: 2022-11-29 11:47:26
 * @Description: 水库专题首页缩略图 -->
 <template>
   <div class="river-course-view">
@@ -13,116 +13,96 @@
     <div class="topic-animation4 display-animation4"></div>
     <div class="topic-animation5 display-animation5"></div>
     <div class="topic-animation6 display-animation6"></div>
-
-
   </div>
 </template>
 
 <script>
-  import {
+  import { getProvideDistrictFundStatement } from '@/api/assertReport'
-    getDistrictFundStatement
-  } from '@/api/assertReport'
   import axios from 'axios'
-const echarts = require("echarts");
+  const echarts = require('echarts')
   export default {
     //import引入的组件需要注入到对象中才能使用
     components: {},
     data() {
       //这里存放数据
       return {
-
         districtData: [
           {
-          name: "市南区",
+            name: '市南区',
             value: [120.395966, 36.000892],
           },
           {
-          name: "市北区",
+            name: '市北区',
             value: [120.355026, 36.083819],
-  
           },
           {
-          name: "李沧区",
+            name: '李沧区',
             value: [120.421236, 36.188023],
-    
           },
           {
-          name: "崂山区",
+            name: '崂山区',
             value: [120.587393, 36.199569],
           },
           {
-          name: "城阳区",
+            name: '城阳区',
             value: [120.369135, 36.266833],
-    
           },
           {
-          name: "即墨区",
+            name: '即墨区',
             value: [120.517352, 36.490847],
-    
           },
           {
-          name: "莱西市",
+            name: '莱西市',
             value: [120.426226, 36.86009],
-      
           },
           {
-          name: "胶州市",
+            name: '胶州市',
             value: [120.010202, 36.235878],
-    
           },
           {
-          name: "平度市",
+            name: '平度市',
             value: [119.959012, 36.788828],
-   
           },
           {
-          name: "西海岸",
+            name: '西海岸新区',
             value: [119.895518, 35.875138],
-        
           },
         ],
-    
+      }
-    
-    };
     },
 
     mounted() {
-    this.findAllInfo();
+      this.findAllInfo()
     },
     //方法集合
     methods: {
       findAllInfo() {
-      getDistrictFundStatement().then((res) => {
+        getProvideDistrictFundStatement().then((res) => {
-        
           let districtData = this.districtData
           let resulrtData = res.data.data
           for (let i = 0; i < resulrtData.length; i++) {
             for (let j = 0; j < districtData.length; j++) {
-            if(resulrtData[i].districtName=districtData[j].name){
+              if (resulrtData[i].districtName === districtData[j].name) {
-              
+                districtData[j].num = resulrtData[i].applyPrice + '万'
-              districtData[j].num=resulrtData[i].applyPrice
               }
             }
           }
-     
+          console.log('上图数据', districtData)
           this.initMap(districtData)
         })
-
-     
       },
       initMap(data) {
-      this.loadedDataUrl = "./static/qingdao.json";
+        this.loadedDataUrl = './static/qingdao.json'
         let _this = this
-      axios.get(_this.loadedDataUrl, {}) .then(geoJson =>{
+        axios.get(_this.loadedDataUrl, {}).then((geoJson) => {
-
+          _this.myChart = echarts.init(_this.$refs.qdCityMap)
-        _this.myChart = echarts.init(_this.$refs.qdCityMap);
+          echarts.registerMap('qingdao', geoJson.data)
-        echarts.registerMap("qingdao", geoJson.data);
+          const imgBack = new Image()
-        const imgBack = new Image();
+          imgBack.src = './static/assets/map-back.png'
-        imgBack.src = "./static/assets/map-back.png";
+          const img = new Image()
-        const img = new Image();
+          img.src = './static/assets/echarts-map-bak.png'
-        img.src = "./static/assets/echarts-map-bak.png";
+          const typeImg = new Image()
-        const typeImg = new Image();
+          typeImg.src = './static/assets/reservoir-type-bak.png'
-        typeImg.src = "./static/assets/reservoir-type-bak.png";
 
           _this.option = {
             visualMap: {
@@ -130,12 +110,12 @@ export default {
               max: 100,
               seriesIndex: 1,
               inRange: {
-              color: ["#000000", "yellow", "pink"],
+                color: ['#000000', 'yellow', 'pink'],
               },
             },
             geo: [
               {
-              map: "qingdao",
+                map: 'qingdao',
                 roam: false, // 是否允许缩放
                 aspectScale: 0.8,
                 zoom: 1.1, // 默认显示级别
@@ -144,14 +124,14 @@ export default {
                 label: {
                   show: true, //是否显示市
                   textStyle: {
-                  color: "#ffffff", //文字颜色
+                    color: '#ffffff', //文字颜色
                     fontSize: 16, //文字大小
-                  fontFamily: "微软雅黑",
+                    fontFamily: '微软雅黑',
-                  backgroundColor: "rgba(0,0,0,0)", //透明度0清空文字背景
+                    backgroundColor: 'rgba(0,0,0,0)', //透明度0清空文字背景
                   },
                 },
                 itemStyle: {
-                borderColor: "#25e8ff",
+                  borderColor: '#25e8ff',
                   borderWidth: 2,
                   /* areaColor: "#004d8e", //rgba设置透明度0
                   shadowColor: "#10daff",
@@ -160,12 +140,12 @@ export default {
                 opacity: 0.53, */
                   areaColor: {
                     image: img,
-                  repeat: "repeat",
+                    repeat: 'repeat',
                   },
                 },
                 emphasis: {
                   disabled: false,
-                focus: "none",
+                  focus: 'none',
                   itemStyle: {
                     color: null,
                   },
@@ -176,15 +156,15 @@ export default {
                 },
               },
               {
-              map: "qingdao",
+                map: 'qingdao',
                 aspectScale: 0.8,
                 roam: false, // 是否允许缩放
                 zoom: 1.1, // 默认显示级别
                 top: 105,
                 z: 4,
                 itemStyle: {
-                areaColor: "#1864a5",
+                  areaColor: '#1864a5',
-                borderColor: "transparent",
+                  borderColor: 'transparent',
                 },
                 silent: true,
                 tooltip: {
@@ -192,15 +172,15 @@ export default {
                 },
               },
               {
-              map: "qingdao",
+                map: 'qingdao',
                 aspectScale: 0.8,
                 roam: false, // 是否允许缩放
                 zoom: 1.1, // 默认显示级别
                 top: 110,
                 z: 3,
                 itemStyle: {
-                areaColor: "#1864a5",
+                  areaColor: '#1864a5',
-                borderColor: "transparent",
+                  borderColor: 'transparent',
                   borderWidth: 2,
                 },
                 silent: true,
@@ -209,19 +189,19 @@ export default {
                 },
               },
               {
-              map: "qingdao",
+                map: 'qingdao',
                 aspectScale: 0.8,
                 roam: true, // 是否允许缩放
                 zoom: 1.1, // 默认显示级别
                 top: 115,
                 z: 2,
                 itemStyle: {
-                areaColor: "#1864a5",
+                  areaColor: '#1864a5',
                   //borderColor: "#0f3866",
-                borderColor: "transparent",
+                  borderColor: 'transparent',
                   borderWidth: 1,
-                shadowColor: "#808080", // 外部阴影
+                  shadowColor: '#808080', // 外部阴影
-                shadowBlur: "10",
+                  shadowBlur: '10',
                 },
                 silent: true,
                 tooltip: {
@@ -278,9 +258,9 @@ export default {
                   normal: {
                     show: true,
                     formatter: function (params) {
-                    var name = params.data.num;
+                      var name = params.data.num
-                    var text = `{fline|${name}}`;
+                      var text = `{fline|${name}}`
-                    return text;
+                      return text
                     },
                     color: '#fff',
                     rich: {
@@ -308,19 +288,16 @@ export default {
                 itemStyle: {
                   color: '#e3e00a',
                 },
-              symbol: "image://static/assets/reservoir-type-bak.png",
+                symbol: 'image://static/assets/reservoir-type-bak.png',
                 symbolSize: [84, 28],
                 symbolOffset: [0, -30],
                 z: 999,
                 data: data, //企业名称
               },
-
-
-
             ],
-        };
+          }
-        _this.myChart.setOption(_this.option);
+          _this.myChart.setOption(_this.option)
-        _this.myChart.on("click", (params) => {
+          _this.myChart.on('click', (params) => {
             //  console.log("点的是什么", params);
             // //进入对应区的三维地图
             // //跟右下角菜单切换触发调用方法一样，但是要传递区划参数，区划name
@@ -334,31 +311,28 @@ export default {
             //   latitude:_this.districtData[index].value[1],
             // };
             // _this.$emit('jumpIntoMap',districtObject);
-        });
+          })
-      });
+        })
       },
-
-
-
     },
 
     beforeCreate() {}, //生命周期 - 创建之前
     beforeMount() {}, //生命周期 - 挂载之前
     beforeUpdate() {}, //生命周期 - 更新之前
     updated() {}, //生命周期 - 更新之后
-  beforeDestroy() {}, //生命周期 - 销毁之前
+    beforeUnmount() {}, //生命周期 - 销毁之前
-  destroyed() {}, //生命周期 - 销毁完成
+    unmounted() {}, //生命周期 - 销毁完成
     activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
-};
+  }
 </script>
-<style lang='less' scoped>
+<style lang="less" scoped>
   //@import url(); 引入公共css类
 
   .river-course-view {
     position: relative;
     width: 100%;
     height: 100%;
-  background: url("~@/assets/common/homePage/big-bak.png") no-repeat;
+    background: url('~@/assets/common/homePage/big-bak.png') no-repeat;
     background-size: 100% 100%;
     .city-map-content-echarts {
       width: 10rem;
@@ -450,7 +424,7 @@ export default {
       position: absolute;
 
       margin: 0px auto;
-    background-image: url("~@/assets/common/homePage/animation1.png");
+      background-image: url('~@/assets/common/homePage/animation1.png');
       background-size: cover;
     }
     .display-animation1 {
@@ -462,7 +436,7 @@ export default {
       position: absolute;
 
       margin: 0px auto;
-    background-image: url("~@/assets/common/homePage/animation2.png");
+      background-image: url('~@/assets/common/homePage/animation2.png');
       background-size: cover;
     }
     .display-animation2 {
@@ -474,7 +448,7 @@ export default {
       position: absolute;
 
       margin: 0px auto;
-    background-image: url("~@/assets/common/homePage/animation3.png");
+      background-image: url('~@/assets/common/homePage/animation3.png');
       background-size: cover;
     }
     .display-animation3 {
@@ -486,7 +460,7 @@ export default {
       position: absolute;
 
       margin: 0px auto;
-    background-image: url("~@/assets/common/homePage/animation4.png");
+      background-image: url('~@/assets/common/homePage/animation4.png');
       background-size: cover;
     }
     .display-animation4 {
@@ -498,7 +472,7 @@ export default {
       position: absolute;
 
       margin: 0px auto;
-    background-image: url("~@/assets/common/homePage/animation5.png");
+      background-image: url('~@/assets/common/homePage/animation5.png');
       background-size: cover;
     }
     .display-animation5 {
@@ -510,7 +484,7 @@ export default {
       position: absolute;
 
       margin: 0px auto;
-    background-image: url("~@/assets/common/homePage/animation6.png");
+      background-image: url('~@/assets/common/homePage/animation6.png');
       background-size: cover;
     }
     .display-animation6 {

front/src/views/assertReport/index.vue

@@ -1,9 +1,6 @@
 <!--  -->
 <template>
-
-
   <div class="capability-cloud">
-
     <div class="header">
       <span class="title" @click="goHome">城市云脑通用能力服务平台</span>
     </div>
@@ -19,8 +16,9 @@
         </template>
         <div class="mianJi">万元</div>
       </div>
-      <div style="  color: #bed1df; font-size: 16px">注：资源参考价格由部门提供或参考市场价格设定</div>
+      <div style="color: #bed1df; font-size: 16px">
-
+        注：资源参考价格由部门提供或参考市场价格设定
+      </div>
     </div>
     <!--左侧-->
     <div class="reservoir-left">
@@ -41,40 +39,35 @@
     <!--下方-->
     <div class="bottom">
       <reservoir-bottom />
-
     </div>
   </div>
-
 </template>
 
 <script>
-import {
+  import { getApplyPriceCount } from '@/api/assertReport'
-  getApplyPriceCount
+  import ReservoirThumbnail from './components/ReservoirThumbnail.vue'
-  } from '@/api/assertReport'
+  import ReservoirLeft from './components/ReservoirLeft'
-  import ReservoirThumbnail from "./components/ReservoirThumbnail.vue";
+  import ReservoirRight from './components/ReservoirRight'
-import ReservoirLeft from "./components/ReservoirLeft";
+  import ReservoirBottom from './components/ReservoirBottom'
-  import ReservoirRight from "./components/ReservoirRight";
+  import { NumbersConvertedToArrays } from '@/utils/arrayMethod.js'
-  import ReservoirBottom from "./components/ReservoirBottom";
-  import { NumbersConvertedToArrays } from "@/utils/arrayMethod.js";
   export default {
     //import引入的组件需要注入到对象中才能使用
     components: {
       ReservoirThumbnail,
       ReservoirLeft,
       ReservoirRight,
-    ReservoirBottom
+      ReservoirBottom,
-
     },
     data() {
       //这里存放数据
       return {
         saveMonmy: [],
-      model: "common",
+        model: 'common',
-      dialogTitle: "周边视频",
+        dialogTitle: '周边视频',
         videoAnalysisDialogVisible: false, //视频分析弹窗显示标志位
         riverCourseHistoryDialogVisible: false, //河道历史弹窗
         riverDetailInfo: {}, //河道具体信息用于历史弹窗显示数据
-      dialogType: "add",
+        dialogType: 'add',
         dialogData: {},
         dangerReportDialogVisible: false,
         positionInfo: null,
@@ -82,11 +75,11 @@ export default {
         districtOptions: [], //区划数组
         isThumbnail: true, //是否为地图缩略图
         tabindex: 0, //3d地图选中的tab。
-      listType:"",//水库列表的类型，普通列表 “”，预警列表 warnig
+        listType: '', //水库列表的类型，普通列表 “”，预警列表 warnig
         basicInfo: {}, //水库详情信息
         type: '',
-      callSource:"indexPage",
+        callSource: 'indexPage',
-    };
+      }
     },
     //监听属性 类似于data概念
     computed: {},
@@ -96,17 +89,15 @@ export default {
     methods: {
       getSaveMoney() {
         getApplyPriceCount().then((res) => {
-     
           this.saveMonmy = NumbersConvertedToArrays(res.data.data)
         })
-    }
+      },
     },
 
     mounted() {
       this.getSaveMoney()
     },
-
+  }
-};
 </script>
 <style lang="less">
   @font-face {
@@ -135,7 +126,7 @@ export default {
     }
   }
 </style>
-<style lang='less' scoped>
+<style lang="less" scoped>
   // 此处去掉scoped为修改date-picker背景色，所以业务样式都应放在reservoir层级中，避免影响
   //@import url(); 引入公共css类
   .module-header-container {
@@ -167,7 +158,6 @@ export default {
       text-align: center;
 
       height: 1.8rem;
-
     }
     .header1 {
       top: 78px;
@@ -189,8 +179,8 @@ export default {
           // line-height: 45px;
           color: #fed93f;
           font-weight: bold;
-            background: url("~@/assets/capabilityCloud/num_bg.png") 
+          background: url('~@/assets/capabilityCloud/num_bg.png') 100% 100%
-            100% 100% no-repeat;
+            no-repeat;
           background-size: 100%;
           text-align: center;
           font-size: 34px;
@@ -199,7 +189,7 @@ export default {
           font-family: DinPro-Bold;
         }
         .mianJi {
-            margin-top: 6px;;
+          margin-top: 6px;
           margin-right: 3px;
           font-size: 22px;
           float: right;
@@ -285,6 +275,4 @@ export default {
       border-color: #009ab3;
     }
   }
-
-
 </style>

front/src/views/capabilityCloud/components/DataResources.vue

@@ -1,8 +1,8 @@
 <!--
  * @Author: hisense.liangjunhua
  * @Date: 2022-06-19 10:15:33
- * @LastEditors: hisense.liangjunhua
+ * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-06-27 12:52:18
+ * @LastEditTime: 2022-11-28 16:23:25
  * @Description: 告诉大家这是什么
 -->
 <template>
@@ -50,10 +50,10 @@
       name: '总申请次数',
       num: '',
     },
-    {
+    // {
-      name: '满足率',
+    //   name: '满足率',
-      num: '',
+    //   num: '',
-    },
+    // },
   ])
   // 右侧数据
   const assignRankings = ref([

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,
+          // iMaxSplit: 4,
-          iWidth: '800px',
+          // iWidth: '800px',
-          iCurrentSplit: 4,
+          // iCurrentSplit: 4,
-          openDebug: true,
+          // openDebug: true,
-          oStyle: {
+          // oStyle: {
-            borderSelect: '#FFCC00',
+          //   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('取流异常,请稍后尝试')
+            // message.error('取流异常,请稍后尝试')
-            mybus.emit('closeLoading', false)
+            // mybus.emit('closeLoading', false)
           },
           windowEventOver: function (iWndIndex) {
             //鼠标移过回调
@@ -159,16 +158,26 @@
           },
           firstFrameDisplay: function (iWndIndex, iWidth, iHeight) {
             //首帧显示回调
-            console.log(
+            // console.log(
-              'firstFrame loaded callback: ',
+            //   'firstFrame loaded callback: ',
-              iWndIndex,
+            //   iWndIndex,
-              iWidth,
+            //   iWidth,
-              iHeight
+            //   iHeight
-            )
+            // )
-            // 如果是录像播放，首帧绘制完成后停止
+            // // 如果是录像播放，首帧绘制完成后停止
-            if (!that.realTime) {
+            // if (!that.realTime) {
-              that.pausePlay(iWndIndex)
+              // 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')
+            // console.log('暂停视频流')
-            // 预览时6s停止播放
+            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('关闭所有视频')