增加绑定蓝牙页面

pages/common/addBLE/LinkBle.vue

@@ -1,33 +1,227 @@
 <template>
-	<view>
+	<view class="content">
-		
+		<view class="deviceDetail">
+			<view class="imgContent">
+				<image src="/static/images/BLEAdd/addBleDevice.png" class="titleIco" mode="aspectFit">
+				</image>
+			</view>
+			<view class="deviceName">
+				设备名:{{device.deviceName}}
+			</view>
+			<view class="deviceId">
+				ID:{{device.deviceId}}
+			</view>
+			<view class="bound" v-bind:class="boundStatu">
+				{{Statu.boundRemark}}
+			</view>
+		</view>
+		<view class="btnLink" @click="Link()">
+			连接
+		</view>
+
+
 	</view>
 </template>
 
 <script>
-	var these=null;
+	import request from '@/utils/request.js';
-	var eventChannel =null;
+	import bleTool from '@/utils/BleHelper.js'
+	var these = null;
+	var eventChannel = null;
+	var ble=null;
 	export default {
 		data() {
 			return {
-				
+				Statu: {
+					bound: null
+				},
+				device: {
+					"deviceId": "",
+					"name": "",
+					"deviceName": "",
+					"RSSI": -37,
+					"localName": "",
+					"advertisServiceUUIDs": [
+
+					],
+					"linkStatu": false,
+					"macAddress": ""
+				}
+			}
+		},
+		computed: {
+			boundStatu: function() {
+				if (this.Statu.bound === null) {
+					return "displayNone"
+				}
+				if (this.Statu.bound) {
+					return "green"
+				} else {
+					return "red";
+				}
 			}
 		},
 		onLoad(option) {
-			these=this;
+			these = this;
-			  eventChannel= this.getOpenerEventChannel();
+			ble=bleTool.getBleTool();
-			
+			eventChannel = this.getOpenerEventChannel();
-			  eventChannel.on('LinkItem', function(data) {
+			eventChannel.on('LinkItem', function(data) {
-			    console.log("收到父页面的参数了,",data)
+				let f=ble.data.LinkedList.find((v)=>{
-				eventChannel.emit("Linked",data);
+					return v.deviceId=data.deviceId;
-			  })
+				});
+				if(f){
+					these.device = f;
+					console.log("获取到设备",f);
+					these.initDevice();
+				}else{
+					console.log("未获取到设备");
+				}
+			})
 		},
 		methods: {
-			
+			initDevice: function() {
+				request({
+					url: 'app/device/getDeviceInfoByDeviceMac',
+					method: 'GET',
+					data: {						
+						deviceMac: these.device.macAddress
+					}
+				}).then(res=>{
+					console.log("获取设备信息",res);
+				}).catch((ex)=>{
+					console.log("获取设备出现异常:",ex);
+				});
+			},
+			Link() {
+				// 调用绑定设备接口
+				
+				let f=ble.data.LinkedList.find((v)=>{
+					return v.deviceId=these.device.deviceId;
+				});
+				if(!f){
+					these.Statu.bound = false;
+					these.Statu.boundRemark = "蓝牙连接不成功";					
+					return;
+				}
+				if(!f.macAddress){
+					these.Statu.bound = false;
+					these.Statu.boundRemark = "获取设备Mac地址异常";
+					return;
+				}
+				these.Statu.bound = null;
+				these.Statu.boundRemark = "";
+				uni.showLoading({
+					mask: true,
+					title: "连接中..."
+				})
+				let promise = request({
+					url: '/app/device/bind',
+					method: 'POST',
+					data: {
+						deviceImei: '',
+						deviceMac: these.device.macAddress,
+						communicationMode: '1', //0是4g,1是蓝牙
+					}
+				});
+				promise.then((res) => {
+					console.log("1111" + JSON.stringify(res));
+					if (res.code == 200) {					
+						these.Statu.bound = true;
+						these.Statu.boundRemark = "设备绑定成功!";
+						uni.$emit("refreshDeviceList");
+						setTimeout(()=>{
+						uni.switchTab({
+							url:"/pages/common/index/index"
+						});	
+						},500);						
+					} else {
+						these.Statu.bound = false;
+						these.Statu.boundRemark = res.msg;
+					}
+				}).catch((ex) => {
+					these.Statu.bound = false;
+					these.Statu.boundRemark = '出现了未知的异常,操作失败';
+				}).finally(() => {
+					uni.hideLoading();
+				});
+			}
 		}
 	}
 </script>
 
 <style>
+	.content {
+		background-color: #1d1d1d;
+		color: #ffffffde;
+		box-sizing: border-box;
+		overflow: hidden;
+		width: 100%;
+		min-height: 100vh;
+		height: auto;
+		font-family: "PingFang SC";
+	}
 
-</style>
+	.deviceDetail {
+		margin: 200rpx auto;
+		display: flex;
+		flex-direction: column;
+		flex-wrap: nowrap;
+		align-content: center;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.imgContent,
+	.titleIco {
+		width: 120rpx;
+		height: 120rpx;
+	}
+
+	.deviceId {
+		color: rgba(255, 255, 255, 0.87);
+		font-size: 32rpx;
+
+		line-height: 44rpx;
+		letter-spacing: 0.14rpx;
+		margin-top: 5rpx;
+	}
+
+	.btnLink {
+		position: fixed;
+		bottom: 30rpx;
+		left: 30rpx;
+		right: 30rpx;
+		width: calc(100% - 60rpx);
+		border-radius: 91px;
+		height: 90rpx;
+		background: rgba(187, 230, 0, 1);
+		color: rgba(35, 35, 35, 1);
+
+
+		font-size: 32rpx;
+		line-height: 90rpx;
+		letter-spacing: 12rpx;
+		text-align: center;
+	}
+
+	.bound,
+	.deviceName {
+		font-size: 32rpx;
+		font-weight: 400;
+		line-height: 44rpx;
+		letter-spacing: 0.14rpx;
+		margin-top: 5rpx;
+	}
+
+	.displayNone {
+		display: none !important;
+	}
+
+	.green {
+		color: rgba(187, 230, 0, 1);
+	}
+
+	.red {
+		color: rgba(245, 80, 80, 1);
+	}
+</style>

pages/common/addBLE/addEquip.vue

@@ -228,19 +228,7 @@
 				ble.showBlueSetting(false);
 			},
 			Link: function(item, index) {
-				ble.StopSearch();
+			
-				uni.navigateTo({
-					url:"/pages/common/addBLE/LinkBle",
-					events:{
-						Linked:function(data ){
-							console.log("收到数据了",data);
-						}
-					},
-					success(res) {
-						 res.eventChannel.emit('LinkItem', item)
-					}
-				});
-				return;
 				uni.showLoading({
 					title: "正在连接",
 					mask: true
@@ -258,6 +246,15 @@
 
 							these.PairEquip.push(item);
 						}
+						uni.navigateTo({
+							url:"/pages/common/addBLE/LinkBle",
+							events:{
+								
+							},
+							success(res) {
+								 res.eventChannel.emit('LinkItem', item)
+							}
+						});
 
 					}).catch((ex) => {
 						console.log("ex=",ex)