1
0
forked from dyf/APP
Files
APP/pages/210/HBY210.vue
2026-04-22 08:29:06 +08:00

2465 lines
55 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="maincontent contentBg">
<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 center">
<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 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>
</view>
<view class="rightTxt">
<view class="row">
<image class="img" src="/static/images/common/battry.png" mode="aspectFit"></image>
<view class="txt">
<view class="bigTxt">{{formData.sta_PowerPercent}}%</view>
<view class="smallTxt">电量</view>
</view>
</view>
</view>
</view>
<view class="eqinfo">
<view class="item">
<text class="lbl">设备名称</text>
<text class="value valueFont">{{device.deviceName}}</text>
</view>
<view class="item">
<text class="lbl">设备IMEI</text>
<text class="value">{{device.deviceImei}}</text>
</view>
<view class="item">
<text class="lbl">Mac地址</text>
<text class="value">{{device.deviceMac}}</text>
</view>
<view class="item">
<text class="lbl">蓝牙名称</text>
<text class="value valueFont">{{device.bluetoothName}}</text>
</view>
<view class="item" @click.top="bleStatuToggle">
<text class="lbl">蓝牙状态</text>
<text class="value" :class="formData.bleStatu?'green':'red'">{{getbleStatu}}</text>
</view>
<view class="item">
<text class="lbl">设备状态</text>
<text class="value valueFont">{{sta_system}}</text>
</view>
<view class="item">
<text class="lbl">定位信息</text>
<view class="multiValue" @click.stop="gotoMap()">
<view class="valueItem valueFont">
{{formData.sta_longitude}}
</view>
<view class="valueItem valueFont">
{{formData.sta_latitude}}
</view>
<view class="valueItem">
<view style="width:80%;float: right;text-align: right;" class="valueFont">
<uni-icons type="location" size="17" color="rgba(255, 255, 255, 0.8)"
style="vertical-align: bottom;" />
{{formData.address}}
</view>
<view class="clear"></view>
</view>
</view>
</view>
</view>
<view class="warnnig" :class="ShakeBit?'':'displayNone'">
<view>{{ShakeBit}}</view>
<view>{{AlarmTime}}</view>
<uni-icons type="closeempty" size="16" color="#FFFFFF" @click="CloseWarn()"></uni-icons>
</view>
<view class="lampMode">
<view class="mode " :class="{active:formData.sta_SOSGrade=='2'}" v-on:click.stop="sosSetting(2)">
<view class="leftImg">
<image v-show="formData.sta_SOSGrade!='2'" class="img" src="/static/images/670/rb.png"
mode="aspectFit"></image>
<image v-show="formData.sta_SOSGrade=='2'" class="img" src="/static/images/670/rbActive.png"
mode="aspectFit"></image>
</view>
<view class="rightTxt">
<text class="bigTxt">红蓝警示</text>
<text class="smallTxt">{{formData.sta_SOSGrade=='2'?'开启':'关闭'}}</text>
</view>
</view>
<view class="mode " :class="{active:formData.sta_SOSGrade=='1'}" v-on:click.stop="sosSetting(1)">
<view class="leftImg">
<image v-show="formData.sta_SOSGrade!='1'" class="img" src="/static/images/670/sg.png"
mode="aspectFit"></image>
<image v-show="formData.sta_SOSGrade=='1'" class="img" src="/static/images/670/sgActive.png"
mode="aspectFit"></image>
</view>
<view class="rightTxt">
<text class="bigTxt">声光报警</text>
<text class="smallTxt">{{formData.sta_SOSGrade=='1'?'开启':'关闭'}}</text>
</view>
</view>
<view class="mode " :class="{active:formData.sta_RadarType!=0}"
v-on:click.stop="showAction('BottomMenu')">
<view class="leftImg">
<image v-show="formData.sta_RadarType!=0" class="img" src="/static/images/102/redarActive.png"
mode="aspectFit"></image>
<image v-show="formData.sta_RadarType==0" class="img" src="/static/images/102/redar.png"
mode="aspectFit"></image>
</view>
<view class="rightTxt">
<text class="bigTxt">雷达感应</text>
<text class="smallTxt">{{formData.sta_RadarType==0?'关闭':formData.sta_RadarType+'M'}}</text>
</view>
</view>
<view class="mode " :class="{active:formData.sta_InfraRed=='1'}"
v-on:click.stop="toggleSetting(1,'InfraRed')">
<view class="leftImg">
<image v-show="formData.sta_InfraRed=='1'" class="img" src="/static/images/common/hongwaiActive.png"
mode="aspectFit"></image>
<image v-show="formData.sta_InfraRed!='1'" class="img" src="/static/images/common/hongwai.png"
mode="aspectFit"></image>
</view>
<view class="rightTxt">
<text class="bigTxt">红外感应</text>
<text class="smallTxt">{{formData.sta_InfraRed=='1'?'开启':'关闭'}}</text>
</view>
</view>
<view class="mode "
v-on:click.stop="showAction('PictureMenu')">
<view class="leftImg">
<image class="img" src="/static/images/6155/DeviceDetail/open.png"
mode="aspectFit"></image>
</view>
<view class="rightTxt">
<text class="bigTxt">开机画面</text>
</view>
</view>
</view>
<view class="usrinfo">
<view>
<text class="usrtitle fleft">人员信息登记</text>
<view class="btnSend fright" v-on:click.stop="sendUsr">发送</view>
<view class="clear"></view>
<TextToHexV1 class="TextToHex" ref="textToHex" :txts="formData.textLines" :bgColor="'#FFFFFF'"
:color="'#000000'" :fontSize="14" />
</view>
<view class="item">
<text class="lbl">单位</text>
<input class="value" v-model.trim="formData.textLines[0]" placeholder="请输入单位" maxlength="8"
placeholder-class="usrplace" />
</view>
<view class="item">
<text class="lbl">部门</text>
<input class="value" v-model.trim="formData.textLines[1]" placeholder="请输入姓名" maxlength="8"
placeholder-class="usrplace" />
</view>
<view class="item">
<text class="lbl">姓名</text>
<input class="value" v-model.trim="formData.textLines[2]" placeholder="请输入职位" maxlength="8"
placeholder-class="usrplace" />
</view>
<view class="item">
<text class="lbl">ID</text>
<input class="value" v-model.trim="formData.textLines[3]" placeholder="ID" maxlength="16"
placeholder-class="usrplace" />
</view>
</view>
<BottomSlideMenuPlus :config="Status.BottomMenu" @btnClick="btnClick" @itemClick="itemClick" @close="closeActionSheet"></BottomSlideMenuPlus>
<BottomSlideMenuPlus :config="Status.PictureMenu" @btnClick="btnPictureClick" @itemClick="itemPictureClick" @close="closeActionSheet"></BottomSlideMenuPlus>
<ProParams :id="device.id"></ProParams>
<MsgBox ref="msgPop" />
<global-loading ref="loading" />
</view>
</template>
<script>
import usrApi from '@/api/670/HBY670.js';
import TextToHexV1 from '@/components/TextToHex/TextToHexV1.vue';
import request, {
baseURL
} from '@/utils/request.js';
import {
showLoading,
hideLoading,
updateLoading
} from '@/utils/loading.js';
import {
MsgSuccess,
MsgError,
MsgClose,
MsgWarning,
showPop,
MsgInfo
} from '@/utils/MsgPops.js'
import Common from '@/utils/Common.js';
import BleTool from '@/utils/BleHelper.js'
import BleReceive from '@/utils/BleReceive';
var eventChannel = null;
var these = null;
var ble = null;
var recei = null;
var mq = null;
var pagePath = "/pages/210/HBY210";
export default {
components: {
TextToHexV1
},
data() {
return {
Status: {
msgOkIntval: null, //紧急通知等待的时间
msgOkTime: null, //
pageHide: false,
apiType: "listA",
navbar: {
icons: [{
src: '/static/images/common/msg.png'
},
{
src: '/static/images/common/shape.png'
}
],
title: 'HBY210',
showBack: true,
height: 90
},
usrToggle: true,
bleLinkCnt: 0,
PictureMenu:{
show: false,
showHeader: true,
menuItems: [{
text: '照片',
value: 'img',
icon: ''
},
{
text: '视频',
value: 'video',
icon: ''
}
],
activeIndex: -1,
bgColor: '#2a2a2a',
itemBgColor: '#3a3a3a',
textColor: '#ffffffde',
textAlign: 'flex-start',
title: '开机画面',
showDivider: false,
dividerColor: '#00000000',
dividerThickness: '0rpx',
dividerMargin: '10rpx',
itemHeight: '80rpx',
type: '',
showBtn: true,
btnBgColor: "#bbe600",
btnText: "确定",
btnTextColor: "#232323de",
showMask: true,
maskBgColor: '#00000066',
showClose: false
},
BottomMenu: {
show: false,
showHeader: true,
menuItems: [{
text: '2M',
value: 2,
icon: ''
},
{
text: '4M',
value: 4,
icon: ''
},
{
text: '7M',
value: 7,
icon: ''
},
{
text: '10M',
value: 10,
icon: ''
},
{
text: '关闭',
value: 0,
icon: ''
}
],
activeIndex: -1,
bgColor: '#2a2a2a',
itemBgColor: '#3a3a3a',
textColor: '#ffffffde',
textAlign: 'flex-start',
title: '雷达设置',
showDivider: false,
dividerColor: '#00000000',
dividerThickness: '0rpx',
dividerMargin: '10rpx',
itemHeight: '80rpx',
type: '',
showBtn: true,
btnBgColor: "#bbe600",
btnText: "确定",
btnTextColor: "#232323de",
showMask: true,
maskBgColor: '#00000066',
showClose: false
}
},
formData: {
img: '/static/images/common/HBY210.png',
address: "", //地址
company: "湖北消防总队", //单位
usrname: "胡红军", //姓名
job: "中队长", //职位
usrid: "", //id
deviceId: "",
bleStatu: false,
sta_AlarmTime:0,
sta_PowerPercent: "",
sta_PowerTime: "",
sta_SOSGrade:0,
sta_longitude: "",
sta_latitude: "",
sta_system: "", //设备状态0关机1仅充电2开机未充电,3开机且充电
sta_RadarType: "",
sta_ShakeBit: 0, //报警状态
sta_InfraRed:0,
textLines: ['湖北星汉文化', '有限', '公司','12345678']
},
device: {
id: "",
deviceName: "",
deviceImei: "",
deviceMac: "",
communicationMode: 0,
devicePic: "",
typeName: "",
bluetoothName: null,
deviceStatus: null,
bindingTime: "",
onlineStatus: 0,
battery: "0",
latitude: null,
longitude: null,
alarmStatus: null,
detailPageUrl: "/pages/008A/HBY008A",
showConfirm: false
},
permissions: [],
inteval:80
}
},
computed: {
AlarmTime(){
if(this.formData.sta_AlarmTime){
return Common.formatTime(this.formData.sta_AlarmTime,"second");
}
return "";
},
ShakeBit() {
//"sta_ShakeBit":0-未报警1-强制报警2静止报警3撞击报警4雷达报警5漏电报警6触水报警7红外报警
let dic = {
"0": "",
"1": "设备强制报警中",
"2": "设备静止报警中",
"3": "设备疑似受到撞击",
"4": "设备雷达报警中",
"5": "设监测到漏电",
"6": "设备触水报警中",
"7": "红外闯入报警中"
};
let keys = Object.keys(dic);
let f = keys.find(v => {
return v == this.formData.sta_ShakeBit;
});
if (f) {
let str= dic[f]
return str;
}
return "";
},
getbleStatu() {
if (this.formData.bleStatu === true) {
return '已连接';
}
if (this.formData.bleStatu === 'connecting') {
return '连接中';
}
if (this.formData.bleStatu === 'dicconnect') {
return '正在断开';
}
if (this.formData.bleStatu === 'err') {
return '连接异常';
}
return '未连接';
},
sta_system() {
//0关机1仅充电2开机未充电,3开机且充电
if (this.formData.sta_system == '0') {
return '已关机'
}
if (this.formData.sta_system == '1') {
return '仅充电'
}
if (this.formData.sta_system == '2') {
return '开机未充电'
}
if (this.formData.sta_system == '3') {
return '开机充电中'
}
}
},
created() {
this.Status.navbar.height = uni.getSystemInfoSync().statusBarHeight + 20;
},
onUnload() {
console.log("页面卸载,释放资源");
let statusTopic = `A/${this.formData.imei?this.formData.imei:this.device.deviceImei}`;
if (ble) {
ble.removeAllCallback(pagePath);
ble.removeReceiveCallback(pagePath);
}
if (mq) {
mq.unsubscribe(statusTopic);
mq.disconnect();
mq = null;
}
},
onShow() {
this.Status.pageHide = false;
let f = this.getDevice();
if (!f) {
this.showBleUnConnect();
return;
}
},
onHide: function() {
this.Status.pageHide = true;
},
onLoad() {
these = this;
recei = BleReceive.getBleReceive();
ble = BleTool.getBleTool();
ble.addReceiveCallback(these.bleValueNotify, pagePath);
ble.addStateBreakCallback(these.bleStateBreak, pagePath);
ble.addStateRecoveryCallback(these.bleStateRecovry, pagePath);
ble.addDisposeCallback(these.deviceDispose, pagePath);
ble.addRecoveryCallback(these.deviceRecovry, pagePath);
eventChannel = this.getOpenerEventChannel();
eventChannel.on('detailData', function(data) {
console.log("收到父页面的参数:" + JSON.stringify(data));
var device = data.data;
these.Status.apiType = data.apiType;
these.device = device;
these.formData.usrid = device.deviceImei;
if (data.apiType !== 'listA') {
Common.getdeviceShareId(data.data.id).then(res => {
if (res.code == 200) {
if (res.data.permission) {
these.permissions = res.data.permission.split(',');
}
}
});
}
if (these.device.deviceImei) {
these.initMQ();
}
let f = ble.data.LinkedList.find((v) => {
if (v.macAddress == device.deviceMac) {
console.log("找到设备了", v);
these.formData.deviceId = v.deviceId;
return true;
}
return false;
});
if (!f) {
these.showBleUnConnect();
// these.getDetail();
return;
}
let form = f.formData;
if (form) {
let keys = Object.keys(form);
for (var i = keys.length; i >= 0; i--) {
let key = keys[i];
these.formData[key] = form[key];
}
}
if (these.formData['imei'] && !these.device.deviceImei) {
these.initMQ();
} else if (these.device.deviceImei) {
these.formData['imei'] = these.device.deviceImei;
}
// these.getDetail();
these.formData.bleStatu = 'connecting';
ble.LinkBlue(f.deviceId, f.writeServiceId, f.wirteCharactId, f.notifyCharactId).then(res => {
these.formData.bleStatu = true;
}).catch(ex => {
these.formData.bleStatu = 'err';
MsgError("连接错误:" + ex.msg, "确定", these);
});
});
},
methods: {
showAction(type){
if(type=='BottomMenu'){
this.Status.BottomMenu.show = true;
this.Status.PictureMenu.show=false;
this.Status.BottomMenu.menuItems.find((v,i)=>{
if(this.formData.sta_RadarType==v.value){
this.Status.BottomMenu.activeIndex=i;
return true;
}
}) ;
}else{
this.Status.PictureMenu.show=true;
this.Status.BottomMenu.show = false;
}
},
btnPictureClick(li,i){
let f = this.getDevice();
if (!f) {
this.showBleUnConnect();
return;
}
this.Status.PictureMenu.show = false;
console.log("li=",li)
if (li.value == 'img') {
//照片
these.sendImg();
} else {
//视频
these.checkSendVideo();
}
},
checkSendVideo() {
if (!this.permissions.includes('3') && this.Status.apiType !== 'listA') {
MsgError('无操作权限', '确定', these);
return;
}
let f = this.getDevice();
let timeDelayCloseLoading = () => {
setTimeout(() => {
hideLoading(these);
}, 1500);
}
let sendVideoPackets = (ReSendNo) => {
console.log("开始发送分片数据");
return new Promise((resolve, reject) => {
if (f) {
// 总数据包数
var totalPackets = 1536; //36;
let currentPacket = 1;
console.log("发送数据准备中,总共" + totalPackets);
if (ReSendNo) {
totalPackets = ReSendNo;
currentPacket = ReSendNo;
}
this.totalPackets = totalPackets;
// 发送单个数据包
const sendNextVideoPacket = () => {
// console.log("准备发送一段数据");
if (currentPacket > totalPackets) {
if (!ReSendNo) {
setTimeout(() => {
ble.sendString(f.deviceId, "transmit complete", f
.writeServiceId, f.wirteCharactId, 20)
.then(
() => {
console.log("全部发送完毕")
}).catch((ex) => {
console.log("出现异常", ex);
});
}, 500);
}
hideLoading(these);
showPop({
showPop: true,
message: "上传成功",
iconUrl: "/static/images/common/success.png"
}, these);
these.videoHexArray = null;
resolve();
return;
}
// 计算当前包的数据
let packetSize = 500;
// 创建数据包
const startIndex = (currentPacket - 1) * packetSize;
const endIndex = Math.min(startIndex + packetSize, these.videoHexArray
.length);
if (startIndex > endIndex) {
resolve();
return;
}
////console.log("111111");
const packetData = these.videoHexArray.slice(startIndex, endIndex);
// 构建数据包
////console.log("packetData.length"+packetData.length);
const bufferSize = 504; // 头部5字节 + 数据部分
const buffer = new ArrayBuffer(bufferSize);
const dataView = new DataView(buffer);
let sortNo = currentPacket.toString(16).padStart(4, '0');
// 填充头部
dataView.setUint8(0, 0x55); // 帧头
dataView.setUint8(1, 0x04); // 帧类型:开机画面
dataView.setUint8(2, '0x' + sortNo.substring(0, 2)); // 包序号
dataView.setUint8(3, '0x' + sortNo.substring(2, 4)); // 包序号
// dataView.setUint8(4, 0x01);
// dataView.setUint8(5, 0xF4);
for (let i = 0; i < packetData.length; i++) {
dataView.setUint8(4 + i, '0x' + packetData[i]);
}
let inteval = 60;
ble.sendData(f.deviceId, buffer, f.writeServiceId, f
.wirteCharactId, 10).then(() => {
updateLoading(these, {
text: "正在发送:" + currentPacket + "/" +
totalPackets
});
currentPacket++;
// console.log("发送一段成功,发送下一段");
setTimeout(sendNextVideoPacket, inteval);
}).catch(err => {
console.log("发送失败了", err);
if (err.code == '10007') { //遇到这个错误自动重新发送
console.log(err.errMsg + ",发送失败了,正在补偿:" +
currentPacket);
setTimeout(sendNextVideoPacket, 800);
} else {
hideLoading(these);
showPop({
showPop: true,
message: err.msg + ",发送失败了",
borderColor: "#e034344d",
buttonBgColor: "#E03434",
buttonText: "确定",
iconUrl: "/static/images/common/uploadErr.png"
}, these);
reject(err);
these.videoHexArray = null;
return;
}
});
};
sendNextVideoPacket();
} else {
console.log("Fail.......")
}
});
}
var sendVideo = (videoPath) => {
let uploadVideo = () => {
these.videoHexArray = [];
console.log("开始处理,正在上传");
showLoading(these, {
text: "上传中"
});
let p1 = new Promise((resolve, reject) => {
ble.sendString(f.deviceId, "video transmit start", f
.writeServiceId, f.wirteCharactId).then(res => {
setTimeout(() => {
console.log("握手成功了");
resolve(true);
}, 2200)
}).catch(ex => {
reject(ex);
});
});
let p2 = new Promise((succ, err) => {
const token = uni.getStorageSync('token');
const clientid = uni.getStorageSync('clientID');
if (!token) {
err({
code: 401,
msg: "请先登陆后再试"
});
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",
filePath: videoPath,
name: 'file',
header: {
"Method": "POST",
"Content-Type": "multipart/form-data",
"Authorization": 'Bearer ' + token,
"clientid": clientid
},
timeout: 600000,
fail: (ex) => {
console.log("上传视频失败" + JSON.stringify(ex));
err(ex);
},
success: (res) => {
console.log("上传完成,向蓝牙设备发送");
succ(res);
}
});
});
Promise.all([p1, p2]).then((arr) => {
if (arr[0].status == 'rejected') {
MsgError("设备准备未就绪,请重试",'',these);
return;
}
if(arr[1].status== 'rejected'){
MsgError("读取视频失败",'',these);
return;
}
let res = arr[1];
// console.log("11111111111111111111111",res);
res = JSON.parse(res.data);
// console.log("22222222222222222222");
if (res.data) {
these.videoHexArray = res.data;
updateLoading(these, {
text: "正在发送:0/1536"
});
shotVideoClick(res.data);
} else {
console.log("服务器未返回正确的数据");
showPop({
message: "与服务器连接出现异常,请检查网络设置",
iconUrl: "/static/images/common/uploadErr.png",
borderColor: "#e034344d",
buttonBgColor: "#E03434",
}, these);
}
}).catch((ex) => {
console.log("出现异常,", ex)
hideLoading(these);
showPop({
message: "出现异常," + ex.msg,
iconUrl: "/static/images/common/uploadErr.png",
borderColor: "#e034344d",
buttonBgColor: "#E03434",
}, these);
})
}
let shotVideoClick = () => {
console.log("正在开始发送");
sendVideoPackets().then(() => {
console.log("发送完成");
}).catch((ex1) => {
//console.log("出现了异常", ex1)
}).finally(() => {
hideLoading(these);
});
}
uploadVideo();
}
uni.chooseVideo({
sourceType: ['album'],
compressed: false, // 关闭视频压缩,确保上传原始文件
success: function(res) {
console.log("res=", res);
let path = res.tempFilePath;
// iOS可能返回浮点数需要转换为整数进行比较
let width = Math.round(res.width);
let height = Math.round(res.height);
let duration = res.duration;
// 获取平台信息
const systemInfo = uni.getSystemInfoSync();
const platform = systemInfo.platform;
const isIOS = platform === 'ios';
console.log("平台:", platform, "uni.chooseVideo返回 - 宽度:", width, "高度:", height,
"时长:", duration);
// iOS特殊处理如果返回的是80*40很可能是160*80的一半iOS的bug
if (isIOS && width === 80 && height === 40) {
console.log("检测到iOS特殊情况返回80*40实际应该是160*80进行修正");
width = 160;
height = 80;
}
// 检查分辨率是否符合要求
let checkResolution = (w, h) => {
// 使用容差比较允许1像素的误差
return Math.abs(w - 160) <= 1 && Math.abs(h - 80) <= 1;
};
let err = [];
if (duration < 2) {
err.push("视频时长至少2秒");
}
if (!checkResolution(width, height)) {
err.push("视频宽高必须是160*80当前分辨率" + width + "*" + height);
}
if (err.length > 0) {
err = err.join(";");
showPop({
message: err,
iconUrl: "/static/images/common/uploadErr.png",
borderColor: "#e034344d",
buttonBgColor: "#E03434",
}, these);
return;
}
showLoading(these, {
text: '正在上传'
});
setTimeout(() => {
sendVideo(path);
}, 0);
}
});
},
sendImg() {
if (!this.permissions.includes('3') && this.Status.apiType !== 'listA') {
MsgError('无操作权限', '确定', these);
return;
}
let f = this.getDevice();
var sendImagePackets = function(ReSendNo) {
return new Promise((resolve, reject) => {
// 总数据包数
let totalPackets = 52;
let currentPacket = 1;
if (ReSendNo) {
totalPackets = ReSendNo;
currentPacket = ReSendNo;
}
if (f) {
// 发送单个数据包
const sendNextPacket = () => {
if (currentPacket > totalPackets) {
hideLoading(these);
these.closeAction();
showPop({
showPop: true,
message: "上传成功",
iconUrl: "/static/images/common/success.png",
});
setTimeout(() => {
ble.sendString(f.deviceId, "transmit complete", f
.writeServiceId, f
.wirteCharactId);
}, 1000);
these.rgb565Data = null;
resolve();
return;
}
// 计算当前包的数据
let packetSize = 250;
// if (currentPacket <= 51) {
// packetSize = 250; // 前51个包每个500字节
// } else {
// packetSize = 50; // 最后一个包100字节
// }
// 创建数据包
const startIndex = (currentPacket - 1) * packetSize;
const endIndex = Math.min(startIndex + packetSize, these.rgb565Data
.length);
if (startIndex > endIndex) {
return;
}
const packetData = these.rgb565Data.slice(startIndex,
endIndex);
// 构建数据包
const bufferSize = 505; // 5 + packetData.length * 2; // 头部5字节 + 数据部分
const buffer = new ArrayBuffer(bufferSize);
const dataView = new DataView(buffer);
// 填充头部
dataView.setUint8(0, 0x55); // 帧头
dataView.setUint8(1, 0x02); // 帧类型:开机画面
dataView.setUint8(2, '0x' + currentPacket.toString(16).padStart(2,
'0')); // 包序号
dataView.setUint16(3, packetData.length*2,false); // 包t长度
// 填充数据每个RGB565值占2字节
for (let i = 0; i < packetData.length; i++) {
dataView.setUint16(5 + i * 2, packetData[i], false); // 大端字节序
}
//发送数据包
ble.sendData(f.deviceId, buffer, f.writeServiceId, f.wirteCharactId,
10)
.then(() => {
updateLoading(these, {
text: "正在发送:" + currentPacket + "/" +
totalPackets
})
currentPacket++;
setTimeout(sendNextPacket, these.inteval);
}).catch(err => {
console.log("发送数据包失败了" + JSON.stringify(err));
if (err.code == '10007') {
setTimeout(sendNextPacket, these.inteval);
return;
}
these.closeAction();
showPop({
message: err.msg,
iconUrl: "/static/images/common/uploadErr.png",
borderColor: "#e034344d",
buttonBgColor: "#E03434",
});
hideLoading(these);
these.rgb565Data = null;
reject(err);
});
}
if (ReSendNo) {
sendNextPacket(ReSendNo);
return;
}
// 开始牵手
ble.sendString(f.deviceId, "picture transmit start", f.writeServiceId,
f.wirteCharactId).then(() => {
setTimeout(sendNextPacket, 120);
}).catch((err) => {
console.log("握手没有成功");
showPop({
message: err.msg,
iconUrl: "/static/images/common/uploadErr.png",
borderColor: "#e034344d",
buttonBgColor: "#E03434",
});
hideLoading(these);
reject(err);
});
}
});
}
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album','camera'],
success: function(res) {
uni.navigateTo({
url: "/pages/common/ImgCrop/ImgCrop",
events: {
ImgCutOver: function(data) {
showLoading(these, {
text: "正在发送0/52"
});
these.rgb565Data = Common.convertToRGB565(data.piexls);
setTimeout(function() {
sendImagePackets().catch(() => {
});
}, 0)
}
},
success(ev) {
ev.eventChannel.emit('checkImg', {
data: res.tempFiles[0].path
})
},
fail(ex) {
console.log("跳转页面失败" + JSON.stringify(ex));
}
});
}
});
},
btnClick(){
let f = this.getDevice();
if (!f) {
this.showBleUnConnect();
return;
}
this.Status.BottomMenu.show = false;
let d=this.Status.BottomMenu.menuItems[this.Status.BottomMenu.activeIndex];
let bleSend = () => {
let json = {ins_RadarType:d.value};
json = JSON.stringify(json);
if (ble) {
ble.sendString(f.deviceId, json).then(res => {
console.log("ble send success")
this.formData.sta_RadarType = d.value;
}).catch(ex => {
this.mqSend(json);
});
}
}
bleSend();
},
itemClick(item, index) {
this.Status.BottomMenu.activeIndex=index;
},
itemPictureClick(item,index){
this.Status.PictureMenu.activeIndex=index;
},
closeActionSheet() {
this.Status.BottomMenu.show = false;
this.Status.PictureMenu.show=false;
},
sendUsr() {
if (!this.permissions.includes('4') && this.Status.apiType !== 'listA') {
MsgError('无操作权限', '', these);
return;
}
let f = this.getDevice();
if (!f) {
these.showBleUnConnect()
return;
}
let toByteValue = (value) => {
if (typeof value === 'number') {
return value;
}
if (typeof value === 'string') {
if (value.startsWith('0x') || value.startsWith('0X')) {
return parseInt(value, 16);
}
return parseInt(`0x${value}`, 16);
}
return 0;
}
let err = false;
this.formData.textLines.find((txt) => {
if (txt.length === 0) {
console.log("txt=", txt);
err = true;
return true;
}
return false;
})
if (err) {
MsgError('单位、部门、姓名、ID必须填写', '', these);
return;
}
showLoading(these, {
text: "请稍候..."
});
//握手
let holdHand = () => {
return new Promise((resolve, reject) => {
updateLoading(these, {
text: '设备准备中...'
})
let hexs = 'word transmit start';
ble.sendString(f.deviceId, hexs, f.writeServiceId, f.wirteCharactId, 10).then(res => {
setTimeout(() => {
resolve(res)
}, 2200);
}).catch(ex => {
reject(ex)
});
});
}
//画图
let drawText = () => {
return new Promise((resolve, reject) => {
this.$refs.textToHex.drawAndGetPixels().then(allPixels => {
if (!allPixels) {
reject("文本初始化失败");
return;
}
resolve(allPixels);
}).catch(compEx => {
reject(compEx);
});
});
}
//发送3个分包的数据
let task = (allPixels) => {
try {
let combinedData = [];
for (let i = 0; i < this.formData.textLines.length; i++) {
let linePixels = (allPixels[i] || []).flat(Infinity).map(item =>
typeof item === 'string' ? toByteValue(item) : item
);
for (var j = linePixels.length; j < 256; j++) {
linePixels.push(0x00);
}
combinedData.push([0xFA, 0x06, i + 1, 1].concat(linePixels.slice(0, 128)));
combinedData.push([0xFA, 0x06, i + 1, 2].concat(linePixels.slice(128, 256)));
}
combinedData.push([0x74, 0x72, 0x61, 0x6E, 0x73, 0x6D, 0x69, 0x74, 0x20, 0x63, 0x6F, 0x6D,
0x70, 0x6C, 0x65, 0x74, 0x65
]);
let curr = 1;
let len = combinedData.length;
console.log(combinedData);
showLoading(these, {
text: '正在发送' + (curr - 1) + '/' + len
});
//分包发送
let sendPacket = () => {
if (combinedData.length === curr - 1) {
these.setBleFormData();
MsgSuccess("发送成功", '', these);
let json = {
deviceId: these.device.id,
name: these.formData.textLines[1],
position: these.formData.textLines[0],
unitName: these.formData.textLines[2],
code: ""
};
usrApi.sendUsr(json);
hideLoading(these);
return;
}
let array = combinedData[curr - 1];
ble.sendHexs(f.deviceId, array, f.writeServiceId, f.wirteCharactId, 10).then(
res => {
updateLoading(these, {
text: '正在发送' + curr + '/' + len
});
curr++;
setTimeout(sendPacket, 300);
}).catch(err => {
if (err.code == '10007') {
setTimeout(sendPacket, 300);
} else {
console.log("err:", err);
hideLoading(these);
MsgError("发送失败: " + (err.msg || err.message), '', these)
}
});
}
setTimeout(sendPacket, 0);
// 5. 发送成功处理
} catch (ex) {
hideLoading(these);
MsgError("发送失败: " + (ex.msg || ex.message), '', these);
}
}
setTimeout(() => {
Promise.allSettled([holdHand(), drawText()]).then(results => {
console.log("results=", results)
if (results[0].status == 'rejected') {
updateLoading(these, {
text: results[0].reason
});
setTimeout(() => {
hideLoading(these)
}, 500);
return;
}
if (results[1].status == 'rejected') {
updateLoading(these, {
text: results[1].reason
})
setTimeout(() => {
hideLoading(these)
}, 500);
return;
}
task(results[1].value);
})
}, 0);
},
toggleSetting(val, type) {
let f = this.getDevice();
if (!f) {
this.showBleUnConnect();
return;
}
let sta_type = "sta_" + type;
let newVal = null;
if (val == this.formData[sta_type]) {
newVal = 0;
} else {
newVal = val;
}
let bleSend = () => {
let json = {};
json['ins_' + type] = newVal
json = JSON.stringify(json);
if (ble) {
ble.sendString(f.deviceId, json).then(res => {
console.log("send success")
this.formData[sta_type] = newVal;
}).catch(ex => {
this.mqSend(json);
});
}
}
bleSend();
},
CloseWarn(){
let f = this.getDevice();
// #ifdef APP
if (!f) {
this.showBleUnConnect();
return;
}
// #endif
// #ifdef WEB
f={deviceId:12345}
// #endif
let bleSend = () => {
let json = {
ins_ShakeBit: 0
};
json = JSON.stringify(json);
if (ble) {
ble.sendString(f.deviceId, json).then(res => {
this.formData.sta_ShakeBit = 0;
this.formData.sta_InfraRed=0;
}).catch(ex => {
this.mqSend(json);
this.formData.sta_ShakeBit = 0;
this.formData.sta_InfraRed=0;
});
}
}
MsgError('确定解除报警?', '', these, bleSend);
},
sosSetting(val) {
let f = this.getDevice();
if (!f) {
this.showBleUnConnect();
return;
}
let newVal = null;
if (val == this.formData.sta_SOSGrade) {
newVal = 0;
} else {
newVal = val;
}
let msg = "";
if (newVal == 0 && this.formData.sta_SOSGrade == 1) {
msg = "确定解除声光报警?";
} else if (newVal == 1) {
msg = "确定开启声光报警?";
}
let bleSend = () => {
let json = {
ins_SOSGrade: newVal
};
json = JSON.stringify(json);
if (ble) {
ble.sendString(f.deviceId, json).then(res => {
this.formData.sta_SOSGrade = newVal;
}).catch(ex => {
this.mqSend(json);
this.formData.sta_SOSGrade = newVal;
});
}
}
if (msg) {
MsgError(msg, '', these, () => {
bleSend();
});
} else {
bleSend();
}
},
getDevice: function() {
let f = ble.data.LinkedList.find((v) => {
if (v.macAddress == these.device.deviceMac) {
if (!this.formData.deviceId) {
this.formData.deviceId = v.deviceId
};
return true;
}
});
return f;
},
bleStatuToggle() {
let f = this.getDevice();
if (!f) {
this.showBleUnConnect();
return;
}
if (this.formData.bleStatu === true) {
this.formData.bleStatu = 'dicconnect';
ble.disconnectDevice(f.deviceId).finally(r => {
this.formData.bleStatu = false;
});
return;
}
if (this.formData.bleStatu === false || this.formData.bleStatu === 'err') {
this.formData.bleStatu = 'connecting';
ble.LinkBlue(f.deviceId, f.writeServiceId, f.wirteCharactId, f.notifyCharactId).then(res => {
these.formData.bleStatu = true;
}).catch(ex => {
these.formData.bleStatu = 'err';
MsgError("连接错误:" + ex.msg, "确定", these);
});
return;
}
},
mqSend(json) {
if (mq) {
mq.publish("B/" + this.device.deviceImei, json).then(res => {
let keys = Object.keys(JSON.parse(json));
for (let i = 0; i < keys.length; i++) {
let key = keys[i];
let state = key.replace('ins_', 'sta_');
this.formData[state] = json[key];
}
}).catch(ex => {
});
}
},
showBleUnConnect() {
MsgError("蓝牙未连接过该设备,请使用蓝牙重新添加该设备", '去连接', this, () => {
uni.navigateTo({
url: "/pages/common/addBLE/addEquip",
events: {
BindOver: function(data) {
console.log(data)
these.formData.bleStatu = true;
}
},
success: function(res) {
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit('detailData', {
data: these.device
})
}
})
})
},
initMQ() {
return new Promise((resolve, reject) => {
if (mq) {
resolve();
return;
}
console.log("正在初始化MQtt")
mq = new MqttClient();
mq.connect(() => {
console.log("连接成功,开始订阅消息")
// 订阅来自设备的状态更新
const statusTopic =
`A/${this.formData.imei?this.formData.imei:this.device.deviceImei}`;
mq.subscribe(statusTopic, (payload, receive) => {
console.log("mq收到消息", payload)
let json = JSON.parse(payload);
this.receivData(json);
});
resolve();
});
});
},
bleValueNotify: function(receive, device, path, recArr) { //订阅消息
if (receive.deviceId !== this.formData.deviceId) {
return;
}
let data = recei.ReceiveData(receive, device, pagePath, recArr);
console.log("蓝牙收到消息", data)
this.receivData(data);
},
receivData(data) { //处理蓝牙/MQ的数据
let keys = Object.keys(data);
keys.forEach(key => {
this.formData[key] = data[key];
});
this.setBleFormData();
},
setBleFormData() {
let f = ble.data.LinkedList.find((v) => {
if (v.deviceId == these.formData.deviceId) {
v.formData = these.formData;
return true;
}
return false;
});
if (f) {
uni.setStorageSync(ble.StorageKey, ble.data.LinkedList);
}
},
deviceRecovry(res) {
if (this.Status.pageHide) {
return;
}
if (res.deviceId == these.formData.deviceId) {
this.formData.bleStatu = true;
setTimeout(() => {
hideLoading(these, 1000);
});
uni.showToast({
icon: 'success',
title: '蓝牙连接成功'
});
}
},
deviceDispose(res) {
if (this.Status.pageHide) {
return;
}
if (res.deviceId == these.formData.deviceId) {
if (res.device) {
these.formData.bleStatu = 'connecting';
} else {
this.formData.bleStatu = false;
}
setTimeout(() => {
hideLoading(these, 1000);
});
uni.showToast({
icon: 'fail',
title: '蓝牙连接已断开'
});
}
},
bleStateBreak() {
if (this.Status.pageHide) {
return;
}
//蓝牙适配器不可用
this.formData.bleStatu = false;
uni.showToast({
icon: 'fail',
title: '蓝牙已不可用'
})
hideLoading(this);
},
bleStateRecovry() {
console.log("蓝牙可用");
if (this.Status.pageHide) {
return;
}
console.log("蓝牙可用");
//蓝牙适配器再次可用,尝试恢复连接
showLoading(this, {
text: "蓝牙恢复可用,正在连接设备"
});
this.formData.bleStatu = 'connecting';
ble.LinkBlue(these.formData.deviceId).then(() => {
these.formData.bleStatu = true;
updateLoading(these, {
text: '连接成功'
});
}).catch(ex => {
updateLoading(these, {
text: ex.msg
})
these.formData.bleStatu = 'err';
MsgError("连接错误:" + ex.msg, "确定", these);
}).finally(() => {
setTimeout(() => {
hideLoading(these);
}, 1000);
});
},
prevPage() {
uni.navigateBack({
});
},
handleRightClick: function(s, e) {
if (s === 0) {
return;
} else if (s === 1) {
console.log("分享");
uni.navigateTo({
url: '/pages/common/share/index',
events: {
ack: function(data) {}
},
success: (res) => {
let json = {
persissonType: '6075'
};
Object.assign(json, this.device);
res.eventChannel.emit('share', {
data: json
});
}
})
}
},
}
}
</script>
<style>
.content {
padding: 30rpx;
box-sizing: border-box;
}
.eq {
width: 100%;
height: 250rpx;
border-radius: 8px;
background: rgba(26, 26, 26, 1);
box-sizing: border-box;
padding: 24rpx 28rpx;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
margin-bottom: 24rpx;
}
.eq .leftImg {
box-sizing: border-box;
padding: 36rpx;
border-radius: 16rpx;
background: rgba(42, 42, 42, 0.5);
}
.eq .leftImg,
.eq .rightTxt {
width: 50%;
height: 100%;
}
.eq .rightTxt {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: flex-start;
justify-content: space-evenly;
align-items: flex-start;
}
.eq .leftImg .img {
width: 100%;
height: 100%;
}
.eq .rightTxt .img {
width: 52rpx;
height: 52rpx;
}
.eq .rightTxt .row {
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: flex-start;
align-items: center;
box-sizing: border-box;
padding-left: 50rpx;
}
.eq .rightTxt .row .txt {
padding-left: 20rpx;
}
.eq .bigTxt {
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
}
.eq .smallTxt {
color: rgba(255, 255, 255, 0.6);
font-family: PingFang SC;
font-size: 24rpx;
font-weight: 400;
}
.eqinfo {
border-radius: 16rpx;
background: rgba(26, 26, 26, 1);
box-sizing: border-box;
padding: 14rpx 0rpx;
}
.eqinfo .item {
width: 100%;
min-height: 60rpx;
height: auto;
line-height: 60rpx;
padding: 0rpx 28rpx;
box-sizing: border-box;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-between;
align-items: center;
}
.eqinfo .lbl {
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
width: 140rpx;
letter-spacing: 0.07px;
text-align: left;
}
.eqinfo .value {
color: rgba(255, 255, 255, 0.6);
font-family: 'PingFang SC';
font-size: 28rpx !important;
font-weight: 400;
letter-spacing: 0.07px;
text-align: left;
}
.eqinfo .valueFont {
font-family: 'PingFang SC';
font-size: 28rpx !important;
font-weight: 400;
color: rgba(255, 255, 255, 0.6);
}
.eqinfo .multiValue {
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: flex-end;
align-items: flex-end;
justify-content: flex-start;
width: calc(100% - 140rpx)
}
.eqinfo .valueItem {
height: auto;
line-height: 40rpx;
color: rgba(255, 255, 255, 0.6);
font-family: PingFang SC;
font-size: 14px;
font-weight: 400;
letter-spacing: 0.07px;
}
.lamp {
margin-top: 24rpx;
}
.lamp .title {
width: 100%;
height: 60rpx;
line-height: 60rpx;
padding: 0rpx 28rpx;
box-sizing: border-box;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-between;
align-items: center;
font-size: 28rpx;
}
.lampMode {
padding: 30rpx 0rpx;
width: 100%;
box-sizing: border-box;
display: flex;
align-content: space-around;
justify-content: space-between;
align-items: center;
justify-items: stretch;
flex-direction: row;
flex-wrap: wrap;
}
.lampMode .mode {
width: calc(calc(100% - 34rpx) / 2);
border-radius: 8px;
margin-top: 20rpx;
background: rgba(26, 26, 26, 1);
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
align-items: center;
justify-content: flex-start;
padding: 30rpx;
box-sizing: border-box;
border: 1rpx solid #00000000;
}
.lampMode .mode.active {
border: 1rpx solid rgba(174, 214, 0, 1) !important;
}
.lampMode .mode.active .bigTxt {
color: rgba(174, 214, 0, 1) !important;
}
.mode.marginLeft {
margin-left: 34rpx !important;
}
.mode .leftImg .img {
width: 70rpx;
height: 70rpx;
}
.mode .rightTxt {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: flex-start;
justify-content: center;
align-items: flex-start;
padding-left: 20rpx;
}
.mode .bigTxt {
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.07px;
}
.mode .smallTxt {
color: rgba(255, 255, 255, 0.6);
font-family: PingFang SC;
font-size: 24rpx;
font-weight: 400;
letter-spacing: 0.07px;
border: 1px solid #00000000;
}
.usrinfo {
border-radius: 8px;
width: 100%;
box-sizing: border-box;
padding: 24rpx 28rpx;
background: rgba(26, 26, 26, 1);
margin-bottom: 20rpx;
}
.usrtitle {
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
height: 40rpx;
line-height: 40rpx;
letter-spacing: 0.07px;
}
.usrinfo .btnSend {
line-height: 65rpx;
border-radius: 8px;
width: 120rpx;
height: 65rpx;
color: rgba(35, 35, 35, 0.87);
font-family: PingFang SC;
font-size: 24rpx;
font-weight: 400;
letter-spacing: 0.15rpx;
text-align: center;
background-color: #BBE600;
}
.usrinfo .item {
border-radius: 8px;
width: 100%;
box-sizing: border-box;
line-height: 90rpx;
height: 90rpx;
background: rgba(42, 42, 42, 1);
margin-top: 24rpx;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: flex-start;
align-items: center;
}
.usrinfo .lbl {
width: 120rpx;
height: 100%;
padding-left: 24rpx;
box-sizing: border-box;
text-align: right;
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.07px;
}
.usrinfo .value {
width: calc(100% - 120rpx);
height: 100%;
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.07px;
text-align: left;
}
.usrinfo .value .uni-input-input {
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
}
.usrplace {
color: rgba(255, 255, 255, 0.4);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.07px;
text-align: left;
}
.proinfo .itemcontent {
display: flex;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-evenly;
}
.proinfo .item {
width: 180rpx;
height: 180rpx;
box-sizing: border-box;
padding: 40rpx;
border-radius: 16rpx;
background: rgba(26, 26, 26, 1);
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
}
.proinfo .item .img {
width: 50rpx;
height: 50rpx;
}
.proinfo .item .txt {
color: rgba(255, 255, 255, 0.6);
font-family: PingFang SC;
font-size: 24rpx;
font-weight: 400;
margin-top: 20rpx;
letter-spacing: 0.07px;
text-align: left;
}
.slider-container {
padding: 0px;
}
.addIco {
width: 100%;
height: 360rpx;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
}
.icoContent {
width: 240rpx;
height: 240rpx;
border-radius: 8rpx;
background: rgba(58, 58, 58, 1);
}
.icoContent .img {
width: 70rpx;
height: 70rpx;
}
.modeSetting {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-around;
align-items: center;
border-radius: 8px;
background: rgba(26, 26, 26, 1);
box-sizing: border-box;
padding: 30rpx 0rpx;
}
.modeSetting .item {
width: 120rpx;
height: 120rpx;
background: rgba(42, 42, 42, 1);
border-radius: 50%;
color: rgba(255, 255, 255, 0.87);
font-family: PingFang SC;
font-size: 28rpx;
font-weight: 400;
line-height: 0px;
box-sizing: border-box;
}
.modeSetting .item.active {
border: 4rpx solid rgba(174, 214, 0, 1);
background: rgba(26, 26, 26, 1);
padding: 6rpx;
color: rgba(26, 26, 26, 0.87);
}
.modeSetting .item.active .p100 {
background: rgba(174, 214, 0, 1);
border-radius: 50%;
}
.usrinfo .image {
width: 30rpx;
height: 40rpx;
}
.usrinfo .img {
width: 30rpx;
height: 40rpx;
}
.content {
box-sizing: border-box;
width: 100%;
min-height: 100vh;
height: auto;
}
.contentBg {
background-color: #121212;
color: #ffffffde;
}
.fleft {
float: left;
}
.fright {
float: right;
}
.clear {
clear: both;
}
.displayNone {
display: none !important;
}
.p100 {
width: 100%;
height: 100%;
}
.center {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
}
.centerLeft {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: flex-start;
align-items: center;
}
.warnnig {
border-radius: 16rpx;
width: 100%;
height: 70rpx;
line-height: 70rpx;
background: rgba(224, 52, 52, 1);
box-sizing: border-box;
padding: 0rpx 30rpx;
margin-top: 20rpx;
color: rgba(255, 255, 255, 0.87);
font-family: 'PingFang SC';
font-size: 28rpx;
font-weight: 400;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-between;
align-items: center;
}
.optTitle {
color: rgba(255, 255, 255, 0.87);
font-family: 'PingFang SC';
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.14rpx;
text-align: left;
width: 100%;
box-sizing: border-box;
padding: 30rpx 0rpx 10rpx 30rpx;
}
.sosContent {
width: 100%;
height: 130rpx;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-between;
align-items: center;
}
.sosContent .item {
width: calc(calc(100% - 80rpx) / 2);
height: 100%;
box-sizing: border-box;
border-radius: 16rpx;
background: rgba(26, 26, 26, 1);
color: rgba(255, 255, 255, 0.87);
font-family: 'PingFang SC';
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.14rpx;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
}
.sosContent .item.active {
border: 1px solid rgba(224, 52, 52, 1);
color: rgba(224, 52, 52, 1);
}
.sosContent .imgContent {
width: 55rpx;
height: 55rpx;
background-color: #232323;
border-radius: 4rpx;
margin-right: 30rpx;
}
.sosContent .imgContent .img {
width: 70%;
height: 70%;
}
.sosContent .item.active .imgContent {
background-color: #E034340F;
}
.lightMode {
width: 100%;
height: 180rpx;
border-radius: 16rpx;
background: rgba(26, 26, 26, 1);
margin-bottom: 30rpx;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-between;
align-items: center;
}
.lightMode .item {
width: calc(calc(100% - 90rpx) / 3);
height: 100%;
box-sizing: border-box;
border-radius: 16rpx;
color: rgba(255, 255, 255, 0.87);
font-family: 'PingFang SC';
font-size: 28rpx;
font-weight: 400;
letter-spacing: 0.14rpx;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: space-evenly;
align-items: center;
}
.lightMode .item.active {
color: #AED600;
}
.lightMode .imgContent {
width: 80rpx;
height: 100rpx;
}
.lightMode .imgContent .img {
width: 100%;
height: 100%;
}
.picVideo .btnImg {
width: 100%;
height: 100rpx;
border-radius: 16rpx;
background: rgba(42, 42, 42, 1);
}
.picVideo .btnImg .img {
width: 40rpx;
height: 40rpx;
}
.netContent {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: flex-end;
justify-content: space-around;
align-items: flex-end;
width: 50rpx;
}
.net {
width: 7rpx;
background: rgba(255, 255, 255, 0.3);
}
.net.netone {
height: 11rpx;
}
.net.nettwo {
height: 17rpx;
}
.net.netsiri {
height: 23rpx;
}
.net.netfour {
height: 29rpx;
}
.net.netfive {
height: 35rpx;
}
.net.active {
background: #FFFFFF !important;
}
.navbarRight .img {
width: 35rpx;
height: 35rpx;
margin-right: 30rpx;
}
.uni-navbar--fixed {
top: 0rpx;
}
/deep/ .uni-navbar--fixed {
top: 0px;
}
/deep/ .uni-navbar__placeholder {
display: none !important;
}
.TextToHex {
position: fixed;
top: -99999rpx;
left: -99999rpx;
visibility: hidden;
}
</style>