电视墙 信息组件

src/assets/styles/base.scss

@@ -89,8 +89,8 @@ $date-state3: #d6333b;
 }
 //电视墙视频摄像头预览弹层样式
 .TVWallCustomWidth {
-  width: 1500px !important;
-  height: 750px !important;
+  width: 1200px !important;
+  height: 740px !important;
 }
 
 //公共
@@ -226,21 +226,48 @@ ul {
   list-style: none;
 }
 
+
 .sj-container {
   width: 100%;
   height: 100vh;
 }
 .sj-icon-btn {
 
-  padding: 0 .3rem;
-  height: 1.5rem;
-  background-color: #112543;
-  color: $inBlue;
-  border: 1px $searchBorder;
+    padding: 0 .3rem;
+    height: 1.5rem;
+    background-color: #112543;
+    color: $inBlue;
+    border: 1px $searchBorder;
 }
 .sj-icon-btn:hover {
   text-shadow: 0 0 15px rgba($color: $inBlueHover, $alpha: 1.0);
 }
+.sj-upload{
+  .el-upload--picture-card{
+    background-color: #0d1620!important;
+    border: 1px dashed #083874;
+  }
+  .el-upload--picture-card i {
+    color: #153d6c;
+  }
+}
+// 下拉
+.el-select-dropdown {
+  border: none;
+  background-color: rgba(1, 28, 82, 0.8);
+}
+.el-select-dropdown__item{
+  color: $white;
+}
+.el-select-dropdown{
+  background-color: #00335c;
+  border: solid 1px #56dfff;
+  color: $white;
+}
+.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
+  background-color: #035faa;
+
+}
 //tips样式
 .js-tps{
 
@@ -310,7 +337,8 @@ ul {
     .d-l-con {
       width: 100%;
       box-shadow: none;
-      cursor: auto;
+      cursor:auto;
+
       .d-l-l-text {
         width: 100%;
         //white-space: nowrap;
@@ -359,8 +387,6 @@ div::-webkit-scrollbar {
   padding:.5rem .8rem;
 }
 
-
-
 .w-5 {
   width: 5.5rem;
 }
@@ -3256,6 +3282,7 @@ div::-webkit-scrollbar {
 .no_hover{
   cursor: auto;
 }
+
 // 20220927 林业修改
 .no_hover:hover{
 	background: none!important;
@@ -3265,7 +3292,7 @@ div::-webkit-scrollbar {
 	color:#2bacf7!important;
 }
 .no_hover:hover .event-count .count-number{
-  border: 2px solid rgba(58, 193, 255, 0.9);
+	border: 2px solid rgba(58, 193, 255, 0.9);
 	-webkit-box-shadow: 0 0 0.5rem 0 #2700ff inset;
 	box-shadow: 0 0 0.5rem 0 #2700ff inset;
 	background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(#55b8f7), to(#8f3bff));
@@ -3289,9 +3316,12 @@ div::-webkit-scrollbar {
 .no_hover .no-weight h4{
 	color:#2bacf7!important;
 }
+
+
 .el-message{
   z-index: 9999 !important;
 }
+
 #dom1{
-  min-width: 1148px;
+  min-width: 907px;
 }

src/components/TVWall.vue

@@ -2,28 +2,29 @@
   <div>
     <el-dialog :title="title" :visible.sync="TVWallVisible" v-if="TVWallVisible" customClass="TVWallCustomWidth"
                @close="cancelEventLocationShow()">
-	  <!--<div class="forthis" style="width: 22%; position: absolute;left: 0;z-index: 9999999999999;">-->
-	  	<!--&lt;!&ndash; <div class="this-title">-->
-	  		<!--<span>林场</span>-->
-	  		<!--<span>45</span>-->
-	  	<!--</div> &ndash;&gt;-->
-	  	<!--<div class="i-list-con" style="height: 46vh; overflow-y: scroll;">-->
-	  		<!--<span v-for="(item,index) in cameraList" :key="index">-->
-	  			<!--<div class="d-l-con" @click="playhk(item.channelCode)">-->
-	  				<!--<div class="d-l-l-text">-->
-	  					<!--<i class="i-small"></i>-->
-	  					<!--<h4>{{ item.cameraName }}</h4>-->
-	  				<!--</div>-->
-	  			<!--</div>-->
-	  		<!--</span>-->
-	  	<!--</div>-->
-	  <!--</div>-->
+      <!--<div class="forthis" style="width: 22%; position: absolute;left: 0;z-index: 9999999999999;">-->
+      <!--&lt;!&ndash; <div class="this-title">-->
+      <!--<span>林场</span>-->
+      <!--<span>45</span>-->
+      <!--</div> &ndash;&gt;-->
+      <!--<div class="i-list-con" style="height: 46vh; overflow-y: scroll;">-->
+      <!--<span v-for="(item,index) in cameraList" :key="index">-->
+      <!--<div class="d-l-con" @click="playhk(item.channelCode)">-->
+      <!--<div class="d-l-l-text">-->
+      <!--<i class="i-small"></i>-->
+      <!--<h4>{{ item.cameraName }}</h4>-->
+      <!--</div>-->
+      <!--</div>-->
+      <!--</span>-->
+      <!--</div>-->
+      <!--</div>-->
       <!--<div style="width:70%;height:400px;position:absolute;">-->
-        <!--&lt;!&ndash;视频窗口展示-&#45;&#45;大华&ndash;&gt;-->
-        <!--<div id="dom1" class="dom1"></div>-->
-        <!--&lt;!&ndash;视频窗口展示-&#45;&#45;海康&ndash;&gt;-->
-        <!--<div id="playWnd" class="playWnd" style="left: 0px; top: 0px;"></div>-->
+      <!--&lt;!&ndash;视频窗口展示-&#45;&#45;大华&ndash;&gt;-->
+      <!--<div id="dom1" class="dom1"></div>-->
+      <!--&lt;!&ndash;视频窗口展示-&#45;&#45;海康&ndash;&gt;-->
+      <!--<div id="playWnd" class="playWnd" style="left: 0px; top: 0px;"></div>-->
       <!--</div>-->
+
       <div id="dom1" class="dom1"></div>
     </el-dialog>
   </div>
@@ -38,7 +39,6 @@ import DHWs from '@/dahua/lib/DHWs'
 import { rotation } from '@/api/monitor'
 import Cookies from "js-cookie"
 import {selectConfigKey} from "@/api/system/config";
-
 /** ----------------------------------摄像头预览结束------------------------------------- */
 export default {
   dicts: ['event_source'],
@@ -48,54 +48,54 @@ export default {
       title:['365','369','371','373','372','370'].includes(Cookies.get("deptId"))?"电视墙":"电视墙\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000\u3000您的所有操作痕迹已被后台记录，请谨慎操作。",
       tvListJson: [
         {
-        'switchTab': '1',
-        'treeLabels': [
-          {
-            'labelCode': '123456',
-            'labelName': '视频场景',
-            'parentLabelCode': null
-          },
-          {
-            'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa',
-            'labelName': '标签2',
-            'parentLabelCode': 123456
-          },
-          {
-            'labelCode': 'd941adbbd3e64dac92cc448dec5293cd',
-            'labelName': '标签1',
-            'parentLabelCode': 123456
-          }
-        ],
-        'labelChannels': [{
-          'channelDates': [{
-            'channelCode': '6044981090191552',
-            'channelName': '复兴大桥中段-交通事故',
-            'channelSn': null,
-            'cameraType': 0,
-            'online': 1
-          },
+          'switchTab': '1',
+          'treeLabels': [
             {
-              'channelCode': 'ZgVzqsjwA1DTF561VGHK5E',
-              'channelName': '北京7青羊东二路77号2通道1',
-              'channelSn': null,
-              'cameraType': 1,
-              'online': 1
+              'labelCode': '123456',
+              'labelName': '视频场景',
+              'parentLabelCode': null
+            },
+            {
+              'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa',
+              'labelName': '标签2',
+              'parentLabelCode': 123456
+            },
+            {
+              'labelCode': 'd941adbbd3e64dac92cc448dec5293cd',
+              'labelName': '标签1',
+              'parentLabelCode': 123456
             }
           ],
-          'labelCode': 'd941adbbd3e64dac92cc448dec5293cd'
-        },
-          {
+          'labelChannels': [{
             'channelDates': [{
-              'channelCode': 'ZgVzqsjwA1DTF561VGHKK7',
-              'channelName': '北京7青羊东二路77号2通道2',
+              'channelCode': '6044981090191552',
+              'channelName': '复兴大桥中段-交通事故',
               'channelSn': null,
-              'cameraType': 2,
-              'online': 0
-            }],
-            'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa'
-          }
-        ]
-      },
+              'cameraType': 0,
+              'online': 1
+            },
+              {
+                'channelCode': 'ZgVzqsjwA1DTF561VGHK5E',
+                'channelName': '北京7青羊东二路77号2通道1',
+                'channelSn': null,
+                'cameraType': 1,
+                'online': 1
+              }
+            ],
+            'labelCode': 'd941adbbd3e64dac92cc448dec5293cd'
+          },
+            {
+              'channelDates': [{
+                'channelCode': 'ZgVzqsjwA1DTF561VGHKK7',
+                'channelName': '北京7青羊东二路77号2通道2',
+                'channelSn': null,
+                'cameraType': 2,
+                'online': 0
+              }],
+              'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa'
+            }
+          ]
+        },
         {
           'switchTab': '2',
           'labelChannels': [{
@@ -286,6 +286,7 @@ export default {
     },
     //火点联动电视墙调用
     showTVWall1(longitude,latitude,tvListJson) {
+
       selectConfigKey("DssVersion").then(res => {
         if(this.ws.getLocalDssVersion()!=res.data){
           this.$modal.confirm('系统检测到新客户端版本，请更新后使用', '系统提示', {
@@ -302,6 +303,7 @@ export default {
           });
           return
         }else{
+
           // let that=this;
           /** ----------------------------------大华摄像头预览开始------------------------------------- */
           this.ws.addEventListener('connectStateChange', data => {
@@ -378,15 +380,6 @@ export default {
         }
       })
 
-
-    },
-    realTimeVideoDialog(cameraParams) {
-      // 调用弹窗实时播放接口
-      if (!this.isLogin) {
-        this.$Message.info("正在登陆客户端，请稍等......");
-        return false;
-      }
-      this.ws.openVideo(cameraParams);
     },
     create1(longitude,latitude,tvListJson,array,array1) { // 调用创建控件接口
       let _this = this
@@ -412,12 +405,8 @@ export default {
       }
       this.setPos()
       this.customizeTree(tvListJson);
-      // if(array1.length == 1){
-      //   _this.realTimeVideoDialog(array1);
-      // }else{
-        _this.ws.createCtrl(params);
-        _this.playRealMonitorVideo(array)
-      // }
+      _this.ws.createCtrl(params);
+      _this.playRealMonitorVideo(array)
       setTimeout(() => {
         _this.rotation(longitude,latitude,array1)
       }, 5000)
@@ -458,6 +447,7 @@ export default {
           });
           return
         }else{
+
           if(tvListJson){
             this.preview(tvListJson,bfArray);
             this.TVWallVisible = true;
@@ -485,7 +475,6 @@ export default {
           // }, 5000)
           // /** ----------------------------------海康摄像头预览结束------------------------------------- */
           this.TVWallVisible = true
-
         }
       })
 
@@ -550,7 +539,7 @@ export default {
           'ctrlCode': 'ctrl1',
           'ctrlProperty': {
             'displayMode': 1,
-            "splitNum": 4,
+            'splitNum': 4,
             'channelList': [
               {
                 'channelId': ''
@@ -571,12 +560,8 @@ export default {
       for (let i = 1; i < length; i++) {
         bfArray.push({"channelId": tvListJson[0].treeLabels[i].labelCode})
       }
-      // if(bfArray.length == 1){
-      //   _this.realTimeVideoDialog([tvListJson[0].treeLabels[1].labelCode]);
-      // }else{
-        _this.ws.createCtrl(params);
-        _this.playRealMonitorVideo(bfArray)
-      // }
+      _this.ws.createCtrl(params);
+      _this.playRealMonitorVideo(bfArray)
     },
     setPos() {
       let target = document.getElementById(this.domId)
@@ -913,14 +898,4 @@ html, body {
   margin-top: 100px;
   margin-left: 80px;
 }
-
-
-//电视墙视频摄像头预览弹层样式
- .TVWallCustomWidth {
-   width: 1500px !important;
-   height: 750px !important;
-   background: #04080c !important;
-   box-shadow: $barShadow !important;
-   border: 1px $barBorder !important;
- }
 </style>

src/components/TVWalls.vue

@@ -212,8 +212,8 @@ export default {
   },
   methods: {
     cancelEventLocationShow() {
-      this.userData = []
       // this.activeName = 'tv'
+      this.userData = []
       this.TVWallVisible = false
       this.destroy()
 
@@ -226,7 +226,6 @@ export default {
       }
     },
     showTVWall(data, val, item) {
-
       selectConfigKey("DssVersion").then(res => {
         if(this.ws.getLocalDssVersion()!=res.data){
           this.$modal.confirm('系统检测到新客户端版本，请更新后使用', '系统提示', {
@@ -376,8 +375,8 @@ export default {
       // if(_this.stringList.length == 1){
       //   _this.realTimeVideoDialog([_this.stringList[0]]);
       // }else{
-        _this.ws.createCtrl(params);
-        _this.playRealMonitorVideo();
+      _this.ws.createCtrl(params);
+      _this.playRealMonitorVideo();
       // }
       if (_this.data != undefined && _this.data != null) {
         setTimeout( _this.rotation(_this.data.longitude, _this.data.latitude, _this.stringList),5000)

src/components/vBottomMenu.vue

@@ -135,10 +135,6 @@
             </div>
             <div class="btm-r-pop-info-con">
               <div class="btm-r-pop-info-list">
-                <div class="btm-r-pop-info-list-name">消息时间</div>
-                <div class="btm-r-pop-info-list-text">{{ item.createTime }}</div>
-              </div>
-              <div class="btm-r-pop-info-list">
                 <div class="btm-r-pop-info-list-name">标题</div>
                 <div class="btm-r-pop-info-list-text">{{ item.taskTitle }}</div>
               </div>
@@ -182,6 +178,10 @@
           <div class="btm-r-pop-info-box" v-for="(item,index) in messageList">
             <div class="btm-r-pop-info-con">
               <div class="btm-r-pop-info-list">
+                <div class="btm-r-pop-info-list-name">消息时间</div>
+                <div class="btm-r-pop-info-list-text">{{ item.createTime }}</div>
+              </div>
+              <div class="btm-r-pop-info-list">
                 <div class="btm-r-pop-info-list-name">标题</div>
                 <div class="btm-r-pop-info-list-text">{{ item.title }}</div>
               </div>
@@ -201,8 +201,9 @@
               <el-link type="success" v-if="item.eventCode!=null&&item.type ==1" @click="showEventDialog_message(item.eventCode)">
                 查看事件详情
               </el-link>
-              <div class="btm-r-pop-info-btm-btn">
-                <el-button type="primary" v-if="item.type ==2" @click="selectMessageById(item.id)">标记已读</el-button>
+              <div class="btm-r-pop-info-btm-btn" v-else>
+                <el-button type="primary"  @click="selectMessageById(item.id)">标记已读
+                </el-button>
               </div>
             </div>
           </div>
@@ -435,7 +436,8 @@
                                                  v-for="(itemfile,indexfile) in item.fileVOs">
                                       <el-image :src="itemfile.fileUrl" v-if="itemfile.fileType=='image'"
                                                 :preview-src-list="assetTypeAnImage(item.fileVOs)"
-                                                style="width:3rem; height:3rem;margin: 2px;" :z-index="10000" :title="itemfile.fileName">
+                                                :z-index="10000"
+                                                style="width:3rem; height:3rem;margin: 2px;" :title="itemfile.fileName">
                                       </el-image>
                                       <img v-else-if="itemfile.fileType=='video'"
                                            style="width:3rem; height:3rem;margin: 2px;"
@@ -471,14 +473,14 @@
                     <div class="this-con h-25 no-padding">
                       <div class="z-info-list" style="margin-top: 0;">
                         <div class="z-info-btm-grp">
-<!--                          <div class="z-info-btm-grp-top">-->
-<!--                            <div class="z-info-btm-grp-left">-->
-<!--                              <el-button size="small" icon="el-icon-upload" @click="showEventLogUpload()">上传-->
-<!--                              </el-button>-->
-<!--                              <el-button size="small" icon="el-icon-download" @click="toImage()">截图上传-->
-<!--                              </el-button>-->
-<!--                            </div>-->
-<!--                          </div>-->
+                          <!--                          <div class="z-info-btm-grp-top">-->
+                          <!--                            <div class="z-info-btm-grp-left">-->
+                          <!--                              <el-button size="small" icon="el-icon-upload" @click="showEventLogUpload()">上传-->
+                          <!--                              </el-button>-->
+                          <!--                              <el-button size="small" icon="el-icon-download" @click="toImage()">截图上传-->
+                          <!--                              </el-button>-->
+                          <!--                            </div>-->
+                          <!--                          </div>-->
                           <div class="z-info-btm-input">
                             <el-input type="textarea" v-model="eventLog" :autosize="{ minRows: 7, maxRows: 7}"
                                       placeholder="请输入反馈信息">
@@ -538,12 +540,10 @@
           <ImageUpload class="sj-upload" ref="ImageUpload" :limit="10" :fileType="['jpg', 'png','jpeg']" :value="uploadAttachList"
                        @input="getUrl"></ImageUpload>
         </el-form-item>
-        <el-button class="sj-icon-btn" size="mini" type="primary" v-if="eventStatusButton=='sh'"
-                   icon="el-icon-circle-check"
+        <el-button class="sj-icon-btn" icon="el-icon-check" size="mini" type="primary" v-if="eventStatusButton=='sh'"
                    @click="updateCentereventTEventcatalogueStatus('shtg',true)">通过
         </el-button>
-        <el-button class="sj-icon-btn" size="mini" type="primary" v-if="eventStatusButton=='sh'"
-                   icon="el-icon-circle-close"
+        <el-button class="sj-icon-btn" icon="el-icon-circle-close" size="mini" type="primary" v-if="eventStatusButton=='sh'"
                    @click="updateCentereventTEventcatalogueStatus('shbtg',true)">不通过
         </el-button>
       </el-form>
@@ -919,8 +919,8 @@ export default {
         this.messageList = response.data
         this.messageCount = response.data.length
       })
-        this.initWebSocket('MESSAGE_SOCKET', '/messagePush/', this.websockSid.userId)
-        this.initWebSocket('MESSAGE_SOCKET', '/messageDeptPush/', this.websockSid.deptId)
+      this.initWebSocket('MESSAGE_SOCKET', '/messagePush/', this.websockSid.userId)
+      this.initWebSocket('MESSAGE_SOCKET', '/messageDeptPush/', this.websockSid.deptId)
 
     },
     filterbanNode(value, data) {

src/views/bigdata/bigdata.vue

@@ -23,7 +23,7 @@
       <div class="bigdata-list wid-li-1">
         <div class="b-con mg-b-20">
           <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-            <span>事件来源，类型统计</span>
+            <span>事件来源 类型统计</span>
           </div>
           <chartEvent></chartEvent>
         </div>