首页更新，添加蓝牙电量显示
This commit is contained in:
liub
@ -107,7 +107,7 @@
|
||||
|
||||
<view class="lampMode">
|
||||
<view class="colorContent">
|
||||
<view v-for="item,index in dic.groups" class="item"
|
||||
<view v-for="item,index in formData.groups" class="item"
|
||||
:class="{active:item.id==formData.sta_GroupType,marginNoLeft:index%3===0}"
|
||||
@click.stop="groupSetting(item,index)">
|
||||
|
||||
@ -125,15 +125,15 @@
|
||||
<view class="lamp noPadding">
|
||||
<view class="title">箭头模式</view>
|
||||
<view class="smlltitle">
|
||||
箭头朝向
|
||||
朝向/颜色
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="arrowContent marginTop10">
|
||||
<view class="modeSetting">
|
||||
|
||||
<view class="arrow" @click.stop="ArrowSet('red_front')"
|
||||
:class="formData.sta_ArrowType=='red_front'?'active':''">
|
||||
<view class="arrow" @click.stop="ArrowModeSet('right_off')"
|
||||
:class="formData.sta_ArrowMode=='right_off'?'active':''">
|
||||
<view class="outCircle">
|
||||
<view class="item">
|
||||
<image class="img nomal" src="/static/images/4877/arrow.png" mode="aspectFit"></image>
|
||||
@ -141,10 +141,10 @@
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text">红色朝前</view>
|
||||
<view class="text">朝左</view>
|
||||
</view>
|
||||
<view class="arrow" @click.stop="ArrowSet('green_back')"
|
||||
:class="formData.sta_ArrowType=='green_back'?'active':''">
|
||||
<view class="arrow" @click.stop="ArrowModeSet('right_on')"
|
||||
:class="formData.sta_ArrowMode=='right_on'?'active':''">
|
||||
<view class="outCircle">
|
||||
<view class="item">
|
||||
<image class="img nomal translate" src="/static/images/4877/arrow.png" mode="aspectFit">
|
||||
@ -153,10 +153,37 @@
|
||||
mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text">绿色朝后</view>
|
||||
<view class="text">朝右</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
|
||||
<view class="modeSetting">
|
||||
|
||||
<view class="arrow" @click.stop="ArrowSet('red_front')"
|
||||
:class="formData.sta_ArrowType=='red_front'?'redactive':''">
|
||||
<view class="outCircle">
|
||||
<view class="item">
|
||||
<view class="text">红色</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="arrow" @click.stop="ArrowSet('green_back')"
|
||||
:class="formData.sta_ArrowType=='green_back'?'greenactive':''">
|
||||
<view class="outCircle">
|
||||
<view class="item">
|
||||
<view class="text">绿色</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="lamp noPadding">
|
||||
@ -255,7 +282,7 @@
|
||||
import {
|
||||
colors as groupColors
|
||||
} from '@/api/4877/BJQ4877.js';
|
||||
|
||||
|
||||
import MqTool from '@/utils/MqHelper.js'
|
||||
|
||||
const pagePath = "/pages/4877/BJQ4877";
|
||||
@ -265,7 +292,7 @@
|
||||
var recei = null;
|
||||
var interval = null;
|
||||
var slidTime = null;
|
||||
var mq=null;
|
||||
var mq = null;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@ -346,7 +373,11 @@
|
||||
sta_GroupType: -1, //配组
|
||||
sta_ArrowType: '', //箭头方向
|
||||
warnTime: 0,
|
||||
sta_Channel: 80
|
||||
sta_Channel: 80,
|
||||
sta_ArrowMode:'',
|
||||
groups: [
|
||||
|
||||
]
|
||||
},
|
||||
dic: {
|
||||
SOS: [{
|
||||
@ -361,10 +392,8 @@
|
||||
img: '/static/images/4877/fan.png',
|
||||
activeImg: '/static/images/4877/fanActive.png'
|
||||
}
|
||||
],
|
||||
groups: [
|
||||
|
||||
]
|
||||
|
||||
},
|
||||
device: {
|
||||
id: "",
|
||||
@ -391,19 +420,19 @@
|
||||
onUnload() {
|
||||
console.log("页面卸载,释放资源");
|
||||
ble.removeAllCallback(pagePath);
|
||||
if(mq){
|
||||
mq.unSubscribes();
|
||||
mq.disconnect();
|
||||
if (mq) {
|
||||
mq.unSubscribes();
|
||||
mq.disconnect();
|
||||
}
|
||||
ble=null;
|
||||
mq=null;
|
||||
ble = null;
|
||||
mq = null;
|
||||
clearInterval(interval);
|
||||
},
|
||||
onLoad: function() {
|
||||
these = this;
|
||||
recei = BleReceive.getBleReceive();
|
||||
ble = BleTool.getBleTool();
|
||||
mq=MqTool.getMqTool();
|
||||
mq = MqTool.getMqTool();
|
||||
this.dic.gropus = [];
|
||||
|
||||
|
||||
@ -433,19 +462,28 @@
|
||||
return false;
|
||||
});
|
||||
|
||||
these.dic.groups = groups;
|
||||
these.formData.groups = groups;
|
||||
|
||||
}
|
||||
var device = data.data;
|
||||
these.device = device;
|
||||
|
||||
let arr=[{topic:'C/4877_Groups_'+these.device.id,callback:these.getCheckedColors}];
|
||||
mq.init().then(res=>{
|
||||
mq.subscribes(arr).catch(ex=>{
|
||||
console.error("ex=",ex);
|
||||
|
||||
let arr = [{
|
||||
topic: 'C/4877_Groups_' + these.device.id,
|
||||
callback: these.getCheckedColors
|
||||
}
|
||||
// ,
|
||||
// {
|
||||
// topic: 'C/4877_Channel_' + these.device.id,
|
||||
// callback: these.getChannel
|
||||
// }
|
||||
];
|
||||
mq.init().then(res => {
|
||||
mq.subscribes(arr).catch(ex => {
|
||||
console.error("ex=", ex);
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
let f = ble.data.LinkedList.find((v) => {
|
||||
if (v.macAddress == device.deviceMac) {
|
||||
// console.log("找到设备了", v);
|
||||
@ -474,8 +512,8 @@
|
||||
|
||||
these.formData.bleStatu = false;
|
||||
these.formData.deviceId = f.deviceId;
|
||||
these.formData.warnTime=null;
|
||||
these.formData.sta_SOSType='sos_off';
|
||||
these.formData.warnTime = null;
|
||||
these.formData.sta_SOSType = 'sos_off';
|
||||
ble.LinkBlue(f.deviceId, f.writeServiceId, f.wirteCharactId, f.notifyCharactId).then(res => {
|
||||
these.formData.bleStatu = true;
|
||||
});
|
||||
@ -496,38 +534,53 @@
|
||||
|
||||
},
|
||||
methods: {
|
||||
getCheckedColors(rec){
|
||||
console.error("收到MQ消息:",rec);
|
||||
try{
|
||||
|
||||
let str=rec.receive.payloadString;
|
||||
let arr=JSON.parse(str);
|
||||
|
||||
|
||||
let groups = groupColors.filter((v,index) => {
|
||||
if(arr[index]===1){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
these.dic.groups = groups;
|
||||
|
||||
let checks = groups.map(item => {
|
||||
return item.id
|
||||
});
|
||||
|
||||
uni.setStorage({
|
||||
key: "4877CheckColor_" + this.device.id,
|
||||
data: checks
|
||||
});
|
||||
|
||||
|
||||
}catch(err){
|
||||
|
||||
getChannel(rec) {
|
||||
console.error("收到MQ信道保留消息:", rec);
|
||||
try {
|
||||
|
||||
let str = rec.receive.payloadString;
|
||||
let json = JSON.parse(str);
|
||||
if('ins_channel' in json){
|
||||
this.formData.sta_Channel=json.ins_channel;
|
||||
these.setBleFormData();
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
getCheckedColors(rec) {
|
||||
console.error("收到MQ消息:", rec);
|
||||
try {
|
||||
|
||||
let str = rec.receive.payloadString;
|
||||
let arr = JSON.parse(str);
|
||||
|
||||
|
||||
let groups = groupColors.filter((v, index) => {
|
||||
if (arr[index] === 1) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
these.formData.groups = groups;
|
||||
console.error("groups=",these.formData.groups);
|
||||
let checks = groups.map(item => {
|
||||
return item.id
|
||||
});
|
||||
|
||||
uni.setStorage({
|
||||
key: "4877CheckColor_" + this.device.id,
|
||||
data: checks
|
||||
});
|
||||
|
||||
|
||||
} catch (err) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
ShowChannelEdit() {
|
||||
this.Status.ShowEditChannel = true;
|
||||
@ -547,15 +600,15 @@
|
||||
promptTitle: '',
|
||||
modelValue: '',
|
||||
visibleClose: false,
|
||||
okCallback: ()=>{
|
||||
okCallback: () => {
|
||||
this.onChannelChanging();
|
||||
this.Status.ShowEditChannel=false;
|
||||
this.Status.ShowEditChannel = false;
|
||||
},
|
||||
showSlot: true,
|
||||
buttonCancelText: '取消',
|
||||
showCancel: true,
|
||||
cancelCallback:()=>{
|
||||
this.Status.ShowEditChannel=false;
|
||||
cancelCallback: () => {
|
||||
this.Status.ShowEditChannel = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
@ -566,7 +619,7 @@
|
||||
return;
|
||||
}
|
||||
let f = this.getDevice();
|
||||
|
||||
|
||||
if (!f) {
|
||||
this.showBleUnConnect();
|
||||
return;
|
||||
@ -580,6 +633,14 @@
|
||||
json = JSON.stringify(json);
|
||||
ble.sendString(f.deviceId, json, f.writeServiceId, f.wirteCharactId, 30).then(res => {
|
||||
console.log("发送成功");
|
||||
|
||||
// mq.sendData('C/4877_Channel_' + these.device.id, JSON.stringify(json), true).then(
|
||||
// res => {
|
||||
// console.log("发送成功,", res)
|
||||
// }).catch(err => {
|
||||
// console.error("err=", err);
|
||||
// });
|
||||
|
||||
this.setBleFormData();
|
||||
}).catch(ex => {
|
||||
this.showMsg(ex.msg);
|
||||
@ -587,6 +648,31 @@
|
||||
}, 200)
|
||||
|
||||
|
||||
},
|
||||
ArrowModeSet(val) {
|
||||
if (this.formData.sta_SOSType === 'sos') {
|
||||
this.showMsg("设备强制报警中,请先关闭报警")
|
||||
return;
|
||||
}
|
||||
|
||||
let f = this.getDevice();
|
||||
if (!f) {
|
||||
this.showBleUnConnect();
|
||||
return;
|
||||
}
|
||||
if (this.formData.sta_ArrowMode === val) {
|
||||
return;
|
||||
}
|
||||
|
||||
var json = {
|
||||
ins_right_side: val
|
||||
}
|
||||
json = JSON.stringify(json);
|
||||
ble.sendString(f.deviceId, json, f.writeServiceId, f.wirteCharactId, 30).then(res => {
|
||||
this.formData.sta_ArrowMode = val;
|
||||
}).catch(ex => {
|
||||
this.showMsg(ex.msg);
|
||||
});
|
||||
},
|
||||
ArrowSet(val) {
|
||||
if (this.formData.sta_SOSType === 'sos') {
|
||||
@ -631,7 +717,7 @@
|
||||
return false;
|
||||
});
|
||||
|
||||
these.dic.groups = arr;
|
||||
these.formData.groups = arr;
|
||||
these.CheckGroupOver(data.allFlag);
|
||||
}
|
||||
},
|
||||
@ -648,17 +734,17 @@
|
||||
return;
|
||||
}
|
||||
|
||||
mq.sendData('C/4877_Groups_'+these.device.id,JSON.stringify(arr),true).then(res=>{
|
||||
console.log("发送成功,",res)
|
||||
}).catch(err=>{
|
||||
console.error("err=",err);
|
||||
mq.sendData('C/4877_Groups_' + these.device.id, JSON.stringify(arr), true).then(res => {
|
||||
console.log("发送成功,", res)
|
||||
}).catch(err => {
|
||||
console.error("err=", err);
|
||||
});
|
||||
var json = {
|
||||
ins_GroupType: arr
|
||||
}
|
||||
json = JSON.stringify(json);
|
||||
ble.sendString(f.deviceId, json, f.writeServiceId, f.wirteCharactId, 30).then(res => {
|
||||
|
||||
this.setBleFormData();
|
||||
}).catch(ex => {
|
||||
this.showMsg(ex.msg);
|
||||
});
|
||||
@ -672,11 +758,11 @@
|
||||
// borderColor: "#e034344d",
|
||||
// buttonBgColor: "#E03434",
|
||||
// okCallback: () => {
|
||||
clearInterval(interval);
|
||||
clearInterval(interval);
|
||||
|
||||
this.sosSetting({
|
||||
val: val
|
||||
});
|
||||
this.sosSetting({
|
||||
val: val
|
||||
});
|
||||
// },
|
||||
// buttonText: "解除",
|
||||
// showCancel: true,
|
||||
@ -715,21 +801,21 @@
|
||||
}
|
||||
groupSet();
|
||||
},
|
||||
SOSEvt(){
|
||||
SOSEvt() {
|
||||
if (this.formData.sta_SOSType == 'sos') {
|
||||
this.formData.sta_ArrowType='arrow_off';
|
||||
this.formData.sta_ArrowType = 'arrow_off';
|
||||
this.formData.warnTime = 0;
|
||||
clearInterval(interval);
|
||||
interval = setInterval(() => {
|
||||
this.formData.warnTime += 1;
|
||||
}, 1000)
|
||||
}else{
|
||||
} else {
|
||||
clearInterval(interval);
|
||||
interval=null;
|
||||
interval = null;
|
||||
this.formData.warnTime = 0;
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
sosSetting(item, index) {
|
||||
|
||||
let f = this.getDevice();
|
||||
@ -750,7 +836,7 @@
|
||||
ble.sendString(f.deviceId, json, f.writeServiceId, f.wirteCharactId, 30).then(res => {
|
||||
this.formData.sta_GroupType = -1;
|
||||
this.formData.sta_SOSType = json.ins_SOSType
|
||||
|
||||
|
||||
these.SOSEvt();
|
||||
|
||||
})
|
||||
@ -759,9 +845,9 @@
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
let confirmTask=()=>{
|
||||
|
||||
|
||||
let confirmTask = () => {
|
||||
this.showPop({
|
||||
message: '确定' + (this.formData.sta_SOSType === 'sos' ? '关闭' : '开启') + '声光报警模式?',
|
||||
iconUrl: "/static/images/6155/DeviceDetail/uploadErr.png",
|
||||
@ -777,14 +863,14 @@
|
||||
confirmTask();
|
||||
|
||||
} else if (item.val === 'sos_off') {
|
||||
|
||||
if(this.formData.sta_SOSType === 'sos'){
|
||||
|
||||
if (this.formData.sta_SOSType === 'sos') {
|
||||
confirmTask();
|
||||
}else{
|
||||
} else {
|
||||
task();
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
} else {
|
||||
|
||||
if (this.formData.sta_SOSType === 'sos') {
|
||||
@ -922,14 +1008,14 @@
|
||||
this.formData[key] = data[key];
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
let msg = [];
|
||||
if (data.sta_SOSType == 'sos') {
|
||||
msg.push("设备声光报警中");
|
||||
|
||||
|
||||
}
|
||||
if('sta_SOSType' in data){
|
||||
if ('sta_SOSType' in data) {
|
||||
these.SOSEvt();
|
||||
}
|
||||
if (data.sta_PowerPercent <= 20) {
|
||||
@ -1566,7 +1652,7 @@
|
||||
border-radius: 16rpx;
|
||||
background: rgba(26, 26, 26, 1);
|
||||
width: 100%;
|
||||
padding: 10rpx 0rpx;
|
||||
padding: 20rpx 0rpx;
|
||||
}
|
||||
|
||||
.modeSetting {
|
||||
@ -1600,7 +1686,22 @@
|
||||
letter-spacing: 0.14rpx;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.modeSetting .arrow .outCircle .text {
|
||||
margin-top:0rpx !important;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.arrowContent .line {
|
||||
width:calc(100% - 60rpx);
|
||||
|
||||
height: 0rpx;
|
||||
border-bottom:1px solid #ffffff30;
|
||||
margin: 30rpx ;
|
||||
}
|
||||
.modeSetting .arrow .outCircle {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
@ -1632,6 +1733,8 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.modeSetting .arrow.active .outCircle {
|
||||
border: 4rpx solid rgba(174, 214, 0, 1);
|
||||
padding: 4rpx;
|
||||
@ -1642,6 +1745,35 @@
|
||||
border-radius: 50%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.modeSetting .arrow.redactive .outCircle {
|
||||
border: 4rpx solid #EC2A2A;
|
||||
padding: 4rpx;
|
||||
}
|
||||
|
||||
.modeSetting .arrow.redactive .item {
|
||||
background: #EC2A2A;
|
||||
border-radius: 50%;
|
||||
|
||||
}
|
||||
|
||||
.modeSetting .arrow.greenactive .outCircle {
|
||||
border: 4rpx solid #00BD00;
|
||||
padding: 4rpx;
|
||||
}
|
||||
|
||||
.modeSetting .arrow.greenactive .item {
|
||||
background: #00BD00;
|
||||
border-radius: 50%;
|
||||
|
||||
}
|
||||
|
||||
.modeSetting .arrow.redactive .item .text,
|
||||
.modeSetting .arrow.greenactive .item .text{
|
||||
color:#FFFFFFde !important;
|
||||
}
|
||||
|
||||
|
||||
.modeSetting .item .img {
|
||||
width: 52rpx;
|
||||
|
||||
Reference in New Issue
Block a user