2025-04-16 02:11:26 +01:00

80 lines
1.8 KiB
Vue

<template>
<view class="weatherStation">
<!-- <view class="flex jcsb background-color-fff padding-20 border-radius-10 margin-bottom-20">
<view class="label">
是否开启实时数据
</view>
<view class="switch">
<u-switch :disabled="device.status!=3" v-model="switchStatus" @change="switchChange" activeValue="1"
inactiveValue="0" activeColor="#5ac725"></u-switch>
</view>
</view> -->
<view class="flex fwr jcsb">
<control :style="{width: ['txt','ctl'].includes(controlType(item))?'48%':'100%'}" :item="item" :device="device" v-for="(item,index) in propertyList" :key="index" @mqttPublish="mqttPublish" @showChart="showChart"></control>
</view>
<u-toast ref="uToast"></u-toast>
</view>
</template>
<script>
import control from './controls/index.vue'
import {controlType} from './controls/util.js'
import mqttService from '@/utils/mqttService.js'
export default {
props: {
device: {
type: Object,
default: null
}
},
components: {
control
},
data() {
return {
propertyList: null,
switchStatus: "0"
};
},
watch: {
device: {
handler: function(n, o) {
if (n.thingsModels && n.thingsModels.length > 0) {
//过滤出property
this.propertyList = this.device.thingsModels.filter(item => item.type == 1).map((item,
index) => {
return {
...item,
bg: this.$colorList[index % 7]
}
});
}
},
immediate: true,
deep:true
},
},
methods: {
mqttPublish(item){
this.$emit('mqttPublish',item);
},
showChart(item){
console.log(909090,item)
this.$emit('showChart',item);
},
switchChange(e) {
if (e == 1) {
mqttService.monitor(this.device,true)
} else {
mqttService.monitor(this.device,false)
}
},
controlType(item){
return controlType(item)
},
}
}
</script>