电视墙

lawenforcement-ui/src/views/lawenforcement/record/DetailsVue.vue

@@ -199,7 +199,7 @@
                  customClass="videoCustomWidth"
                  @close="destroy" append-to-body
       >
-        <div id="dssPreview" style="width:1020px;height:625px;position:relative;"></div>
+        <div id="dssPreview" style="width:1020px;height:625px;"></div>
       </el-dialog>
       <!--海康预览回放窗口-->
       <!--预览-->
@@ -268,6 +268,7 @@ export default {
       /***大华***/
       dssPreviewTitle: '',
       dssPreviewVisible: false,
+      ctrl: 'ctrl1',
       /***海康***/
       cameraTitle: '',
       cameraVisible: false,
@@ -415,7 +416,7 @@ export default {
             this.ws.on('loginState', (res) => {
               this.isLogin = res
               if (res) {
-                this.alertLoginSuccess()
+                /*this.alertLoginSuccess()*/
                 this.activePanel = 'key2'
                 let channelList = []
                 for (let i = 0; i < cameraCode.length; i++) {
@@ -433,6 +434,119 @@ export default {
         })
       })
     },
+    careteListJson(cameraCode, cameraName, deviceCode=null, deviceSn=null, deviceProtocolType=null, deviceLoginType=null) {
+      const treeLabels = [{
+        'id': null,
+        'labelCode': '999',
+        'labelName': '电视墙',
+        'cameraType': null,
+        'parentLabelCode': ''
+      },
+        {
+          'id': null,
+          'labelCode': cameraCode,
+          'labelName': cameraName,
+          'cameraType': '1',
+          'parentLabelCode': '999'
+        }]
+      const channelDates = []
+      for (let i in cameraCode) {
+        let currentParams = {
+          'channelCode': cameraCode,
+          'channelName': cameraName,
+          'channelSn': null,
+          'cameraType': '1',
+          'online': '1',
+          'cameraCode': '1'
+        };
+        if (deviceCode!== null) {
+          currentParams.deviceCode = deviceCode;
+        }
+        if (deviceSn!== null) {
+          currentParams.deviceSn = deviceSn;
+        }
+        if (deviceProtocolType!== null) {
+          currentParams.deviceProtocolType = deviceProtocolType;
+        }
+        if (deviceLoginType!== null) {
+          currentParams.deviceLoginType = deviceLoginType;
+        }
+        channelDates.push(currentParams);
+      }
+      const labelChannels = [{
+        'labelCode': cameraCode,
+        'channelDates': channelDates
+      }]
+      let tvListJson = [{
+        'switchTab': '2',
+        'treeLabels': treeLabels,
+        'labelChannels': labelChannels
+      }]
+      console.log('11111111111111111111111111', {
+        cameraCode, cameraName, deviceCode, deviceSn, deviceProtocolType, deviceLoginType
+      })
+      return tvListJson
+    },
+    create(tvListJson, channelList, domId, ctrlType) { // 调用创建控件接口
+      let _this = this
+      const params = [
+        {
+          'ctrlType': ctrlType,
+          'ctrlCode': 'ctrl1',
+          'ctrlProperty': {
+            'displayMode': 1,
+            'splitNum': 1,
+            'channelList': [
+              {
+                'channelId': ''
+              }
+            ]
+          },
+          'visible': true,
+          'domId': domId
+        }
+      ]
+      this.setPos(domId)
+      this.customizeTree(tvListJson)
+      _this.ws.createCtrl(params)
+    },
+    setPos(domId) {
+      let target = document.getElementById(domId)
+      target.style.right = `19px`
+      target.style.top = `-20px`
+      target.style.width = `1070px`
+      target.style.height = `700px`
+      if (document.createEvent) {
+        var event = document.createEvent('HTMLEvents')
+        event.initEvent('resize', true, true)
+        window.dispatchEvent(event)
+      } else if (document.createEventObject) {
+        window.fireEvent('onresize')
+      }
+    },
+    destroy() { // 调用销毁控件接口
+      if (!this.isLogin) {
+        this.$modal.msgWarning('正在登陆客户端，请稍等......')
+        return false
+      }
+      const ctrls = this.ws.ctrls.map(i => {
+        if (i.ctrlCode === this.ctrl) {
+          return i.ctrlCode
+        }
+      })
+      this.ws.destroyCtrl(ctrls)
+    },
+    customizeTree(tvListJson) { // 调用控件接口树
+      const config = this.ws.config
+      const { loginIp, userCode } = config
+      this.ws.postMessage('customizeTree', {
+        loginIp,
+        userCode,
+        params: {
+          array: tvListJson
+        }
+      })
+    },
     /** ----------------------------------大华摄像头回放结束------------------------------------- */
     cancelEventLocationShow() {
       if (this.oWebControl != null) {
@@ -473,18 +587,6 @@ export default {
         funcName: 'stopAllPlayback'
       })
     },
-    destroy() { // 调用销毁控件接口
-      if (!this.isLogin) {
-        this.$modal.msgWarning('正在登陆客户端，请稍等......')
-        return false
-      }
-      const ctrls = this.ws.ctrls.map(i => {
-        if (i.ctrlCode === this.ctrl) {
-          return i.ctrlCode
-        }
-      })
-      this.ws.destroyCtrl(ctrls)
-    },
     hikDisconnect() {
       console.log('111')
       let that = this
@@ -509,3 +611,17 @@ export default {
   },
 };
 </script>
+
+<style rel="stylesheet/scss" lang="scss">
+  //视频摄像头预览弹层样式
+  .videoCustomWidth {
+    width: 1070px !important;
+    /*height: 760px !important;*/
+  }
+
+  //视频摄像头预览弹层样式
+  .videoCustomWidthPlayBack {
+    width: 1080px !important;
+    height: 780px !important;
+  }
+</style>