首页更新,添加蓝牙电量显示

This commit is contained in:
liub
2026-01-06 16:13:28 +08:00
parent d08d109fd1
commit 78adc0bfed
870 changed files with 3941 additions and 525 deletions

View File

@ -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;

View File

@ -56,6 +56,10 @@
</view>
<view class="modeSetting">
<view class="item" :class="formData.modeCurr=='smalllow'?'active':''"
@click="MainModeSetting('smalllow','staticBattery')">
<view class="p100 center">前置</view>
</view>
<view class="item" :class="formData.modeCurr=='low'?'active':''"
@click="MainModeSetting('low','staticBattery')">
<view class="p100 center">低档</view>
@ -68,10 +72,14 @@
@click="MainModeSetting('hight','staticBattery')">
<view class="p100 center">高档</view>
</view>
<view class="item " :class="formData.modeCurr=='close'?'active':''"
<!-- <view class="item " :class="formData.modeCurr=='close'?'active':''"
@click="MainModeSetting('close','staticBattery')">
<view class="p100 center">关闭</view>
</view>
</view> -->
</view>
<view class="lampMode">
<view class="mode fleft" :class="formData.cMode?'active':''" v-on:click.stop="LampToggle()">
@ -594,16 +602,19 @@
},
MainModeSetting: function(type, byteType) {
if (this.formData.modeCurr == type) {
return;
type='close';
}
showLoading(this, {
text: "请稍候..."
});
let task = () => {
this.formData.modeCurr = type;
let dataValue = 0x00;
let btype = 0x00;
switch (type) {
case "smalllow":
dataValue = 0x68;
break;
case "low": //低档
dataValue = 0x67;
break;
@ -655,8 +666,7 @@
// 发送数据
ble.sendData(f.deviceId, buffer, f.writeServiceId, f.wirteCharactId, 10).then(() => {
this.formData.modeCurr = type;
console.log("发送成功了");
}).catch((ex) => {
@ -1084,10 +1094,12 @@
hideLoading(these);
return;
}
console.log("baseURL=",baseURL);
console.log("token",token);
console.log("clientID",clientid);
uni.uploadFile({
// url: 'http://114.55.111.217/video/upload',
url: baseURL + "app/video/upload",
url: baseURL + "/app/video/upload",
filePath: videoPath,
name: 'file',
header: {
@ -1112,9 +1124,10 @@
});
Promise.all([p1, p2]).then((arr) => {
let res = arr[1];
res = JSON.parse(res.data);
if (res.data) {
these.videoHexArray = res.data;
updateLoading(these, {

View File

@ -1,10 +1,21 @@
<template>
<view class="content contentBg">
<custom-navbar :title="Status.navbar.title" :showBack="Status.navbar.showBack" color="#FFFFFF"
:rightIcons="Status.navbar.icons" @icon-click="handleRightClick"></custom-navbar>
<view>
<!-- <custom-navbar :title="Status.navbar.title" :showBack="Status.navbar.showBack" color="#FFFFFF"
:rightIcons="Status.navbar.icons" @icon-click="handleRightClick" backgroundColor="#121212"></custom-navbar>
-->
<uni-nav-bar :border="false" @clickLeft="prevPage" fixed="true" statusBar="true"
background-color="#121212" color="#FFFFFF" :title="Status.navbar.title">
<template v-slot:left><view>
<uni-icons type="left" size="24" color="#FFFFFF"></uni-icons>
</view></template>
<block slot="right">
<view class="navbarRight">
<image @click.stop="handleRightClick(index,item)" v-for="item,index in Status.navbar.icons" class="img" :src="item.src" mode="aspectFit"></image>
</view>
</block>
</uni-nav-bar>
</view>
<view class="eq" :style="{marginTop:Status.navbar.height+'px'}">
<view class="leftImg" @click.stop="previewImg(device.devicePic?device.devicePic:formData.img)">
<image class="img" :src="device.devicePic?device.devicePic:formData.img" mode="aspectFit"></image>
@ -90,8 +101,7 @@
<view :class="getWarnStyle(5)" class="net netfive"></view>
</view>
</view>
<view class="warnnig" :class="formData.qzwarn ?'':'displayNone'"
@click="CloseWarn(true)">
<view class="warnnig" :class="formData.qzwarn ?'':'displayNone'" @click="CloseWarn(true)">
<view>设备强制报警中</view>
<view class="netContent" :class="{'displayNone':!Status.staticWarn.time}">
{{Status.staticWarn.time}}s
@ -219,8 +229,8 @@
<view>
<view class="item">
<input maxlength="16" class="value" style="text-indent: 20rpx;" v-model="formData.msgTxt" placeholder="请输入文字"
placeholder-class="usrplace" />
<input maxlength="16" class="value" style="text-indent: 20rpx;" v-model="formData.msgTxt"
placeholder="请输入文字" placeholder-class="usrplace" />
</view>
</view>
@ -560,6 +570,11 @@
},
methods: {
prevPage() {
uni.navigateBack({
})
},
deviceRecovry(res) {
if (this.Status.pageHide) {
return;
@ -679,20 +694,24 @@
});
},
gotoMap() {
let lnglat = lnglatConvert.wgs84_to_gcj02(this.formData.Lon, this.formData.Lat);
this.detailData.longitude = lnglat[0];
this.detailData.latitude = lnglat[1];
uni.navigateTo({
url: '/pages/common/map/index',
events: {
ack: function(data) {}
},
success: (res) => {
res.eventChannel.emit('Map', {
data: this.detailData
});
}
})
let promise = lnglatConvert.wgs84_to_gcj02(this.formData.Lon, this.formData.Lat);
promise.then(lnglat => {
this.detailData.longitude = lnglat[0];
this.detailData.latitude = lnglat[1];
uni.navigateTo({
url: '/pages/common/map/index',
events: {
ack: function(data) {}
},
success: (res) => {
res.eventChannel.emit('Map', {
data: this.detailData
});
}
})
});
},
getDetail() {
var that = this;
@ -799,7 +818,7 @@
return className;
},
handleRightClick: function(s, e) {
if (s === 0) {
console.log("消息");
uni.navigateTo({
@ -832,8 +851,8 @@
},
initMQ() {
return new Promise((resolve, reject) => {
return new Promise((resolve, reject) => {
if (mqttClient) {
// console.log("无需再次初始化")
resolve();
@ -869,7 +888,8 @@
if (keys.indexOf('sta_BreakNews') > -
1) { //紧急通知
if (json.sta_BreakNews ===
'I get it') // && this.Status.msgOkTime && this.Status.msgOkIntval){
'I get it'
) // && this.Status.msgOkTime && this.Status.msgOkIntval){
{
these.showPop({
showPop: true,
@ -973,9 +993,9 @@
if ("sta_SOSGrade" in json) {
let sosText = json.sta_SOSGrade === 2 ? 'rb' : json.sta_SOSGrade === 1 ? "sg" : "close";
receiveData.SOS = sosText;
receiveData.qzwarn=sosText==='sg';
receiveData.qzwarn = sosText === 'sg';
}
if ("sta_ShakeBit" in json) {
@ -1059,14 +1079,14 @@
if (this.formData.imei) {
this.initMQ();
}
let msgs=[];
if(this.formData.qzwarn){
let msgs = [];
if (this.formData.qzwarn) {
msgs.push("设备强制报警中");
}
if (this.formData.staticWarn) { //有静止报警
msgs.push("设备静止报警中");
}
if(msgs.length>0){
if (msgs.length > 0) {
this.showPop({
message: msgs.join(";"),
iconUrl: "/static/images/6155/DeviceDetail/warnning.png",
@ -1076,7 +1096,7 @@
clickEvt: "staticWarn"
});
}
this.setBleFormData();
},
@ -3320,4 +3340,13 @@
.net.active {
background: #FFFFFF !important;
}
.navbarRight .img{
width: 35rpx;
height: 35rpx;
margin-right: 20rpx;
}
.uni-navbar--fixed{
top:0rpx;
}
</style>

View File

@ -483,8 +483,9 @@
if (this.Status.pageHide) {
return;
}
let json = recei.ReceiveData(receive, device, path, recArr);
console.log("收到消息:",receive.hexs);
if (!json) {
return;
}

View File

@ -293,29 +293,42 @@
},
updateBleStatu(deviceId) { //更新列表的蓝牙连接状态
updateBleStatu() { //更新列表的蓝牙连接状态,电池 电量
if (ble) {
for (var i = 0; i < this.deviceList.length; i++) {
let bleStatu = false;
let f=null;
if (ble.data && ble.data.LinkedList) {
ble.data.LinkedList.find(v => {
if (deviceId && v.deviceId != deviceId) {
return false;
}
f=ble.data.LinkedList.find(v => {
if (v.macAddress && v.device && v.device.id) {
if (v.device.id == this.deviceList[i].id && v.Linked) {
bleStatu = true;
return true;
}
return v.device.id == this.deviceList[i].id;
}
return false;
});
}
this.$set(this.deviceList[i], 'bleStatu', bleStatu);
if(f){
this.$set(this.deviceList[i], 'bleStatu', f.Linked);
if(f.formData){
let battary=0;
if('battary' in f.formData){
battary=f.formData.battary;
}
else if('sta_PowerPercent' in f.formData){
battary=f.formData.sta_PowerPercent;
}
else if('sta_battery' in f.formData){
battary=f.formData.sta_battery;
}
this.$set(this.deviceList[i], 'battery',battary);
}
}
}
@ -672,7 +685,7 @@
let url = item.detailPageUrl;
// console.log("url=",url);
// if(!url){
//url="/pages/670/HBY670"
// url="/pages/6075/BJQ6075"
// }
uni.navigateTo({
url: url,
@ -718,6 +731,13 @@
.filter(Boolean);
},
},
onShow(){
if(ble){
//因为vue视图只能后退不能隐藏后再显示
//所以回到首页后将其他所有页面的订阅都删除
ble.removeAllCallbackByRetain(pagePath);
}
},
onLoad() {
console.error("首页加载");
this.getTab()
@ -757,6 +777,11 @@
console.error("蓝牙适配器不可用的回调");
this.bleStateBreak();
},pagePath);
//接收到消息的回调
ble.addReceiveCallback((rec,f,path,arr)=>{
this.updateBleStatu();
},pagePath);
this.getSystemInfoSyncH();
},
@ -767,7 +792,7 @@
},
onUnload() {
uni.$off('deviceStatusUpdate');
ble && ble.removeAllCallback();
ble && ble.removeAllCallback(pagePath);
}
}