Browse Source

空调能做到对用户更友好提示。
增加下拉刷新列表和金额。

程志平 3 years ago
parent
commit
e9a847391d
1 changed files with 106 additions and 96 deletions
  1. 106 96
      pagesAir/shareAir/shareAir.vue

+ 106 - 96
pagesAir/shareAir/shareAir.vue

@@ -50,8 +50,9 @@
 			</view>
 		</view>
 		<view class="list-air" v-else>
-			<scroll-view scroll-y="true" :style="{height: screenHeight}" @scrolltoupper="scroll_to_upper"
-				@scrolltolower="scroll_to_lower">
+			<scroll-view scroll-y="true" :style="{height: screenHeight}" refresher-enabled="true"
+				:refresher-threshold="100" refresher-background="#FFF" :refresher-triggered="triggered"
+				@refresherrestore="onRestore" @refresherrefresh="scroll_to_refresh">
 				<view class="list-items" v-for="(item, index) in airs" :key="index">
 					<view v-if="item.on === true" class="item-air"
 						@longpress="itemLongPress($event, item.time, item.air_ip)">
@@ -61,10 +62,10 @@
 								<view class="circle2"></view>
 								<view class="circle3"></view>
 							</view>
-							<view class="item-title">{{item.name}}</view>
+							<view class="item-title">{{item.name_show}}</view>
 							<view class="item-info">
 								<text class="item-info-left">{{item.info}}</text>
-								<text>启动时间:</text><text>{{item.time}}</text>
+								<text>{{item.status}}</text><text>{{item.time}}</text>
 							</view>
 						</view>
 						<view class="item-right"
@@ -85,10 +86,11 @@
 								<view class="circle2"></view>
 								<view class="circle3"></view>
 							</view>
-							<view class="item-title">{{item.name}}</view>
+							<view class="item-title">{{item.name_show}}</view>
 							<view class="item-info">
 								<text class="item-info-left">{{item.info}}</text>
-								<image src="../static/images/power-off.png" mode="" class="item-info-icon"></image>
+								<!-- <image src="../static/images/power-off.png" mode="" class="item-info-icon"></image> -->
+								<text>{{item.status}}</text>
 								<text v-if="item.time !== ''">{{item.time}}</text>
 								<text v-else>未启动</text>
 							</view>
@@ -149,13 +151,15 @@
 				isList: false, // 是否显示添加的空调列表
 				screenHeight: '', // 屏幕的高度
 				options: 0,
-				time_string: '未知(其他人员使用中)',
+				time_string: '其他人员使用中',
+				triggered: false,
 				test: this.$store.state.test
 			};
 		},
 		onLoad(options) {
+			var _this = this;
 			// 系统正在维护...
-			if (this.test == 'weihuzhong') {
+			if (_this.test == 'weihuzhong') {
 				uni.redirectTo({
 					url: '../../pages/index/index'
 				})
@@ -163,24 +167,29 @@
 				return;
 			}
 
-			this.options = options
+			_this.options = options
 			try {
 				// 选择绑定了的空调
 				let airs_selected = uni.getStorageSync('airs_selected')
 				if (airs_selected.length > 0) {
 					// 使用存储的列表
-					this.selectAirs = airs_selected
+					_this.selectAirs = airs_selected
 				}
 			} catch (e) {
 				console.log('读取空调相关信息:' + e.message);
 			}
+
+			_this._freshing = false;
+			setTimeout(() => {
+				_this.triggered = true;
+			}, 500);
 		},
 		onShow() {
+			var _this = this;
 			// 从新计算高度
-			this.calc_screen_height();
+			_this.calc_screen_height();
 			// 监听全局的自定义事件,事件由 uni.$emit 触发,但仅触发一次,在第一次触发之后移除该监听器。
 			// 绑定空调
-			var _this = this;
 			uni.$once('selectAirs', data => {
 				// console.log(data.sel_airs);
 				// 拆分数组元素
@@ -214,20 +223,20 @@
 					var newArr = [...new Set(_this.selectAirs.map(e => JSON.stringify(e)))].map(e => JSON.parse(
 						e));
 
-					_this.selectAirs = newArr
+					_this.selectAirs = newArr;
 				}
 				// 存储空调列表
-				uni.setStorageSync('airs_selected', _this.selectAirs)
+				uni.setStorageSync('airs_selected', _this.selectAirs);
 				// 移除全局自定义事件监听器。
 				// uni.$off('selectAirs')
 			});
 
 			// 获取基本信息
-			this.get_base_info(this.options, 'onShow')
+			_this.get_base_info(_this.options, 'onShow');
 
 			setTimeout(() => {
 				uni.hideLoading();
-			}, 3000)
+			}, 3000);
 		},
 		methods: {
 			/**
@@ -238,15 +247,16 @@
 					title: '加载绑定的空调'
 				});
 
+				var _this = this;
 				const res = await this.$myRequest({
-					host: this.ceshi,
+					host: _this.ceshi,
 					url: '/airManage/usersqueryAir.action',
 					method: 'POST',
 					header: {
 						'content-type': 'application/x-www-form-urlencoded'
 					},
 					data: {
-						sfzh: this.id_card
+						sfzh: _this.id_card
 					}
 				})
 
@@ -254,32 +264,29 @@
 				if (res.data.code == 200) {
 					let data = res.data.data
 					if (data.length > 0) {
-						this.airs = []
+						_this.airs = []
 						let tmpAirs = []
 						for (var i = 0; i < data.length; i++) {
 							tmpAirs.push({
 								air_ip: data[i].air_ip,
 								name: data[i].school + '-' + data[i].build + '-' + data[i].floors + '-' + data[
-										i].dom +
-									'-' + data[i].air_name,
+									i].dom + '-' + data[i].air_name,
+								name_show: data[i].school + '-' + data[i].dom + '-' + data[i].air_name,
 								info: data[i].air_config,
 								time: '',
 								abnormal: data[i].is_normal,
 								on: data[i].is_on, // true开启了,false关闭了
 								order_num: '' // 订单号
 							})
-							// for (var j = 0; j < this.selectAirs.length; j++) {
-							// 	if (this.selectAirs[j].air_ip == data[i].air_ip) {
-							// 		tmpAirs.push(this.selectAirs[j])
+							// for (var j = 0; j < _this.selectAirs.length; j++) {
+							// 	if (_this.selectAirs[j].air_ip == data[i].air_ip) {
+							// 		tmpAirs.push(_this.selectAirs[j])
 							// 		break
 							// 	}
 							// }
 						}
 						// 不为空
 						if (tmpAirs.length > 0) {
-							// 按名称排序
-							tmpAirs.sort((a, b) => a.name.localeCompare(b.name));
-							let _this = this;
 							// 遍历状态
 							for (var i = 0; i < tmpAirs.length; i++) {
 								// 获取空调状态
@@ -291,7 +298,7 @@
 							}
 
 							setTimeout(() => {
-								if (this.airs.length > 0) {
+								if (_this.airs.length > 0) {
 									// 显示添加的空调列表
 									_this.isList = true;
 									uni.hideLoading();
@@ -300,14 +307,14 @@
 						}
 					} else {
 						// 隐藏添加的空调列表
-						this.isList = false
+						_this.isList = false
 					}
 				} else if (res.data.code == 205) {
 					// 隐藏添加的空调列表
-					this.isList = false
+					_this.isList = false
 				} else {
 					// 隐藏添加的空调列表
-					this.isList = false
+					_this.isList = false
 					// 提示返回信息
 					uni.showToast({
 						title: res.data.message
@@ -322,8 +329,9 @@
 			 * @param {Object} index
 			 */
 			async readAirsStatus(tmpAirs, index) {
-				const res = await this.$myRequest({
-					host: this.ceshi,
+				var _this = this;
+				const res = await _this.$myRequest({
+					host: _this.ceshi,
 					url: '/airManage/consumeStatus.action',
 					method: 'POST',
 					header: {
@@ -331,7 +339,7 @@
 					},
 					data: {
 						air_ip: tmpAirs[index].air_ip,
-						sfzh: this.id_card
+						sfzh: _this.id_card
 					}
 				})
 
@@ -340,37 +348,30 @@
 					let data = res.data;
 					if (data.is_on == 1) {
 						if (typeof data.order_num === 'undefined') {
-							// 提示返回信息
-							// uni.showToast({
-							// 	icon: 'none',
-							// 	title: '其他人员使用中!',
-							// 	duration: 3000
-							// })
-							tmpAirs[index].time = this.time_string;
+							tmpAirs[index].status = '状态:';
+							tmpAirs[index].time = _this.time_string;
 						} else {
+							tmpAirs[index].status = '启动时间:';
 							tmpAirs[index].time = data.start_time
 						}
 						tmpAirs[index].on = true
 						tmpAirs[index].order_num = data.order_num
 					} else {
+						tmpAirs[index].status = '状态:';
 						tmpAirs[index].on = false
 						tmpAirs[index].time = ''
 						tmpAirs[index].order_num = ''
 					}
 					// 更新自己绑定的空调列表
-					this.airs.push(tmpAirs[index])
-				} else if (res.data.code !== 200) {
+					_this.airs.push(tmpAirs[index])
+				} else {
+					tmpAirs[index].status = '状态:';
 					tmpAirs[index].time = res.data.message;
 					// 更新自己绑定的空调列表
-					this.airs.push(tmpAirs[index])
-				} else {
-					// uni.showToast({
-					// 	icon: 'none',
-					// 	title: tmpAirs[index].air_ip + ' ' + res.data.message,
-					// 	duration: 3000
-					// })
-					// console.log(tmpAirs[index].air_ip + ' ' + res.data.message);
+					_this.airs.push(tmpAirs[index])
 				}
+				// 按名称排序
+				_this.airs.sort((a, b) => a.name.localeCompare(b.name));
 			},
 			/**
 			 * 获取基本信息
@@ -447,11 +448,12 @@
 			 * 请求服务器,获得openid
 			 */
 			async getOpenId(options, param_code) {
-				if (typeof this.userinfo === 'object') {
-					this.userinfo = JSON.stringify(this.userinfo)
+				var _this = this;
+				if (typeof _this.userinfo === 'object') {
+					_this.userinfo = JSON.stringify(_this.userinfo)
 				}
-				const res = await this.$myRequest({
-					host: this.ceshi,
+				const res = await _this.$myRequest({
+					host: _this.ceshi,
 					url: '/airManage/usersopenid.action',
 					method: 'POST',
 					header: {
@@ -459,21 +461,21 @@
 					},
 					data: {
 						code: param_code,
-						userinfo: this.userinfo
+						userinfo: _this.userinfo
 					}
 				})
 
 				// console.log(res.data);
 				if (res.data.code == 200) {
 					// 查询用户基本信息
-					this.getCode(options, 'get_user_info')
+					_this.getCode(options, 'get_user_info')
 					// 绑定成功,提示返回信息,但没必要提示
 					// uni.showToast({
 					// 	title: res.data.message
 					// })
 				} else if (res.data.code == 205) {
 					// 查询用户基本信息
-					this.getCode(options, 'get_user_info')
+					_this.getCode(options, 'get_user_info')
 					// 用户已经存在,但没必要提示
 					// uni.showToast({
 					// title: res.data.message
@@ -500,8 +502,9 @@
 			 * @param {Object} code
 			 */
 			async getUserInfo(code) {
-				const res = await this.$myRequest({
-					host: this.ceshi,
+				var _this = this;
+				const res = await _this.$myRequest({
+					host: _this.ceshi,
 					url: '/airManage/usersget_user.action',
 					method: 'POST',
 					header: {
@@ -510,20 +513,20 @@
 					data: {
 						code: code
 					}
-				})
+				});
 
 				// console.log(res.data);
 				if (res.data.code == 200) {
 					// 余额
-					this.balance = res.data.data.balance.toFixed(2)
-					this.id_card = res.data.data.sfzh
+					_this.balance = res.data.data.balance.toFixed(2);
+					_this.id_card = res.data.data.sfzh;
 
 					// 查询绑定的空调(更新列表)
-					this.select_banding_airs()
+					_this.select_banding_airs();
 				} else {
 					uni.showToast({
 						title: res.data.message
-					})
+					});
 				}
 			},
 			/**
@@ -565,15 +568,16 @@
 			 * @param {Object} index
 			 */
 			async unbangding_airs(air_ip, index) {
-				const res = await this.$myRequest({
-					host: this.ceshi,
+				var _this = this;
+				const res = await _this.$myRequest({
+					host: _this.ceshi,
 					url: '/airManage/usersdelAir.action',
 					method: 'POST',
 					header: {
 						'content-type': 'application/x-www-form-urlencoded'
 					},
 					data: {
-						sfzh: this.id_card,
+						sfzh: _this.id_card,
 						air_ip: air_ip
 					}
 				});
@@ -581,11 +585,11 @@
 				// console.log(res.data);
 				if (res.data.code == 200) {
 					// 删除指定下标的元素
-					this.airs.splice(index, 1);
-					uni.setStorageSync('airs_selected', this.airs);
+					_this.airs.splice(index, 1);
+					uni.setStorageSync('airs_selected', _this.airs);
 
-					if (this.airs.length == 0) {
-						this.isList = false;
+					if (_this.airs.length == 0) {
+						_this.isList = false;
 					}
 
 					uni.showToast({
@@ -629,7 +633,7 @@
 					return;
 				}
 
-				if (this.airs[index].on) {
+				if (_this.airs[index].on) {
 					uni.showModal({
 						title: '提示',
 						content: '确认【关闭】空调吗?',
@@ -693,15 +697,16 @@
 					mask: true
 				});
 
+				var _this = this;
 				const res = await this.$myRequest({
-					host: this.ceshi,
+					host: _this.ceshi,
 					url: '/airManage/consumeend.action',
 					method: 'POST',
 					header: {
 						'content-type': 'application/x-www-form-urlencoded'
 					},
 					data: {
-						sfzh: this.id_card,
+						sfzh: _this.id_card,
 						order_num: order_num,
 						air_ip: air_ip
 					}
@@ -721,12 +726,15 @@
 					// console.log(res.data)
 					if (res.data.code == 200) {
 						// 显示已经关闭图标
-						this.airs[index].on = false
-						this.airs[index].time = '未启动'
+						_this.airs[index].status = '状态:';
+						_this.airs[index].on = false;
+						_this.airs[index].time = '未启动';
 						uni.showToast({
 							title: '关闭成功!',
 							duration: 2000,
 							success() {
+								// 获取基本信息
+								_this.get_base_info(_this.options, 'onShow');
 								setTimeout(() => {
 									uni.hideLoading();
 								}, 1000);
@@ -735,7 +743,9 @@
 					} else {
 						if (res.data.message == '该订单已结算,请勿重复结算') {
 							// 显示已经关闭图标
-							this.airs[index].on = false
+							_this.airs[index].status = '状态:';
+							_this.airs[index].on = false;
+							_this.airs[index].time = '设备已结算';
 						}
 						uni.showToast({
 							icon: 'none',
@@ -805,6 +815,7 @@
 							duration: 2000,
 							success() {
 								// 将开启按钮变成关闭按钮
+								_this.airs[index].status = '启动时间:';
 								_this.airs[index].on = true;
 								_this.airs[index].time = res.data.start_time;
 								setTimeout(() => {
@@ -826,25 +837,24 @@
 					}
 				}
 			},
-			/**
-			 * 滚动到顶部提示
-			 */
-			scroll_to_upper() {
-				uni.showToast({
-					title: '到顶了!',
-					icon: 'none',
-					duration: 500
-				})
+			scroll_to_refresh() {
+				var _this = this;
+				// 获取基本信息
+				_this.get_base_info(_this.options, 'onShow');
+				// 查询绑定的空调(更新列表)
+				_this.select_banding_airs();
+
+				if (_this._freshing)
+					return;
+
+				_this._freshing = true;
+				setTimeout(() => {
+					_this.triggered = false;
+					_this._freshing = false;
+				}, 1000);
 			},
-			/**
-			 * 滚动到底部提示
-			 */
-			scroll_to_lower() {
-				uni.showToast({
-					title: '到底了!',
-					icon: 'none',
-					duration: 500
-				})
+			onRestore() {
+				this.triggered = true; // 需要重置
 			},
 			/**
 			 * 轮播图发生改变