You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
1.7 KiB
79 lines
1.7 KiB
5 years ago
|
<template>
|
||
|
|
<view>
|
||
|
|
<view class="uni-padding-wrap uni-common-mt">
|
||
|
|
<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" />
|
||
|
|
</view>
|
||
|
|
<view class="content">
|
||
|
|
<view v-show="current === 0">
|
||
|
|
<device-info :info="info"></device-info>
|
||
|
|
</view>
|
||
|
|
<view v-show="current === 1">
|
||
|
|
<real-data :msg="msg"></real-data>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import uniSegmentedControl from '@/components/uni-segmented-control/uni-segmented-control.vue'
|
||
|
|
import deviceInfo from './device-info.vue'
|
||
|
|
import realData from './real-data.vue'
|
||
|
|
import { getDeviceInfo,getDeviceLatestUpMessage } from '@/api/device.js'
|
||
|
|
import { getMQTTClient } from '@/common/mqttClient.js'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
uniSegmentedControl,
|
||
|
|
deviceInfo,
|
||
|
|
realData
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
info:{},
|
||
|
|
msg:{},
|
||
|
|
productId: '',
|
||
|
|
deviceName: '',
|
||
|
|
items: [
|
||
|
|
'设备信息',
|
||
|
|
'实时数据'
|
||
|
|
],
|
||
|
|
current: 0,
|
||
|
|
client: null
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad(e){
|
||
|
|
if(e){
|
||
|
|
this.productId = e.productId;
|
||
|
|
this.deviceName = e.deviceName;
|
||
|
|
}
|
||
|
|
this.fetchDeviceInfo()
|
||
|
|
this.fetchDeviceData()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
onClickItem(index) {
|
||
|
|
if (this.current !== index) {
|
||
|
|
this.current = index
|
||
|
|
}
|
||
|
|
},
|
||
|
|
fetchDeviceInfo(){
|
||
|
|
getDeviceInfo(this.productId,this.deviceName).then(response => {
|
||
|
|
this.info = response.data;
|
||
|
|
this.client = getMQTTClient(this.info.productId,this.info.deviceName,this.info.deviceSecret)
|
||
|
|
console.log(this.client)
|
||
|
|
})
|
||
|
|
},
|
||
|
|
fetchDeviceData(){
|
||
|
|
getDeviceLatestUpMessage(this.productId,this.deviceName).then(response => {
|
||
|
|
if(response.data){
|
||
|
|
this.msg = response;
|
||
|
|
}
|
||
|
|
console.log(this.msg)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
|
||
|
|
</style>
|