R13

package.json

@@ -29,7 +29,8 @@
     "xlsx": "^0.16.8"
   },
   "devDependencies": {
-    "@babel/core": "~7.8.7",
+    "@babel/core": "^7.8.7",
+    "@babel/preset-env": "^7.14.7",
     "@vue/cli-plugin-babel": "~4.2.3",
     "@vue/cli-plugin-e2e-nightwatch": "~4.2.3",
     "@vue/cli-plugin-eslint": "~4.2.3",
@@ -39,6 +40,7 @@
     "axios": "^0.20.0",
     "babel-eslint": "~10.1.0",
     "babel-jest": "~25.1.0",
+    "babel-loader": "^8.2.2",
     "chromedriver": "~80.0.1",
     "core-js": "~3.6.4",
     "eslint": "~6.8.0",
@@ -47,7 +49,8 @@
     "node-sass": "~4.13.1",
     "npm-run-all": "~4.1.5",
     "sass-loader": "~8.0.2",
-    "vue-template-compiler": "~2.6.11"
+    "vue-template-compiler": "~2.6.11",
+    "webpack": "^4.46.0"
   },
   "browserslist": [
     "> 1%",

src/App.vue

@@ -7,6 +7,7 @@ export default {
   name: 'App'
 }
 </script>
+
 <style lang="scss">
   // Import Main styles for this application
   @import 'assets/scss/style';

src/assets/icon/demo_index.html

@@ -54,12 +54,6 @@ <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" targ
       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
 
-            <li class="dib">
-              <span class="icon iconfont">&#xe650;</span>
-                <div class="name">456464674641</div>
-                <div class="code-name">&amp;#xe650;</div>
-              </li>
-
             <li class="dib">
               <span class="icon iconfont">&#xe64d;</span>
                 <div class="name">监控点列表</div>
@@ -888,9 +882,9 @@ <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</co
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1622434661118') format('woff2'),
-       url('iconfont.woff?t=1622434661118') format('woff'),
-       url('iconfont.ttf?t=1622434661118') format('truetype');
+  src: url('iconfont.woff2?t=1620295037209') format('woff2'),
+       url('iconfont.woff?t=1620295037209') format('woff'),
+       url('iconfont.ttf?t=1620295037209') format('truetype');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -916,15 +910,6 @@ <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面
       <div class="content font-class">
         <ul class="icon_lists dib-box">
 
-          <li class="dib">
-            <span class="icon iconfont icon-guobiao"></span>
-            <div class="name">
-              456464674641
-            </div>
-            <div class="code-name">.icon-guobiao
-            </div>
-          </li>
-
           <li class="dib">
             <span class="icon iconfont icon-jiankongdianliebiao"></span>
             <div class="name">
@@ -2167,14 +2152,6 @@ <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h
       <div class="content symbol">
           <ul class="icon_lists dib-box">
 
-            <li class="dib">
-                <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-guobiao"></use>
-                </svg>
-                <div class="name">456464674641</div>
-                <div class="code-name">#icon-guobiao</div>
-            </li>
-
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-jiankongdianliebiao"></use>

src/assets/icon/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 2028119 */
-  src: url('iconfont.woff2?t=1622434661118') format('woff2'),
-       url('iconfont.woff?t=1622434661118') format('woff'),
-       url('iconfont.ttf?t=1622434661118') format('truetype');
+  src: url('iconfont.woff2?t=1620295037209') format('woff2'),
+       url('iconfont.woff?t=1620295037209') format('woff'),
+       url('iconfont.ttf?t=1620295037209') format('truetype');
 }
 
 .iconfont {
@@ -13,10 +13,6 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-.icon-guobiao:before {
-  content: "\e650";
-}
-
 .icon-jiankongdianliebiao:before {
   content: "\e64d";
 }

src/assets/icon/iconfont.json

@@ -5,13 +5,6 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
-    {
-      "icon_id": "21928193",
-      "name": "456464674641",
-      "font_class": "guobiao",
-      "unicode": "e650",
-      "unicode_decimal": 58960
-    },
     {
       "icon_id": "17805935",
       "name": "监控点列表",

src/assets/scss/style.scss

@@ -90,9 +90,4 @@ a{
         box-sizing: border-box;
     }
 
-}
-.addChannelSloganTable{
-    min-height: 0vh  !important;
-  background: none;
-  border: none;
 }

src/containers/TheSidebar.vue

@@ -42,7 +42,7 @@
 					<span slot="title">{{$t("message.left.tour")}}</span>
 				</el-menu-item>
 				<el-menu-item v-if="this.$store.state.root=='Administrator'" index="/GB/GB28181">
-					<i class="iconfont icon-guobiao" style="font-size:16px"></i>
+					<i class="iconfont icon-wendang" style="font-size:18px"></i>
 					<span slot="title">GB</span>
 				</el-menu-item>
 

src/router/index.js

@@ -727,6 +727,9 @@ if(sessionStorage.getItem('Certificatetime')){
 	store.state.Certificatetime=sessionStorage.getItem('Certificatetime');
 }
 
+if(localStorage.getItem('devicemarktoggle')){
+	store.state.devicemarktoggle=localStorage.getItem('devicemarktoggle');
+}
 if(localStorage.getItem('Mapurl')){
 	store.state.Mapurl=localStorage.getItem('Mapurl');
 }

src/store.js

@@ -9,7 +9,7 @@ const state = {
   asideShow: false,
   asideShows:false,
   liveviewrtc:'WS',
-  liveviewrtc1:'RTC',
+  liveviewrtc1:'WS',
   deviceprintcolor:'',
   strNodeName:9090,
   switch:false,

src/views/Liveview.vue

@@ -52,13 +52,26 @@
                             </div>
                         </div>
                     </template>
-                    <el-tree
+                   <el-tree
                         class="el_tree"
                         node-key="strName" 
                         :default-expanded-keys="['root']" 
                         :data="data1" 
+                        @node-click="handleNodeClick"
                         :props="defaultProps1">
-                        <span slot-scope="{data }" style="width:100%;">
+                        <span slot-scope="{ data }" style="width:100%;">
+                            <div style="width:100%;display: flex;justify-content: space-between;">
+                                <span  
+                                    draggable="true" 
+                                    @dragstart="dragStart($event,data.strToken,data.strName,data.streamprofile, data.name,data.disabled_me)">
+                                    <span v-if="data.iconclass" style="font-size: 12px;" :class="data.iconclass" :id="'icon'+data.strToken"></span>
+                                    <span v-else style="font-size: 12px;" class="iconfont icon-quyu" :id="'icon'+data.strToken"></span>
+                                    <span :class="data.iconclass1" style="padding-left: 4px;">{{data.strName}}</span>
+                                </span>
+                                <span :class="data.iconclass2" class="black" style="">{{$t("message.live.Videorecording")}}</span>
+                            </div>
+                        </span>
+                        <!-- <span slot-scope="{data }" style="width:100%;">
                             <span>
                                 <span class="iconfont icon-quyu"></span>
                                 <span :class="data.iconclass1" style="padding-left: 4px;">{{data.strName}}</span>
@@ -78,7 +91,7 @@
                                     </span>
                                 </el-tree>
                             </div>
-                        </span>
+                        </span> -->
                     </el-tree>
                 </el-collapse-item>
                 <el-collapse-item name="2" id="viewclis">
@@ -210,7 +223,7 @@ export default {
                 iconclass:"iconclass"
             },
             defaultProps1: {
-                children: 'node',
+                children: 'cam',
                 label: 'strName',
                 cam:"cam"
             },
@@ -1165,12 +1178,93 @@ export default {
                 var oldarr1=result.data.src;
                 // console.log(oldarr,oldarr1)
                 var dataroot=this.getchild(oldarr,oldarr1);
-                this.data1.push(dataroot);
+                // this.data1.push(dataroot);
                 console.log(dataroot);
+                this.datapush(dataroot)
+                console.log(this.data1);
             })
         },
+        datapush(data){
+            this.a(data)
+        },
+        a(data){
+            console.log(data.cam);
+            if(data.node.length!=0){
+                for (let i = 0; i < data.node.length; i++) {
+                data.cam.push(data.node[i])
+            }
+            }
+            delete data.node
+            for (let i = 0; i < data.cam.length; i++) {
+                // console.log(data);
+                this.b(data.cam[i])
+                this.data1=[];
+                this.data1.push(data);
+            }
+        },
+        b(data){
+            if (data.name) {
+                return
+            }
+            if(data.node.length!=0){
+                for (let i = 0; i < data.node.length; i++) {
+                data.cam.push(data.node[i])
+                }
+            }
+            delete data.node
+            for (let i = 0; i < data.cam.length; i++) {
+                console.log(data.cam[i]);
+                if (data.cam[i].cam) {
+                    this.c(data.cam[i])
+                }
+            }
+        },
+        c(data){
+            if (data.name) {
+                return
+            }
+            if(data.node.length!=0){
+                for (let i = 0; i < data.node.length; i++) {
+                data.cam.push(data.node[i])
+            }
+            }
+            delete data.node;
+            for (let i = 0; i < data.cam.length; i++) {
+                console.log(data.cam[i]);
+                if (data.cam[i].cam) {
+                    this.d(data.cam[i])
+                }
+            }
+        },
+        d(data){
+            if (data.name) {
+                return
+            }
+            if(data.node.length!=0){
+                for (let i = 0; i < data.node.length; i++) {
+                data.cam.push(data.node[i])
+            }
+            }
+            delete data.node;
+            for (let i = 0; i < data.cam.length; i++) {
+                console.log(data.cam[i]);
+                if (data.cam[i].cam) {
+                    this.e(data.cam[i])
+                }
+            }
+        },
+        e(data){
+            if (data.name) {
+                return
+            }
+            if(data.node.length!=0){
+                for (let i = 0; i < data.node.length; i++) {
+                data.cam.push(data.node[i])
+            }
+            }
+            delete data.node;
+        },
         getchild(arr,arr1) {
-
             for(var i in arr.cam){
                 if(!arr.cam[i].strName){
                     for(var j in arr1){

src/views/Settings.vue

@@ -7,7 +7,8 @@
                 :default-active="activemenu" 
 				class="el-menu-vertical-demo"
 				:background-color="($store.state.darkMode) ? '#2D2D2D' : '#F5F5F5'"
-				:text-color="($store.state.darkMode) ? '#B7B7B7' : '#7A7A7A'">
+				:text-color="($store.state.darkMode) ? '#B7B7B7' : '#7A7A7A'"
+				style="height:100%">
 				<el-submenu index="/Settings/DeviceStream">
 					<template slot="title">
 						<i class="iconfont icon-shezhi_guanli"></i>

src/views/liveview/Liveplay.vue

@@ -202,6 +202,8 @@ export default {
             picturequality:'',//画质名称
             rtcid:"rtc"+this.h5videoid,
             streamprofileInformation:null,//码流区分
+            height:"",
+            width:""
         }
     },
     beforeDestroy() {
@@ -308,7 +310,30 @@ export default {
                             name:this.$t("message.live.Bitrate"),
                             data:(item.nAudioBitrate/1024).toFixed(1)+'kpbs'
                         }]
-
+                         if(this.height){
+                            var informationVideo = [
+                                {
+                                    name: this.$t("message.live.Codec"),
+                                    data: item.strVideoType,
+                                },
+                                {
+                                    name: this.$t("message.live.Width"),
+                                    data: this.width,
+                                },
+                                {
+                                    name: this.$t("message.live.Height"),
+                                    data: this.height,
+                                },
+                                {
+                                    name: this.$t("message.live.FPS"),
+                                    data: item.nVideoFPS,
+                                },
+                                {
+                                    name: this.$t("message.live.Bitrate"),
+                                    data: (item.nVideoBitrate / 1024).toFixed(1) + "kpbs",
+                                },
+                                ];
+                            }else{
                         var informationVideo=[{
                             name:this.$t("message.live.Codec"),
                             data:item.strVideoType
@@ -325,6 +350,7 @@ export default {
                             name:this.$t("message.live.Bitrate"),
                             data:(item.nVideoBitrate/1024).toFixed(1)+'kpbs'
                         }]
+                    }
                         this.informationAudio=informationAudio
                         this.informationVideo=informationVideo
                 }
@@ -382,13 +408,15 @@ export default {
         },
         // 画质
         handleCommand(command) {
+             this.height =command.nHeight
+      this.width =command.nWidth
            this.videoname=''
            var arr=this.inputlabel.split("-")
            var name=arr[0]+"-"+command.strName
            var token=this.inputtoken
            this.videoname=name
            var streamprofile= command.strToken
-           this.PlayVideo(token,streamprofile,label,name)
+           this.PlayVideo(token,streamprofile,"",name)
 
         },
         //播放