{"version":3,"sources":["webpack:///./src/views/layout/Liveplay.vue?a177","webpack:///./src/views/layout/Liveplay.vue?f3ac","webpack:///./src/views/layout/Liveplay.vue","webpack:///./src/assets/js/uuid.js","webpack:///./src/views/layout.vue?658e","webpack:///./src/views/layout/Liveplay.vue?8997","webpack:///./src/assets/js/h5splayerhelper.js","webpack:///src/views/layout.vue","webpack:///src/views/layout/Liveplay.vue","webpack:///./src/views/layout.vue?432a","webpack:///./src/views/layout.vue?4e7d","webpack:///./src/views/layout.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","videoid","staticStyle","videonameid","_v","_s","videoname","picturequality","valuebutton","inputid","on","$event","Bitstream","target","value","spanqualityid","qualityid","handleCommand","elqualityid","$t","slot","_l","it","index","key","strName","Audiochange","model","callback","$$v","Audioslider","expression","a","name","data","rtcid","open_liveplay_butt","$store","state","liveviewrtc","scopedSlots","_u","fn","qrcode","proxy","ref","class","Audiosetup","Information","Shoutwheatclass","Shoutwheat","DoSnapshotWeb","DoSnapshot","DoManualRecordStart","DoManualRecordStop","PtzControlShow","FullScreen","CloseVideo","PtzActionUpleft","PtzActionStop","PtzActionUp","PtzActionUpright","PtzActionLeft","PtzActionRight","PtzActionDownleft","PtzActionDown","PtzActionDownright","content","focusing","PtzActionZoomIn","PtzActionZoomOut","Focus","PtzActionfocusing","PtzActionfocusings","aperture","PtzActionaperture","PtzActionaperturej","LightON","PtzActionlighton","LightOFF","PtzActionlightoff","WiperON","PtzActionwiperon","WiperOFF","PtzActionwiperoff","Preset_value","Pre","domProps","preset_Jump","strToken","preset_set","staticRenderFns","component","uuid","len","radix","i","r","chars","split","length","Math","random","join","H5siOS","iDevices","navigator","platform","pop","components","viewlists","cur_query","viewdata","proto","rows","cols","selectCol","selectRow","contentHeight","contentWidth","objlist","tokens","data22","data33","data44","data55","data6","data8","vdata","mounted","$","setTimeout","methods","stopVideo","event","licenseWaterMark","_this","sessionStorage","document","catch","console","addWaterMarker","body","can","cans","viewplay","viewlist","strview","strIndex","strStream","strLayoutType","src","icon","viewClick","viewparameter","label","token","streamprofile","vid","srcview","getview","arr","arr1","videoClick","c","updateUI","x","changePanel","Object","Vue","list_gong","computed","watchvideo","watch","props","informationshow","informationAudio","informationVideo","h5handler","audioback","currtoken","tokenshou","ptzshow","audioshow","Presetdata","picturequalityid","qualitylist","streamprofileInformation","height","width","beforeDestroy","listData","$controlsin","clearInterval","Informationdate","Gettranscod","command","PlayVideo","protocol","host","rootpath","hlsver","rtcengine","session","consolelog","$controlsinAudio","$controlsininformation","$controlsptz","$ptzcontrols","qrcode1","fileName","date","canvas","ctx","dlLink","message","type","title","elem","updateUIExitFullScreen","$controls","PtzAction","action","preventDefault"],"mappings":"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AA,uBACA,yBACAC,0BACAA,iCACAA,kCACAA,mBACAA,wBACAA,mCACAJ,iDACAF,uGAEAO,SAtEA,WAuEA,0BACAL,2CACAA,4BACA,oBACAA,+BACA,oCAGAM,SA/EA,WA+EA,WACA,cACA,SACA,oBAEA,GADAN,oBACA,6BAGA,aACAO,aACA,aACAA,aACA,aACAA,aACA,aACAA,aACA,aACAA,aACA,aACAA,aACA,aACAA,aACA,aACAA,aACA,cAGA,OAFAA,QAMA,gCACA,iFACA,oCACA,mBACAP,wBACA,oCACA,wDAGA,qBACA,iBAEA,sBACA,uBACA,cACA,OACAQ,8BACA3D,qBACA4D,2BACA5H,gCAEA,qBACA,cACA,GACA2H,8BACA3D,qBACA4D,2BACA5H,gCAEA,qBACA,cACA,GACA2H,8BACA3D,qBACA4D,2BACA5H,gCAEA,qBACA,cACA,GACA2H,6BACA3D,qBACA4D,2BACA5H,gCAEA,qBACA,cACA,GACA2H,6BACA3D,qBACA4D,2BACA5H,gCAEA,oBACA,CACA,aACA,GACA2H,kBACA3D,qBACA4D,2BACA5H,gCAEA,gBAKA,OACA6H,gBACAC,YACAC,4CAEA,oBAIAC,UA1LA,SA0LAvH,GAAA,kIACA0G,eACA,8BACAJ,EAAA,EAHA,SAIA,6BAJA,UAKAtG,gBALA,uBAMA8F,EAAA,CACA0B,+BAEAlB,4BATA,0BAYAxC,EAAA,EAZA,aAYAA,gBAZA,wBAaA4C,sEACAe,EAAA,GACA,2BAEAA,oEACA,4BAEAA,oEAEA3B,EAAA,CACA4B,wBACAC,iCACA5H,OACA0H,uBACAG,sBACAJ,+BAEA1C,EAAA,CACAoC,2BACA3D,2BACA4D,8BAEAb,4BAnCA,UAoCAA,mCApCA,QAYAxC,IAZA,+DAuCA+D,QAjOA,WAiOA,WACAnB,qCACA,kFACA,oCAEA,GADAA,eACA,gBAEA,kBACA,aACA,gBACA,wBACA,mBACA,yBAEAA,yBAEAA,6BAIAoB,QArPA,SAqPAC,EAAAC,GAoBA,YAnBA,uBACAD,uCACA,uBACAA,4CACA,uBACAA,6CACA,uBACAA,6CACA,uBACAA,6CACA,uBACAA,6CACA,wBACAA,6CACA,uBACAA,6CACA,yBACAA,6CAEA,MACA,eACA,mCACAA,+BAIA,UAGAE,WAnRA,SAmRAlE,EAAAmE,EAAAzJ,GACA,iBACA,iBACAiI,iBACAV,0CACAA,kCAGAmC,SA3RA,SA2RAC,GACA1B,mCACA,6BACA,gDAEA,+CAEAV,2DACAA,6CAGAqC,YAtSA,SAsSAjC,EAAAmB,GACAb,iBACA,SAEA1G,EADA,eACAA,mBAEAA,wBAGA,WACA,kBACA,kBAEAsI,0BACAtD,iBACAC,mBAEAyB,iCACA6B,kCACA,gCAEAvC,iEACAA,+DACAA,kEACAA,kEAEA,mBACA,WACAwC,+BACAA,8BACAA,4BACAA,4BAEA,WACAA,+BACAA,8BACAA,8BACAA,0BAEA,WACAA,+BACAA,4BACAA,8BACAA,4BAEA,YACAA,4BACAA,8BACAA,8BACAA,6BAEAxC,gDACA,oBACAU,eACA,MACAV,yBACAA,0BACAA,yBACAA,yBACAA,0BACAA,yBACAA,iCAEA,OACAA,yBACAA,0BACAA,+BAMAyC,UACAC,WADA,WAGA,OADAhC,+BACA,oBAIAiC,OACAD,WADA,SACA1I,GACA,qB,8ICpPe,QACfD,gBACA6I,yCACA5I,KAHA,WAIA,OACAJ,cACAiJ,mBACAC,oBACAC,oBACAhE,oCACAhH,uBACAiL,iBACAC,iBACAC,iBACAC,eACAC,WACAC,aACAlG,gBACAmG,cACAvI,kCACAkB,SACAC,0CACAG,oCACAG,0CAEAG,wCACAE,0CACAE,wCACAE,2CAGApE,6CACAC,mCACAE,yCACAf,kCACAsL,mDACAhL,+BACAiL,eACAlL,8CACAF,aACAC,kBACA4B,2BACAwJ,8BACAC,UACAC,WAGAC,cA/CA,WAgDA,0BAEAnB,UACAoB,SADA,WAEA,qCAEAnB,WAJA,WAMA,OADAhC,+BACA,oBAGAX,QA3DA,WAsEA,GARAC,kDACAA,mDACA,mBACA,+BACAA,oCAEAA,mCAEA,wBACA,6BACAA,2EACAA,qFACA,eACA,2BACAA,2DAGA,2BACAA,6DAKA2C,OACAkB,SADA,SACAnC,GAAA,WACAhB,eACA,kCACA,iCAEAT,uBACA,gBAIA,oDACA,oBACA,8CACA,MAEAyC,WAhBA,SAgBA1I,GAMA,GALA,eACAgG,oCAEAA,mCAEA,OACA,4BACA,CACA,aACAA,2EACAA,qFACA,eACA,2BACAA,2DAGA,2BACAA,8DAOAE,SAEAhG,mBAFA,WAGA,4EACA8F,yEACAA,wCACAA,0FAEAA,wEACAA,qCACAA,0FAIAnF,WAdA,WAeA,uBACA,8BACA,mBACAiJ,yBACA,oBAEAA,wBACA,oBAGAtK,YAzBA,WA2BAkH,wCACAF,iEAGA1F,YA/BA,WA+BA,WACA4F,mBACA,uBACA,6BACA,sBAEA,OADAA,8BACA,+BAGA,yBAKAoD,wBACA,wBACAC,kCACA,IAPArD,uBACAoD,yBACA,wBAOA,4BACA,0CACA,sBACA,SAGAE,gBAxDA,WAwDA,WACA,2BAEA,oIAEA,oCACA,kBACAtD,eACA,aACA,IACA3G,gCACAC,qBACA,CACAD,qCACAC,yBACA,CACAD,oCACAC,wBACA,CACAD,mCACAC,uBACA,CACAD,kCACAC,gDAEA,YACA,OACA,CACAD,gCACAC,qBAEA,CACAD,gCACAC,cAEA,CACAD,iCACAC,eAEA,CACAD,8BACAC,kBAEA,CACAD,kCACAC,qDAIA,IACAD,gCACAC,qBACA,CACAD,gCACAC,oBACA,CACAD,iCACAC,qBACA,CACAD,8BACAC,kBACA,CACAD,kCACAC,gDAGA,qBACA,0BAKAtB,UAhIA,SAgIA0H,GAGA,GAFAM,iDAEA,uCACA,YACA,kBACA,kBACA,kDACA,0CACA,wBACA,oDACA,4BACA,2CACA,SACA,kBACA,gEACA,2CACA,wBACA,mDACA,yBAIAuD,YAvJA,WAuJA,WACA,sFACA,oCAEA,gBACA,iCAmBAxD,SAGA1H,cAlLA,SAkLAmL,GACA,sBACA,oBACA,kBACA,oEACA,kBACA,kBACA,iBACA,iBACA,0BAGAC,UA9LA,SA8LAzC,EAAAC,EAAAF,EAAA1H,QAGA,oBACA,mCACA,eACA,uBAEA,iBAEA,sCAEA,kBACA,kBACA,qBAEA,iBAEAiG,8CACAA,6CACAA,0CACAA,2DAEAA,qDACAA,sDACA,iBAEA,iBADA,UACA,mCAEA,kCAKA,OACAjI,uBACAqM,kCACAC,8BACA1C,gBACA2C,aACA5C,QACA6C,YACAC,+CACAC,gCACAC,mBAEA,6DACAhE,2CACA,+BAGAA,2CACA,8BAGA,yBACA,8BACAgB,WACAC,mBACA5H,UACA0H,WACAG,SACAJ,qBAIAjG,WAhQA,SAgQAiG,GAIA,GAFA,wDAEA,wBACA,6BACAxB,2EACAA,qFACA,eACA,2BACAA,2DAGA,2BACAA,2DAIA,eACA,uDACA,4DACA,0CACAU,4CAIA,uBAEA,8BACAiE,wBACA,kBAEA,iCACAC,wBACA,wBACAb,iCAEA,8BACAc,wBACA,gBACA,mBACA,0CACArE,iEAIA,wCACA,kBAGA,kBACA,oBACA,iCAKAsE,wBACA9E,iDACAA,gDACAA,6CAEAA,kDACAA,wDACA,oBACA,mCACA,eACA,4BAEA,oBACA,mCACA,eACA,sBACA,0CACAA,uCACAA,uCAMA1C,YAjVA,SAiVAoE,GAEA,8JACAhB,eAEA,oCACA,eACAA,sBAOAlD,WA/VA,SA+VAkE,EAAAtB,GACA,0EAEA,4IACAM,eAEA,oCACA,eACAA,kBAGAA,mBAGAjG,OA7WA,WA+WA,GADAiG,iCACA,kBACA,SAEA,8GACA,2GAEA,iCACA,kCACAA,iBACA,mCACAiD,UACAD,aAEA,gCACAC,UACAD,aAEAjJ,UACAsK,UACAtK,cACAsK,eAGA/J,WAtYA,WAuYA,2BAGA,qBACA,GACAoJ,kCACAC,0BACAC,aACA5C,QACA+C,iCAIA,uBACA,sBACA/D,kBACA,6BACA,yBACA,wCAEAA,mBACA,mCACA,eACA,sBACA,0CAIAzF,cAnaA,WAoaA,2BAGA,UACA,WACA+J,0DACA,IAAAC,YAAA,IAAAA,aAAA,IAAAA,eAAA,IAAAA,eACAvE,eACA,mCACA,eACA,gBACA,mCACAwE,UACAA,WACA,yBACAC,uBACA,kBACA,mBAGA,8BACAC,aACAA,SACAA,sDAEA5E,6BACA4E,UACA5E,+BAGAtF,WAlcA,WAkcA,WACA,2BAGA,IACA,0BACAwF,8BAEA,yFAEA,oCACAA,eACA,eACA,YACA2E,gCACAC,oBAGA7E,OAAA,YACAC,kCACA,gBACA6E,4BAEA,YACAF,4BACAC,sBAKAnK,oBAheA,WAgeA,WACA,2BAGA,IAEA,0CACAuF,4BAEA,kGAEA,oCACAA,eACA,eACA,YACA2E,2CACAC,oBAGA7E,OAAA,YACAC,gCACA,YACA2E,0BACAC,sBAKAlK,mBA5fA,SA4fAgF,GAAA,WACA,2BAGA,IACA,0CACAM,4BAEA,iGAEA,oCACAA,eACA,eACA,YACA2E,0CACAC,oBAGA7E,OAAA,YAEA,YACA4E,0BACAC,sBAKAhK,WAvhBA,WAwhBA,8BAGAkF,4BACAA,kCACAA,+BACAA,6BAGAA,4BACAA,kCACAA,+BACAA,8BAEA,wBACAA,0BACA,8BACAA,gCACA,6BACAA,+BACA,2BACAA,4BAKAE,gDACA,gCAEAA,gCAGA,oBACA8E,sBACA,0BACAA,4BACA,uBACAA,yBACA,uBACAA,yBAIA9E,6DAGA+E,uBAtkBA,WAukBA,+GACAzF,4DAGA3E,eA3kBA,SA2kBA+E,GAAA,WACA,mBACA,0BACA,OACA,SAGA,8GAEA,oCACA,kBACA,gBACA,SAEA,aAEAM,eACA,mCACA,OACAnH,4BACAgE,+BAGA,GADA,qBACA,IACA,WAMA,uBACA,0BACA,iBACAmI,yBACA,kBAEAA,wBACA,kBAIA1I,iBApnBA,SAonBAoD,GACA,2BAEAlD,kBAvnBA,SAunBAkD,GACA,4BAEAxD,iBA1nBA,SA0nBAwD,GACA,2BAEAtD,kBA7nBA,SA6nBAsD,GACA,4BAEA9D,kBAhoBA,SAgoBA8D,GACA,2BAEA7D,mBAnoBA,SAmoBA6D,GACA,4BAEA3D,kBAtoBA,SAsoBA2D,GACA,0BAEA1D,mBAzoBA,SAyoBA0D,GACA,2BAGAjE,gBA7oBA,SA6oBAiE,GACAM,+BACA,0BAEAtE,iBAjpBA,SAipBAgE,GACA,2BAEA5E,gBAppBA,SAopBA4E,GACA,0BAEAzE,iBAvpBA,SAupBAyE,GACA,2BAEAtE,kBA1pBA,SA0pBAsE,GACA,4BAEApE,mBA7pBA,SA6pBAoE,GACA,6BAEAxE,cAhqBA,SAgqBAwE,GACA,wBAEAvE,eAnqBA,SAmqBAuE,GACA,yBAEA1E,YAtqBA,SAsqBA0E,GACA,sBAEArE,cAzqBA,SAyqBAqE,GACA,wBAEA3E,cA5qBA,SA4qBA2E,GACAM,6BACA,wBAGAiF,UAjrBA,SAirBAC,GACA,2BAGA,IACA,mEACAlF,wBAEA,oFAEA,oCACAA,eACA,YAGAD,OAAA,YACAC,sC,sFClgCA,IAAIpJ,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,YAAY,CAACF,EAAG,MAAM,CAACG,MAAM,CAAC,GAAK,qBAAqBH,EAAG,MAAM,CAACE,YAAY,iBAAiBC,MAAM,CAAC,GAAK,eAAe,CAACH,EAAG,MAAM,CAACG,MAAM,CAAC,GAAK,cAAcP,EAAI4B,GAAI5B,EAAQ,MAAE,SAASwG,GAAG,OAAOpG,EAAG,MAAM,CAAC2B,IAAIyE,EAAElG,YAAY,yBAAyBG,YAAY,CAAC,SAAW,YAAYF,MAAM,CAAC,KAAO,SAASP,EAAI4B,GAAI5B,EAAQ,MAAE,SAAS2K,GAAG,OAAOvK,EAAG,MAAM,CAAC2B,IAAI4I,EAAErK,YAAY,SAASC,MAAM,CAAC,KAAO,QAAQU,GAAG,CAAC,YAAc,SAASC,GAAgC,OAAxBA,EAAOoN,iBAAwBtO,EAAI4I,UAAU1H,IAAS,MAAQ,SAASA,GAAQ,OAAOlB,EAAI0K,WAAWlE,EAAEmE,EAAEzJ,MAAW,CAACd,EAAG,aAAa,CAACG,MAAM,CAAC,GAAK,IAAIiG,EAAEmE,EAAE,KAAO,IAAInE,EAAEmE,EAAE,KAAO3K,EAAIyH,KAAK,KAAOzH,EAAI0H,KAAK,UAAY,SAASlB,EAAEmE,EAAE,SAAW,SAASnE,EAAEmE,MAAM,MAAK,MAAK,QACjzBzE,EAAkB,G,YCD0T,S,wBCQ5UC,EAAY,eACd,EACApG,EACAmG,GACA,EACA,KACA,WACA,MAIa,aAAAC,E","file":"static/js/chunk-31021b77.771f0782.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"liveplay h5container\"},[_c('video',{staticClass:\"h5video\",attrs:{\"id\":_vm.videoid,\"autoplay\":\"\",\"webkit-playsinline\":\"\",\"playsinline\":\"\"}}),_c('div',{staticStyle:{\"z-index\":\"30\"},attrs:{\"id\":_vm.videonameid}},[_vm._v(\" \"+_vm._s(_vm.videoname)+\" \"+_vm._s(_vm.picturequality)+\" \"),_c('input',{staticClass:\"spanpicturequality\",attrs:{\"type\":\"button\",\"value\":_vm.valuebutton,\"id\":_vm.inputid},on:{\"click\":function($event){return _vm.Bitstream($event.target.value)}}})]),_c('span',{staticClass:\"spanquality\",attrs:{\"id\":_vm.spanqualityid}},[_c('el-dropdown',{staticClass:\" \",staticStyle:{\"z-index\":\"30\"},attrs:{\"placement\":\"top-end\",\"trigger\":\"click\",\"id\":_vm.qualityid},on:{\"command\":_vm.handleCommand}},[_c('span',{staticClass:\"el-dropdown-link\",attrs:{\"id\":_vm.elqualityid}},[_c('i',{staticClass:\"el-icon-video-camera el-icon--left\"}),_vm._v(_vm._s(_vm.$t('message.live.Quality'))+\" \")]),_c('el-dropdown-menu',{attrs:{\"slot\":\"dropdown\"},slot:\"dropdown\"},[_vm._l((_vm.qualitylist),function(it,index){return _c('el-dropdown-item',{key:index,attrs:{\"command\":it}},[_vm._v(_vm._s(it.strName)+\" \")])})],2)],1)],1),_c('div',{staticClass:\"Audio_slider\",attrs:{\"id\":\"Audio_slider\"}},[_c('el-slider',{attrs:{\"step\":0.1,\"show-tooltip\":false,\"max\":1},on:{\"input\":_vm.Audiochange},model:{value:(_vm.Audioslider),callback:function ($$v) {_vm.Audioslider=$$v},expression:\"Audioslider\"}})],1),_c('div',{staticClass:\"information\",staticStyle:{\"display\":\"none padding:0px\"}},[_c('div',{staticClass:\"information_con\"},[_c('div',{staticClass:\"information1\"},[_c('div',{staticClass:\"information_title\"},[_vm._v(_vm._s(_vm.$t('message.live.Video')))]),_vm._l((_vm.informationVideo),function(a,index){return _c('div',{key:index,staticClass:\"information_content\"},[_c('div',{staticClass:\"information_content_left\"},[_vm._v(_vm._s(a.name))]),_c('div',{staticClass:\"information_content_right\"},[_vm._v(_vm._s(a.data))])])})],2),_c('div',{staticClass:\"information1\"},[_c('div',{staticClass:\"information_title\"},[_vm._v(_vm._s(_vm.$t('message.live.Audio')))]),_vm._l((_vm.informationAudio),function(a,index){return _c('div',{key:index,staticClass:\"information_content\"},[_c('div',{staticClass:\"information_content_left\"},[_vm._v(_vm._s(a.name))]),_c('div',{staticClass:\"information_content_right\"},[_vm._v(_vm._s(a.data))])])})],2)])]),_c('div',{staticClass:\"btnbox\",staticStyle:{\"width\":\"100%\",\"height\":\"100%\",\"position\":\"absolute\",\"top\":\"0\",\"left\":\"0\"}},[_c('div',{staticClass:\"liveplay_butt\"},[_c('div',{staticStyle:{\"display\":\"flex\",\"justify-content\":\"flex-end\"}},[_c('button',{staticClass:\"iconfont icon-bofang open_button rotate\",staticStyle:{\"font-size\":\"12px\",\"line-height\":\"14px\"},attrs:{\"id\":_vm.rtcid},on:{\"click\":_vm.open_liveplay_butt}}),(_vm.$store.state.liveviewrtc == 'RTC')?_c('button',{staticClass:\"open_liveplay_butt\",attrs:{\"type\":\"text\"}},[_vm._v(\"RTC\")]):_c('button',{staticClass:\"open_liveplay_butt\",attrs:{\"type\":\"text\"}},[_vm._v(\"WS\")]),_c('CDropdown',{staticClass:\"fw_butt\",attrs:{\"color\":\"link\",\"placement\":\"top-start\",\"caret\":false},scopedSlots:_vm._u([{key:\"toggler-content\",fn:function(){return [_c('button',{staticClass:\"iconfont icon-erweima1\",staticStyle:{\"margin-left\":\"0px\"},on:{\"click\":_vm.qrcode}})]},proxy:true}])},[_c('div',{staticClass:\"bottom_QR\"},[_c('div',{staticClass:\"bottom_scan\"},[_vm._v(\"扫一扫\")]),_c('div',{staticClass:\"bottom_QRcode\"},[_c('div',[_c('div',{ref:\"qrcodead\",staticStyle:{\"margin-bottom\":\"16px\"},attrs:{\"id\":\"qrcodead1\"}}),_c('div',[_vm._v(\"Android\")])]),_c('div',[_c('div',{ref:\"qrcodeios\",staticStyle:{\"margin-bottom\":\"16px\"},attrs:{\"id\":\"qrcodeios1\"}}),_c('div',[_vm._v(\"iOS\")])])])])]),_c('button',{staticClass:\"info_id_show iconfont\",class:(_vm.Audioslider==0)?'icon-jingyin':'icon-mn_shengyin_fill',on:{\"click\":_vm.Audiosetup}}),_c('button',{staticClass:\"info_id_show iconfont icon-liuliang\",on:{\"click\":_vm.Information}}),_c('button',{staticClass:\"iconfont\",class:_vm.Shoutwheatclass,on:{\"click\":_vm.Shoutwheat}}),_c('button',{staticClass:\"iconfont icon-picfill\",on:{\"click\":_vm.DoSnapshotWeb}}),_c('button',{staticClass:\"iconfont icon-camerafill\",on:{\"click\":_vm.DoSnapshot}}),_c('button',{staticClass:\"iconfont icon-videofill\",on:{\"click\":_vm.DoManualRecordStart}}),_c('button',{staticClass:\"iconfont icon-radioboxfill\",on:{\"click\":_vm.DoManualRecordStop}}),_c('button',{staticClass:\"ptz_id_show iconfont icon-yuntai\",on:{\"click\":_vm.PtzControlShow}}),_c('button',{staticClass:\"iconfont icon-full\",on:{\"click\":_vm.FullScreen}}),_c('button',{staticClass:\"iconfont icon-roundclosefill\",on:{\"click\":function($event){return _vm.CloseVideo('close')}}})],1)]),_c('div',{staticClass:\"liveplay_ptz\",staticStyle:{\"display\":\"none padding:0px\",\"z-index\":\"100\"}},[_c('div',{staticClass:\"flex_content\"},[_c('div',{staticClass:\"content_zoom\"},[_c('div',{staticClass:\"key_zoom\"},[_c('div',{staticClass:\"key_flex\"},[_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionUpleft($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionUpleft($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionUp($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionUp($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionUpright($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionUpright($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionLeft($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionLeft($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\"}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionRight($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionRight($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionDownleft($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionDownleft($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionDown($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionDown($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}}),_c('div',{staticClass:\"key_but\",on:{\"mousedown\":function($event){return _vm.PtzActionDownright($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionDownright($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})])]),_c('div',{staticClass:\"zoom\"},[_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.focusing,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-add-focus zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionZoomIn($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionZoomIn($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.focusing,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-reduce-focus zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionZoomOut($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionZoomOut($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})])],1)]),_c('div',{staticClass:\"zoom_g\"},[_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.Focus,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-jujiao2 zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionfocusing($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionfocusing($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.Focus,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-jujiao1 zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionfocusings($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionfocusings($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.aperture,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-guangquanjia zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionaperture($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionaperture($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.aperture,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-guangquanjian zoom_add\",on:{\"mousedown\":_vm.PtzActionaperturej,\"mouseup\":_vm.PtzActionStop,\"touchstart\":_vm.PtzActionaperturej,\"touchend\":_vm.PtzActionStop}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.LightON,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-light-open zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionlighton($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionfocusing($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.LightOFF,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-light-close zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionlightoff($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionfocusings($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.WiperON,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-kaiyushua zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionwiperon($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionaperture($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})]),_c('el-tooltip',{attrs:{\"enterable\":false,\"content\":_vm.content.WiperOFF,\"placement\":\"top\",\"effect\":\"light\"}},[_c('button',{staticClass:\"iconfont icon-guanyushua zoom_add\",on:{\"mousedown\":function($event){return _vm.PtzActionwiperoff($event)},\"mouseup\":function($event){return _vm.PtzActionStop($event)},\"touchstart\":function($event){return _vm.PtzActionaperture($event)},\"touchend\":function($event){return _vm.PtzActionStop($event)}}})])],1),_c('div',{staticClass:\"Preset\"},[_c('div',{staticStyle:{\"text-align\":\"center\"}},[_c('el-slider',{attrs:{\"show-tooltip\":false,\"max\":1,\"min\":0.1,\"step\":0.1},model:{value:(_vm.Preset_value),callback:function ($$v) {_vm.Preset_value=$$v},expression:\"Preset_value\"}}),_c('span',{staticStyle:{\"color\":\"#ffffff\"}},[_vm._v(_vm._s(_vm.Preset_value))])],1),_c('div',{staticClass:\"block\"},[_c('el-timeline',_vm._l((_vm.Presetdata),function(Pre){return _c('el-timeline-item',{key:Pre.strName,attrs:{\"placement\":\"top\"}},[_c('el-card',[_c('div',{staticClass:\"preset_bgc\"},[_c('input',{staticClass:\"preset_input\",attrs:{\"type\":\"text\"},domProps:{\"value\":Pre.strName}}),_c('button',{staticClass:\"iconfont icon-RectangleCopy1\",attrs:{\"type\":\"button\"},on:{\"click\":function($event){return _vm.preset_Jump(Pre.strToken)}}}),_c('button',{staticClass:\"iconfont icon-icon-test1\",attrs:{\"type\":\"button\"},on:{\"click\":function($event){return _vm.preset_set(Pre.strToken,$event)}}})])])],1)}),1)],1)])])])])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Liveplay.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Liveplay.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Liveplay.vue?vue&type=template&id=2025fd41&scoped=true&\"\nimport script from \"./Liveplay.vue?vue&type=script&lang=js&\"\nexport * from \"./Liveplay.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Liveplay.vue?vue&type=style&index=0&id=2025fd41&prod&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"2025fd41\",\n  null\n  \n)\n\nexport default component.exports","\nfunction uuid (len, radix) {\n  var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('')\n  var uuid = []\n  var i\n  radix = radix || chars.length\n\n  if (len) {\n    // Compact form\n    for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random() * radix]\n  } else {\n    // rfc4122, version 4 form\n    var r\n\n    // rfc4122 requires these characters\n    uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-'\n    uuid[14] = '4'\n\n    // Fill in random data.  At i==19 set the high bits of clock sequence as\n    // per rfc4122, sec. 4.1.5\n    for (i = 0; i < 36; i++) {\n      if (!uuid[i]) {\n        r = 0 | Math.random() * 16\n        uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r]\n      }\n    }\n  }\n\n  return uuid.join('')\n}\n\nexport default uuid\n","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./layout.vue?vue&type=style&index=0&id=73cebdd7&prod&lang=scss&scoped=true&\"","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Liveplay.vue?vue&type=style&index=0&id=2025fd41&prod&lang=scss&scoped=true&\"","import {H5sPlayerWS,H5sPlayerHls,H5sPlayerRTC} from './h5splayer.js'\n/** \n * Check on iOS platform\n*/\nfunction H5siOS() {\n\n  var iDevices = [\n    'iPad Simulator',\n    'iPhone Simulator',\n    'iPod Simulator',\n    'iPad',\n    'iPhone',\n    'iPod'\n  ];\n\n  if (!!navigator.platform) {\n    while (iDevices.length) {\n      if (navigator.platform === iDevices.pop()){ return true; }\n    }\n  }\n\n  return false;\n}\n\n/** \n *=================H5Player Create\n *\n */\n \nfunction H5sPlayerCreate(conf) {\n\tvar player;\n\n\tif (H5siOS())\n\t{\n        player = new H5sPlayerRTC(conf);\n\t}else{\n        player = new H5sPlayerWS(conf);\n\t}\n\treturn player;\n}\n\n \n/** \n *=================H5Player Delete\n *\n */\nfunction H5sPlayerDelete(player) {\n\t// delete player;\n\t\n\treturn true;\n}\n \nexport {H5siOS,H5sPlayerCreate}\n\n","<template>\n  <div class=liveview>\n    <div id=\"watermarktoggle\"></div>\n    <!-- 右边视频栏 -->\n    <div class=\"liveview_right\" id=\"videoPanel\">\n      <div id=\"video_hed\">\n        <div name='flex' style=\"position: relative;\" class=\"videoColor videoHeader\" v-for=\"r in rows\" :key=\"r\">\n          <div class=\"palace\" name=\"flex\" v-for=\"c in cols\" @contextmenu.prevent=\"stopVideo($event)\"\n            @click=\"videoClick(r,c,$event)\" :key=\"c\">\n            <v-liveplay v-bind:id=\"'h'+r+c\" :h5id=\"'h'+r+c\" :rows=\"rows\" :cols=\"cols\" :h5videoid=\"'hvideo'+r+c\"\n              :canvasid=\"'canvas'+r+c\">\n            </v-liveplay>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n<script>\nimport Vue from 'vue'\nimport liveplay from './layout/Liveplay.vue'\nimport uuid from '../assets/js/uuid'\nexport default {\n  name: 'Liveview',\n  components: {\n    'v-liveplay': liveplay\n  },\n  data () {\n    return {\n      viewlists: {},\n      cur_query: this.$route.query || {},\n      viewdata: [],//视图数据\n      proto: this.$store.state.liveviewrtc,\n      rows: 0,\n      cols: 0,\n      selectCol: 1,\n      selectRow: 1,\n      contentHeight: '',\n      contentWidth: '',\n      data: [],\n      objlist: {},\n      tokens: {},\n      data22: ['h11', 'h12', 'h21', 'h22'],\n      data33: ['h11', 'h12', 'h13', 'h21', 'h22', 'h23', 'h31', 'h32', 'h33'],\n      data44: ['h11', 'h12', 'h13', 'h14', 'h21', 'h22', 'h23', 'h24', 'h31', 'h32', 'h33', 'h34', 'h41', 'h42', 'h43', 'h44'],\n      data55: ['h11', 'h12', 'h13', 'h14', 'h15', 'h21', 'h22', 'h23', 'h24', 'h25', 'h31', 'h32', 'h33', 'h34', 'h35', 'h41', 'h42', 'h43', 'h44', 'h45', 'h51', 'h52', 'h53', 'h54', 'h55'],\n      data6: ['h11', 'h14', 'h15', 'h12', 'h13', 'h16', 'h17'],\n      data8: ['h11', 'h12', 'h13', 'h14', 'h15', 'h16', 'h17', 'h19', 'h18', 'h110', 'h111', 'h112', 'h113'],\n      vdata: [],\n    }\n  },\n  mounted () {\n    this.viewlist();\n    $('.c-header').hide();\n    setTimeout(() => {\n      this.viewplay();\n      this.updateUI(1);\n      this.addWaterMarker();\n      this.licenseWaterMark();\n    }, 1000);\n    this.$nextTick(() => {\n      this.srcview();\n    });\n  },\n  methods: {\n    stopVideo (event) {\n      return;\n    },\n    licenseWaterMark () {\n      let _this = this;\n      var url = _this.$store.state.IPPORT + \"/api/v1/GetSystemInfo?session=\" + _this.$store.state.token;\n      // console.log(\"------------\",url)\n      _this.$http.get(url).then(result => {\n        if (result.status == 200) {\n          if (result.data.strLicenseType == 'Enterprise' || result.data.strLicenseType == 'Customization') {\n            this.$store.state.Certificatetime = 'false'\n            sessionStorage.Certificatetime = 'false'\n            if (localStorage.getItem('watermarktoggle') == null) {\n              if (this.$store.state.Certificatetime == \"true\") {\n                document.getElementById(\"watermarktoggle\").style.display = 'block';\n              } else if (this.$store.state.Certificatetime == \"false\") {\n                document.getElementById(\"watermarktoggle\").style.display = 'none';\n              }\n            } else {\n              document.getElementById(\"watermarktoggle\").style.display = this.$store.state.watermarktoggle;\n            }\n          } else {\n            this.$store.state.Certificatetime = 'true'\n            sessionStorage.Certificatetime = 'true'\n            if (localStorage.getItem('watermarktoggle') == null) {\n              if (this.$store.state.Certificatetime == \"true\") {\n                document.getElementById(\"watermarktoggle\").style.display = 'block';\n              } else if (this.$store.state.Certificatetime == \"false\") {\n                document.getElementById(\"watermarktoggle\").style.display = 'none';\n              }\n            } else {\n              document.getElementById(\"watermarktoggle\").style.display = this.$store.state.watermarktoggle;\n            }\n          }\n        }\n      }).catch(error => {\n        console.log(\"GetSystemInfo\");\n      });\n    },\n    //水印\n    addWaterMarker () {\n      if (!document.getElementById(\"watermarktoggle\")) {\n        return\n      }\n      console.log(111111111111111);\n      var date = new Date();\n      var Y = date.getFullYear() + '-';\n      var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';\n      var D = date.getDate() + ' ';\n      var dates = Y + M + D;\n      var watermarkstring = this.$store.state.watermarkstring;\n      // console.log(watermarkstring);\n\n      var can = document.createElement('canvas');\n      var body = document.body;\n      body.appendChild(can);\n      can.width = 300; //画布的宽\n      can.height = 200;//画布的高度\n      can.style.display = 'none';\n      var cans = can.getContext('2d');\n      cans.rotate(-20 * Math.PI / 140); //画布里面文字的旋转角度\n      cans.font = \"16px Microsoft JhengHei\"; //画布里面文字的字体\n      cans.fillStyle = \"rgba(17, 17, 17, 1)\";//画布里面文字的颜色\n      cans.textAlign = 'left'; //画布里面文字的水平位置\n      cans.textBaseline = 'Middle'; //画布里面文字的垂直位置\n      cans.fillText(watermarkstring, can.width / 3, can.height / 2); //画布里面文字的间距比例\n      console.log(\"url(\" + can.toDataURL(\"image/png\") + \")\");\n      document.getElementById(\"watermarktoggle\").style.backgroundImage = \"url(\" + can.toDataURL(\"image/png\") + \")\";\n    },\n    viewplay () {\n      let data = this.cur_query.view;\n      console.log(111111111111, data, this.cur_query);\n      console.log(this.viewlists);\n      if (this.viewlists[data]) {\n        console.log(this.viewlists[data]);\n        this.viewClick(this.viewlists[data]);\n      }\n    },\n    viewlist () {\n      this.vdata = [];\n      var strview = '';\n      let query = this.$route.query;\n      console.log(query.type)\n      if (!query.type || query.type == 'undefined') {\n        return;\n      } else {\n        if (query.type == 1) {\n          strview = '1|1'\n        } else if (query.type == 2) {\n          strview = '1|3'\n        } else if (query.type == 3) {\n          strview = '2|2'\n        } else if (query.type == 4) {\n          strview = '1|4'\n        } else if (query.type == 5) {\n          strview = '1|6'\n        } else if (query.type == 6) {\n          strview = '1|7'\n        } else if (query.type == 7) {\n          strview = '3|3'\n        } else if (query.type == 8) {\n          strview = '1|13'\n        } else if (query.type == 9) {\n          strview = '4|4'\n        } else {\n          return;\n        }\n      }\n\n      this.changePanel(strview, 'viewClick')\n      var url = this.$store.state.IPPORT + \"/api/v1/GetSrc\" + \"?session=\" + this.$store.state.token;\n      this.$http.get(url).then(result => {\n        if (result.status === 200) {\n          console.log(result.data.src);\n          for (let i = 0; i < result.data.src.length; i++) {\n            this.objlist[result.data.src[i].strToken] = result.data.src[i].strName;\n          }\n        }\n        for (let i = 1; i < 26; i++) {\n          this.tokens[i] = query[i];\n        }\n        for (const k in this.tokens) {\n          if (this.tokens[k] != undefined) {\n            if (query.type == 3) {\n              var data = {\n                strIndex: this.data22[k - 1] || 'h11',\n                strToken: this.tokens[k],\n                strStream: query.stream || \"main\",\n                strName: this.objlist[this.tokens[k]]\n              }\n              this.vdata.push(data);\n            } else if (query.type == 7) {\n              var data = {\n                strIndex: this.data33[k - 1] || 'h11',\n                strToken: this.tokens[k],\n                strStream: query.stream || \"main\",\n                strName: this.objlist[this.tokens[k]]\n              }\n              this.vdata.push(data);\n            } else if (query.type == 9) {\n              var data = {\n                strIndex: this.data44[k - 1] || 'h11',\n                strToken: this.tokens[k],\n                strStream: query.stream || \"main\",\n                strName: this.objlist[this.tokens[k]]\n              }\n              this.vdata.push(data);\n            } else if (query.type == 6) {\n              var data = {\n                strIndex: this.data6[k - 1] || 'h11',\n                strToken: this.tokens[k],\n                strStream: query.stream || \"main\",\n                strName: this.objlist[this.tokens[k]]\n              }\n              this.vdata.push(data);\n            } else if (query.type == 8) {\n              var data = {\n                strIndex: this.data8[k - 1] || 'h11',\n                strToken: this.tokens[k],\n                strStream: query.stream || \"main\",\n                strName: this.objlist[this.tokens[k]]\n              }\n              this.vdata.push(data);\n            } else {\n              var vid = 'h1' + k;\n              var data = {\n                strIndex: vid || 'h11',\n                strToken: this.tokens[k],\n                strStream: query.stream || \"main\",\n                strName: this.objlist[this.tokens[k]]\n              }\n              this.vdata.push(data);\n\n            }\n          }\n        }\n        var listdata = {\n          strLayoutType: strview,\n          src: this.vdata,\n          icon: \"iconfont icon-tubiao_huaban1fuben51\",\n        }\n        this.viewClick(listdata);\n      })\n    },\n    //播放视图\n    async viewClick (data) {\n      console.log(data);\n      this.$store.state.liveviewadd = [];\n      var _this = this;\n      await this.changePanel(data, 'viewClick')\n      if (data.src.length == 0) {\n        var vdata = {\n          viewparameter: 'viewparameter'\n        }\n        _this.$store.state.layoutplay = vdata;\n        return\n      }\n      for (var i = 0; i < data.src.length; i++) {\n        console.log(this.objlist, this.objlist[data.src[i].strToken], data.src[i].strToken);\n        var label = '';\n        if (data.src[i].strStream == 'main') {\n          // label=data.src[i].strName+\"--\"+this.$t('message.live.mainstream');\n          label = this.objlist[data.src[i].strToken] + \"--\" + this.$t('message.live.mainstream');\n        } else if (data.src[i].strStream == 'sub') {\n          // label=data.src[i].strName+\"--\"+this.$t('message.live.substream');\n          label = this.objlist[data.src[i].strToken] + \"--\" + this.$t('message.live.substream');\n        }\n        var vdata = {\n          token: data.src[i].strToken,\n          streamprofile: data.src[i].strStream,\n          name: label,\n          label: data.src[i].strName,\n          vid: data.src[i].strIndex,\n          viewparameter: 'viewparameter'\n        }\n        var viewdata = {\n          strIndex: data.src[i].strIndex,\n          strToken: data.src[i].strToken,\n          strStream: data.src[i].strStream\n        }\n        _this.$store.state.layoutplay = vdata;\n        await _this.$store.state.liveviewadd.push(viewdata);\n      }\n    },\n    srcview () {\n      console.log(this.$store.state.token);\n      var url = this.$store.state.IPPORT + \"/api/v1/GetView?session=\" + this.$store.state.token;\n      this.$http.get(url).then(result => {\n        console.log(result);\n        if (result.status === 200) {\n          // console.log(result)\n          var oldarr = result.data.conf;\n          var oldarr1 = result.data.src;\n          for (var l in oldarr) {\n            var dataroot = this.getview(oldarr[l], oldarr1);\n            this.viewdata.push(dataroot);\n            this.viewlists[dataroot.strName] = dataroot\n          }\n          console.log(this.viewlists);\n          // console.log(this.viewlists.indexOf(cur_query['view']));\n          console.log(this.viewdata);\n        }\n      })\n    },\n    getview (arr, arr1) {\n      if (arr.strLayoutType == '1|1') {\n        arr.icon = 'iconfont icon-tubiao_huaban11';\n      } else if (arr.strLayoutType == '1|3') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben1';\n      } else if (arr.strLayoutType == '2|2') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben21';\n      } else if (arr.strLayoutType == '1|6') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben31';\n      } else if (arr.strLayoutType == '1|7') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben41';\n      } else if (arr.strLayoutType == '3|3') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben51';\n      } else if (arr.strLayoutType == '1|13') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben61';\n      } else if (arr.strLayoutType == '4|4') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben71';\n      } else if (arr.strLayoutType == '5|5') {\n        arr.icon = 'iconfont icon-tubiao_huaban1fuben8';\n      }\n      for (var i in arr.src) {\n        for (var j in arr1) {\n          if (arr.src[i].strToken == arr1[j].strToken) {\n            arr.src[i].strName = arr1[j].strName;\n          }\n        }\n      }\n      return arr;\n    },\n    //点击宫格\n    videoClick (r, c, $event) {\n      this.selectCol = c;\n      this.selectRow = r;\n      console.log(r, c);\n      $(\".h5container\").removeClass('h5videoh');\n      $(\"#h\" + r + c).addClass('h5videoh');\n    },\n    // ui宽度\n    updateUI (x) {\n      console.log(this.rows, 'this.rows');\n      if ($(document.body).width() < 768) {\n        this.contentHeight = $(document.body).height() * 0.4;\n      } else {\n        this.contentHeight = $(document.body).height() * x;\n      }\n      $('div[name=\"flex\"]').height(this.contentHeight / this.rows);\n      $(document.body).css('overflow-y', 'hidden');\n    },\n    //点击宫格\n    changePanel (event, viewClick) {\n      console.log(viewClick, event);\n      var data = ''\n      if (viewClick == 'viewClick') {\n        data = event.strLayoutType || event\n      } else {\n        data = $(event.target).data('row');\n      }\n      // return\n      let _this = this;\n      let cols = data.split('|')[1];\n      let rows = data.split('|')[0];\n      //this.map.clear();\n      Object.assign(this.$data, {\n        rows: parseInt(rows),\n        cols: parseInt(cols)\n      });\n      console.log(this.rows, this.cols);\n      Vue.nextTick(function () {\n        if (data == '1|6' || data == '1|7' || data == '1|13') {\n        } else {\n          $(\"#videoPanel .videoColor .palace\").removeClass(\"Seven_Palace\");\n          $(\"#videoPanel .videoColor .palace\").removeClass(\"Six_Palace\");\n          $(\"#videoPanel .videoColor .palace\").removeClass(\"videoflexitem\");\n          $(\"#videoPanel .videoColor .palace\").removeClass(\"fours_Palace\");\n        }\n        var list_gong = $(\".palace\");\n        if (data == '1|4') {\n          list_gong.removeClass(\"videoflexitem\");\n          list_gong.removeClass(\"Seven_Palace\");\n          list_gong.removeClass(\"Six_Palace\");\n          list_gong.addClass(\"fours_Palace\");\n        }\n        if (data == '1|6') {\n          list_gong.removeClass(\"videoflexitem\");\n          list_gong.removeClass(\"Seven_Palace\");\n          list_gong.removeClass(\"fours_Palace\");\n          list_gong.addClass(\"Six_Palace\");\n        }\n        if (data == '1|7') {\n          list_gong.removeClass(\"videoflexitem\");\n          list_gong.removeClass(\"Six_Palace\");\n          list_gong.removeClass(\"fours_Palace\");\n          list_gong.addClass(\"Seven_Palace\");\n        }\n        if (data == '1|13') {\n          list_gong.removeClass(\"Six_Palace\");\n          list_gong.removeClass(\"Seven_Palace\");\n          list_gong.removeClass(\"fours_Palace\");\n          list_gong.addClass(\"videoflexitem\");\n        }\n        $('div[name=\"flex\"]').height(_this.contentHeight / rows);\n        var cors = _this.cols * _this.rows;\n        console.log(cors);\n        if (cors > 9) {\n          $('.ptz_id_show').hide()\n          $('.info_id_show').hide()\n          $('.ptzcontrols').hide()\n          $('.information').hide()\n          $('.liveplay_ptz').hide()\n          $('.open_button').hide();\n          $('.open_liveplay_butt').hide();\n        }\n        if (cors <= 9) {\n          $('.ptz_id_show').show()\n          $('.info_id_show').show()\n          $('.open_button').show();\n          // $('.open_liveplay_butt').show();\n        }\n      })\n    },\n  },\n  computed: {\n    watchvideo () {\n      console.log(this.$route.query);\n      return this.$route.query;\n    },\n  },\n  //监听器\n  watch: {\n    watchvideo (data) {\n      this.viewlist();\n    },\n  },\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.liveview {\n  width: 100vw;\n  height: 90vh;\n  // padding-top: 10px;\n  /* 水印 */\n  #watermarktoggle {\n    position: fixed;\n    z-index: 100;\n    width: 100%;\n    height: 100%;\n    left: 0;\n    top: 0;\n    display: none;\n    pointer-events: none;\n    margin-top: 40px;\n  }\n  .liveview_right {\n    width: 100%;\n    height: 100%;\n    /* 播放片段 */\n    .h5videoh {\n      /* border: 2px solid #f44336 !important;\n            box-sizing: border-box; */\n      box-shadow: 0 0 0 2px #f44336;\n      // box-sizing: border-box;\n      z-index: 10;\n    }\n    #video_hed {\n      height: 100%;\n    }\n    .videoColor {\n      height: 100%;\n      .palace {\n        height: 100% !important;\n        background-size: 10%;\n        flex: 1 1 10%;\n      }\n      .fours_Palace {\n        flex: 1 1 33.33% !important;\n        height: 33.33% !important;\n        &:nth-child(1) {\n          flex: 1 1 100% !important;\n          height: 66.66% !important;\n        }\n      }\n      /* 六 */\n      .Six_Palace {\n        flex: 1 1 33.33% !important;\n        height: 33.33% !important;\n        &:nth-child(1) {\n          flex: 1 1 66.66% !important;\n          height: 66.66% !important;\n        }\n        &:nth-child(3) {\n          width: 33.33% !important;\n          position: absolute;\n          top: 33.33%;\n          right: 0;\n        }\n      }\n      /* 十三宫格 */\n      .videoflexitem {\n        flex: 1 1 25% !important;\n        width: 25% !important;\n        height: 25% !important;\n        &:nth-child(6) {\n          position: absolute;\n          top: 50%;\n          left: 0;\n        }\n        &:nth-child(7) {\n          flex: 1 1 50% !important;\n          height: 50% !important;\n        }\n        &:nth-child(8) {\n          flex: 1 1 25% !important;\n          position: absolute;\n          top: 50%;\n          right: 0;\n        }\n      }\n      /* 七宫格 */\n      .Seven_Palace {\n        flex: 1 1 33.33%;\n        height: 33.33% !important;\n        &:nth-child(1) {\n          height: 100% !important;\n        }\n        &:nth-child(3) {\n          width: 33.33% !important;\n          position: absolute;\n          top: 33.33%;\n          right: 0;\n        }\n        &:nth-child(2) {\n          width: 33.33% !important;\n          position: absolute;\n          top: 33.33%;\n          right: 33.33%;\n        }\n        &:nth-child(6) {\n          width: 33.33% !important;\n          position: absolute;\n          bottom: 0;\n          right: 33.33%;\n        }\n        &:nth-child(7) {\n          width: 33.33% !important;\n          position: absolute;\n          bottom: 0;\n          right: 0;\n        }\n      }\n    }\n    div[name=\"flex\"] {\n      display: flex;\n      flex-wrap: wrap;\n      border-bottom: 0px !important;\n      :hover {\n        /*background-color: #3c8dbc;*/\n        cursor: pointer;\n      }\n      + [name=\"flex\"] {\n        border-left: 0px !important;\n      }\n    }\n    .liveview_group {\n      width: 100%;\n      padding: 20px 20%;\n      display: none;\n      justify-content: space-between;\n      button {\n        border: none;\n        background: none;\n        font-size: 30px;\n      }\n    }\n  }\n}\n</style>","<template>\n  <div class=\"liveplay h5container\">\n    <video class=\"h5video\" :id=\"videoid\" autoplay webkit-playsinline playsinline></video>\n    <div :id=\"videonameid\" class=\"\" style=\"z-index:30\">\n      {{videoname}} {{picturequality}}\n      <input type=\"button\" :value=\"valuebutton\" @click=\"Bitstream($event.target.value)\" :id=\"inputid\"\n        class=\"spanpicturequality\" />\n    </div>\n    <!-- <div :id=\"rtcid\" class=\"\"></div> -->\n    <!-- 画质 -->\n    <span class=\"spanquality\" :id=\"spanqualityid\">\n      <el-dropdown placement='top-end' trigger=\"click\" @command=\"handleCommand\" class=\" \" :id=\"qualityid\"\n        style=\"z-index:30\">\n        <span :id=\"elqualityid\" class=\"el-dropdown-link\">\n          <i class=\"el-icon-video-camera el-icon--left\"></i>{{$t('message.live.Quality')}}\n        </span>\n        <el-dropdown-menu slot=\"dropdown\">\n          <template>\n            <el-dropdown-item v-for=\"(it,index) in qualitylist\" :key=\"index\" :command=\"it\">{{it.strName}}\n            </el-dropdown-item>\n          </template>\n        </el-dropdown-menu>\n      </el-dropdown>\n    </span>\n    <div id=\"Audio_slider\" class=\"Audio_slider\">\n      <el-slider :step='0.1' :show-tooltip=\"false\" :max='1' @input='Audiochange' v-model=\"Audioslider\"></el-slider>\n    </div>\n    <div class=\"information\" style=\"display:none padding:0px\">\n      <div class=\"information_con\">\n        <div class=\"information1\">\n          <div class=\"information_title\">{{$t('message.live.Video')}}</div>\n          <div class=\"information_content\" v-for=\"(a,index) in informationVideo\" :key=\"index\">\n            <div class=\"information_content_left\">{{a.name}}</div>\n            <div class=\"information_content_right\">{{a.data}}</div>\n          </div>\n        </div>\n        <div class=\"information1\">\n          <div class=\"information_title\">{{$t('message.live.Audio')}}</div>\n          <div class=\"information_content\" v-for=\"(a,index) in informationAudio\" :key=\"index\">\n            <div class=\"information_content_left\">{{a.name}}</div>\n            <div class=\"information_content_right\">{{a.data}}</div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"btnbox\" style=\"width: 100%;height:100%;position: absolute; top: 0;left: 0;\">\n      <div class=\"liveplay_butt\">\n        <div style=\"display: flex;justify-content: flex-end;\">\n          <button :id=\"rtcid\" class=\"iconfont icon-bofang open_button rotate\" @click=\"open_liveplay_butt\"\n            style=\"font-size:12px;line-height: 14px;\"></button>\n          <button class=\"open_liveplay_butt\" type=\"text\" v-if=\"$store.state.liveviewrtc == 'RTC'\">RTC</button>\n          <button class=\"open_liveplay_butt\" type=\"text\" v-else>WS</button>\n          <CDropdown class=\"fw_butt\" style=\"\" color=\"link\" placement=\"top-start\" :caret=\"false\">\n            <template #toggler-content>\n              <button class=\"iconfont icon-erweima1\" @click=\"qrcode\" style=\"margin-left:0px;\"></button>\n            </template>\n            <div class=\"bottom_QR\">\n              <div class=\"bottom_scan\">扫一扫</div>\n              <div class=\"bottom_QRcode\">\n                <div>\n                  <div ref=\"qrcodead\" id=\"qrcodead1\" style=\"margin-bottom: 16px;\"></div>\n                  <div>Android</div>\n                </div>\n                <div>\n                  <div ref=\"qrcodeios\" id=\"qrcodeios1\" style=\"margin-bottom: 16px;\"></div>\n                  <div>iOS</div>\n                </div>\n              </div>\n            </div>\n          </CDropdown>\n          <button class=\"info_id_show iconfont\" :class=\"(Audioslider==0)?'icon-jingyin':'icon-mn_shengyin_fill'\"\n            @click=\"Audiosetup\"></button>\n          <button class=\"info_id_show iconfont icon-liuliang\" @click=\"Information\"></button>\n          <button class=\"iconfont\" :class=\"Shoutwheatclass\" @click=\"Shoutwheat\"></button>\n          <button class=\"iconfont icon-picfill\" @click=\"DoSnapshotWeb\"></button>\n          <button class=\"iconfont icon-camerafill\" @click=\"DoSnapshot\"></button>\n          <button class=\"iconfont icon-videofill\" @click=\"DoManualRecordStart\"></button>\n          <button class=\"iconfont icon-radioboxfill\" @click=\"DoManualRecordStop\"></button>\n          <button class=\"ptz_id_show iconfont icon-yuntai\" @click=\"PtzControlShow\"></button>\n          <button class=\"iconfont icon-full\" @click=\"FullScreen\"></button>\n          <button class=\"iconfont icon-roundclosefill\" @click=\"CloseVideo('close')\"></button>\n        </div>\n      </div>\n      <div class=\"liveplay_ptz\" style=\"display:none padding:0px;z-index:100\">\n        <div class=\"flex_content\">\n          <div class=\"content_zoom\">\n            <div class=\"key_zoom\">\n              <div class=\"key_flex\">\n                <div class=\"key_but\" @mousedown=\"PtzActionUpleft($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionUpleft($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionUp($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionUp($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionUpright($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionUpright($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionLeft($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionLeft($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionRight($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionRight($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionDownleft($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionDownleft($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionDown($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionDown($event)\" @touchend=\"PtzActionStop($event)\"></div>\n                <div class=\"key_but\" @mousedown=\"PtzActionDownright($event)\" @mouseup=\"PtzActionStop($event)\"\n                  @touchstart=\"PtzActionDownright($event)\" @touchend=\"PtzActionStop($event)\"></div>\n              </div>\n\n            </div>\n            <div class=\"zoom\">\n              <el-tooltip :enterable=\"false\" :content=\"content.focusing\" placement=\"top\" effect=\"light\">\n                <button class=\"iconfont icon-add-focus zoom_add\" @mousedown=\"PtzActionZoomIn($event)\"\n                  @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionZoomIn($event)\"\n                  @touchend=\"PtzActionStop($event)\"></button>\n              </el-tooltip>\n              <el-tooltip :enterable=\"false\" :content=\"content.focusing\" placement=\"top\" effect=\"light\">\n                <button class=\"iconfont icon-reduce-focus zoom_add\" @mousedown=\"PtzActionZoomOut($event)\"\n                  @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionZoomOut($event)\"\n                  @touchend=\"PtzActionStop($event)\"></button>\n              </el-tooltip>\n            </div>\n          </div>\n          <div class=\"zoom_g\">\n            <el-tooltip :enterable=\"false\" :content=\"content.Focus\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-jujiao2 zoom_add\" @mousedown=\"PtzActionfocusing($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionfocusing($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n            <el-tooltip :enterable=\"false\" :content=\"content.Focus\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-jujiao1 zoom_add\" @mousedown=\"PtzActionfocusings($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionfocusings($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n\n            <el-tooltip :enterable=\"false\" :content=\"content.aperture\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-guangquanjia zoom_add\" @mousedown=\"PtzActionaperture($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionaperture($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n            <el-tooltip :enterable=\"false\" :content=\"content.aperture\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-guangquanjian zoom_add\" @mousedown=\"PtzActionaperturej\"\n                @mouseup=\"PtzActionStop\" @touchstart=\"PtzActionaperturej\" @touchend=\"PtzActionStop\"></button>\n            </el-tooltip>\n            <el-tooltip :enterable=\"false\" :content=\"content.LightON\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-light-open zoom_add\" @mousedown=\"PtzActionlighton($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionfocusing($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n            <el-tooltip :enterable=\"false\" :content=\"content.LightOFF\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-light-close zoom_add\" @mousedown=\"PtzActionlightoff($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionfocusings($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n            <el-tooltip :enterable=\"false\" :content=\"content.WiperON\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-kaiyushua zoom_add\" @mousedown=\"PtzActionwiperon($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionaperture($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n            <el-tooltip :enterable=\"false\" :content=\"content.WiperOFF\" placement=\"top\" effect=\"light\">\n              <button class=\"iconfont icon-guanyushua zoom_add\" @mousedown=\"PtzActionwiperoff($event)\"\n                @mouseup=\"PtzActionStop($event)\" @touchstart=\"PtzActionaperture($event)\"\n                @touchend=\"PtzActionStop($event)\"></button>\n            </el-tooltip>\n          </div>\n          <div class=\"Preset\">\n            <div class=\"\" style=\"text-align: center;\">\n              <el-slider v-model=\"Preset_value\" :show-tooltip=\"false\" :max=\"1\" :min=\"0.1\" :step=\"0.1\"></el-slider>\n              <span style=\"color:#ffffff;\">{{Preset_value}}</span>\n            </div>\n            <div class=\"block\">\n              <el-timeline>\n                <el-timeline-item placement=\"top\" v-for=\"Pre in Presetdata\" :key=\"Pre.strName\">\n                  <el-card>\n                    <div class=\"preset_bgc\">\n                      <input type=\"text\" class=\"preset_input\" :value=\"Pre.strName\" />\n                      <button type=\"button\" class=\"iconfont icon-RectangleCopy1\"\n                        @click=\"preset_Jump(Pre.strToken)\"></button>\n                      <button type=\"button\" class=\"iconfont icon-icon-test1\"\n                        @click=\"preset_set(Pre.strToken,$event)\"></button>\n                    </div>\n                  </el-card>\n                </el-timeline-item>\n              </el-timeline>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n<script>\nimport QRCode from 'qrcodejs2';\nimport '../../assets/js/adapter'\nimport { H5sPlayerWS, H5sPlayerHls, H5sPlayerRTC, H5sPlayerAudBack } from '../../assets/js/h5splayer.js'\nimport { H5siOS, H5sPlayerCreate } from '../../assets/js/h5splayerhelper.js'\nimport uuid from '../../assets/js/uuid';\nexport default {\n  name: \"liveplay\",\n  props: ['h5id', 'h5videoid', \"cols\", \"rows\"],\n  data () {\n    return {\n      Audioslider: 0,//音频\n      informationshow: false,\n      informationAudio: [],\n      informationVideo: [],\n      proto: this.$store.state.liveviewrtc,\n      videoid: this.h5videoid,\n      h5handler: undefined,//v1\n      audioback: undefined,//语音\n      currtoken: undefined,//token\n      tokenshou: null,\n      ptzshow: false,\n      audioshow: false,\n      Preset_value: 0.5,//镜头转换速度\n      Presetdata: [],//预置位数组\n      Shoutwheatclass: \"icon-voicefill1\",//语音图标\n      content: {\n        focusing: this.$t('message.live.focusing'),\n        Focus: this.$t('message.live.Focus'),\n        aperture: this.$t('message.live.aperture'),\n\n        LightON: this.$t('message.live.LightON'),\n        LightOFF: this.$t('message.live.LightOFF'),\n        WiperON: this.$t('message.live.WiperON'),\n        WiperOFF: this.$t('message.live.WiperOFF')\n      },//聚焦\n\n      spanqualityid: \"spanqualityid\" + this.h5videoid,\n      qualityid: 'quality' + this.h5videoid,\n      elqualityid: 'elqualityid' + this.h5videoid,\n      videonameid: \"name\" + this.h5videoid,\n      picturequalityid: \"picturequalityid\" + this.h5videoid,\n      inputid: \"input\" + this.h5videoid,\n      qualitylist: [],\n      valuebutton: this.$t(\"message.live.substream\"),\n      videoname: \"\",//视频名称\n      picturequality: '',//画质名称\n      rtcid: \"rtc\" + this.h5videoid,\n      streamprofileInformation: null,//码流区分\n      height: \"\",\n      width: \"\"\n    }\n  },\n  beforeDestroy () {\n    this.CloseVideo('close');\n  },\n  computed: {\n    listData () {\n      return this.$store.state.layoutplay;\n    },\n    watchvideo () {\n      console.log(this.$route.query);\n      return this.$route.query;\n    },\n  },\n  mounted () {\n    let _this = this;\n    // console.log(this.$store.state.liveplay)\n    $(\"#\" + this.spanqualityid).addClass(\"spanquality\")\n    $(\"#\" + this.inputid).addClass(\"spanpicturequality\")\n    this.Gettranscod();\n    if (this.$route.query.ctrl == 'true') {\n      $('.btnbox').css(\"display\", \"block\")\n    } else {\n      $('.btnbox').css(\"display\", \"none\")\n    }\n    if (this.$route.query.type) {\n      var strLayoutType = this.$route.query.type;\n      $('.liveplay_butt').children().children('.open_button').addClass('rotate');\n      $('.liveplay_butt').children().children('.open_liveplay_butt').css(\"display\", \"none\");\n      if (strLayoutType == \"8\" || strLayoutType == \"9\") {\n        this.$nextTick(() => {\n          $('.liveplay_butt').css('background-size', '280px 35px');\n        })\n      } else {\n        this.$nextTick(() => {\n          $('.liveplay_butt').css('background-size', '380px 35px');\n        })\n      }\n    }\n  },\n  watch: {\n    listData (token) {\n      console.log(token);\n      if (token.viewparameter == 'viewparameter') {\n        this.CloseVideo(token.viewparameter);\n      }\n      setTimeout(() => {\n        if (this.h5id != token.vid) {\n          return;\n        }\n\n        this.PlayVideo(token.token, token.streamprofile, token.label, token.name);\n        this.tokenshou = token.token;\n        this.streamprofileInformation = token.streamprofile\n      }, 200)\n    },\n    watchvideo (data) {\n      if (data.ctrl == 'true') {\n        $('.btnbox').css(\"display\", \"block\")\n      } else {\n        $('.btnbox').css(\"display\", \"none\")\n      }\n      if (data.type) {\n        if (data.type == 0 || data.type > 9) {\n        } else {\n          var strLayoutType = data.type;\n          $('.liveplay_butt').children().children('.open_button').addClass('rotate');\n          $('.liveplay_butt').children().children('.open_liveplay_butt').css(\"display\", \"none\");\n          if (strLayoutType == \"8\" || strLayoutType == \"9\") {\n            this.$nextTick(() => {\n              $('.liveplay_butt').css('background-size', '280px 35px');\n            })\n          } else {\n            this.$nextTick(() => {\n              $('.liveplay_butt').css('background-size', '380px 35px');\n            })\n          }\n        }\n      }\n    }\n  },\n  methods: {\n    // 展开或收缩liveplay上面的button按钮\n    open_liveplay_butt () {\n      if ($(\"#\" + this.rtcid).attr(\"class\") == \"iconfont icon-bofang open_button rotate\") {\n        $(\"#\" + this.rtcid).siblings('.open_liveplay_butt').css(\"display\", \"block\");\n        $(\"#\" + this.rtcid).removeClass('rotate');\n        $(\"#\" + this.rtcid).parent().parent('.liveplay_butt').css('background-size', '420px 35px');\n      } else {\n        $(\"#\" + this.rtcid).siblings('.open_liveplay_butt').css(\"display\", \"none\");\n        $(\"#\" + this.rtcid).addClass('rotate');\n        $(\"#\" + this.rtcid).parent().parent('.liveplay_butt').css('background-size', '380px 35px');\n      }\n    },\n    //音频\n    Audiosetup () {\n      var $container = $(\"#\" + this.h5id);\n      var $controlsin = $container.children(\".Audio_slider\");\n      if (this.audioshow == false) {\n        $controlsin.css(\"display\", \"block\");\n        this.audioshow = true;\n      } else {\n        $controlsin.css(\"display\", \"none\");\n        this.audioshow = false;\n      }\n    },\n    Audiochange () {\n      //要打开音频设置\n      console.log(\"要打开音频设置\", this.Audioslider)\n      document.getElementById(this.h5videoid).volume = this.Audioslider\n    },\n    //码率\n    Information () {\n      console.log('124')\n      var $container = $(\"#\" + this.h5id);\n      var $controlsin = $container.children(\".information\");\n      var cors = this.cols * this.rows;\n      console.log(this.tokenshou)\n      if (cors > 9 || this.tokenshou == undefined) {\n        return false\n      }\n      if (this.informationshow == false) {\n        console.log('12455', cors)\n        $controlsin.css(\"display\", \"block\");\n        this.informationshow = true;\n      } else {\n        $controlsin.css(\"display\", \"none\");\n        this.informationshow = false;\n        clearInterval(this.timerRunInfo);\n        return false\n      }\n      this.Informationdate()\n      this.timerRunInfo = setInterval(() => {\n        this.Informationdate()\n      }, 8000)\n\n    },\n    Informationdate () {\n      var root = this.$store.state.IPPORT;\n      //url\n      var url = root + \"/api/v1/GetVidStreamStatus?token=\" + this.tokenshou + \"&stream=\" + this.streamprofileInformation + \"&session=\" + this.$store.state.token;\n      //重组\n      this.$http.get(url).then(result => {\n        if (result.status == 200) {\n          console.log(result)\n          var item = result.data\n          var informationAudio = [{\n            name: this.$t(\"message.live.Codec\"),\n            data: item.strAudioType\n          }, {\n            name: this.$t(\"message.live.SampleRate\"),\n            data: item.nAudioSampleRate\n          }, {\n            name: this.$t(\"message.live.SampleBit\"),\n            data: item.nAudioSampleBit\n          }, {\n            name: this.$t(\"message.live.Channels\"),\n            data: item.nAudioChannels\n          }, {\n            name: this.$t(\"message.live.Bitrate\"),\n            data: (item.nAudioBitrate / 1024).toFixed(1) + 'kpbs'\n          }]\n          if (this.height) {\n            var informationVideo = [\n              {\n                name: this.$t(\"message.live.Codec\"),\n                data: item.strVideoType,\n              },\n              {\n                name: this.$t(\"message.live.Width\"),\n                data: this.width,\n              },\n              {\n                name: this.$t(\"message.live.Height\"),\n                data: this.height,\n              },\n              {\n                name: this.$t(\"message.live.FPS\"),\n                data: item.nVideoFPS,\n              },\n              {\n                name: this.$t(\"message.live.Bitrate\"),\n                data: (item.nVideoBitrate / 1024).toFixed(1) + \"kpbs\",\n              },\n            ];\n          } else {\n            var informationVideo = [{\n              name: this.$t(\"message.live.Codec\"),\n              data: item.strVideoType\n            }, {\n              name: this.$t(\"message.live.Width\"),\n              data: item.nVideoWidth\n            }, {\n              name: this.$t(\"message.live.Height\"),\n              data: item.nVideoHeight\n            }, {\n              name: this.$t(\"message.live.FPS\"),\n              data: item.nVideoFPS\n            }, {\n              name: this.$t(\"message.live.Bitrate\"),\n              data: (item.nVideoBitrate / 1024).toFixed(1) + 'kpbs'\n            }]\n          }\n          this.informationAudio = informationAudio\n          this.informationVideo = informationVideo\n        }\n      })\n    },\n    //码流按钮\n    Bitstream (event) {\n      console.log(event, this.$t(\"message.live.substream\"))\n      // return false\n      if (event === this.$t(\"message.live.substream\")) {\n        var streamprofile = 'sub'\n        var token = this.inputtoken\n        var label = this.inputlabel\n        var arr = label.substring(0, this.inputlabel.lastIndexOf(\"-\"))\n        var name = arr + \"-\" + this.$t(\"message.live.substream\")\n        this.PlayVideo(token, streamprofile, label, name)\n        this.valuebutton = this.$t(\"message.live.mainstream\")\n        this.picturequality = ''\n      } else if (event === this.$t(\"message.live.mainstream\")) {\n        var streamprofile = 'main'\n        var token = this.inputtoken\n        var arr = this.inputlabel.substring(0, this.inputlabel.lastIndexOf(\"-\"))\n        var name = arr + \"-\" + this.$t(\"message.live.mainstream\")\n        this.PlayVideo(token, streamprofile, label, name);\n        this.valuebutton = this.$t(\"message.live.substream\")\n        this.picturequality = ''\n      }\n    },\n    // 转码\n    Gettranscod () {\n      var url = this.$store.state.IPPORT + \"/api/v1/GetTransProfile?session=\" + this.$store.state.token;\n      this.$http.get(url).then(result => {\n        //   return false;\n        if (result.status == 200) {\n          this.qualitylist = result.data.profile\n          //   var itme=result.data.profile;\n          //   for(var i=0;i<itme.length;i++){\n          //       var qualitydata={\n          //           strName:itme[i].strName,\n          //           strToken:itme[i].strToken,\n          //           nCodec:itme[i].nCodec,\n          //           nEngine:itme[i].nEngine,\n          //           nBitrate:itme[i].nBitrate,\n          //           nFPSType:itme[i].nFPSType,\n          //           nFPS :itme[i].nFPS,\n          //           nScaleType:itme[i].nScaleType,\n          //           nWidth:itme[i].nWidth,\n          //           nHeight:itme[i].nHeight,\n          //       };\n          //       this.qualityform.push(qualitydata);\n          //   }\n\n        }\n      }).catch()\n    },\n    // 画质\n    handleCommand (command) {\n      this.height = command.nHeight\n      this.width = command.nWidth\n      this.videoname = ''\n      var arr = this.inputlabel.substring(0, this.inputlabel.lastIndexOf(\"-\"))\n      var name = arr + \"-\" + command.strName\n      var token = this.inputtoken\n      this.videoname = name\n      var streamprofile = command.strToken\n      this.PlayVideo(token, streamprofile, \"\", name)\n    },\n    //播放\n    PlayVideo (token, streamprofile, label, name) {\n\n\n      if (this.h5handler != undefined) {\n        this.h5handler.disconnect();\n        delete this.h5handler;\n        this.h5handler = undefined;\n      }\n      this.currtoken = token;\n\n      var videosize = document.querySelector('#' + this.h5id);\n      // return false;\n      this.inputtoken = token\n      this.inputlabel = name\n      this.streamprofile = streamprofile\n      // this.streamprofile=streamprofile\n      this.videoname = name;//视频名称\n\n      $(\"#\" + this.videonameid).addClass(\"videoname\");\n      $(\"#\" + this.inputid).addClass(\"streambutton\")\n      $(\"#\" + this.qualityid).addClass(\"quality\")\n      $(\"#\" + this.picturequalityid).removeClass(\"picturequality\")\n      //console.log(\"*********************\",label,token);\n      $(\"#\" + this.spanqualityid).removeClass(\"spanquality\")\n      $(\"#\" + this.inputid).removeClass(\"spanpicturequality\")\n      this.currtoken = token;\n      if (streamprofile === \"sub\") {\n        this.valuebutton = this.$t(\"message.live.mainstream\")\n      } else if (streamprofile === \"main\") {\n        this.valuebutton = this.$t(\"message.live.substream\")\n      } else {\n        this.valuebutton = this.$t(\"message.live.substream\")\n      }\n\n      let conf = {\n        videoid: this.h5videoid,\n        protocol: window.location.protocol, //http: or https:\n        host: this.$store.state.WSROOT, //localhost:8080\n        streamprofile: streamprofile, // {string} - stream profile, main/sub or other predefine transcoding profile\n        rootpath: '/', // '/'\n        token: token,\n        hlsver: 'v1', //v1 is for ts, v2 is for fmp4\n        rtcengine: localStorage.getItem('H5sRtcengine'),\n        session: this.$store.state.token, //session got from login\n        consolelog: 'true'\n      };\n      if (this.$store.state.liveviewrtc == 'RTC' || (H5siOS() === true)) {\n        console.log(this.$store.state.liveviewrtc)\n        this.h5handler = new H5sPlayerRTC(conf);\n        // $(\"#\"+this.rtcid).addClass(\"rtc_new\");\n      } else {\n        console.log(this.$store.state.liveviewrtc)\n        this.h5handler = new H5sPlayerWS(conf);\n        // $(\"#\"+this.rtcid).removeClass(\"rtc_new\");\n      }\n      this.h5handler.connect();\n      this.$store.state.layoutplay = {\n        token: null,\n        streamprofile: null,\n        name: null,\n        label: null,\n        vid: null,\n        viewparameter: null\n      }\n    },\n    //关闭\n    CloseVideo (viewparameter) {\n      // console.log(viewparameter)\n      this.$store.state.videoid = this.videoid + uuid();\n      // 关闭实时协议显示\n      if (this.$route.query.type) {\n        var strLayoutType = this.$route.query.type;\n        $('.liveplay_butt').children().children('.open_button').addClass('rotate');\n        $('.liveplay_butt').children().children('.open_liveplay_butt').css(\"display\", \"none\");\n        if (strLayoutType == \"8\" || strLayoutType == \"9\") {\n          this.$nextTick(() => {\n            $('.liveplay_butt').css('background-size', '280px 35px');\n          })\n        } else {\n          this.$nextTick(() => {\n            $('.liveplay_butt').css('background-size', '380px 35px');\n          })\n        }\n      }\n      if (viewparameter === 'close') {\n        for (var i = 0; i < this.$store.state.liveviewadd.length; i++) {\n          if (this.$store.state.liveviewadd[i].strToken == this.tokenshou) {\n            this.$store.state.liveviewadd.splice(i, 1)\n            console.log(this.$store.state.liveviewadd)\n          }\n        }\n      }\n      var $container = $(\"#\" + this.h5id);\n      //音频\n      var $controlsinAudio = $container.children(\".Audio_slider\");\n      $controlsinAudio.css(\"display\", \"none\");\n      this.audioshow = false;\n      //码流\n      var $controlsininformation = $container.children(\".information\");\n      $controlsininformation.css(\"display\", \"none\");\n      this.informationshow = false;\n      clearInterval(this.timerRunInfo);\n      //ptz\n      var $controlsptz = $container.find(\".liveplay_ptz\");\n      $controlsptz.css(\"display\", \"none\");\n      this.ptzshow = false;\n      this.Audioslider = 0;\n      if (document.getElementById(this.h5videoid)) {\n        document.getElementById(this.h5videoid).volume = this.Audioslider\n      }\n\n      //麦克风\n      if (this.Shoutwheatclass == \"icon-voicefill\") {\n        this.Shoutwheat();\n      }\n      //转码\n      this.videoname = \"\";\n      this.valuebutton = '';\n      var $ptzcontrols = $container.children(\".ptzcontrols\");\n\n      // var valueId=document.getElementById('inputid ')\n      // var divId=document.getElementById('divid')\n      // console.log(divId)\n      $ptzcontrols.css(\"display\", \"none\");\n      $(\"#\" + this.videonameid).removeClass(\"videoname\");\n      $(\"#\" + this.inputid).removeClass(\"streambutton\")\n      $(\"#\" + this.qualityid).removeClass(\"quality\")\n      // $(\"#\"+this.rtcid).removeClass(\"rtc_new\");\n      $(\"#\" + this.spanqualityid).addClass(\"spanquality\")\n      $(\"#\" + this.inputid).addClass(\"spanpicturequality\")\n      if (this.audioback != undefined) {\n        this.audioback.disconnect();\n        delete this.audioback;\n        this.audioback = undefined;\n      }\n      if (this.h5handler != undefined) {\n        this.h5handler.disconnect();\n        delete this.h5handler;\n        this.h5handler = undefined;\n        if (document.getElementById(this.h5videoid)) {\n          $(\"#\" + this.h5videoid).get(0).poster = '';\n          $(\"#\" + this.h5videoid).get(0).load();\n        }\n      }\n\n    },\n    //预置位跳转\n    preset_Jump (token) {\n      //url\n      var url = this.$store.state.IPPORT + \"/api/v1/Ptz?token=\" + this.tokenshou + \"&action=preset&preset=\" + token + \"&speed=\" + this.Preset_value + \"&session=\" + this.$store.state.token;\n      console.log(url)\n      //重组\n      this.$http.get(url).then(result => {\n        if (result.status == 200) {\n          console.log(\"跳转\");\n        }\n      })\n\n\n    },\n    //预置位设置\n    preset_set (token, event) {\n      var input_val = event.currentTarget.previousElementSibling.previousElementSibling.value;\n      //url\n      var url = this.$store.state.IPPORT + \"/api/v1/SetPreset?token=\" + this.tokenshou + \"&presetname=\" + input_val + \"&presettoken=\" + token + \"&session=\" + this.$store.state.token;\n      console.log(url)\n      //重组\n      this.$http.get(url).then(result => {\n        if (result.status == 200) {\n          console.log(result);\n        }\n      })\n      console.log(\"设置\");\n    },\n    // 二维码\n    qrcode () {\n      console.log(this.currtoken)\n      if (this.currtoken == undefined) {\n        return false;\n      } else {\n        var android = window.location.protocol + '//' + window.location.host + '/single.html?token=' + this.currtoken + \"&h5splayer=ws\";\n        var ios = window.location.protocol + '//' + window.location.host + '/single.html?token=' + this.currtoken + \"&h5splayer=rtc\";\n      }\n      this.$refs.qrcodead.innerHTML = \"\";\n      this.$refs.qrcodeios.innerHTML = \"\";\n      console.log(android, ios)\n      var qrcode = new QRCode(this.$refs.qrcodead, {\n        width: 100,\n        height: 100// 高度\n      })\n      var qrcode1 = new QRCode(this.$refs.qrcodeios, {\n        width: 100,\n        height: 100// 高度\n      })\n      qrcode.clear();\n      qrcode1.clear();\n      qrcode.makeCode(android);\n      qrcode1.makeCode(ios);\n    },\n    //麦克风\n    Shoutwheat () {\n      if (this.h5handler == undefined) {\n        return;\n      }\n      var tokenshou = this.currtoken\n      var conf2 = {\n        protocol: window.location.protocol, //http: or https:\n        host: window.location.host, //localhost:8080\n        rootpath: '/', // '/' or window.location.pathname\n        token: tokenshou,\n        session: this.$store.state.token //session got from login\n      };\n\n\n      var Shoutwheat = this.Shoutwheatclass;\n      if (Shoutwheat == \"icon-voicefill1\") {\n        console.log(\"大开\");\n        this.audioback = new H5sPlayerAudBack(conf2);\n        this.audioback.connect();\n        this.Shoutwheatclass = \"icon-voicefill\";\n      } else {\n        console.log(\"关闭2\");\n        this.audioback.disconnect();\n        delete this.audioback;\n        this.audioback = undefined;\n        this.Shoutwheatclass = \"icon-voicefill1\";\n      }\n    },\n    //本地截图\n    DoSnapshotWeb () {\n      if (this.h5handler == undefined) {\n        return;\n      }\n      var fileName = '1';\n      const date = new Date();\n      fileName = this.currtoken + '_' + date.getFullYear() + '-' + (date.getMonth() + 1)\n        + '-' + date.getDate() + '-' + date.getHours() + '-' + date.getMinutes() + '-' + date.getSeconds();\n      console.log(fileName);\n      var video = $(\"#\" + this.h5videoid).get(0);\n      var w = video.videoWidth;//video.videoWidth * scaleFactor;\n      var h = video.videoHeight;//video.videoHeight * scaleFactor;\n      var canvas = document.createElement('canvas');\n      canvas.width = w;\n      canvas.height = h;\n      var ctx = canvas.getContext('2d');\n      ctx.drawImage(video, 0, 0, w, h);\n      var MIME_TYPE = \"image/png\";\n      var imgURL = canvas.toDataURL(MIME_TYPE, 1.0);\n      // console.log(imgURL);\n\n      var dlLink = document.createElement('a');\n      dlLink.download = fileName;\n      dlLink.href = imgURL;\n      dlLink.dataset.downloadurl = [MIME_TYPE, dlLink.download, dlLink.href].join(':');\n\n      document.body.appendChild(dlLink);\n      dlLink.click();\n      document.body.removeChild(dlLink);\n    },\n    //截图服务端\n    DoSnapshot () {\n      if (this.h5handler == undefined) {\n        return;\n      }\n      let _this = this;\n      var snapshot = \"token=\" + this.currtoken;\n      console.log(\"snapshot cmd\", snapshot);\n\n      var url = this.$store.state.IPPORT + \"/api/v1/Snapshot?\" + snapshot + \"&session=\" + this.$store.state.token;\n\n      this.$http.get(url).then(result => {\n        console.log(result);\n        if (result.status == 200) {\n          this.$message({\n            message: 'Snapshot successfully',\n            type: 'success'\n          });\n        }\n      }).catch(error => {\n        console.log('Snapshot failed!', error);\n        this.$Notice.info({\n          title: \"Snapshot failed !\"\n        })\n        this.$message({\n          message: 'Snapshot failed !',\n          type: 'warning'\n        });\n      });\n    },\n    //开始录像\n    DoManualRecordStart () {\n      if (this.h5handler == undefined) {\n        return;\n      }\n      let _this = this;\n\n      var record = \"token=\" + this.currtoken + \"&duration=300\";\n      console.log(\"record cmd\", record);\n\n      var url = this.$store.state.IPPORT + \"/api/v1/ManualRecordStart?\" + record + \"&session=\" + this.$store.state.token;\n\n      this.$http.get(url).then(result => {\n        console.log(result);\n        if (result.status == 200) {\n          this.$message({\n            message: 'Manual Start Record successfully',\n            type: 'success'\n          });\n        }\n      }).catch(error => {\n        console.log('Record failed!', error);\n        this.$message({\n          message: 'Record failed !',\n          type: 'warning'\n        });\n      });\n    },\n    //关闭录像\n    DoManualRecordStop (event) {\n      if (this.h5handler == undefined) {\n        return;\n      }\n      let _this = this;\n      var record = \"token=\" + this.currtoken + \"&duration=300\";\n      console.log(\"record cmd\", record);\n\n      var url = this.$store.state.IPPORT + \"/api/v1/ManualRecordStop?\" + record + \"&session=\" + this.$store.state.token;\n\n      this.$http.get(url).then(result => {\n        console.log(result);\n        if (result.status == 200) {\n          this.$message({\n            message: 'Manual Stop Record successfully',\n            type: 'success'\n          });\n        }\n      }).catch(error => {\n\n        this.$message({\n          message: 'Record failed !',\n          type: 'warning'\n        });\n      });\n    },\n    //全屏\n    FullScreen () {\n      var elem = $(\"#\" + this.h5id).get(0);\n      //var elem = $(\"#videoPanel\");\n      if (\n        document.fullscreenEnabled ||\n        document.webkitFullscreenEnabled ||\n        document.mozFullScreenEnabled ||\n        document.msFullscreenEnabled\n      ) {\n        if (\n          document.fullscreenElement ||\n          document.webkitFullscreenElement ||\n          document.mozFullScreenElement ||\n          document.msFullscreenElement\n        ) {\n          if (document.exitFullscreen) {\n            document.exitFullscreen();\n          } else if (document.webkitExitFullscreen) {\n            document.webkitExitFullscreen();\n          } else if (document.mozCancelFullScreen) {\n            document.mozCancelFullScreen();\n          } else if (document.msExitFullscreen) {\n            document.msExitFullscreen();\n\n          }\n          // this.Electronicoff();\n          // this.Electronicopen();\n          console.log(\"========  updateUIExitFullScreen\");\n          this.updateUIExitFullScreen();\n        } else {\n          console.log('panelFullScreen3');\n          // this.Electronicoff();\n          // this.Electronicopen();\n          if (elem.requestFullscreen) {\n            elem.requestFullscreen();\n          } else if (elem.webkitRequestFullscreen) {\n            elem.webkitRequestFullscreen();\n          } else if (elem.mozRequestFullScreen) {\n            elem.mozRequestFullScreen();\n          } else if (elem.msRequestFullscreen) {\n            elem.msRequestFullscreen();\n          }\n        }\n      } else {\n        console.log('Fullscreen is not supported on your browser.');\n      }\n    },\n    updateUIExitFullScreen () {\n      if (!document.fullscreenElement && !document.webkitIsFullScreen && !document.mozFullScreen && !document.msFullscreenElement) {\n        $('div[name=\"flex\"]').height(this.contentHeight / this.rows);\n      }\n    },\n    PtzControlShow (event) {\n      this.Presetdata = [];\n      var cors = this.cols * this.rows;\n      if (cors > 9) {\n        return false\n      }\n      //url\n      var url = this.$store.state.IPPORT + \"/api/v1/GetPresets?token=\" + this.tokenshou + \"&session=\" + this.$store.state.token;\n      //重组\n      this.$http.get(url).then(result => {\n        if (result.status == 200) {\n          if (result.bStatus == false) {\n            return false;\n          } else {\n            var data = result.data;\n\n            console.log(data)\n            for (var i = 0; i < data.preset.length; i++) {\n              var newItem = {\n                strName: data.preset[i].strName,\n                strToken: data.preset[i].strToken,\n              };\n              this.Presetdata.push(newItem);\n              if (i > 8) {\n                break;\n              }\n            }\n          }\n        }\n      })\n      var $container = $(\"#\" + this.h5id);\n      var $controls = $container.find(\".liveplay_ptz\");\n      if (this.ptzshow == false) {\n        $controls.css(\"display\", \"block\");\n        this.ptzshow = true;\n      } else {\n        $controls.css(\"display\", \"none\");\n        this.ptzshow = false;\n      }\n    },\n\n    PtzActionwiperon (event) {\n      this.PtzAction('wiperon');\n    },\n    PtzActionwiperoff (event) {\n      this.PtzAction('wiperoff');\n    },\n    PtzActionlighton (event) {\n      this.PtzAction('lighton');\n    },\n    PtzActionlightoff (event) {\n      this.PtzAction('lightoff');\n    },\n    PtzActionfocusing (event) {\n      this.PtzAction('focusin');\n    },\n    PtzActionfocusings (event) {\n      this.PtzAction('focusout');\n    },\n    PtzActionaperture (event) {\n      this.PtzAction('irisin');\n    },\n    PtzActionaperturej (event) {\n      this.PtzAction('irisout');\n    },\n\n    PtzActionZoomIn (event) {\n      console.log(\"PtzActionZoomIn\");\n      this.PtzAction('zoomin');\n    },\n    PtzActionZoomOut (event) {\n      this.PtzAction('zoomout');\n    },\n    PtzActionUpleft (event) {\n      this.PtzAction('upleft');\n    },\n    PtzActionUpright (event) {\n      this.PtzAction('upright');\n    },\n    PtzActionDownleft (event) {\n      this.PtzAction('downleft');\n    },\n    PtzActionDownright (event) {\n      this.PtzAction('downright');\n    },\n    PtzActionLeft (event) {\n      this.PtzAction('left');\n    },\n    PtzActionRight (event) {\n      this.PtzAction('right');\n    },\n    PtzActionUp (event) {\n      this.PtzAction('up');\n    },\n    PtzActionDown (event) {\n      this.PtzAction('down');\n    },\n    PtzActionStop (event) {\n      console.log(\"PtzActionStop\");\n      this.PtzAction('stop');\n    },\n\n    PtzAction (action) {\n      if (this.h5handler == undefined) {\n        return;\n      }\n      let _this = this;\n      var ptzcmd = \"token=\" + this.currtoken + \"&action=\" + action + \"&speed=\" + this.Preset_value + \"\";\n      console.log(\"ptzcmd\", ptzcmd);\n\n      var url = this.$store.state.IPPORT + \"/api/v1/Ptz?\" + ptzcmd + \"&session=\" + this.$store.state.token;\n\n      this.$http.get(url).then(result => {\n        console.log(result);\n        if (result.status == 200) {\n\n        }\n      }).catch(error => {\n        console.log('ptz failed!', error);\n      });\n    },\n  }\n}\n</script>\n\n\n<style lang=\"scss\" scoped>\n.liveplay {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  .h5video {\n    object-fit: fill;\n    width: 100%;\n    height: 100%;\n  }\n  &:hover .liveplay_butt {\n    display: block;\n  }\n  // 音频\n  .Audio_slider {\n    display: none;\n    width: 100px;\n    position: absolute;\n    top: 40px;\n    left: 50px;\n    z-index: 1012;\n    .el-slider__runway {\n      height: 4px;\n    }\n  }\n  .liveplay_butt {\n    position: absolute;\n    display: none;\n    top: 0;\n    z-index: 1012;\n    width: 100%;\n    height: 40px;\n    line-height: 30px;\n    background: url(\"~@/views/liveview/imgs/liveview_buttback.png\") no-repeat;\n    background-size: 380px 35px;\n    background-position-x: right;\n    text-align: right;\n    padding: 0 15px;\n    /deep/.open_liveplay_butt {\n      display: none;\n    }\n    .rotate {\n      -webkit-transform: rotateY(180deg);\n      transform: rotateY(180deg);\n    }\n    .bottom_QR {\n      font-size: 16px;\n      font-weight: 600;\n\n      text-align: center;\n\n      .bottom_scan {\n        font-size: 16px;\n        font-weight: 600;\n        margin-bottom: 20px;\n        padding: 0 20px;\n      }\n      .bottom_QRcode {\n        display: flex;\n        div {\n          padding: 0 20px;\n        }\n      }\n    }\n    button {\n      background: none;\n      border: none;\n      padding: 0;\n      margin: 0;\n      color: #ffffff;\n      margin-left: 15px;\n    }\n    .fw_butt {\n      padding: 0;\n      display: inline;\n      border: none;\n      top: -2px;\n      right: -15px;\n      /deep/ .btn-link {\n        padding: 0px 12px 0px 0px !important;\n      }\n    }\n  }\n  .liveplay_ptz {\n    position: absolute;\n    bottom: 0;\n    background: rgba(255, 255, 255, 0);\n    padding: 0px;\n    box-sizing: content-box;\n    width: 100%;\n    height: 100%;\n    display: none;\n    .flex_content {\n      width: 100%;\n      height: 100%;\n      background: rgba(0, 0, 0, 0.3);\n      padding: 8% 0 8% 0;\n      position: relative;\n      /* margin-bottom: 6%; */\n      .content_zoom {\n        width: 50%;\n        height: 100%;\n        display: flex;\n        /* justify-content: space-between; */\n        align-items: flex-end;\n        .key_zoom {\n          width: 25%;\n          margin: 0 4% 0 8%;\n          /* position: absolute;\n                        bottom: 4%; */\n          .key_flex {\n            width: 100px;\n            height: 100px;\n            display: flex;\n            flex-wrap: wrap;\n            justify-content: space-between;\n            margin-left: 5%;\n            background: url(\"~@/views/liveview/imgs/liveview_ptzbutton.png\")\n              no-repeat center;\n            /* margin-bottom: 20px; */\n            .key_but {\n              width: 33.33%;\n              height: 33.33%;\n              text-align: center;\n              /* background-color: #FF0000; */\n            }\n          }\n        }\n        .zoom {\n          width: 20px;\n          height: 50px;\n          // background-color: rgba(0, 0, 0, 0.6);\n          display: flex;\n          flex-wrap: wrap;\n          justify-content: space-around;\n          align-content: space-around;\n          margin-left: 40px;\n          margin-bottom: 50px;\n          .zoom_add {\n            width: 20px;\n            height: 20px;\n            text-align: center;\n            background: none;\n            border: 0;\n            padding: 0;\n            color: #ffffff;\n          }\n        }\n      }\n      .zoom_g {\n        width: 20px;\n        height: 100%;\n        position: absolute;\n        left: 0;\n        bottom: 0;\n        background-color: rgba(0, 0, 0, 0.6);\n        display: flex;\n        flex-wrap: wrap;\n        justify-content: space-around;\n        align-content: space-around;\n        // margin-left: 40px\n        padding: 0 2px;\n        .zoom_add {\n          width: 20px;\n          height: 20px;\n          text-align: center;\n          background: none;\n          border: 0;\n          padding: 0;\n          color: #ffffff;\n          font-size: 14px;\n          &:nth-child(5) {\n            color: #3abbfe;\n            font-size: 18px;\n          }\n          &:nth-child(7) {\n            color: #3abbfe;\n            font-size: 18px;\n          }\n          &:nth-child(6) {\n            font-size: 18px;\n          }\n          &:nth-child(8) {\n            font-size: 18px;\n          }\n        }\n      }\n\n      /*  */\n      .Preset {\n        width: 30%;\n        position: absolute;\n        bottom: 10%;\n        right: 4%;\n        .block {\n          width: 100%;\n          height: 140px;\n          margin-right: 4%;\n          overflow: auto;\n          color: #ffffff;\n          &::-webkit-scrollbar {\n            display: none;\n          }\n          .preset_bgc {\n            width: 100%;\n            height: 24px;\n            background: rgba(255, 255, 255, 0.2);\n            .preset_input {\n              width: 52%;\n              background: none;\n              /* opacity:0.2; */\n              border-radius: 12px;\n              border: 0;\n              padding: 0 0 0 10px;\n              color: rgba(255, 255, 255, 1) !important;\n            }\n            button {\n              width: 15%;\n              background: none;\n              border: 0;\n              font-size: 15px;\n              color: #ffffff;\n              margin-left: 3px;\n            }\n          }\n        }\n      }\n    }\n  }\n  .information {\n    position: absolute;\n    bottom: 40px;\n    left: 10px;\n    background: rgba(0, 0, 0, 0.5);\n    box-sizing: content-box;\n    /* z-index:1100; */\n    width: 330px;\n    height: 150px;\n    display: none;\n    color: #ffffff;\n    .information_con {\n      width: 100%;\n      height: 90%;\n      display: flex;\n      justify-content: space-between;\n      flex-wrap: wrap;\n      align-content: space-between;\n      .information1 {\n        width: 50%;\n        .information_title {\n          width: 100%;\n          height: 30px;\n          line-height: 30px;\n          background-color: rgba(0, 0, 0, 0.7);\n          padding: 0 10px;\n        }\n        .information_content {\n          width: 100%;\n          display: flex;\n          justify-content: space-between;\n          padding: 0 2px;\n          .information_content_left {\n            width: 50%;\n            color: #3abbfe;\n            text-align: left;\n          }\n          .information_content_right {\n            width: 50%;\n            color: #3abbfe;\n            text-align: left;\n          }\n        }\n      }\n    }\n  }\n\n  //主副码流\n  .videoname {\n    position: absolute;\n    bottom: 0px;\n    font-size: 14px;\n    background-color: rgba(0, 0, 0, 0.3);\n    color: #ffffff;\n    padding: 8px 24px;\n    text-align: center;\n    .streambutton {\n      position: absolute;\n      bottom: 5px;\n      right: -73px;\n      border-radius: 10px;\n      background-color: #67cfb5;\n      border: none;\n      width: 68px;\n      font-size: 10px;\n      height: 25px;\n      padding: 0 2px;\n    }\n  }\n  .quality {\n    position: absolute;\n    bottom: 5px;\n    right: 10px;\n    padding: 0 10px;\n    /* display:none; */\n  }\n  .spanquality {\n    display: none;\n  }\n  .spanpicturequality {\n    display: none !important;\n  }\n  .el-dropdown {\n    .el-dropdown-link {\n      color: white;\n      .el-dropdown-menu :hover li {\n        background-color: rgb(248, 28, 28) !important;\n      }\n    }\n  }\n  //rtc\n  .rtc_new {\n    width: 25px;\n    height: 25px;\n    margin: 10px;\n    background: url(\"~@/views/liveview/imgs/liveview_rtc.svg\") no-repeat center;\n    background-size: contain;\n    background-position: center center;\n    position: absolute;\n    top: 0px;\n  }\n}\n</style>","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"liveview\"},[_c('div',{attrs:{\"id\":\"watermarktoggle\"}}),_c('div',{staticClass:\"liveview_right\",attrs:{\"id\":\"videoPanel\"}},[_c('div',{attrs:{\"id\":\"video_hed\"}},_vm._l((_vm.rows),function(r){return _c('div',{key:r,staticClass:\"videoColor videoHeader\",staticStyle:{\"position\":\"relative\"},attrs:{\"name\":\"flex\"}},_vm._l((_vm.cols),function(c){return _c('div',{key:c,staticClass:\"palace\",attrs:{\"name\":\"flex\"},on:{\"contextmenu\":function($event){$event.preventDefault();return _vm.stopVideo($event)},\"click\":function($event){return _vm.videoClick(r,c,$event)}}},[_c('v-liveplay',{attrs:{\"id\":'h'+r+c,\"h5id\":'h'+r+c,\"rows\":_vm.rows,\"cols\":_vm.cols,\"h5videoid\":'hvideo'+r+c,\"canvasid\":'canvas'+r+c}})],1)}),0)}),0)])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./layout.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./layout.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./layout.vue?vue&type=template&id=73cebdd7&scoped=true&\"\nimport script from \"./layout.vue?vue&type=script&lang=js&\"\nexport * from \"./layout.vue?vue&type=script&lang=js&\"\nimport style0 from \"./layout.vue?vue&type=style&index=0&id=73cebdd7&prod&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"73cebdd7\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}