| | |
| | | 'l-t-s-yuan': true, |
| | | }" |
| | | ></span> |
| | | |
| | | <span>{{' ' + state }}</span> |
| | | |
| | | <span>{{ " " + state }}</span> |
| | | </div> |
| | | <div class="t-t-time"> |
| | | <p>{{ ReportTime }}</p> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column label="跳转实时" prop=""> |
| | | |
| | | |
| | | </el-table-column> --> |
| | | </el-table> |
| | | </div> |
| | |
| | | prop="open"> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-form> |
| | | </el-form> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | |
| | | </el-row> |
| | | <el-row> |
| | | <el-col span="12"> |
| | | <el-form-item label="负责人"> |
| | | <el-form-item label="主要负责人"> |
| | | <el-input |
| | | disabled="true" |
| | | v-model="detailsData.person" |
| | |
| | | v-model="detailsData.user" |
| | | autocomplete="off" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-form-item> |
| | | </el-col> --> |
| | | <el-col span="12"> |
| | | <el-form-item label="序列号"> |
| | |
| | | <!-- <div class="r-b-t-main"> |
| | | <span class="r-b-t-left">设备标签</span> |
| | | <span class="r-b-t-right"> |
| | | <div |
| | | class="r-b-t-r-label" |
| | | v-for="(value,index) in labels" |
| | | <div |
| | | class="r-b-t-r-label" |
| | | v-for="(value,index) in labels" |
| | | :key="index" |
| | | > |
| | | {{value}} |
| | | {{value}} |
| | | </div> |
| | | </span> |
| | | </div> --> |
| | |
| | | myChart: "", |
| | | numdatalist: [120, 132, 101, 134, 90, 230, 210, 120, 132, 0, 134, 0], |
| | | |
| | | jingqingPdianji: null, |
| | | |
| | | name: "", |
| | | state: "", |
| | | evaluate: "", |
| | |
| | | isRecord: true, |
| | | screens: false, |
| | | //复选框 |
| | | dataState: ["掉线", "在线", "故障", "预警"], |
| | | dataState: ["掉线", "正常", "故障", "预警"], |
| | | // [grey,green,red][ |
| | | // onlineStatus = 0, |
| | | // onlineStatus = 1, |
| | |
| | | }); |
| | | }); |
| | | }, |
| | | stetDetails(d, imgdata) { |
| | | stetDetails(c, imgdata) { |
| | | this.name = "无数据" && this.a.deviceName; |
| | | //设备状态 |
| | | // [grey,green,red][ |
| | | // onlineStatus = 0, |
| | | // onlineStatus = 1, |
| | | // state!= "", |
| | | // jtype != 2 |
| | | // ] |
| | | var states, |
| | | o = this.a.onlineStatus, |
| | | s = this.a.state, |
| | | j = this.a.jtype; |
| | | // if (o == 0) { |
| | | // states = "掉线"; |
| | | // } else if (o == 1) { |
| | | // states = "在线"; |
| | | // } else if (s != "") { |
| | | // states = "故障"; |
| | | // } else if (j != 2) { |
| | | // states = "预警"; |
| | | // } |
| | | if (s != "") { |
| | | d = this.a.dtype; |
| | | if (d == 0) { |
| | | states = "掉线"; |
| | | } else if (d == 1) { |
| | | states = "正常"; |
| | | } else if (d == 3) { |
| | | states = "故障"; |
| | | } else { |
| | | if (j != 1) { |
| | | if (o == 1) { |
| | | states = "在线"; |
| | | } else { |
| | | states = "掉线"; |
| | | } |
| | | } else { |
| | | states = "预警"; |
| | | } |
| | | } else if (d == 2) { |
| | | states = "预警"; |
| | | } |
| | | // console.log(o, 1000); |
| | | // console.log(s, 1000); |
| | | // console.log(j, 1000); |
| | | |
| | | // console.log(states, 1000); |
| | | this.state = states; |
| | | |
| | | this.evaluate = "空气质量"; |
| | |
| | | installation: this.a.stime, // 安装时间 |
| | | heartbeat: this.a.heartbeat, // 心跳时间 |
| | | }; |
| | | this.form = d; |
| | | this.form = c; |
| | | }, |
| | | getdataG() { |
| | | var dataG = { |
| | |
| | | var ds = res.data.data.records; |
| | | // console.log(ds) |
| | | this.setdataG(ds); |
| | | this.jingqingPdianji = ds; |
| | | }); |
| | | }, |
| | | setdataG(d) { |
| | |
| | | oneContacts: d[key].oneContacts, |
| | | alarmPeople: d[key].alarmPeople, |
| | | onePhone: d[key].onePhone, |
| | | jjTime: d[key].jjTime, |
| | | childs: [], |
| | | }); |
| | | } |
| | |
| | | this.startEcharts01(); |
| | | }, |
| | | getMap() { |
| | | window.frames[0].init("DetailMap", { |
| | | window.frames[1].init("DetailMap", { |
| | | x: this.a.jd, |
| | | y: this.a.wd, |
| | | }); |
| | |
| | | }, |
| | | handleCurrentChange(val) { |
| | | //行点击事件 |
| | | // console.log(val.i); |
| | | var b = this.jingqingPdianji; |
| | | for (var key in b) { |
| | | if (b[key].jjTime == val.jjTime) { |
| | | // console.log(b[key]); |
| | | // this.$store.commit("SET_DATAL", this.a); |
| | | this.$router.push({ path: "/policeTracking/track", query: b[key] }); |
| | | } |
| | | } |
| | | // console.log(this.$store.state) |
| | | }, |
| | | //获取视频 |
| | | openRealVideoBox(serialNumber, channelNumber) { |
| | | openRealVideoBox(serialNumber, channelNumber,deviceNumber,manufacturer) { |
| | | var that = this; |
| | | var newAxios = axios.create({ |
| | | baseURL: "https://web.byisf.com:18000", |
| | | withCredentials: false, |
| | | headers: { |
| | | "Content-type": "application/x-www-form-urlencoded", |
| | | }, |
| | | }); |
| | | newAxios |
| | | .post( |
| | | "/api_control", |
| | | {}, |
| | | { |
| | | params: { |
| | | param: JSON.stringify({ PktType: "GetAccessToken" }), |
| | | }, |
| | | } |
| | | ) |
| | | .then((res) => { |
| | | newAxios |
| | | .get( |
| | | `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${serialNumber}&chl=${channelNumber}` |
| | | ) |
| | | .then((result) => { |
| | | that.videoSource = result.data.data.m3u8; |
| | | if (Hls.isSupported()) { |
| | | var dom = document.getElementById( |
| | | "real_video_conversationDataL" |
| | | ); |
| | | that.hls = new Hls(); |
| | | var m3u8Url = decodeURIComponent(that.videoSource); |
| | | that.hls.loadSource(m3u8Url); |
| | | that.hls.attachMedia(dom); |
| | | that.hls.on(Hls.Events.MANIFEST_PARSED, function () { |
| | | dom.play(); |
| | | }); |
| | | that.hls.on(Hls.Events.ERROR, function (event, data) { |
| | | console.log(data, 4566824159, "视频播放有问题!!!"); |
| | | if (data.fatal) { |
| | | switch (data.type) { |
| | | case Hls.ErrorTypes.NETWORK_ERROR: |
| | | console.log( |
| | | "fatal network error encountered, try to recover" |
| | | ); |
| | | that.hls.startLoad(); |
| | | break; |
| | | case Hls.ErrorTypes.MEDIA_ERROR: |
| | | console.log( |
| | | "fatal media error encountered, try to recover" |
| | | ); |
| | | that.hls.recoverMediaError(); |
| | | break; |
| | | } |
| | | |
| | | if (manufacturer == "HK"){ |
| | | axios |
| | | .get( |
| | | `/api/blade-jfpts/equipment/equipment/selectEquimentPlayInfo?number=${deviceNumber}&bmp=m3u8&manufacturer=${manufacturer}` |
| | | ) |
| | | .then((result) => { |
| | | that.videoSource = result.data.data.data.url; |
| | | if (Hls.isSupported()) { |
| | | var dom = document.getElementById( |
| | | "real_video_conversationDataL" |
| | | ); |
| | | that.hls = new Hls(); |
| | | var m3u8Url = decodeURIComponent(that.videoSource); |
| | | that.hls.loadSource(m3u8Url); |
| | | that.hls.attachMedia(dom); |
| | | that.hls.on(Hls.Events.MANIFEST_PARSED, function () { |
| | | dom.play(); |
| | | }); |
| | | that.hls.on(Hls.Events.ERROR, function (event, data) { |
| | | // console.log(data, 4566824159, "视频播放有问题!!!"); |
| | | if (data.fatal) { |
| | | switch (data.type) { |
| | | case Hls.ErrorTypes.NETWORK_ERROR: |
| | | console.log( |
| | | "fatal network error encountered, try to recover" |
| | | ); |
| | | that.hls.startLoad(); |
| | | break; |
| | | case Hls.ErrorTypes.MEDIA_ERROR: |
| | | console.log( |
| | | "fatal media error encountered, try to recover" |
| | | ); |
| | | that.hls.recoverMediaError(); |
| | | break; |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }else{ |
| | | var res = that.a; |
| | | if (res.deviceName.indexOf("(象湖院区)") != -1 || res.deviceName.indexOf("(东湖院区)") != -1){ |
| | | debugger |
| | | var dom = document.getElementById( |
| | | "real_video_conversationDataL" |
| | | ); |
| | | dom.src = res.netType; |
| | | dom.play(); |
| | | return; |
| | | } |
| | | |
| | | var newAxios = axios.create({ |
| | | baseURL: "https://web.byisf.com:18000", |
| | | withCredentials: false, |
| | | headers: { |
| | | "Content-type": "application/x-www-form-urlencoded", |
| | | }, |
| | | }); |
| | | newAxios |
| | | .post( |
| | | "/api_control", |
| | | {}, |
| | | { |
| | | params: { |
| | | param: JSON.stringify({ PktType: "GetAccessToken" }), |
| | | }, |
| | | } |
| | | ) |
| | | .then((res) => { |
| | | newAxios |
| | | .get( |
| | | `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${serialNumber}&chl=${channelNumber}` |
| | | ) |
| | | .then((result) => { |
| | | that.videoSource = result.data.data.m3u8; |
| | | if (Hls.isSupported()) { |
| | | var dom = document.getElementById( |
| | | "real_video_conversationDataL" |
| | | ); |
| | | that.hls = new Hls(); |
| | | var m3u8Url = decodeURIComponent(that.videoSource); |
| | | that.hls.loadSource(m3u8Url); |
| | | that.hls.attachMedia(dom); |
| | | that.hls.on(Hls.Events.MANIFEST_PARSED, function () { |
| | | dom.play(); |
| | | }); |
| | | that.hls.on(Hls.Events.ERROR, function (event, data) { |
| | | // console.log(data, 4566824159, "视频播放有问题!!!"); |
| | | if (data.fatal) { |
| | | switch (data.type) { |
| | | case Hls.ErrorTypes.NETWORK_ERROR: |
| | | console.log( |
| | | "fatal network error encountered, try to recover" |
| | | ); |
| | | that.hls.startLoad(); |
| | | break; |
| | | case Hls.ErrorTypes.MEDIA_ERROR: |
| | | console.log( |
| | | "fatal media error encountered, try to recover" |
| | | ); |
| | | that.hls.recoverMediaError(); |
| | | break; |
| | | } |
| | | } |
| | | }); |
| | | } |
| | | }); |
| | | }); |
| | | } |
| | | }, |
| | | }, |
| | | created() { |
| | | // let loadingInstance1 = Loading.service({ fullscreen: true }); |
| | | // this.baseUrl = `/map/index.html?openid=SupervisoryMap`; |
| | | this.a = this.$route.query; |
| | | // this.a = this.$route.query.deviceNumber == undefined? this.$store.state.dataL.dataLa : this.$route.query; |
| | | if(this.$route.query.deviceNumber == undefined){ |
| | | this.a = this.$store.state.dataL.dataLa; |
| | | }else{ |
| | | this.a = this.$route.query; |
| | | this.$store.commit("SET_DATAL", this.a);//每次都缓存在vuex中,如果没有从正确路径进来,则使用缓存 |
| | | } |
| | | // console.log(this.a); |
| | | this.baseUrl = `/map/index.html?ISinit=1&openid=DetailMap&jd=${this.a.jd}&wd=${this.a.wd}`; |
| | | this.myDeviceNumber = this.$route.query.deviceNumber; |
| | | this.myDeviceNumber = this.a.deviceNumber; |
| | | // console.log(this.a); |
| | | // console.log(this.myDeviceNumber); |
| | | this.getdata(); |
| | |
| | | // this.doEvents(); |
| | | // var timel = setTimeout(() => { |
| | | this.$refs.detailMap.onload = () => { |
| | | // window.frames[0].init("DetailMap", { |
| | | // window.frames[1].init("DetailMap", { |
| | | // x: this.a.jd, |
| | | // y: this.a.wd, |
| | | // }); |
| | | if (window.frames[0].init) { |
| | | if (window.frames[1].init) { |
| | | this.getMap(); |
| | | } else { |
| | | // this.re(); |
| | | console.log(`没有找到到window.frames[0].init`); |
| | | console.log(`没有找到到window.frames[1].init`); |
| | | } |
| | | }; |
| | | }, |
| | |
| | | activeName() { |
| | | if (this.activeName == "third") { |
| | | this.i++; |
| | | this.openRealVideoBox(this.a.serialNumber, this.a.channelNumber); |
| | | }else{ |
| | | this.openRealVideoBox(this.a.serialNumber, this.a.channelNumber,this.a.deviceNumber,this.a.manufacturers); |
| | | } else { |
| | | var dom = document.getElementById("real_video_conversationDataL"); |
| | | if (dom.getAttribute("src") != "") { |
| | | dom.pause(); |
| | | dom.setAttribute("src", ""); |
| | | this.hls.destroy(); |
| | | } |
| | | dom.pause(); |
| | | dom.setAttribute("src", ""); |
| | | this.hls.destroy(); |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | <style lang="scss" > |
| | | video::-webkit-media-controls-timeline { |
| | | display: none; |
| | | } |
| | | #Lour { |
| | | width: 100%; |
| | | font-size: 14px; |
| | |
| | | width: 50%; |
| | | } |
| | | video::-webkit-media-controls-timeline { |
| | | display: none; |
| | | } |
| | | </style> |
| | | display: none; |
| | | } |
| | | </style> |