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

64 lines
1.5 KiB
Vue

<template>
<view class="controller">
<view class="flex fwr jcsb">
<control :style="{width: ['txt','ctl'].includes(controlType(item))?'48%':'100%'}" :item="item" :device="device" @mqttPublish="mqttPublish" @showChart="showChart" v-if="functionList && functionList.length>0" v-for="(item,index) in functionList" :key="index"></control>
</view>
<view v-if="functionList && functionList.length==0"
style="width:100%;display:flex;justify-content: center;align-items: center;">
<u-empty mode="data" />
</view>
<u-toast ref="uToast"></u-toast>
</view>
</template>
<script>
import control from './controls/index.vue'
import {controlType} from './controls/util.js'
export default {
name: "controller",
props: {
device: {
type: Object,
default: null
}
},
components: {
control
},
data() {
return {
functionList: null,
shadowUnEnable: false
};
},
watch: {
device: {
handler: function(n, o) {
if (n.thingsModels && n.thingsModels.length > 0) {
//过滤出property
this.functionList = this.device.thingsModels.filter(item => item.type == 2).map((item,
index) => {
return {
...item,
bg: this.$colorList[index % 7]
}
});
}
},
immediate: true
},
},
methods: {
mqttPublish(item){
this.$emit('mqttPublish',item)
},
showChart(item){
this.$emit('showChart',item);
},
controlType(item){
return controlType(item)
},
}
}
</script>