设备分享模块页面功能开发
This commit is contained in:
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- 使用自定义导航栏 -->
|
||||
<custom-navbar :title="navTitle" :showBack="true" color="#FFFFFF" rightIcon="/static/images/path.png"
|
||||
@right-click="uploadStartup"></custom-navbar>
|
||||
<custom-navbar :title="navTitle" :showBack="true" color="#FFFFFF" rightIcon="/static/images/shape.png"
|
||||
@right-click="shareUp"></custom-navbar>
|
||||
<view class="device-detail-container" :style="{ paddingTop: navBarHeight + 'px' }">
|
||||
<!-- 设备电量信息 -->
|
||||
<view class="battery-section">
|
||||
@ -176,12 +176,12 @@
|
||||
<!-- 上传开机画面弹框 -->
|
||||
<view class="agreement-mask" v-if="lightModeB">
|
||||
<!-- 上传画面弹窗 -->
|
||||
<view class="agreement-popup">
|
||||
<view class="agreement-popupB">
|
||||
<!-- 标题 -->
|
||||
<view class="popup-title">上传开机画面</view>
|
||||
<view class="popup-content">
|
||||
<view class="example-body">
|
||||
<uni-file-picker limit="1"></uni-file-picker>
|
||||
<uni-file-picker limit="1" class="custom-file-picker"></uni-file-picker>
|
||||
<view class="example_title">点击上传图片</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -324,6 +324,12 @@
|
||||
handleupload() {
|
||||
this.lightModeB = false
|
||||
},
|
||||
// 分享
|
||||
shareUp(){
|
||||
uni.navigateTo({
|
||||
url: '/pages/6170/share/index'
|
||||
})
|
||||
},
|
||||
|
||||
// 操作说明
|
||||
operatingInst() {
|
||||
@ -357,27 +363,42 @@
|
||||
// 发送人员信息
|
||||
sendPersonnelInfo() {
|
||||
if (!this.mqttClient || !this.mqttClient.client.isConnected()) {
|
||||
uni.showToast({ title: 'MQTT未连接', icon: 'none' });
|
||||
uni.showToast({
|
||||
title: 'MQTT未连接',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
const topic = `device/command/${this.deviceID}/personnel`;
|
||||
const message = JSON.stringify(this.personnelInfo);
|
||||
this.mqttClient.publish(topic, message);
|
||||
uni.showToast({ title: '人员信息已发送', icon: 'success' });
|
||||
uni.showToast({
|
||||
title: '人员信息已发送',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
// 发送文本消息
|
||||
sendTextMessage() {
|
||||
if (!this.mqttClient || !this.mqttClient.client.isConnected()) {
|
||||
uni.showToast({ title: 'MQTT未连接', icon: 'none' });
|
||||
uni.showToast({
|
||||
title: 'MQTT未连接',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!this.messageToSend) {
|
||||
uni.showToast({ title: '请输入要发送的文字', icon: 'none' });
|
||||
uni.showToast({
|
||||
title: '请输入要发送的文字',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
const topic = `device/command/${this.deviceID}/message`;
|
||||
this.mqttClient.publish(topic, this.messageToSend);
|
||||
uni.showToast({ title: '消息已发送', icon: 'success' });
|
||||
uni.showToast({
|
||||
title: '消息已发送',
|
||||
icon: 'success'
|
||||
});
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
@ -418,7 +439,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.device-detail-container {
|
||||
padding: 30rpx;
|
||||
background: #121212;
|
||||
@ -625,23 +646,13 @@
|
||||
.example-body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 70%;
|
||||
top: 60%;
|
||||
width: 100%;
|
||||
transform: translate(-17%, -100%);
|
||||
transform: translate(-10%, -100%);
|
||||
|
||||
}
|
||||
|
||||
.uni-file-picker__container {
|
||||
width: 200rpx !important;
|
||||
border: 1px solid rgb(58, 58, 58);
|
||||
}
|
||||
|
||||
:deep .file-picker__box {
|
||||
width: 40% !important;
|
||||
}
|
||||
|
||||
.example_title {
|
||||
padding-top: 20rpx;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
}
|
||||
|
||||
@ -776,6 +787,17 @@
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
.agreement-popupB {
|
||||
width: 100%;
|
||||
height: 40%;
|
||||
background-color: rgb(42, 42, 42);
|
||||
border-radius: 60rpx 60rpx 0rpx 0rpx;
|
||||
padding: 40rpx;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
}
|
||||
|
||||
.agreement-popupC {
|
||||
width: 80%;
|
||||
background-color: rgb(42, 42, 42);
|
||||
|
Reference in New Issue
Block a user