119 lines
2.9 KiB
Vue
119 lines
2.9 KiB
Vue
|
<template>
|
||
|
|
<view class="device-status">
|
||
|
|
<view class="title-wrap">
|
||
|
|
<view style="width: 175px;">
|
||
|
|
<u-subsection :list="modeList" mode="subsection" :current="current"
|
||
|
|
@change="sectionChange"></u-subsection>
|
||
|
|
</view>
|
||
|
|
<u--text iconStyle="color: #486ff2; margin-right: 4px; font-size: 22px;" type="primary"
|
||
|
|
prefixIcon="list-dot" align="right" text="设备详情" @click="handleGoToDeviceDetail"></u--text>
|
||
|
|
</view>
|
||
|
|
<view class="running-status" v-show="current==0 && !isRelayProduct">
|
||
|
|
<base-status :device="device" ref="baseStatus"></base-status>
|
||
|
|
</view>
|
||
|
|
<view class="deviceVariable" v-show="current==1 && !isRelayProduct">
|
||
|
|
<device-variable ref="deviceVariable" :device="device"></device-variable>
|
||
|
|
</view>
|
||
|
|
<view class="relay-control" v-show="isRelayProduct">
|
||
|
|
<relay-control :device="device" ref="relayControl"></relay-control>
|
||
|
|
</view>
|
||
|
|
<!-- <view class="relay-control" v-show="isRelayProduct">
|
||
|
|
<GRelay :device="device" ref="GRelay"></GRelay>
|
||
|
|
</view> -->
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import baseStatus from './base.vue';
|
||
|
|
import deviceVariable from './variable.vue';
|
||
|
|
import relayControl from './relay.vue';
|
||
|
|
// import GRelay from './GRelay.vue'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'running-status',
|
||
|
|
components: {
|
||
|
|
baseStatus,
|
||
|
|
deviceVariable,
|
||
|
|
relayControl,
|
||
|
|
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
device: {
|
||
|
|
type: Object,
|
||
|
|
default: null,
|
||
|
|
required: true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
// 兼容小程序
|
||
|
|
device: function(newVal, oldVal) {
|
||
|
|
this.deviceInfo = newVal;
|
||
|
|
this.isSubDev = newVal.subDeviceList && newVal.subDeviceList.length > 0;
|
||
|
|
this.isRelayProduct = newVal.productName === '多路控制器';
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
modeList: ['状态模式', '数据模式'],
|
||
|
|
current: 0,
|
||
|
|
isSubDev: false,
|
||
|
|
isRelayProduct: false,
|
||
|
|
deviceInfo: {} // 设备信息
|
||
|
|
};
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
|
||
|
|
// 获取设备状态(兼容H5和APP)
|
||
|
|
if (this.device.subDeviceList) {
|
||
|
|
this.deviceInfo = this.device;
|
||
|
|
this.isSubDev = this.device.subDeviceList.length > 0;
|
||
|
|
}
|
||
|
|
this.isRelayProduct = this.device.productName === '继电器测试';
|
||
|
|
console.log("create的数据", JSON.stringify(this.deviceInfo))
|
||
|
|
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
|
||
|
|
sectionChange(index) {
|
||
|
|
this.current = index;
|
||
|
|
},
|
||
|
|
baseStatusRefresh() {
|
||
|
|
this.$refs.baseStatus.deviceStatusRefresh();
|
||
|
|
},
|
||
|
|
// 调整到设备详情
|
||
|
|
handleGoToDeviceDetail() {
|
||
|
|
const {
|
||
|
|
deviceId
|
||
|
|
} = this.deviceInfo;
|
||
|
|
console.log("deviceId", JSON.stringify(deviceId))
|
||
|
|
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '/pagesA/home/device/detail/index?deviceId=' + deviceId
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.device-status {
|
||
|
|
.status-title {
|
||
|
|
font-weight: 400;
|
||
|
|
font-size: 30rpx;
|
||
|
|
color: #000000;
|
||
|
|
line-height: 45rpx;
|
||
|
|
text-align: left;
|
||
|
|
font-style: normal;
|
||
|
|
text-transform: none;
|
||
|
|
margin: 0 20rpx 27rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-wrap {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
margin: 20rpx 0 30rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|