说明：首页用户绑定模态框，进行了优化。

App.vue

@@ -19,9 +19,9 @@
 	/*每个页面公共css */
 	@font-face {
 	  font-family: "iconfont"; /* Project id 2649342 */
-	  src: url('//at.alicdn.com/t/font_2649342_4vjqgtg661.woff2?t=1625907458371') format('woff2'),
-	       url('//at.alicdn.com/t/font_2649342_4vjqgtg661.woff?t=1625907458371') format('woff'),
-	       url('//at.alicdn.com/t/font_2649342_4vjqgtg661.ttf?t=1625907458371') format('truetype');
+	  src: url('//at.alicdn.com/t/font_2649342_ejw0s9epmuw.woff2?t=1627727529329') format('woff2'),
+	       url('//at.alicdn.com/t/font_2649342_ejw0s9epmuw.woff?t=1627727529329') format('woff'),
+	       url('//at.alicdn.com/t/font_2649342_ejw0s9epmuw.ttf?t=1627727529329') format('truetype');
 	}
 	
 	.iconfont {
@@ -32,6 +32,14 @@
 	  -moz-osx-font-smoothing: grayscale;
 	}
 	
+	.icon-cardid:before {
+	  content: "\e621";
+	}
+	
+	.icon-shengchengmingpianicon:before {
+	  content: "\e636";
+	}
+	
 	.icon-zhongzhi:before {
 	  content: "\e60a";
 	}
@@ -87,16 +95,4 @@
 	.icon-qian:before {
 	  content: "\e7a9";
 	}
-	
-	.icon-5_zhongzhi:before {
-	  content: "\e67a";
-	}
-	
-	.icon-sanjiaoxing:before {
-	  content: "\e6e6";
-	}
-	
-	.icon-jiantou:before {
-	  content: "\e624";
-	}
 </style>

pages/index/index.vue

@@ -16,12 +16,15 @@
 			</view>
 		</view>
 		<!--弹窗-->
-		<modal v-if="showPop" title="请输入学号、身份证号" confirm-text="确定" cancel-text="取消" @cancel="cancelPop"
-			@confirm="confirmPop">
-			<view class="">学号：</view>
-			<input type='text' class="stu-number" maxlength="14" placeholder="请输入学号" v-model="stu_number" />
-			<view class="">身份证号：</view>
-			<input type='text' class="stu-number" maxlength="18" placeholder="请输入身份证号" v-model="id_card" />
+		<modal v-if="showPop" title="用户绑定" confirm-text="确定" cancel-text="重置" @cancel="resetPop" @confirm="confirmPop">
+			<view class="lineGroup">
+				<text class="iconfont icon-shengchengmingpianicon label-icon"></text>
+				<input type='text' class="stu-number" maxlength="14" placeholder="请输入学号" v-model="stu_number" />
+			</view>
+			<view class="lineGroup">
+				<text class="iconfont icon-cardid label-icon"></text>
+				<input type='text' class="stu-number" maxlength="18" placeholder="请输入身份证号码" v-model="id_card" />
+			</view>
 		</modal>
 	</view>
 </template>
@@ -80,7 +83,7 @@
 			/**
 			 * 弹窗
 			 */
-			confirmPop() { //确认
+			confirmPop() { // 确认
 				if (this.stu_number.length == 14 && this.id_card.length == 18) {
 					this.showPop = false
 					// 获得code
@@ -92,18 +95,20 @@
 					});
 				}
 			},
-			cancelPop() { //取消
-				// this.stu_number = ''
-				// this.showPop = false
+			resetPop() { // 重置
+				this.stu_number = ''
+				this.id_card = ''
 			},
-			// 获得code
+			/**
+			 * param获得code
+			 */
 			getCode(param) {
 				uni.login({
 					success: (res) => {
 						// console.log('index', res);
 						if (res.code) {
-							// 请求服务器，获得openid
 							if (param == 'confirm')
+								// 请求服务器，获得openid
 								this.getOpenId(res.code)
 							else
 								this.selectUser(res.code)
@@ -231,14 +236,32 @@
 			}
 		}
 
-		.stu-number {
-			margin-top: 20rpx;
-			color: #00c200;
-			text-align: center;
+		.lineGroup {
+			display: flex;
+			flex-direction: row;
+			border-bottom: 1px solid #c2c2c2;
 			font-size: 38rpx;
-			font-weight: bold;
-			height: 50rpx;
-			line-height: 50rpx;
+			white-space: nowrap;
+
+			.label-icon {
+				display: flex;
+				flex-direction: row;
+				justify-items: right;
+				align-items: center;
+				font-size: 58rpx;
+				width: 88rpx;
+				height: 88rpx;
+				line-height: 88rpx;
+				color: $my-color-primary;
+				margin: 22rpx 0 0 50rpx;
+			}
+
+			.stu-number {
+				margin-top: 20rpx;
+				color: #00c200;
+				height: 88rpx;
+				line-height: 88rpx;
+			}
 		}
 	}
 </style>

pages/reshui/reshui.vue

@@ -285,10 +285,10 @@
 									this.isChecked = true
 
 									// 开始连接匹配的蓝牙设备
-									// setTimeout(async () => {
-									// 请求获取设备启动码
-									this.request_device_start_code()
-									// }, 1000)
+									setTimeout(async () => {
+										// 请求获取设备启动码
+										this.request_device_start_code()
+									}, 300)
 								} else if (res.cancel) {
 									setTimeout(() => {
 										this.isChecked = false
@@ -666,7 +666,7 @@
 					},
 					fail: (err) => {
 						this.isScan = false
-						console.error('获取蓝牙设备特征值失败(getBLEDeviceCharacteristics)', err)
+						// console.error('获取蓝牙设备特征值失败(getBLEDeviceCharacteristics)', err)
 					}
 				});
 			},
@@ -732,12 +732,6 @@
 								// 关闭蓝牙连接
 								this.closeBLEConnection()
 
-								// 处理 35字节
-								// APP 接收后，根据用户操作情况主要做如下几个方面的处理。
-								// 1、向后台提交【结算数据】
-								// 2、提交【结算数据】并生成【启动代码】
-								// 3、提示：用户进行下面的流程
-
 								// 请求结算
 								this.request_pay()
 
@@ -972,31 +966,32 @@
 			 * 请求获取设备启动码
 			 */
 			async request_device_start_code() {
-				if (this.byte35 == '' || this.$store.state.stu_number == '') {
-					uni.showToast({
-						title: '字节码或学号为空！'
-					});
-					return
-				}
-				const res = await this.$myRequest({
-					host: this.ceshi,
-					url: '/HotWaters/wpstart.action',
-					data: {
-						collect_code: this.byte35,
-						stu_number: this.$store.state.stu_number
-					}
-				})
+				if (this.byte35 != '' && this.$store.state.stu_number != '') {
+					const res = await this.$myRequest({
+						host: this.ceshi,
+						url: '/HotWaters/wpstart.action',
+						data: {
+							collect_code: this.byte35,
+							stu_number: this.$store.state.stu_number
+						}
+					})
 
-				// console.log(res)
-				if (res.data.start_code != 'undefined' && res.data.start_code != '') {
-					this.start_code = res.data.start_code
-					this.send('start')
+					// console.log(res)
+					if (res.data.start_code != 'undefined' && res.data.start_code != '') {
+						this.start_code = res.data.start_code
+						this.send('start')
+					} else {
+						uni.showToast({
+							title: res.data.mess,
+							duration: 3000
+						})
+					}
 				} else {
 					uni.showToast({
-						icon: 'none',
-						title: '未获得启动码',
-						duration: 3000
-					})
+						title: '字节码或学号为空！'
+					});
+					// 初始化
+					this.setInit()
 				}
 			},
 
@@ -1004,40 +999,42 @@
 			 * 请求结算
 			 */
 			async request_pay() {
-				if (this.byte35.substring(2) == '') {
-					uni.showToast({
-						title: '字节码为空！',
-						icon: 'success'
-					});
-					return
-				}
-				const res = await this.$myRequest({
-					host: this.ceshi,
-					url: '/HotWaters/wpconsume.action',
-					data: {
-						collect_code: this.byte35.substring(2)
-					}
-				})
-
-				// console.log(res)
-				if (res.data.mess === "支付成功！") {
-					uni.showToast({
-						icon: 'success',
-						title: '结算成功！',
-						success: (res1) => {
-							this.use_amount = res.data.use_amount.toFixed(2)
-							this.amount = (this.amount - this.use_amount).toFixed(2)
-
-							// 刷新选定的月份消费记录
-							this.request_consumption_records()
+				if (this.byte35 != '') {
+					const res = await this.$myRequest({
+						host: this.ceshi,
+						url: '/HotWaters/wpconsume.action',
+						data: {
+							collect_code: this.byte35.substring(2)
 						}
 					})
+
+					// console.log(res)
+					if (res.data.mess == "支付成功") {
+						uni.showToast({
+							icon: 'success',
+							title: '结算成功！',
+							success: (res1) => {
+								this.use_amount = res.data.use_amount.toFixed(2)
+								this.amount = (this.amount - this.use_amount).toFixed(2)
+
+								// 刷新选定的月份消费记录
+								this.request_consumption_records()
+							}
+						})
+					} else {
+						uni.showToast({
+							icon: 'success',
+							title: '结算失败！',
+							duration: 3000
+						})
+					}
 				} else {
 					uni.showToast({
-						icon: 'success',
-						title: '结算失败！',
-						duration: 3000
-					})
+						title: '字节码为空！',
+						icon: 'success'
+					});
+					// 初始化
+					this.setInit()
 				}
 			}
 		}
@@ -1048,7 +1045,7 @@
 	 */
 	function str2StrArray(start_code) {
 		if (start_code.length != 34) {
-			console.log('启动码长度错误')
+			// console.log('启动码长度错误')
 			throw new Error("启动码长度错误");
 			return
 		}