Переглянути джерело

设备正在工作的提示

lilei 4 роки тому
батько
коміт
8d534087f0
2 змінених файлів з 56 додано та 4 видалено
  1. 50 2
      pages/index/index.vue
  2. 6 2
      pages/work/index/index.vue

+ 50 - 2
pages/index/index.vue

@@ -15,6 +15,13 @@
 		<view class="pageContent">
 			<map id="map" :latitude="lat" :longitude="lng" scale="14" show-compass :markers="markers" @markertap="markertap"
 			 show-location style="width: 100%; height:100%;">
+			 <!-- 信息提示 -->
+			 <cover-view class="work-message"  @click="toWork" v-if="workStatus!='stop'">
+				 <cover-view class="work-message-in">
+					 <cover-view class="view">洗车机正在工作中...</cover-view>
+					 <cover-view class="view">点击进入</cover-view>
+				 </cover-view>
+			 </cover-view>
 			 <!-- 左边控件 -->
 				<view class="cover-view">
 					<view class="flex-wrp">
@@ -37,7 +44,10 @@
 					<cover-image class="img" @click="moveToLocation" src="/static/img/location.png"></cover-image>
 				</view>
 				<view class="cover-bottom">
-					<button @click="scanCode" type="warn">扫码洗车</button>
+					<button @click="scanCode" type="warn">
+						<u-icon name="scan" color="#fff" size="38"></u-icon> 
+						扫码洗车
+					</button>
 				</view>
 			</map>
 		</view>
@@ -55,6 +65,7 @@
 		},
 		data() {
 			return {
+				workStatus:'',
 				mapCtx: null, // 地图对象
 				markers: [], // 标注点
 				lng: '',
@@ -109,11 +120,19 @@
 		},
 		onShow() {
 			console.log(this.$store.state.vuex_orderInfo,'vuex_orderInfo')
+			console.log(this.$store.state.vuex_workStatus,'vuex_workStatus')
 		},
 		onLoad() {
 			this.getUserLocation()
+			this.workStatus = this.$store.state.vuex_workStatus
 		},
 		methods: {
+			// 如果机器正在运行,提示并点击跳转的运行界面
+			toWork(){
+				uni.navigateTo({
+					url: "/pages/work/index/index"
+				})
+			},
 			// 用户位置信息授权
 			getUserLocation() {
 				let _this = this
@@ -312,7 +331,33 @@
 		.pageContent {
 			width: 100%;
 			flex: 1;
-
+			.work-message{
+				position: absolute;
+				top: 6%;
+				width: 80%;
+				left: 50%;
+				margin-left: -40%;
+				background: rgba(0,0,0,0.6);
+				border-radius: 100rpx;
+				color: #eee;
+				.work-message-in{
+					display: flex;
+					align-items: center;
+					padding: 26rpx;
+					.view{
+						&:first-child{
+							flex-grow: 1;
+							text-align: center;
+						}
+						&:last-child{
+							font-size: 24rpx;
+							color: #fff;
+							display: flex;
+							align-items: center;
+						}
+					}
+				}
+			}
 			.cover-view {
 				position: absolute;
 				top: calc(60% - 150rpx);
@@ -356,6 +401,9 @@
 				left: calc(9%);
 				uni-button[type=warn]{
 					background: red;
+					u-icon{
+						margin-right: 15rpx;
+					}
 				}
 			}
 

+ 6 - 2
pages/work/index/index.vue

@@ -176,7 +176,6 @@ export default {
 							cmd.operateType = 'stop' //操作命令
 							_this.$store.commit("$sendWebsocket",JSON.stringify(cmd))
 							_this.showStop = true;
-							_this.status = 'stop';
 				        }
 				    }
 				});
@@ -185,6 +184,7 @@ export default {
 		// 启动成功
 		startWashCarSuccess(){
 			this.status = 'working';
+			this.$store.state.vuex_workStatus = 'working'
 			this.curWorkStutesText='设备已启动';
 			this.showStart = false;
 			// 进度条,服务时间根据不同的服务类型而不同
@@ -202,12 +202,15 @@ export default {
 		// 紧急停止成功
 		stopWashCarSuccess(){
 			// 显示急停提示弹框
+			this.status = 'stop';
+			this.$store.state.vuex_workStatus = 'stop'
 			this.curWorkStutesText='设备已紧急停止';
 			this.resetLoadingStatus();
 		},
 		// 洗车完成
 		washCarSuccess(){
 			this.status = "success";
+			this.$store.state.vuex_workStatus = 'stop'
 			this.curWorkStutesText='洗车已结束';
 			this.resetLoadingStatus();
 			// 关闭socket
@@ -251,13 +254,14 @@ export default {
 				washType: this.washCarType,// 洗车模式
 			}
 			this.$store.commit("$sendWebsocket",JSON.stringify(cmd))
-			this.status = 'reseting';
 			this.showStart = true;
 			this.showStop = false;
 		},
 		// 归位结束后
 		resetRabtSuccess(){
 			this.curWorkStutesText='设备已归位';
+			this.status = 'reseting';
+			this.$store.state.vuex_workStatus = 'stop';
 			// 关闭socket
 			this.$store.commit("$closeWebsocket");
 			uni.redirectTo({