|
|
@@ -1,28 +1,43 @@
|
|
|
<template>
|
|
|
|
|
|
- <view class="">
|
|
|
+ <view class="">
|
|
|
+ <view v-if="loadingStatus" class="loadingMask" >Loading...</view>
|
|
|
<view class="cu-list menu-avatar">
|
|
|
- <view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item,index) in deviceData"
|
|
|
- :key="index" :data-target="'move-box-' + index" @tap="goVideoDetail(item)">
|
|
|
- <view v-if="item.trueStatus==0" class="cu-avatar round lg" style="background-image:url(../../static/video-icon-on.png);opacity:.7" ></view>
|
|
|
- <view v-else class="cu-avatar round lg" style="background-image:url(../../static/video-icon-off.png);opacity:.7" ></view>
|
|
|
-
|
|
|
- <view class="content">
|
|
|
- <view class="">{{item.deviceName}}</view>
|
|
|
+ <view v-if="!this.openId&&!this.onLineVideoList.length" class="text-center margin-top-lg">加载中...</view>
|
|
|
+ <view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item,index) in matchedDeviceList"
|
|
|
+ :key="index" :data-target="'move-box-' + index">
|
|
|
+ <view v-if="item.ALIVEVALUE==3" class="cu-avatar round lg" style="background-image:url(../../static/video-icon-on.png);opacity:.7"></view>
|
|
|
+ <view v-else class="cu-avatar round lg" style="background-image:url(../../static/video-icon-off.png);opacity:.7"></view>
|
|
|
+ <view v-if="item.ALIVEVALUE==3" @tap="open_video(item)">
|
|
|
+ <view class="content">
|
|
|
+ <view class="">{{item.DEVICE}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="nav-right num">
|
|
|
+ <view class="online">
|
|
|
+ 在线
|
|
|
+ <text class="icon iconfont margin-right-xs margin-left-lg"></text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="nav-right num">
|
|
|
- <view v-if="item.trueStatus==1" class="offline" >
|
|
|
- 离线
|
|
|
- <text class="icon iconfont margin-right-xs margin-left-lg"></text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view v-else class="online">
|
|
|
- 在线
|
|
|
- <text class="icon iconfont margin-right-xs margin-left-lg"></text>
|
|
|
+
|
|
|
+ <view v-else>
|
|
|
+ <view class="content">
|
|
|
+ <view class="">{{item.DEVICE}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="nav-right num">
|
|
|
+
|
|
|
+ <view class="offline">
|
|
|
+ 离线
|
|
|
+ <text class="icon iconfont margin-right-xs margin-left-lg"></text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
</view>
|
|
|
+
|
|
|
+ <input type="hidden" v-model="openId" style="opacity:0">
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -30,65 +45,211 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- deviceData: [
|
|
|
- // {
|
|
|
- // status: '离线',
|
|
|
- // imgUrl: '../../static/video-icon-off.png',
|
|
|
- // title: 'C59360332',
|
|
|
- // num: 6
|
|
|
- // }, {
|
|
|
- // status: '在线',
|
|
|
- // imgUrl: '../../static/video-icon-on.png',
|
|
|
- // title: 'C59360332',
|
|
|
- // num: 11
|
|
|
- // },
|
|
|
- // {
|
|
|
- // status: '异常',
|
|
|
- // imgUrl: '../../static/video-icon-error.png',
|
|
|
- // title: 'C59360332',
|
|
|
- // num: 6
|
|
|
- // }
|
|
|
- ],
|
|
|
+
|
|
|
+ d: {
|
|
|
+ CMD: 1
|
|
|
+ },
|
|
|
+ deviceData: [],
|
|
|
+ onLineVideoList: [],
|
|
|
+ matchedDeviceList: [],
|
|
|
modalName: null,
|
|
|
|
|
|
+
|
|
|
+
|
|
|
+ openId: '',
|
|
|
+ reCount: 0,
|
|
|
+ count: 0,
|
|
|
+ loadingStatus:false
|
|
|
+
|
|
|
};
|
|
|
- },
|
|
|
- onLoad:function(option){
|
|
|
- console.log(111)
|
|
|
- console.log(option.companyCode)
|
|
|
- this.companyCode=option.companyCode
|
|
|
- this.deviceType=option.deviceType
|
|
|
- this.getDeviceManage({"companyCode":option.companyCode,"deviceType":option.deviceType})
|
|
|
},
|
|
|
- methods: {
|
|
|
-
|
|
|
- async getDeviceManage(ming={}) {
|
|
|
- const res= await this.$myRequest({
|
|
|
- url:'OperationMonitoring/getDeviceList',
|
|
|
- data:ming
|
|
|
- })
|
|
|
- console.log(res.data.data)
|
|
|
- this.deviceData=res.data.data
|
|
|
- // this.powerDeviceCount= res.data.data[0].powerDeviceCount
|
|
|
- // this.videoDeviceCount= res.data.data[0].videoDeviceCount
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- goVideoDetail(item) {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/videoDetail/videoDetail?deviceType=2&companyCode='+this.companyCode+'&deviceCode='+item.deviceCode+'',
|
|
|
- success: res => {},
|
|
|
- fail: () => {},
|
|
|
- complete: () => {}
|
|
|
+ onLoad: function(option) {
|
|
|
+
|
|
|
+ this.companyCode = option.companyCode
|
|
|
+ this.deviceType = option.deviceType
|
|
|
+ this.getDeviceManage({
|
|
|
+ "companyCode": option.companyCode,
|
|
|
+ "deviceType": option.deviceType
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+ this.chk_video()
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ chk_video() {
|
|
|
+ // if (!this.openId) {
|
|
|
+ // uni.showLoading({
|
|
|
+ // title: "加载中",
|
|
|
+ // mask: true,
|
|
|
+ // });
|
|
|
+ // //添加loading
|
|
|
+ // }
|
|
|
+ uni.request({
|
|
|
+ url: 'https://fire.usky.cn:8443/YtIoT/cgi-bin/demo2.cgi',
|
|
|
+ data: 'queryJson:' + JSON.stringify({
|
|
|
+ CMD: 1
|
|
|
+ }),
|
|
|
+ method: 'post',
|
|
|
+ header: {
|
|
|
+ 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
|
|
|
+ },
|
|
|
+ success: (res) => {
|
|
|
+
|
|
|
+ this.onLineVideoList = res.data.RESULT.LIST;
|
|
|
+
|
|
|
+ if (this.openId.length > 0) {
|
|
|
+ console.log('doododododododo')
|
|
|
+
|
|
|
+ for (var n = 0; n < this.onLineVideoList.length; n++) {
|
|
|
+ if (this.openId == this.onLineVideoList[n].DEVICE) {
|
|
|
+ this.reCount++;
|
|
|
+ if (this.onLineVideoList[n].ONAIR) {
|
|
|
+ if ((++this.count) > 2) {
|
|
|
+ // var mask = document.getElementById('videomask');
|
|
|
+ // if (mask != undefined) {
|
|
|
+ // removeDIV('videomask');
|
|
|
+ // }
|
|
|
+ this.loadingStatus=false;
|
|
|
+
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/videoDetail/videoDetail?deviceType=2&companyCode=' + this.companyCode + '&deviceCode=' +
|
|
|
+ this.onLineVideoList[n].DEVICE +
|
|
|
+ '',
|
|
|
+ // url:'https://qhome.usky.cn/video.html?device='+this.onLineVideoList[n].DEVICE+'&companyid=' + this.companyCode + ''
|
|
|
+ });
|
|
|
+
|
|
|
+ } else {
|
|
|
+ setTimeout(this.chk_video, 5000);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ setTimeout(this.chk_video, 5000);
|
|
|
+ }
|
|
|
+ if (this.reCount > 5) {
|
|
|
+ // var mask = document.getElementById('videomask');
|
|
|
+ // if (mask != undefined) {
|
|
|
+ // removeDIV('videomask');
|
|
|
+ // }
|
|
|
+ this.loadingStatus=false;
|
|
|
+ alert('远程摄像头链接超时，请稍后再试')
|
|
|
+ // uni.showToast({
|
|
|
+ // title: "远程摄像头链接超时，请稍后再试",
|
|
|
+ // icon: "none"
|
|
|
+ // });
|
|
|
+ // $("#myPopup").popup("open");
|
|
|
+
|
|
|
+ break;
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ // break;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ for (var i = 0; i < this.onLineVideoList.length; i++) {
|
|
|
+ for (var j = 0; j < this.deviceData.length; j++) {
|
|
|
+ if (this.onLineVideoList[i].DEVICE == this.deviceData[j].deviceCode) {
|
|
|
+ this.matchedDeviceList.push({
|
|
|
+ "DEVICE": this.onLineVideoList[i].DEVICE,
|
|
|
+ "ALIVEVALUE": this.onLineVideoList[i].ALIVEVALUE,
|
|
|
+ "ONAIR":this.onLineVideoList[i].ONAIR
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ console.log(this.matchedDeviceList)
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ open_video(item) {
|
|
|
+ if (this.openId != item.DEVICE) {
|
|
|
+ this.openId = item.DEVICE
|
|
|
+ }
|
|
|
+ for (var n = 0; n < this.onLineVideoList.length; n++) {
|
|
|
+ if (this.onLineVideoList[n].DEVICE == this.openId) {
|
|
|
+ if (this.onLineVideoList[n].ONAIR) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/videoDetail/videoDetail?deviceType=2&companyCode=' + this.companyCode + '&deviceCode=' + item.DEVICE +
|
|
|
+ '',
|
|
|
+ // url:'https://qhome.usky.cn/video.html?device='+item.DEVICE+'&companyid=' + this.companyCode + ''
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.count = 0;
|
|
|
+ this.reCount = 0;
|
|
|
+ this.loadingStatus=true
|
|
|
+ // alert('一些loading操作')
|
|
|
+ uni.request({
|
|
|
+ url: 'https://fire.usky.cn:8443/YtIoT/cgi-bin/demo2.cgi',
|
|
|
+ data: 'queryJson:' + JSON.stringify({
|
|
|
+ CMD: 3,
|
|
|
+ BODY: {
|
|
|
+ DEVICE: item.DEVICE,
|
|
|
+ ACTION: 1,
|
|
|
+ IDX: 7
|
|
|
+ }
|
|
|
+ }),
|
|
|
+ method: 'post',
|
|
|
+ header: {
|
|
|
+ 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
|
|
|
+ },
|
|
|
+ success: (res) => {
|
|
|
+ setTimeout(this.chk_video, 5000);
|
|
|
+ }
|
|
|
});
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ async getDeviceManage(ming = {}) {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: 'OperationMonitoring/getDeviceList',
|
|
|
+ data: ming
|
|
|
+ })
|
|
|
+ this.deviceData = res.data.data
|
|
|
},
|
|
|
|
|
|
|
|
|
+
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss">
|
|
|
-
|
|
|
+<style lang="scss">
|
|
|
+ .loadingMask{
|
|
|
+ width:100%;height:100%;position:absolute;left:0;
|
|
|
+ background:rgba(0,0,0,.3);
|
|
|
+ z-index:1000;
|
|
|
+ color:#000;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ display:flex;
|
|
|
+ text-align:center;
|
|
|
+ padding-top:100rpx;
|
|
|
+ font-size:34rpx;
|
|
|
+ }
|
|
|
+
|
|
|
</style>
|
ming