分享设备相关的功能

pages/common/send/index.vue

@@ -34,12 +34,29 @@
 			<view style="padding:20rpx;">
 				<view class="ql-editor">编辑信息</view>
 				<view class="ql-input">
-					<textarea placeholder-style="color:rgba(255, 255, 255, 0.4)" placeholder="请输入内容" class="textarea" />
+					<textarea placeholder-style="color:rgba(255, 255, 255, 0.4)" placeholder="请输入内容" class="textarea"
+						v-model="messageToSend" />
 				</view>
-				<button class="login-btn">发送</button>
+				<button class="login-btn" @click="sendTextMessage">发送</button>
 			</view>
 
 		</scroll-view>
+		<!-- 成功提示弹框 -->
+		<view class="agreement-mask" v-if="personalShow" @click="closePopup('delete')">
+			<view class="agreement-popup" @click.stop>
+				<view class="popup-content">
+					<image src="/static/images/sendSucc.png" mode="" class="svg"></image>
+					<uni-icon class="trash"></uni-icon>
+					<view>
+						<view class="popup-Title">信息发送成功</view>
+					</view>
+				</view>
+				<!-- 按钮组 -->
+				<view class="popup-buttons">
+					<button class="btn agreeBtn" @click="handleBtn">确定</button>
+				</view>
+			</view>
+		</view>
 	</view>
 </template>
 
@@ -47,10 +64,15 @@
 	import {
 		deviceInfo,
 	} from '@/api/common/index.js'
+	import {
+		deviceSendMessage
+	} from '@/api/6170/deviceControl.js'
 	export default {
 		data() {
 			return {
 				deviceList: [],
+				messageToSend: '', //发送信息
+				personalShow: false
 			}
 		},
 		methods: {
@@ -58,14 +80,6 @@
 				this.deviceList[index].checked = !this.deviceList[index].checked
 				this.$forceUpdate()
 			},
-			sendMessage() {
-				const selectedDevices = this.deviceList.filter(item => item.checked)
-				console.log('选中的设备:', selectedDevices)
-				uni.showToast({
-					title: `已发送到${selectedDevices.length}台设备`,
-					icon: 'success'
-				})
-			},
 			// 获取设备列表
 			getData(deviceType) {
 				this.loading = true;
@@ -88,6 +102,36 @@
 					this.loading = false;
 				});
 			},
+			// 发送文本消息
+			sendTextMessage() {
+				const selectedDevices = this.deviceList.filter(item => item.checked)
+				const deviceIds = selectedDevices.map(item => item.id);
+				if (!this.messageToSend) {
+					uni.showToast({
+						title: '请输入要发送的内容',
+						icon: 'none'
+					});
+					return;
+				}
+				let data = {
+					sendMsg: this.messageToSend,
+					deviceIds: deviceIds
+				}
+				deviceSendMessage(data).then((res) => {
+					if (res.code == 200) {
+						this.personalShow = true
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						});
+					}
+				})
+			},
+			handleBtn(){
+					this.personalShow = false
+					uni.navigateBack()
+			}
 		},
 		onLoad(options) {
 			const eventChannel = this.getOpenerEventChannel();
@@ -296,4 +340,63 @@
 		width: 90%;
 		margin-left: 10rpx;
 	}
+
+	/* 遮罩层 */
+	.agreement-mask {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		background-color: rgba(0, 0, 0, 0.5);
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		z-index: 9999;
+	}
+
+	.popup-Title {
+		color: rgba(255, 255, 255, 0.86);
+		text-align: center;
+		padding: 30rpx 0rpx;
+	}
+
+	.popup-buttons {
+		display: flex;
+		text-align: center;
+	}
+
+	/* 弹窗主体 */
+	.agreement-popup {
+		width: 60%;
+		background-color: rgb(42, 42, 42);
+		border-radius: 40rpx;
+		padding: 30rpx;
+		text-align: center;
+		border: 1px solid rgba(255, 200, 78, 0.3);
+	}
+
+	.svg {
+		width: 58rpx;
+		height: 62rpx;
+	}
+
+	/* 通用按钮样式 */
+	.btn {
+		height: 60rpx;
+		line-height: 60rpx;
+		border-radius: 40rpx;
+		font-size: 24rpx;
+		margin: 10rpx auto;
+		text-align: center;
+
+	}
+
+	/* 同意按钮 */
+	.agreeBtn {
+		background: rgba(187, 230, 0, 1);
+		color: #232323;
+		border: none;
+		width: 170rpx !important;
+	}
 </style>