|
@@ -3,7 +3,7 @@
|
|
|
<view class="device-type">
|
|
|
<view v-for="(item,index) in deviceType" @click="deviceTypeFun(item)">
|
|
|
<img :src="item.img">
|
|
|
- <view>{{item.name}}</view>
|
|
|
+ <view>{{item.hardwareName}}</view>
|
|
|
<img src="@/images/basicsModules/icon_wdwg_gd.png">
|
|
|
</view>
|
|
|
</view>
|
|
@@ -14,8 +14,8 @@
|
|
|
</view>
|
|
|
<view class="sensor">
|
|
|
<view v-for="(item,index) in sensorData">
|
|
|
- <img :src="item.img">
|
|
|
- <veiw>{{item.name}}</veiw>
|
|
|
+ <img :src="baseUrl+item.icon">
|
|
|
+ <veiw>{{item.deviceName}}: {{item.deviceValue?item.deviceValue:''}}{{item.unit?item.unit:''}}</veiw>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 智能控制 -->
|
|
@@ -24,15 +24,13 @@
|
|
|
<view>智能控制</view>
|
|
|
</view>
|
|
|
<view class="intelligent-control">
|
|
|
- <view v-for="(item,index) in labHardwareVOList" :key="index">
|
|
|
+ <view v-for="(item,index) in labHardwareVOList" :key="index" v-if="item.hardwareTypeKey !='airConditioner'">
|
|
|
<view class="for-button-p">{{item.hardwareName}}
|
|
|
- <text v-if="item.state.code=='3'&& item.hardwareTypeEnum.hardwareTypeCode==2">({{item.dictLabel}})</text>
|
|
|
+ <text v-if="item.reservedThree">({{item.reservedThree}})</text>
|
|
|
</view>
|
|
|
- <img v-if="item.state.code=='3' && item.pcType != 1" src="@/images/basicsModules/icon_10.png" @click="buttonClick('switch',item,'close')">
|
|
|
- <img v-if="item.state.code=='4' && item.pcType != 1" src="@/images/basicsModules/icon_11.png" @click="buttonClick('switch',item,'open')">
|
|
|
- <view class="for-button-p" v-if="item.state.code=='0' && item.pcType != 1">离线</view>
|
|
|
- <view class="for-button-p" v-if="item.state.code=='2' && item.pcType != 1" style="color:#0183FA;">在线</view>
|
|
|
- <view v-if="item.pcType == 1" class="pcType-button" @click="buttonClick('operate',item,'')">操作</view>
|
|
|
+ <img v-if="item.online && item.operatingState" src="@/images/basicsModules/icon_10.png" @click="buttonClick('switch',item,'0')">
|
|
|
+ <img v-if="item.online && !item.operatingState" src="@/images/basicsModules/icon_11.png" @click="buttonClick('switch',item,'1')">
|
|
|
+ <view class="for-button-p" v-if="!item.online">离线</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 智能终端 -->
|
|
@@ -42,17 +40,22 @@
|
|
|
</view>
|
|
|
<view class="intelligent-control">
|
|
|
<view v-for="(item,index) in terminalData" :key="index">
|
|
|
- <view class="for-button-p">{{item.name}}</view>
|
|
|
- <view class="for-button-p" v-if="item.pcType == 1">离线</view>
|
|
|
- <view class="for-button-p" v-if="item.pcType != 1" style="color:#0183FA;">在线</view>
|
|
|
+ <view class="for-button-p">{{item.deviceName}}</view>
|
|
|
+ <view class="for-button-p" v-if="!item.online">离线</view>
|
|
|
+ <view class="for-button-p" v-if="item.online" style="color:#0183FA;">在线</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {} from '@/api/basicsModules/index.js'
|
|
|
+ import $mqtt from '@/utils/mqtt.min.js';
|
|
|
+ import {iotAppSensorFindBySubId,iotAppHardwareFindByType,
|
|
|
+ iotAppHardwareOperatingHardware,
|
|
|
+ iotAppDeviceFindByType,
|
|
|
+ } from '@/api/basicsModules/index.js'
|
|
|
+ import { config } from '@/api/request/config.js'
|
|
|
export default {
|
|
|
name: "iotControl",
|
|
|
props: {
|
|
@@ -60,63 +63,28 @@
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ baseUrl:config.base_url,
|
|
|
+ //MQTT请求参数-传感器
|
|
|
+ mtopic:"iot/device/sensor/sub/",
|
|
|
+ //MQTT请求参数-智能控制
|
|
|
+ mtopicOne:"iot/hardware/all/sub/",
|
|
|
+ client:{},
|
|
|
+ newData:{},
|
|
|
+ subId:'',
|
|
|
deviceType:[
|
|
|
{
|
|
|
- id:1,
|
|
|
- name:'视频监控',
|
|
|
+ type:'video',
|
|
|
+ hardwareName:'视频监控',
|
|
|
img: require('@/images/basicsModules/icon_xq_spjk.png'),
|
|
|
},
|
|
|
{
|
|
|
- id:2,
|
|
|
- name:'语音广播',
|
|
|
+ type:'speech',
|
|
|
+ hardwareName:'语音广播',
|
|
|
img: require('@/images/basicsModules/icon_sskz_xz.png'),
|
|
|
},
|
|
|
- {
|
|
|
- id:3,
|
|
|
- name:'空调1',
|
|
|
- img: require('@/images/basicsModules/icon_xq_kt.png'),
|
|
|
- },
|
|
|
- {
|
|
|
- id:4,
|
|
|
- name:'空调2',
|
|
|
- img: require('@/images/basicsModules/icon_xq_kt.png'),
|
|
|
- },
|
|
|
- ],
|
|
|
- sensorData:[
|
|
|
- {
|
|
|
- name:'温度: 36°',
|
|
|
- img: require('@/images/basicsModules/icon_yw_yc.png'),
|
|
|
- },
|
|
|
- {
|
|
|
- name:'湿度: 60%',
|
|
|
- img: require('@/images/basicsModules/icon_yw_yc.png'),
|
|
|
- },
|
|
|
- {
|
|
|
- name:'烟感1号: 0',
|
|
|
- img: require('@/images/basicsModules/icon_yw_yc.png'),
|
|
|
- },
|
|
|
- {
|
|
|
- name:'烟感2号: 1',
|
|
|
- img: require('@/images/basicsModules/icon_yw_yc.png'),
|
|
|
- },
|
|
|
- {
|
|
|
- name:'一氧化碳: 0ppm',
|
|
|
- img: require('@/images/basicsModules/icon_yw_yc.png'),
|
|
|
- },
|
|
|
-
|
|
|
- ],
|
|
|
- labHardwareVOList:[
|
|
|
- {
|
|
|
- hardwareName:'高温设备1',
|
|
|
- hardwareTypeEnum:{
|
|
|
- enumName:'',
|
|
|
- },
|
|
|
- state:{
|
|
|
- code:3,
|
|
|
- },
|
|
|
- pcType:2,
|
|
|
- }
|
|
|
],
|
|
|
+ sensorData:[],
|
|
|
+ labHardwareVOList:[],
|
|
|
terminalData:[
|
|
|
{
|
|
|
name:'智能管控一体机',
|
|
@@ -126,20 +94,25 @@
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
mounted() {
|
|
|
- console.log(this.subjectData)
|
|
|
+ this.$set(this, 'newData',this.subjectData);
|
|
|
+ this.$set(this, 'subId',this.subjectData.subId);
|
|
|
+ this.iotAppSensorFindBySubId();
|
|
|
+ this.iotAppHardwareFindByType();
|
|
|
+ this.iotAppDeviceFindByType();
|
|
|
+ this.offMQTT('on');
|
|
|
},
|
|
|
methods: {
|
|
|
//物联控制设备
|
|
|
deviceTypeFun(item){
|
|
|
- if(item.id==1){
|
|
|
-
|
|
|
- }else if(item.id==2){
|
|
|
+ if(item.type=='video'){
|
|
|
+
|
|
|
+ }else if(item.type=='speech'){
|
|
|
//语音广播弹窗开启
|
|
|
this.$parent.buttonClick('broadcastOpen','');
|
|
|
- }else if(item.id==3){
|
|
|
+ }else if(item.type=='conditioning'){
|
|
|
//空调弹窗开启
|
|
|
this.$parent.buttonClick('conditioningOpen','');
|
|
|
}
|
|
@@ -147,11 +120,11 @@
|
|
|
buttonClick(type,row,status){
|
|
|
let self = this;
|
|
|
if(type == 'switch'){
|
|
|
- //开关
|
|
|
+ //开关
|
|
|
let text = '';
|
|
|
- if(status == 'close'){
|
|
|
+ if(status == '0'){
|
|
|
text = '关闭';
|
|
|
- }else if(status == 'open'){
|
|
|
+ }else if(status == '1'){
|
|
|
text = '开启';
|
|
|
}
|
|
|
uni.showModal({
|
|
@@ -166,38 +139,18 @@
|
|
|
console.log('用户点击取消');
|
|
|
}
|
|
|
}
|
|
|
- });
|
|
|
- }else if(type=='operate'){
|
|
|
- //操作
|
|
|
- uni.showModal({
|
|
|
- content: '确认要操作该设备吗?',
|
|
|
- cancelColor:"#999",
|
|
|
- confirmColor:"#0183FA",
|
|
|
- success: function (res) {
|
|
|
- if (res.confirm) {
|
|
|
- self.controlSwitch(item.id);
|
|
|
- console.log('用户点击确定');
|
|
|
- } else if (res.cancel) {
|
|
|
- console.log('用户点击取消');
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
+ });
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
//设备开关
|
|
|
async mangerControl(item,status){
|
|
|
let obj = {
|
|
|
- id:item.id,
|
|
|
+ hardwareNo:item.hardwareNo,
|
|
|
command:status,
|
|
|
};
|
|
|
- const {data} = await mangerControl(obj);
|
|
|
+ const {data} = await iotAppHardwareOperatingHardware(obj);
|
|
|
if(data.code == 200){
|
|
|
- if(command == 'open'){
|
|
|
- item.type = 3;
|
|
|
- }else if(command == 'close'){
|
|
|
- item.type = 4;
|
|
|
- }
|
|
|
uni.showToast({
|
|
|
title: '操作成功',
|
|
|
icon:"none",
|
|
@@ -206,17 +159,112 @@
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
- async controlSwitch(id){
|
|
|
- const {data} = await controlSwitch({id:id});
|
|
|
+ //查询传感器状态
|
|
|
+ async iotAppSensorFindBySubId(){
|
|
|
+ const {data} = await iotAppSensorFindBySubId({subId:this.subId});
|
|
|
+ if(data.code == 200){
|
|
|
+ this.$set(this, 'sensorData',data.data);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //查询硬件设备
|
|
|
+ async iotAppHardwareFindByType(){
|
|
|
+ const {data} = await iotAppHardwareFindByType({subId:this.subId});
|
|
|
+ if(data.code == 200){
|
|
|
+ this.$set(this, 'labHardwareVOList',data.data);
|
|
|
+ for(let i=0;i<data.data.length;i++){
|
|
|
+ if(data.data[i].hardwareTypeKey=='airConditioner'){
|
|
|
+ data.data[i].type='conditioning';
|
|
|
+ data.data[i].img=require('@/images/basicsModules/icon_xq_kt.png');
|
|
|
+ this.deviceType.push(data.data[i])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //查询物联设备
|
|
|
+ async iotAppDeviceFindByType(){
|
|
|
+ const {data} = await iotAppDeviceFindByType({subjectId:this.subId,typeKeyList:['aio']});
|
|
|
if(data.code == 200){
|
|
|
- uni.showToast({
|
|
|
- title: '操作成功',
|
|
|
- icon:"none",
|
|
|
- mask:true,
|
|
|
- duration: 2000
|
|
|
- });
|
|
|
+ this.$set(this, 'terminalData',data.data);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //MQTT订阅
|
|
|
+ sensorMQTT(){
|
|
|
+ let self = this;
|
|
|
+ this.client = $mqtt.connect('wxs://' +uni.getStorageSync('mqttUrl'), {
|
|
|
+ username:uni.getStorageSync('mqttUser'),
|
|
|
+ password:uni.getStorageSync('mqttPassword')
|
|
|
+ });
|
|
|
+ this.client.on("connect", e =>{
|
|
|
+ this.client.subscribe(this.mtopic+self.subId, (err) => {
|
|
|
+ if (!err) {
|
|
|
+ console.log("传感器订阅成功:" + this.mtopic+self.subId);
|
|
|
+ }else{
|
|
|
+ // console.log("连接错误:" + err);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.client.subscribe(this.mtopicOne+self.subId, (err) => {
|
|
|
+ if (!err) {
|
|
|
+ console.log("智能控制订阅成功:" + this.mtopicOne+self.subId);
|
|
|
+ }else{
|
|
|
+ // console.log("连接错误:" + err);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ this.client.on("message", (topic, message) => {
|
|
|
+ if (message){
|
|
|
+ if(topic==this.mtopic+this.subId){
|
|
|
+ //传感器
|
|
|
+ let data = JSON.parse(message)
|
|
|
+ let list = JSON.parse(JSON.stringify(this.sensorData))
|
|
|
+ list.forEach((item)=>{
|
|
|
+ data.forEach((minItem)=>{
|
|
|
+ if(item.deviceNo == minItem.deviceNo){
|
|
|
+ item.deviceValue = minItem.deviceValue;
|
|
|
+ item.online = minItem.online;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.$set(this,'sensorData',list);
|
|
|
+ }else if(topic == this.mtopicOne+this.subId){
|
|
|
+ //智能控制
|
|
|
+ let data = JSON.parse(message)
|
|
|
+ let list = JSON.parse(JSON.stringify(this.labHardwareVOList))
|
|
|
+ list.forEach((item)=>{
|
|
|
+ if(item.hardwareNo == data.hardwareNo){
|
|
|
+ item.operatingState = data.operatingState;
|
|
|
+ item.online = data.online;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$set(this,'labHardwareVOList',list);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //取消订阅关闭MQTT连接
|
|
|
+ offMQTT(type){
|
|
|
+ let self = this;
|
|
|
+ if(self.client.unsubscribe){
|
|
|
+ self.client.unsubscribe(self.mtopicOne+self.subId, error => {
|
|
|
+ if (error) {
|
|
|
+ // console.log('mqtt关闭连接错误:', error)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ self.client.end();
|
|
|
+ this.$set(this,'client',{});
|
|
|
+ }
|
|
|
+ //判断传入参数如果存在 发起一次新的连接
|
|
|
+ if(type){
|
|
|
+ this.sensorMQTT();
|
|
|
}
|
|
|
},
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ beforeDestroy(){
|
|
|
+ //清除定时器
|
|
|
+ let self = this;
|
|
|
+ self.offMQTT();
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
@@ -232,7 +280,7 @@
|
|
|
justify-content: flex-start;
|
|
|
flex-wrap: wrap;
|
|
|
>view{
|
|
|
- width: 356rpx;
|
|
|
+ //width: 356rpx;
|
|
|
height: 80rpx;
|
|
|
display: flex;
|
|
|
justify-content: flex-start;
|
|
@@ -240,6 +288,7 @@
|
|
|
border-right: 1px dashed #E0E0E0;
|
|
|
border-bottom: 1px dashed #E0E0E0;
|
|
|
padding-left: 10rpx;
|
|
|
+ padding-right: 10rpx;
|
|
|
box-sizing: border-box;
|
|
|
>img:nth-of-type(1){
|
|
|
width: 42rpx;
|
|
@@ -291,7 +340,7 @@
|
|
|
color: #333333;
|
|
|
line-height: 80rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
.sensor{
|
|
|
display: flex;
|
|
@@ -359,7 +408,7 @@
|
|
|
}
|
|
|
>view:nth-last-child(1){
|
|
|
border-bottom:none;
|
|
|
- }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|