完善6170报警功能，图片压缩大小

components/CustomPopup/CustomPopup.vue

@@ -1,20 +1,89 @@
 <template>
-	<view class="agreement-mask" v-if="show" @click="closePopup">
+	<view class="agreement-mask" v-if="show" @click.stop="closePopup">
-		<view class="agreement-popup" @click.stop>
+		<!-- 弹窗主体：支持自定义边框、背景 -->
+		<view 
+			class="agreement-popup" 
+			@click.stop
+			:style="{
+				border: popupBorder,
+				backgroundColor: popupBg,
+				borderRadius: popupRadius
+			}"
+			:class="popupClass"
+		>
 			<view class="popup-content">
-				<!-- 动态图标 -->
+				<!-- 动态图标：支持自定义大小、边距 -->
-				<image v-if="showIcon && icon" :src="icon" mode="aspectFit" class="svg"></image>
+				<image 
+					v-if="showIcon && icon" 
+					:src="icon" 
+					mode="aspectFit" 
+					class="svg"
+					:style="iconStyle"
+				></image>
+				
 				<view class="text-content">
-					<!-- 动态标题 -->
+					<!-- 动态标题：支持自定义颜色、字体大小 -->
-					<view class="popup-Title" v-if="title">{{ title }}</view>
+					<view 
-					<!-- 动态消息内容 -->
+						class="popup-Title" 
-					<view class="popup-Message" v-if="message">{{ message }}</view>
+						v-if="title"
+						:style="{
+							color: titleColor,
+							fontSize: titleSize,
+							padding: titlePadding
+						}"
+					>
+						{{ title }}
+					</view>
+					
+					<!-- 动态消息内容：支持自定义颜色、换行、字体大小 -->
+					<view 
+						class="popup-Message" 
+						v-if="message"
+						:style="{
+							color: messageColor,
+							fontSize: messageSize,
+							whiteSpace: messageWrap ? 'normal' : 'nowrap',
+							padding: messagePadding
+						}"
+					>
+						{{ message }}
+					</view>
 				</view>
 			</view>
-			<!-- 按钮组 -->
+			
-			<view class="popup-buttons">
+			<!-- 按钮组：支持自定义按钮样式 -->
-				<button v-if="showCancel" class="btn cancelBtn" @click="handleCancel">{{ cancelText }}</button>
+			<view class="popup-buttons" :style="{ marginTop: buttonGroupMargin }">
-				<button class="btn agreeBtn" @click="handleConfirm">{{ confirmText }}</button>
+				<button 
+					v-if="showCancel" 
+					class="btn cancelBtn" 
+					@click="handleCancel"
+					:style="{
+						border: cancelBtnBorder,
+						color: cancelBtnColor,
+						backgroundColor: cancelBtnBg,
+						fontSize: cancelBtnSize,
+						borderRadius: buttonRadius,
+						margin: buttonMargin
+					}"
+					:class="cancelBtnClass"
+				>
+					{{ cancelText }}
+				</button>
+				
+				<button 
+					class="btn agreeBtn" 
+					@click="handleConfirm"
+					:style="{
+						backgroundColor: confirmBtnBg,
+						color: confirmBtnColor,
+						fontSize: confirmBtnSize,
+						borderRadius: buttonRadius,
+						margin: buttonMargin
+					}"
+					:class="confirmBtnClass"
+				>
+					{{ confirmText }}
+				</button>
 			</view>
 		</view>
 	</view>
@@ -22,55 +91,155 @@
 
 <script>
 	export default {
+		name: 'CustomPopup',
 		props: {
-			// 控制显示
+			// 基础控制
 			show: {
 				type: Boolean,
 				default: false
 			},
-			// 标题内容（可选）
 			title: {
 				type: String,
 				default: ''
 			},
-			// 消息内容
 			message: {
 				type: String,
 				default: ''
 			},
-			// 确认按钮文本
 			confirmText: {
 				type: String,
 				default: '确定'
 			},
-			// 取消按钮文本
 			cancelText: {
 				type: String,
 				default: '取消'
 			},
-			// 是否显示取消按钮
 			showCancel: {
 				type: Boolean,
 				default: false
 			},
-			// 是否显示图标
 			showIcon: {
 				type: Boolean,
 				default: true
 			},
-			// 图标路径（支持网络和本地路径）
 			icon: {
 				type: String,
 				default: ''
 			},
-			// 图标样式
+			// 文本换行控制
+			messageWrap: {
+				type: Boolean,
+				default: false // 默认不换行，true则自动换行
+			},
+			
+			// 弹窗样式自定义
+			popupBorder: {
+				type: String,
+				default: '1px solid rgba(187, 230, 0, 0.3)'
+			},
+			popupBg: {
+				type: String,
+				default: 'rgb(42, 42, 42)'
+			},
+			popupRadius: {
+				type: String,
+				default: '40rpx'
+			},
+			popupClass: {
+				type: String,
+				default: ''
+			},
+			
+			// 标题样式自定义
+			titleColor: {
+				type: String,
+				default: 'rgba(255, 255, 255, 0.86)'
+			},
+			titleSize: {
+				type: String,
+				default: '32rpx'
+			},
+			titlePadding: {
+				type: String,
+				default: '30rpx 0 10rpx'
+			},
+			
+			// 消息样式自定义
+			messageColor: {
+				type: String,
+				default: 'rgba(255, 255, 255, 0.7)'
+			},
+			messageSize: {
+				type: String,
+				default: '28rpx'
+			},
+			messagePadding: {
+				type: String,
+				default: '10rpx 20rpx 30rpx'
+			},
+			
+			// 图标样式自定义
 			iconStyle: {
 				type: Object,
 				default: () => ({
-					width: '58rpx',
+					width: '72rpx',
-					height: '62rpx',
+					height: '60rpx',
 					marginBottom: '20rpx'
 				})
+			},
+			
+			// 按钮组样式
+			buttonGroupMargin: {
+				type: String,
+				default: '20rpx'
+			},
+			buttonRadius: {
+				type: String,
+				default: '40rpx'
+			},
+			buttonMargin: {
+				type: String,
+				default: '0 10rpx'
+			},
+			
+			// 确认按钮样式
+			confirmBtnBg: {
+				type: String,
+				default: 'rgba(187, 230, 0, 1)'
+			},
+			confirmBtnColor: {
+				type: String,
+				default: '#232323'
+			},
+			confirmBtnSize: {
+				type: String,
+				default: '24rpx'
+			},
+			confirmBtnClass: {
+				type: String,
+				default: ''
+			},
+			
+			// 取消按钮样式
+			cancelBtnBorder: {
+				type: String,
+				default: '1px solid rgba(255, 255, 255, 0.3)'
+			},
+			cancelBtnColor: {
+				type: String,
+				default: 'rgba(255, 255, 255, 0.7)'
+			},
+			cancelBtnBg: {
+				type: String,
+				default: 'transparent'
+			},
+			cancelBtnSize: {
+				type: String,
+				default: '24rpx'
+			},
+			cancelBtnClass: {
+				type: String,
+				default: ''
 			}
 		},
 		methods: {
@@ -91,30 +260,28 @@
 </script>
 
 <style scoped>
-	/* 遮罩层 */
+	/* 遮罩层：全屏覆盖 */
 	.agreement-mask {
 		position: fixed;
 		top: 0;
 		left: 0;
 		right: 0;
 		bottom: 0;
-		background-color: rgba(0, 0, 0, 0.5);
+		background-color: rgba(0, 0, 0, 1);
 		display: flex;
 		justify-content: center;
 		align-items: center;
 		z-index: 9999;
 	}
 
-	/* 弹窗主体 */
+	/* 弹窗主体：基础样式 */
 	.agreement-popup {
 		width: 66%;
-		background: rgba(56, 57, 52, 0.4);
-		border-radius: 40rpx;
 		padding: 30rpx;
 		text-align: center;
-		border: 1px solid rgba(187, 230, 0, 0.3);
 	}
 
+	/* 内容区域布局 */
 	.popup-content {
 		display: flex;
 		flex-direction: column;
@@ -125,59 +292,22 @@
 		width: 100%;
 	}
 
-	.popup-Title {
+	/* 按钮基础样式（不包含可变样式） */
-		color: rgba(255, 255, 255, 0.86);
-		text-align: center;
-		padding: 30rpx 0 10rpx;
-		font-size: 32rpx;
-		font-weight: bold;
-	}
-
-	.popup-Message {
-		color: rgba(255, 255, 255, 0.7);
-		text-align: center;
-		padding: 10rpx 20rpx 30rpx;
-		font-size: 28rpx;
-		line-height: 1.5;
-		white-space: nowrap;
-	}
-
-	/* 图标样式 */
-	.svg {
-		width: 72rpx;
-		height: 60rpx;
-		margin-bottom: v-bind('iconStyle.marginBottom');
-	}
-
-	/* 按钮组 */
 	.popup-buttons {
 		display: flex;
 		justify-content: center;
-		margin-top: 20rpx;
 	}
 
-	/* 按钮基础样式 */
 	.btn {
 		height: 60rpx;
 		line-height: 60rpx;
-		border-radius: 40rpx;
-		font-size: 24rpx;
-		margin: 0 10rpx;
 		padding: 0 30rpx;
 		min-width: 170rpx;
-	}
-
-	/* 确认按钮 */
-	.agreeBtn {
-		background: rgba(187, 230, 0, 1);
-		color: #232323;
 		border: none;
 	}
 
-	/* 取消按钮 */
+	/* 解决按钮默认样式冲突 */
-	.cancelBtn {
+	.btn::after {
-		background: transparent;
+		border: none;
-		color: rgba(255, 255, 255, 0.7);
-		border: 1px solid rgba(255, 255, 255, 0.3);
 	}
 </style>

pages.json

@@ -172,6 +172,12 @@
 			"style": {
 				"navigationBarTitleText": "联机设备"
 			}
+		},
+		{
+			"path": "pages/210/addDevice/index",
+			"style": {
+				"navigationBarTitleText": "添加联机设备"
+			}
 		}
 
 	],

pages/210/addDevice/index.vue

@@ -0,0 +1,332 @@
+<template>
+	<view class="container">
+		<!-- 设备列表 -->
+		<scroll-view class="device-list" scroll-y>
+			<view class="device-card" v-for="(item, index) in deviceList" :key="index" @click="toggleSelect(index)">
+				<!-- 复选框 -->
+				<view class="checkbox" :class="{ checked: item.checked }">
+					<uni-icons v-if="item.checked" type="checkmarkempty" size="18" color="rgb(0, 0, 0)"></uni-icons>
+				</view>
+				<!-- 设备信息 -->
+				<view class="device-content">
+					<view class="device-header">
+						<view class="deviceIMG">
+							<image :src="item.devicePic" class="IMG" mode="aspectFit"></image>
+						</view>
+						<view class="device-name">
+							<view>设备:{{item.deviceName}}</view>
+							<view class="ID">
+								<view class="ID">ID:{{item.deviceImei}}</view>
+								<view class="onlines"
+									v-if="item.onlineStatus==1">在线</view>
+								<!-- 离线状态 -->
+								<view class="unlines"
+									v-if="item.onlineStatus==0">离线</view>
+								<view>电量：{{item.battery || '0'}}%</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="editInfmation">
+				<button class="login-btn" @click="sendTextMessage">添加</button>
+			</view>
+		</scroll-view>
+		<!-- 成功提示弹框 -->
+		<CustomPopup :show="showPopupFlag" :title="popupTitle" :message="popupMessage"  icon="/static/images/common/success.png"
+			:confirm-text="popupConfirmText" :show-cancel="false" @confirm="onPopupConfirm" />
+	</view>
+</template>
+
+<script>
+	import CustomPopup from '@/components/CustomPopup/CustomPopup.vue'
+	import {
+		deviceInfo,
+	} from '@/api/common/index.js'
+	import {
+		deviceSendMessage
+	} from '@/api/6170/deviceControl.js'
+	export default {
+		  components: {
+		    CustomPopup
+		  },
+		data() {
+			return {
+				deviceList: [],
+				messageToSend: '', //发送信息
+				showPopupFlag: false,
+				popupTitle: '',
+				popupMessage: '联机设备添加成功',
+				popupConfirmText: '确认'
+			}
+		},
+		methods: {
+			toggleSelect(index) {
+				this.deviceList[index].checked = !this.deviceList[index].checked
+				this.$forceUpdate()
+			},
+			// 获取设备列表
+			getData(deviceType) {
+				this.loading = true;
+				let data = {
+					pageNum: 1,
+					pageSize: 20,
+					deviceType: deviceType
+				}
+				deviceInfo(data).then((res) => {
+					if (res.code == 200) {
+						const newDevices = res.rows.map(device => ({
+							...device,
+							showConfirm: false,
+							checked: false
+						}));
+						this.total = res.total;
+						this.deviceList = newDevices
+					}
+				}).finally(() => {
+					this.loading = false;
+				});
+			},
+			// 发送文本消息
+			sendTextMessage() {
+				const selectedDevices = this.deviceList.filter(item => item.checked)
+				const deviceIds = selectedDevices.map(item => item.id);
+				if (selectedDevices.length === 0) {
+					uni.showToast({
+						title: '请选择一个设备',
+						icon: 'none'
+					});
+					return;
+				}
+				let data = {
+					deviceIds: deviceIds
+				}
+				deviceSendMessage(data).then((res) => {
+					if (res.code == 200) {
+						this.showPopupFlag = true
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						});
+					}
+				})
+			},
+			onPopupConfirm() {
+				this.showPopupFlag = false
+				uni.navigateBack()
+				console.log('用户点击了确定')
+				// 处理确认逻辑
+			},
+		},
+		onLoad(options) {
+			const eventChannel = this.getOpenerEventChannel();
+			// 监听 'deviceSend' 事件，获取传过来的数据
+			eventChannel.on('deviceSend', (data) => {
+				console.log('Received detail data:', data);
+				this.getData(data.data)
+			});
+			// 如果需要向调用页面返回数据，可以触发 'ack' 事件
+			eventChannel.emit('ack', {})
+		},
+	}
+</script>
+
+<style scoped>
+	.container {
+		min-height: 100vh;
+		background-color: rgb(18, 18, 18);
+		box-sizing: border-box;
+		overflow-x: hidden;
+
+	}
+
+	.device-list {
+		flex: 1;
+		padding: 0 20rpx;
+
+	}
+
+	.device-card {
+		position: relative;
+		display: flex;
+		align-items: center;
+		width: 95%;
+		margin-bottom: 20rpx;
+	}
+
+	.checkbox {
+		width: 40rpx;
+		height: 40rpx;
+		border: 2rpx solid rgba(255, 255, 255, 0.5);
+		margin-right: 20rpx;
+		border-radius: 4rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.checkbox.checked {
+		background-color: rgb(187, 230, 0);
+		border-color: rgb(187, 230, 0);
+	}
+
+	.device-content {
+		background-color: rgb(26, 26, 26);
+		border-radius: 16rpx;
+		position: relative;
+		/* display: flex; */
+		align-items: center;
+		padding: 20rpx;
+		width: 95%;
+	}
+
+	.device-header {
+		display: flex;
+		align-items: center;
+		margin-bottom: 15rpx;
+	}
+
+	.device-name {
+		font-size: 32rpx;
+		color: rgba(255, 255, 255, 0.87);
+		margin-left: 12rpx;
+		line-height: 50rpx;
+		width: 83%;
+		white-space: nowrap;
+	}
+
+	.ID {
+		color: rgba(255, 255, 255, 0.6);
+		font-size: 26rpx;
+		display: flex;
+		justify-content: space-between;
+		position: relative;
+	}
+
+	.device-status {
+		width: 122rpx;
+		height: 52rpx;
+		font-size: 26rpx;
+		border-radius: 0px 8px 0px 8px;
+		background-color: rgb(42, 42, 42);
+		position: absolute;
+		top: 0rpx;
+		right: 0rpx;
+		text-align: center;
+		line-height: 52rpx;
+	}
+
+	.online {
+		color: rgb(187, 230, 0);
+	}
+
+	.unline {
+		color: rgba(255, 255, 255, 0.4);
+	}
+
+	.device-info {
+		display: flex;
+		justify-content: space-evenly;
+		font-size: 26rpx;
+		color: rgba(255, 255, 255, 0.87);
+		padding-top: 10rpx;
+		position: relative;
+	}
+
+	.deviceIMG {
+		width: 100rpx;
+		height: 100rpx;
+		border-radius: 16rpx;
+		position: relative;
+		background-color: rgba(42, 42, 42, 0.6);
+		display: flex;
+		align-items: center;
+	}
+
+	.IMG {
+		width: 68rpx;
+		height: 50rpx;
+		margin-left: 17%;
+	}
+
+	.onlines {
+		position: relative;
+	}
+
+	.onlines::before {
+		content: '';
+		position: absolute;
+		width: 15rpx;
+		height: 15rpx;
+		background: rgb(0, 171, 103);
+		border-radius: 50%;
+		top: 20rpx;
+		left: -20rpx
+	}
+
+	.unlines {
+		position: relative;
+	}
+
+	.unlines::before {
+		content: '';
+		position: absolute;
+		width: 15rpx;
+		height: 15rpx;
+		background: rgba(255, 255, 255, 0.4);
+		border-radius: 50%;
+		top: 20rpx;
+		left: -20rpx
+	}
+
+	.line {
+		width: 2rpx;
+		height: 24rpx;
+		background: linear-gradient(90deg,
+				rgba(0, 0, 0, 0) 0%,
+				rgb(255, 255, 255) 50%,
+				rgba(255, 255, 255, 0) 100%);
+		margin-top: 12rpx;
+	}
+
+	.ql-editor {
+		color: rgba(255, 255, 255, 0.6);
+		font-size: 30rpx;
+	}
+
+	.ql-input {
+		width: 95.9%;
+		height: 200rpx;
+		margin-top: 30rpx;
+		box-sizing: border-box;
+		padding: 30rpx;
+		border-radius: 16rpx;
+		background: rgb(26, 26, 26);
+	}
+
+	.textarea {
+		color: rgba(255, 255, 255, 0.8);
+		background: rgba(42, 42, 42, 1);
+		border-radius: 16rpx;
+		padding: 10rpx;
+		height: 150rpx;
+	}
+
+	.editInfmation {
+		padding: 20rpx;
+		border-radius: 40rpx 40rpx 0px 0px;
+		position: fixed;
+		bottom: 50rpx;
+		box-sizing: border-box;
+		width: 100%;
+	}
+
+	.login-btn {
+		margin-top: 30rpx;
+		background-color: rgb(187, 230, 0);
+		color: rgb(35, 35, 35);
+		border-radius: 50rpx;
+		width: 90%;
+	}
+</style>

pages/210/deviceControl/index.vue

@@ -314,6 +314,7 @@
 				selectedItemIndex: 0,
 				radioList: ['M', 'S'],
 				radioSelected: 0, // -1表示未选中任何项
+				deviceType:''
 			}
 		},
 		methods: {
@@ -336,7 +337,16 @@
 			// 联机设备
 			selectMode() {
 				uni.navigateTo({
-					url:'/pages/210/onlineDevice/index'
+					url:'/pages/210/onlineDevice/index',
+					events: {
+						ack: function(data) {}
+					},
+					success: (res) => {
+						// 页面跳转成功后的回调函数
+						res.eventChannel.emit('onlineDevice', {
+							data: this.deviceType
+						});
+					}
 				})
 			},
 			// 人员信息登录
@@ -666,10 +676,13 @@
 				title: '加载中...'
 			})
 			eventChannel.on('deviceControl', (data) => {
+				console.log(data,'这是传过来的惨呼啊');
 				this.itemInfo = data.data;
 				this.deviceID = data.data.id;
 				this.navTitle = data.data.deviceName;
 				this.apiType = data.apiType
+				this.deviceType=data.deviceType
+				
 				// 根据 apiType 设置右图标的显示状态
 				this.isRightIconVisible = this.apiType === 'listA';
 				// 初始化并连接MQTT

pages/210/onlineDevice/index.vue

@@ -8,36 +8,37 @@
 			<scroll-view class="device-list" scroll-y @scrolltolower="onScrollToLower" :lower-threshold="100"
 				style="height:80vh;">
 				<view v-if="deviceList.length>0">
-						<block v-for="(item, index) in deviceList" :key="index" :ref="'swipeItem_' + index" class="device-card">
+					<block v-for="(item, index) in deviceList" :key="index" :ref="'swipeItem_' + index"
-								<view @click.stop="handleFile(item)">
+						class="device-card">
-									<view class="device-header">
+						<view @click.stop="handleFile(item)">
-										<view class="deviceIMG">
+							<view class="device-header">
-											<image :src="item.devicePic" class="IMG" mode="aspectFit"></image>
+								<view class="deviceIMG">
-										</view>
+									<image :src="item.devicePic" class="IMG" mode="aspectFit"></image>
-										<view class="device-name">
+								</view>
-											<view>设备:{{item.deviceName}}</view>
+								<view class="device-name">
-											<view class="ID">
+									<view>设备:{{item.deviceName}}</view>
-												<view class="ID">ID:{{item.deviceImei}}
+									<view class="ID">
-												</view>
+										<view class="ID">ID:{{item.deviceImei}}
-												<!-- 在线状态 -->
-												<view class="onlines">在线</view>
-												<!-- 离线状态 -->
-												<view class="offlines" v-if="item.onlineStatus==0">离线</view>
-												<view>电量：{{item.battery || '0'}}%</view>
-											</view>
 										</view>
+										<!-- 在线状态 -->
+										<view class="onlines">在线</view>
+										<!-- 离线状态 -->
+										<view class="offlines" v-if="item.onlineStatus==0">离线</view>
+										<view>电量：{{item.battery || '0'}}%</view>
 									</view>
-									<view>
+								</view>
-										<view class="device-status">1</view>
+							</view>
-									</view>
+							<view>
-								</view>							
+								<view class="device-status">1</view>
-						</block>
+							</view>
+						</view>
+					</block>
 				</view>
-				<view  class="content1" @click="addvideo">
+				<view class="content1" @click="addvideo">
 					<image src="/static/images/common/path1.png" class="path1"></image>
 				</view>
 			</scroll-view>
-			
+
 		</view>
 	</view>
 </template>
@@ -47,15 +48,16 @@
 		data() {
 			return {
 				deviceID: '',
-				deviceList:[],
+				deviceList: [],
-				loading:false
+				loading: false,
+				deviceType:''
 			}
 		},
 		methods: {
 			// 添加视频
 			addvideo() {
 				uni.navigateTo({
-					url: `/pages/common/addvideo/index??id=${this.deviceID}`
+					url: `/pages/210/addDevice/index??id=${this.deviceID}`
 				})
 			},
 			getData() {
@@ -65,7 +67,6 @@
 			},
 			// 发生短信
 			handleSend() {
-				console.log(`跳转到发送信息页面\n当前设备类型: ${deviceType}\n设备类型名称: ${currentTab.typeName}`);
 				uni.navigateTo({
 					url: '/pages/common/send/index',
 					events: {
@@ -73,7 +74,7 @@
 					},
 					success: (res) => {
 						res.eventChannel.emit('deviceSend', {
-							
+                           data:this.deviceType
 						});
 					}
 				})
@@ -82,9 +83,15 @@
 		onShow() {
 			this.getData()
 		},
-		onLoad(options) {
+		// onLoad(options) {
-			this.deviceID = options.id
+		// 	this.deviceID = options.id
 
+		// }
+		onLoad(options) {
+			const eventChannel = this.getOpenerEventChannel();
+			eventChannel.on('onlineDevice', (data) => {
+				this.deviceType=data.data
+			})
 		}
 	}
 </script>
@@ -98,6 +105,7 @@
 		background-color: rgb(18, 18, 18);
 		padding: 30rpx;
 	}
+
 	.sendFlex {
 		display: flex;
 		color: rgba(255, 255, 255, 0.87);
@@ -106,6 +114,7 @@
 		margin-bottom: 30rpx;
 		font-size: 28rpx;
 	}
+
 	/* 设备卡片 */
 	.device-card {
 		background-color: rgb(26, 26, 26);
@@ -114,13 +123,14 @@
 		box-sizing: border-box;
 		position: relative;
 	}
-	
+
 	.device-header {
 		display: flex;
 		align-items: center;
 		margin-bottom: 15rpx;
 		padding: 30rpx 0 10rpx 30rpx;
 	}
+
 	.device-name {
 		font-size: 32rpx;
 		color: rgba(255, 255, 255, 0.87);
@@ -129,16 +139,16 @@
 		width: 75%;
 		white-space: nowrap;
 	}
-	
+
 	.ID {
 		color: rgba(255, 255, 255, 0.6);
 		font-size: 26rpx;
 		display: flex;
 		justify-content: space-between;
 		position: relative;
-	
+
 	}
-	
+
 	.device-status {
 		width: 122rpx;
 		height: 52rpx;
@@ -152,7 +162,7 @@
 		line-height: 52rpx;
 		color: rgba(255, 255, 255, 0.8)
 	}
-	
+
 	.circle {
 		width: 8rpx;
 		height: 40rpx;
@@ -160,13 +170,14 @@
 		right: 25rpx;
 		top: 60rpx;
 	}
+
 	.device-id {
 		font-size: 26rpx;
 		color: #999;
 		margin-bottom: 20rpx;
 		display: block;
 	}
-	
+
 	.device-info {
 		display: flex;
 		justify-content: space-evenly;
@@ -175,7 +186,7 @@
 		position: relative;
 		padding: 0rpx 0rpx 30rpx 30rpx;
 	}
-	
+
 	.deviceIMG {
 		width: 100rpx;
 		height: 100rpx;
@@ -185,18 +196,18 @@
 		display: flex;
 		align-items: center;
 	}
-	
+
 	.IMG {
 		width: 68rpx;
 		height: 50rpx;
 		margin-left: 17%;
 		object-fit: contain;
 	}
-	
+
 	.onlines {
 		position: relative;
 	}
-	
+
 	.onlines::before {
 		content: '';
 		position: absolute;
@@ -207,9 +218,11 @@
 		top: 20rpx;
 		left: -20rpx
 	}
-	.offlines{
+
+	.offlines {
 		position: relative;
 	}
+
 	.offlines::before {
 		content: '';
 		position: absolute;
@@ -220,7 +233,7 @@
 		top: 20rpx;
 		left: -20rpx
 	}
-	
+
 	.content1 {
 		height: 160rpx;
 		background: rgb(26, 26, 26);
@@ -228,6 +241,7 @@
 		text-align: center;
 		line-height: 200rpx;
 	}
+
 	.Sendmessage {
 		margin-left: 50rpx;
 		color: rgba(255, 255, 255, 0.87);
@@ -237,5 +251,4 @@
 		width: 62rpx;
 		height: 62rpx;
 	}
-
 </style>

pages/6170/callPolice/index.vue

@@ -1,6 +1,7 @@
 <template>
 	<view class="container">
 		<!-- 设备列表 -->
+		<view class="allSelect" @click="selectAll"> 全选</view>
 		<scroll-view class="device-list" scroll-y>
 			<view class="device-card" v-for="(item, index) in deviceList" :key="index" @click="toggleSelect(index)">
 				<!-- 复选框 -->
@@ -17,11 +18,9 @@
 							<view>设备:{{item.deviceName}}</view>
 							<view class="ID">
 								<view class="ID">ID:{{item.deviceImei}}</view>
-								<view class="onlines"
+								<view class="onlines" v-if="item.onlineStatus==1">在线</view>
-									v-if="item.onlineStatus==1">在线</view>
 								<!-- 离线状态 -->
-								<view class="unlines"
+								<view class="unlines" v-if="item.onlineStatus==0">离线</view>
-									v-if="item.onlineStatus==0">离线</view>
 								<view>电量：{{item.battery || '0'}}%</view>
 							</view>
 						</view>
@@ -29,12 +28,18 @@
 				</view>
 			</view>
 			<view class="editInfmation">
-				<button class="login-btn" @click="sendTextMessage">强制报警</button>
+				<button class="login-btn qz" @click="forceAlarm">强制报警</button>
+				<button class="login-btn jc" @click="cancelAlarm">解除报警</button>
 			</view>
 		</scroll-view>
-		<!-- 成功提示弹框 -->
+		<!-- 强制报警提示弹框 -->
-		<CustomPopup :show="showPopupFlag" :title="popupTitle" :message="popupMessage"  icon="/static/images/6170/bj.png"
+		<CustomPopup v-if="popupType === 'force'" :show="showPopupFlag" popupBorder="1rpx solid rgba(224, 52, 52, 0.3)"
-			:confirm-text="popupConfirmText" :show-cancel="false" @confirm="onPopupConfirm" />
+			:message="popupMessage" icon="/static/images/6170/bj.png" :confirm-text="popupConfirmText"
+			:show-cancel="false" @confirm="onPopupConfirm" confirmBtnBg="rgba(224, 52, 52, 1)" confirmBtnColor="#fff" />
+		<!-- 解除报警 -->
+		<CustomPopup v-if="popupType === 'cancel'" :show="showPopupFlag" popupBorder="1rpx solid rgba(224, 52, 52, 0.3)"
+			:message="popupMessage" icon="/static/images/6170/svg.png" :confirm-text="popupConfirmText"
+			:show-cancel="false" @confirm="onPopupConfirm" confirmBtnBg="rgba(224, 52, 52, 1)" confirmBtnColor="#fff" />
 	</view>
 </template>
 
@@ -47,9 +52,9 @@
 		deviceSendMessage
 	} from '@/api/6170/deviceControl.js'
 	export default {
-		  components: {
+		components: {
-		    CustomPopup
+			CustomPopup
-		  },
+		},
 		data() {
 			return {
 				deviceList: [],
@@ -57,7 +62,13 @@
 				showPopupFlag: false,
 				popupTitle: '',
 				popupMessage: '确认要对所选设备开启强制报警?',
-				popupConfirmText: '确认'
+				popupConfirmText: '确认',
+				popupType: 'force', // 'force' or 'cancel'
+			}
+		},
+		computed: {
+			selectedDeviceIds() {
+				return this.deviceList.filter(item => item.checked).map(item => item.id);
 			}
 		},
 		methods: {
@@ -65,6 +76,16 @@
 				this.deviceList[index].checked = !this.deviceList[index].checked
 				this.$forceUpdate()
 			},
+			// 全选/取消全选
+			selectAll() {
+				console.log('123');
+				const allSelected = this.deviceList.every(item => item.checked);
+				this.deviceList.forEach(item => {
+					item.checked = !allSelected;
+				});
+
+				this.$forceUpdate();
+			},
 			// 获取设备列表
 			getData(deviceType) {
 				this.loading = true;
@@ -87,8 +108,8 @@
 					this.loading = false;
 				});
 			},
-			// 发送文本消息
+			// 强制报警
-			sendTextMessage() {
+			forceAlarm() {
 				const selectedDevices = this.deviceList.filter(item => item.checked)
 				const deviceIds = selectedDevices.map(item => item.id);
 				if (selectedDevices.length === 0) {
@@ -98,24 +119,50 @@
 					});
 					return;
 				}
-				let data = {
+				this.popupType = 'force';
-					deviceIds: deviceIds
+				this.popupMessage = '确认要对所选设备开启强制报警?';
+				this.showPopupFlag = true;
+			},
+			// 解除报警
+			cancelAlarm() {
+				const selectedDevices = this.deviceList.filter(item => item.checked);
+				if (selectedDevices.length === 0) {
+					uni.showToast({
+						title: '请选择一个设备',
+						icon: 'none'
+					});
+					return;
 				}
+				this.popupType = 'cancel';
+				this.popupMessage = '确认要解除所选设备的报警状态?';
+				this.showPopupFlag = true;
+			},
+			sendAlarmCommand(type) {
+				const selectedDevices = this.deviceList.filter(item => item.checked);
+				const deviceIds = selectedDevices.map(item => item.id);
+
+				let data = {
+					deviceIds: deviceIds,
+					commandType: type // '强制或者解除'
+				}
+
 				deviceSendMessage(data).then((res) => {
 					if (res.code == 200) {
-						this.showPopupFlag = true
+						this.showPopupFlag = true;
 					} else {
 						uni.showToast({
 							title: res.msg,
 							icon: 'none'
 						});
 					}
-				})
+				});
 			},
+			// 点击确认状态
 			onPopupConfirm() {
 				this.showPopupFlag = false
 				uni.navigateBack()
 				console.log('用户点击了确定')
+				this.sendAlarmCommand(this.popupType);
 				// 处理确认逻辑
 			},
 		},
@@ -123,7 +170,6 @@
 			const eventChannel = this.getOpenerEventChannel();
 			// 监听 'deviceSend' 事件，获取传过来的数据
 			eventChannel.on('devicePolice', (data) => {
-				console.log('Received detail data:', data);
 				this.getData(data.data)
 			});
 			// 如果需要向调用页面返回数据，可以触发 'ack' 事件
@@ -141,10 +187,17 @@
 
 	}
 
+	.allSelect {
+		color: rgba(255, 255, 255, 0.87);
+		float: right;
+		padding: 25rpx;
+		cursor: pointer;
+	}
+
 	.device-list {
 		flex: 1;
-		padding: 0 20rpx;
+		padding: 0rpx 20rpx;
-
+		clear: both;
 	}
 
 	.device-card {
@@ -167,8 +220,8 @@
 	}
 
 	.checkbox.checked {
-		background-color: rgb(187, 230, 0);
+		background: rgba(224, 52, 52, 1);
-		border-color: rgb(187, 230, 0);
+		border-color: rgba(224, 52, 52, 1);
 	}
 
 	.device-content {
@@ -314,19 +367,33 @@
 	}
 
 	.editInfmation {
+		display: flex;
 		padding: 20rpx;
 		border-radius: 40rpx 40rpx 0px 0px;
-	width: 100%;
+		width: 96%;
 		position: fixed;
 		bottom: 50rpx;
 		box-sizing: border-box;
+
 	}
 
 	.login-btn {
 		margin-top: 30rpx;
-		background-color: rgb(187, 230, 0);
 		color: rgb(35, 35, 35);
 		border-radius: 50rpx;
-		width: 90%;
+		width: 40%;
+		color: #fff;
+		height: 88rpx;
+		font-size: 30rpx;
+		line-height: 88rpx;
+	}
+
+	.qz {
+		background: rgba(224, 52, 52, 1);
+	}
+
+	.jc {
+		border: 1px solid rgba(255, 255, 255, 0.87);
+		background: rgba(18, 18, 18, 1);
 	}
 </style>

pages/6170/deviceControl/index.vue

@@ -25,7 +25,7 @@
 						<view class="battery-v1">
 							<image src="/static/images/common/nz.png" class="dlIMG" mode="aspectFit"></image>
 							<view>
-								<view class="battery-v2">{{deviceInfo.batteryRemainingTime || '0分钟'}}</view>
+								<view class="battery-v2">{{deviceInfo.batteryRemainingTime || '0分钟'}}分钟</view>
 								<view class="battery-v3">续航时间</view>
 							</view>
 						</view>
@@ -61,13 +61,22 @@
 					</view>
 
 				</view>
+				<view class="callpolice" v-if="deviceInfo.onlineStatus==1">
+					<view class="">设备强制报警中</view>
+					<view>
+						<uni-icons type="closeempty" size="15" color="rgba(255, 255, 255, 0.9)"
+							@click="handlePolice"></uni-icons>
+					</view>
+				</view>
 				<view class="info-row">
 					<text class="info-label">灯光亮度</text>
 					<text class="info-value status-running">{{ sliderValue }}%</text>
 				</view>
 
+
 				<!-- 灯光亮度控制 -->
-				<view class="control-card" @touchstart="cardTouchStart" @touchmove="cardTouchMove" @touchend="cardTouchEnd">
+				<view class="control-card" @touchstart="cardTouchStart" @touchmove="cardTouchMove"
+					@touchend="cardTouchEnd">
 					<view @touchmove.prevent>
 						<slider :value="sliderValue" min="10" max="100" activeColor="rgb(187, 230, 0)"
 							backgroundColor="rgb(26, 26, 26)" :show-value="false" @changing="onSliderChanging"
@@ -144,7 +153,7 @@
 					</view>
 
 					<view class="form-row">
-						<input class="form-input" maxlength="20" placeholder="请输入文字" v-model="messageToSend" />
+						<input class="form-input1" maxlength="20" placeholder="请输入文字" v-model="messageToSend" />
 					</view>
 				</view>
 				<!-- 产品信息 -->
@@ -230,8 +239,23 @@
 				</view>
 			</view>
 			<!-- 人员信息成功提示弹框 -->
-			<CustomPopup :show="showPopupFlag" :message="popupMessage" icon="/static/images/common/sendSucc.png"
+			<CustomPopup v-if="popupType === 'person'" :show="showPopupFlag" :message="popupMessage"
-				:confirm-text="popupConfirmText" :show-cancel="false" @confirm="onPopupConfirm" />
+				icon="/static/images/common/sendSucc.png" :confirm-text="popupConfirmText" :show-cancel="false"
+				@confirm="onPopupConfirm" />
+			<!-- 开机log上传成功的弹框提示 -->
+			<CustomPopup v-if="popupType === 'logo'" :show="showPopupFlag" :message="popupMessage"
+				icon="/static/images/common/upload.png" :confirm-text="popupConfirmText" :show-cancel="false"
+				@confirm="onPopupConfirm" />
+			<!--============= 电量低于提示弹框=========== -->
+			<CustomPopup v-if="popupType === 'bettery'" :show="showPopupFlag"
+				popupBorder="1rpx solid rgba(224, 52, 52, 0.3)" :message="popupMessage"
+				icon="/static/images/common/path.png" :confirm-text="popupConfirmText" :show-cancel="true"
+				@confirm="onPopupConfirm" confirmBtnBg="rgba(224, 52, 52, 1)" confirmBtnColor="#fff" />
+			<!-- 解除报警 -->
+			<CustomPopup v-if="popupType === 'cancel'" :show="showPopupFlag"
+				popupBorder="1rpx solid rgba(224, 52, 52, 0.3)" :message="popupMessage"
+				icon="/static/images/6170/svg.png" :confirm-text="popupConfirmText" :show-cancel="false"
+				@confirm="onPopupConfirm" confirmBtnBg="rgba(224, 52, 52, 1)" confirmBtnColor="#fff" />
 		</view>
 	</view>
 </template>
@@ -297,7 +321,9 @@
 				showUploadPopup: false,
 				selectedImage: null, // 添加这个变量来存储选择的图片
 				file: '',
-				selectedItemIndex: 0
+				selectedItemIndex: 0,
+				popupType: 'person', //弹框类型
+				timer: null
 			}
 		},
 		computed: {
@@ -330,30 +356,35 @@
 						res.eventChannel.emit('MapData', JSON.parse(JSON.stringify(mapData)))
 					},
 					fail: (err) => {
-				
+
 					}
 				})
 			},
+			// 强制报警（）
+			handlePolice() {
+				this.popupType = 'cancel';
+				this.popupMessage = '确认要解除所选设备的报警状态';
+				this.showPopupFlag = true;
+			},
 			// ***********进度条***********
 			cardTouchStart(e) {
 				if (!this.cardRect) return;
 				this.touchStartX = e.touches[0].clientX;
 				this.touchStartY = e.touches[0].clientY;
 			},
-			
+
 			cardTouchMove(e) {
 				if (!this.cardRect || e.touches.length === 0) return;
-			
+
 				const deltaX = e.touches[0].clientX - this.touchStartX;
 				const deltaY = e.touches[0].clientY - this.touchStartY;
-			
+
 				// 只有当水平滑动距离大于垂直距离时，才判断为有效滑动
 				if (Math.abs(deltaX) > Math.abs(deltaY)) {
 					this.isCardSliding = true;
 					this.updateSliderFromTouch(e);
 				}
 			},
-			
 			cardTouchEnd(e) {
 				if (this.isCardSliding) {
 					// 触摸结束时，调用滑动结束的处理函数来发送最终值
@@ -367,7 +398,7 @@
 				this.touchStartX = 0;
 				this.touchStartY = 0;
 			},
-			
+
 			updateSliderFromTouch(e) {
 				const touchX = e.touches[0].clientX;
 				const cardLeft = this.cardRect.left;
@@ -391,17 +422,17 @@
 					value = 10;
 				}
 				this.sliderValue = value; // 实时更新UI
-			
+
 				const now = Date.now();
 				// 使用节流防止指令发送过于频繁
 				if (now - this.lastBrightnessTime > 200) { // 200毫秒节流
 					this.lastBrightnessTime = now;
-			
+
 					// 增加轻微的震动反馈，提升手感
 					uni.vibrateShort({
 						type: 'light'
 					});
-			
+
 					let data = {
 						deviceId: this.deviceID,
 						instructValue: this.sliderValue + '.00'
@@ -419,7 +450,7 @@
 					value = 10;
 				}
 				this.sliderValue = value;
-			
+
 				let data = {
 					deviceId: this.deviceID,
 					instructValue: this.sliderValue + '.00'
@@ -615,10 +646,9 @@
 						try {
 							const responseData = JSON.parse(res.data);
 							if (responseData.code === 200) {
-								uni.showToast({
+								this.popupType = 'logo'; //弹框类型
-									title: responseData.msg,
+								this.showPopupFlag = true;
-									icon: 'success'
+								this.popupMessage = '上传成功';
-								});
 								this.selectedImage = '';
 								this.file = null;
 								this.lightModeB = false
@@ -718,6 +748,7 @@
 				registerPersonInfo(data).then((res) => {
 					if (res.code == 200) {
 						uni.hideLoading()
+						this.popupType = 'person';
 						this.showPopupFlag = true
 						this.popupMessage = '人员信息发送成功'
 					} else {
@@ -752,6 +783,7 @@
 				deviceSendMessage(data).then((res) => {
 					if (res.code == 200) {
 						uni.hideLoading()
+						this.popupType = 'person';
 						this.showPopupFlag = true
 						this.popupMessage = '发送信息成功'
 					} else {
@@ -849,6 +881,11 @@
 					const statusTopic = `A/${this.itemInfo.deviceImei}`;
 					this.mqttClient.subscribe(statusTopic, (payload) => {
 						console.log(`收到来自 ${statusTopic} 的消息:`, payload);
+						//收到电量上报。延迟20s请求接口数据
+						setTimeout(() => {
+							this.fetchDeviceDetail(data.data.id)
+						}, 20000);
+
 						// ✅ 发送全局事件通知主页面更新
 						uni.$emit('deviceStatusUpdate', {
 							message: JSON.stringify(payload), // 消息内容
@@ -1104,6 +1141,18 @@
 
 	}
 
+	.callpolice {
+		display: flex;
+		justify-content: space-between;
+		border-radius: 16rpx;
+		background: rgba(224, 52, 52, 1);
+		padding: 15rpx;
+		margin-bottom: 15rpx;
+		color: #fff;
+		line-height: 35rpx;
+		font-size: 26rpx;
+	}
+
 	.example-body {
 		position: absolute;
 		left: 50%;
@@ -1175,6 +1224,14 @@
 		color: rgba(255, 255, 255, 0.87);
 	}
 
+	.form-input1 {
+		height: 80rpx;
+		border: 1rpx solid transparent;
+		font-size: 32rpx;
+		color: rgba(255, 255, 255, 0.87);
+		width: 98%;
+	}
+
 	.product-section {
 		background-color: #fff;
 		border-radius: 16rpx;

pages/common/index/index.vue

@@ -18,7 +18,7 @@
 					<image src="/static/images/common/more.png" mode="aspectFit" class="more"></image>
 				</view>
 			</view>
-			<view class="sendFlex" v-if="activeTab && activeTab.id !== ''&& activeTabInfo.communicationMode==0">
+			<view class="sendFlex" v-if="activeTab && activeTab.id !== ''&& activeTabInfo.communicationMode==0 && activeTabInfo.typeName=='BJQ6170'">
 				<view class="callpolice" @click="callpolice">报警</view>
 				<view class="Sendmessage" @click="location">位置</view>
 				<view class="Sendmessage" @click="handleSend">发送信息</view>
@@ -29,7 +29,7 @@
 					<uni-swipe-action ref="swipeAction">
 						<block v-for="(item, index) in deviceList" :key="index" :ref="'swipeItem_' + index">
 							<uni-swipe-action-item :right-options="Options"
-								@click="handleSwipeClick($event, item, index)" class="device-card">
+								@click="handleSwipeClick($event, item, index)" class="device-card"   :style="{ border: item.communicationMode==0 && item.onlineStatus==1 ? '1px solid rgba(224, 52, 52, 1)' : 'none' }">
 								<view @click.stop="handleFile(item)">
 									<view class="device-header">
 										<view class="deviceIMG">
@@ -51,7 +51,8 @@
 											</view>
 										</view>
 									</view>
-									<view class="" v-if="item.communicationMode==1">
+									<view class="device-callpolice" v-if="item.communicationMode==0 && item.onlineStatus==1">报警中</view>
+									<view v-if="item.communicationMode==1">
 										<view class="device-status online">已连接</view>
 										<view class="device-status unline">未连接</view>
 									</view>
@@ -253,6 +254,7 @@
 			},
 			// tab切换页
 			switchTab(tab, index) {
+				console.log(tab,'tab');
 				this.deviceList = [];
 				this.activeTab = index;
 				this.activeTabInfo = tab
@@ -405,7 +407,7 @@
 			// 报警
 			callpolice(){
 				const currentTab = this.tabs[this.activeTab];
-				const deviceType = currentTab.id || 'all';
+				const deviceType = currentTab.id || '';
 				console.log(`跳转到发送信息页面\n当前设备类型: ${deviceType}\n设备类型名称: ${currentTab.typeName}`);
 				uni.navigateTo({
 					url: '/pages/6170/callPolice/index',
@@ -422,7 +424,7 @@
 			// 发生短信
 			handleSend() {
 				const currentTab = this.tabs[this.activeTab];
-				const deviceType = currentTab.id || 'all';
+				const deviceType = currentTab.id || '';
 				console.log(`跳转到发送信息页面\n当前设备类型: ${deviceType}\n设备类型名称: ${currentTab.typeName}`);
 				uni.navigateTo({
 					url: '/pages/common/send/index',
@@ -443,7 +445,7 @@
 				})
 			},
 			handleFile(item) {
-				//console.log('item' + JSON.stringify(item));
+				console.log('item', item);
 				// communicationMode 0是4G 1是蓝牙,考虑多个4g设备
 				if (item.typeName == 'BJQ6170') {
 					uni.navigateTo({
@@ -460,6 +462,8 @@
 						}
 					})
 				} else if (item.typeName == 'HBY210') {
+					const currentTab = this.tabs[this.activeTab];
+					const deviceType = currentTab.id || '';
 					uni.navigateTo({
 						url: "/pages/210/deviceControl/index",
 						events: {
@@ -469,6 +473,7 @@
 							// 页面跳转成功后的回调函数
 							res.eventChannel.emit('deviceControl', {
 								data: item,
+								deviceType:deviceType
 							});
 						}
 					})
@@ -501,7 +506,7 @@
 						// 示例：如果消息包含特定字段，则更新设备状态
 						return {
 							...item,
-							//status: data.message.status || item.status, // 假设消息中有status字段
+							status: data.message.status || item.status, // 假设消息中有status字段
 							lastUpdate: data.timestamp // 更新时间戳
 						};
 					}
@@ -611,14 +616,6 @@
 		width: 40rpx;
 		height: 8rpx;
 	}
-
-	.gprs {
-		width: 28rpx;
-		height: 35rpx;
-		position: absolute;
-		left: 50rpx
-	}
-
 	.Sendmessage {
 		margin-left: 50rpx;
 		color: rgba(255, 255, 255, 0.87);
@@ -665,7 +662,19 @@
 		position: relative;
 
 	}
-
+.device-callpolice{
+	width: 122rpx;
+	height: 52rpx;
+	font-size: 24rpx;
+	border-radius: 0px 8px 0px 8px;
+	background-color: rgba(224, 52, 52, 1);
+	position: absolute;
+	top: 0rpx;
+	right: -4rpx;
+	text-align: center;
+	line-height: 52rpx;
+	color: #fff;
+}
 	.device-status {
 		width: 122rpx;
 		height: 52rpx;

pages/common/login/index.vue

@@ -62,7 +62,7 @@
 			return {
 				showView: false,
 				phone: '13800138002', //手机号码
-				code: "", //验证码
+				code: "123456", //验证码
 				agreed: false,
 				isCounting: false,
 				countdown: 0,