|
@@ -1,7 +1,7 @@
|
|
|
<template>
|
|
|
<view class="work-pages">
|
|
|
<!-- 工作控制按钮及进度 -->
|
|
|
- <view class="work-cons flex-center">
|
|
|
+ <view class="work-cons flex-center" style="flex-direction: column;">
|
|
|
<!-- 操作按钮组件 -->
|
|
|
<view class="work-button-wrap">
|
|
|
<!-- 按钮 -->
|
|
@@ -24,10 +24,10 @@
|
|
|
{{ status == 'working' ? '紧急停止' : '点击启动' }}
|
|
|
</view>
|
|
|
</view>
|
|
|
- <!-- 状态提示 -->
|
|
|
- <view class="work-button-tips">
|
|
|
- {{curWorkStutesText}}
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ <!-- 状态提示 -->
|
|
|
+ <view class="work-button-tips">
|
|
|
+ <u-notice-bar type="error" border-radius="50" color="#fff" bg-color="#666" mode="vertical" :list="[curWorkStutesText,curWorkStutesText]"></u-notice-bar>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 说明提示 -->
|
|
@@ -66,12 +66,12 @@
|
|
|
<u-popup v-model="showStart" :mask-close-able="false" border-radius="10" mode="center" width="500rpx" height="400rpx">
|
|
|
<view style="padding: 30rpx;display: flex;justify-content: center;text-align: center;">
|
|
|
<!-- 启动中 -->
|
|
|
- <view v-if="status == 'start'">
|
|
|
+ <view v-if="status == 'starting'">
|
|
|
<u-image width="216px" height="120px" src="/static/img/start.png"></u-image>
|
|
|
<view style="padding: 15rpx;">洗车机正在启动...</view>
|
|
|
</view>
|
|
|
<!-- 停止中 -->
|
|
|
- <view v-if="status == 'stop'">
|
|
|
+ <view v-if="status == 'stoping'">
|
|
|
<u-image width="216px" height="120px" src="/static/img/start.png"></u-image>
|
|
|
<view style="padding: 15rpx;">洗车机正在停止中...</view>
|
|
|
</view>
|
|
@@ -99,7 +99,7 @@
|
|
|
</view>
|
|
|
<view style="display: flex;padding: 20rpx 0;justify-content: center;">
|
|
|
<u-button @click="callPhone" style="width: 45%;border-radius: 0;margin-right: 5%;">联系客服</u-button>
|
|
|
- <u-button @click="resetRabt" style="width: 45%;" type="error">洗车机归位</u-button>
|
|
|
+ <u-button @click="sendCmdRabt('reset')" style="width: 45%;" type="error">洗车机归位</u-button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -116,60 +116,84 @@ export default {
|
|
|
ldeg: -135, /// 进度条初始角度
|
|
|
step: 0, // 进度条增值,共60步
|
|
|
interId: null, // 进度时间id
|
|
|
- status: 'start', // 状态,start 开始启动,working 正在工作,stop急停,reseting 归位中, success 洗车成功
|
|
|
+ status: 'linking', // 状态,linking 连接中,start 开始启动, starting 启动中,working 正在工作,stoping 停止中, reset 归位,reseting 归位中, end 洗车完成
|
|
|
curWorkStutesText: '设备准备就绪', // 当前机器运行的进度提示
|
|
|
showStart: false ,// 启动弹框提示
|
|
|
showStop: false, // 急停提示
|
|
|
washCarType: '', // 洗车服务类型,不同的类型对应的时间不一样
|
|
|
- washDuration: 0, // 机器运行时间
|
|
|
+ washDuration: 7.5, // 机器运行步骤,共8步,等分60
|
|
|
orderNo: '',// 订单编号
|
|
|
};
|
|
|
},
|
|
|
onShow() {
|
|
|
console.log("onShow")
|
|
|
// 计算当前倒计时
|
|
|
- let od = this.$store.state.orderDjs
|
|
|
+ let od = this.$store.state.vuex_orderDjs
|
|
|
if(od!=0){
|
|
|
let d = new Date().getTime() - od
|
|
|
this.timestamp = 300 - d/1000
|
|
|
}
|
|
|
- // 计算当前进度条步数
|
|
|
- let ld = this.$store.state.loadingDjs
|
|
|
- let serverTime = this.washDuration / 60 * 1000
|
|
|
- if(ld!=0){
|
|
|
- let lod = new Date().getTime() - ld
|
|
|
- this.step = this.step + Math.floor(lod/serverTime)
|
|
|
- }
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
console.log("onLoad")
|
|
|
// 创建websocket
|
|
|
- this.$store.commit('$webSocket')
|
|
|
- uni.showLoading({
|
|
|
- title: '正在连接...',
|
|
|
- mask: true
|
|
|
- })
|
|
|
+ if(!this.$store.vuex_socket){
|
|
|
+ this.$store.commit('$webSocket')
|
|
|
+ // uni.showLoading({
|
|
|
+ // title: '正在连接...',
|
|
|
+ // mask: true
|
|
|
+ // })
|
|
|
+ // 记录当前的时间
|
|
|
+ this.$store.state.vuex_orderDjs = new Date().getTime()
|
|
|
+ }
|
|
|
+
|
|
|
+ // 更新进度条
|
|
|
+ this.step = this.$store.state.vuex_workStep
|
|
|
+ this.loading()
|
|
|
+
|
|
|
// 获取用户及订单信息
|
|
|
let orderInfo = this.$store.state.vuex_orderInfo
|
|
|
this.washCarType = orderInfo.itemCode
|
|
|
this.orderNo = orderInfo.orderNo
|
|
|
- this.washDuration = orderInfo.duration
|
|
|
- // 记录当前的时间
|
|
|
- this.$store.state.orderDjs = new Date().getTime()
|
|
|
-
|
|
|
+
|
|
|
// 监听消息
|
|
|
- uni.$on('wsMessage',(e)=>{
|
|
|
+ uni.$on('wsMessage', this.watchMessage)
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ // 开始复位时关闭当前页面
|
|
|
+ if(this.status = 'reseting'){
|
|
|
+ // 关闭socket
|
|
|
+ this.$store.commit("$closeWebsocket");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ uni.$off('wsMessage', this.watchMessage)
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 电话客服
|
|
|
+ callPhone () {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: '15202957025'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 倒计时结束时,自动完成洗车订单
|
|
|
+ endDtime() {
|
|
|
+ if(this.status == 'start'){
|
|
|
+ this.washCarSuccess()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 监听socket消息
|
|
|
+ watchMessage(e){
|
|
|
if(typeof e == 'string'){
|
|
|
// 连接成功
|
|
|
if(e=='connected'){
|
|
|
console.log('connected')
|
|
|
- uni.hideLoading()
|
|
|
+ // uni.hideLoading()
|
|
|
+ this.status = 'start'
|
|
|
}
|
|
|
}
|
|
|
- console.log(typeof e)
|
|
|
if(typeof e == 'object' && e.type == 'xcz'){
|
|
|
- console.log(e.data.level,e.data.msgCode,e.data.msgCodeInfo)
|
|
|
- console.log("--------------------------------------------")
|
|
|
+ console.log(e.data.level,e.data.msgCodeInfo,e.data.msgCodeSrc)
|
|
|
// 启动超时
|
|
|
if(e.data.level == 'O'){
|
|
|
if(e.data.msgCode == "PAUSE"){
|
|
@@ -177,10 +201,14 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
// 进度消息
|
|
|
- if(e.data.level == 'C'&&this.status!="reseting"){
|
|
|
+ if(e.data.level == 'C'&&this.status!="reseting"&&e.data.msgCodeSrc){
|
|
|
+ this.curWorkStutesText= e.data.msgCodeInfo
|
|
|
// 启动成功
|
|
|
this.startWashCarSuccess()
|
|
|
- this.curWorkStutesText= e.data.msgCodeInfo
|
|
|
+ // 更新进度条
|
|
|
+ this.step = e.data.msgCodeSrc?Number(e.data.msgCodeSrc.split('-')[1]):0
|
|
|
+ this.$store.state.vuex_workStep = this.step
|
|
|
+ this.loading()
|
|
|
// 洗车完成
|
|
|
if(e.data.msgCode=="XCWC"){
|
|
|
this.washCarSuccess()
|
|
@@ -188,32 +216,27 @@ export default {
|
|
|
}
|
|
|
// 错误消息
|
|
|
if(e.data.level == 'F'&&this.status!="reseting"){
|
|
|
+ this.curWorkStutesText= e.data.msgCodeInfo
|
|
|
// 启动成功
|
|
|
this.startWashCarSuccess()
|
|
|
- this.curWorkStutesText= e.data.msgCodeInfo
|
|
|
// 显示复位提示弹框
|
|
|
- this.showStop = true;
|
|
|
- this.status = 'stop';
|
|
|
- this.stopWashCarSuccess();
|
|
|
+ this.showReset()
|
|
|
}
|
|
|
// 急停
|
|
|
if(e.data.level == 'A'){
|
|
|
if(e.data.msgCode=="JJTZ"||e.data.msgCode=="XCX_JJTZ"){
|
|
|
this.curWorkStutesText= e.data.msgCodeInfo
|
|
|
// 显示复位提示弹框
|
|
|
- this.showStop = true;
|
|
|
- this.stopWashCarSuccess();
|
|
|
+ this.showReset()
|
|
|
}else{
|
|
|
this.devError()
|
|
|
}
|
|
|
}
|
|
|
// 复位状态
|
|
|
if(e.data.level == 'D'){
|
|
|
- // 开始复位
|
|
|
+ // 开始复位中
|
|
|
if(e.data.msgCode=="FW_START"){
|
|
|
- this.status = 'reseting';
|
|
|
- this.showStart = true;
|
|
|
- this.showStop = false;
|
|
|
+ this.reseting()
|
|
|
}
|
|
|
// 复位成功
|
|
|
if(e.data.msgCode=="FW_SUCC"){
|
|
@@ -225,39 +248,31 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- })
|
|
|
- },
|
|
|
- onUnload() {
|
|
|
- // 开始复位时关闭当前页面
|
|
|
- if(this.status = 'reseting'){
|
|
|
- // 关闭socket
|
|
|
- this.$store.commit("$closeWebsocket");
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 电话客服
|
|
|
- callPhone () {
|
|
|
- uni.makePhoneCall({
|
|
|
- phoneNumber: '15202957025'
|
|
|
- })
|
|
|
},
|
|
|
- // 倒计时结束时,自动完成洗车订单
|
|
|
- endDtime() {
|
|
|
- this.washCarSuccess()
|
|
|
+ // 重置到进度条初始状态
|
|
|
+ resetLoadingStatus(){
|
|
|
+ this.rdeg= -135;
|
|
|
+ this.ldeg= -135;
|
|
|
+ },
|
|
|
+ // 洗车机进度条动画
|
|
|
+ loading() {
|
|
|
+ if(this.step==16){this.step = 8}
|
|
|
+ let second = this.step*this.washDuration
|
|
|
+ if (second <= 30) {
|
|
|
+ this.rdeg = -135 + 6 * second;
|
|
|
+ this.ldeg = -135;
|
|
|
+ } else {
|
|
|
+ this.rdeg = 45;
|
|
|
+ this.ldeg = -135 + 6 * (second - 30);
|
|
|
+ }
|
|
|
},
|
|
|
// 操作按钮
|
|
|
startWork() {
|
|
|
let _this = this
|
|
|
- let cmd = {
|
|
|
- orderNo: this.orderNo, // 订单编号
|
|
|
- washType: this.washCarType,// 洗车模式
|
|
|
- }
|
|
|
// 启动
|
|
|
if (this.status == 'start') {
|
|
|
- cmd.operateType = 'start' //操作命令
|
|
|
- this.$store.commit("$sendWebsocket",JSON.stringify(cmd))
|
|
|
- this.showStart = true
|
|
|
- this.$store.state.vuex_workStatus = 'start'
|
|
|
+ this.sendCmdRabt("start")
|
|
|
+ this.starting()
|
|
|
}
|
|
|
// 急停
|
|
|
if (this.status == 'working') {
|
|
@@ -266,78 +281,114 @@ export default {
|
|
|
content: '确定紧急停止洗车机?',
|
|
|
success: function (res) {
|
|
|
if (res.confirm) {
|
|
|
- cmd.operateType = 'stop' //操作命令
|
|
|
- _this.$store.commit("$sendWebsocket",JSON.stringify(cmd))
|
|
|
- _this.status = 'stop'
|
|
|
+ _this.sendCmdRabt("stop")
|
|
|
+ _this.stoping()
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
- // 启动超时
|
|
|
- startWashCarFail(){
|
|
|
- this.showStart = false;
|
|
|
- uni.showModal({
|
|
|
- title: '提示',
|
|
|
- content: '设备启动超时,请重新点击启动',
|
|
|
- showCancel: false,
|
|
|
- });
|
|
|
+ // 启动中
|
|
|
+ starting(){
|
|
|
+ this.showStart = true;
|
|
|
+ this.status = 'starting';
|
|
|
+ this.$store.state.vuex_workStatus = 'starting';
|
|
|
+ this.curWorkStutesText='设备启动中';
|
|
|
},
|
|
|
// 启动成功
|
|
|
startWashCarSuccess(){
|
|
|
// 进度条,服务时间根据不同的服务类型而不同
|
|
|
- if(!this.interId){
|
|
|
- this.status = 'working';
|
|
|
- this.$store.state.vuex_workStatus = 'working'
|
|
|
- this.curWorkStutesText='设备已启动';
|
|
|
+ if(this.step==0){
|
|
|
this.showStart = false;
|
|
|
- this.step = 0;
|
|
|
- let serverTime = this.washDuration / 60; // 转换成分钟
|
|
|
- // 记录当前的开始时间
|
|
|
- this.$store.state.loadingDjs = new Date().getTime()
|
|
|
- this.interId = setInterval(()=>{
|
|
|
- // 小于60时说明洗车机正在工作中
|
|
|
- if(this.step<=60){
|
|
|
- this.loading(this.step++)
|
|
|
- }else{
|
|
|
- // 洗车机正常状态下工作结束
|
|
|
- // this.washCarSuccess()
|
|
|
- this.step = 0
|
|
|
- }
|
|
|
- },1000*serverTime)
|
|
|
+ this.status = 'working';
|
|
|
+ this.$store.state.vuex_workStatus = 'working';
|
|
|
}
|
|
|
},
|
|
|
- // 设备停止成功
|
|
|
- stopWashCarSuccess(){
|
|
|
- this.$store.state.vuex_workStatus = 'stop'
|
|
|
- this.curWorkStutesText='设备已停止';
|
|
|
+ // 启动超时
|
|
|
+ startWashCarFail(){
|
|
|
+ this.showStart = false;
|
|
|
+ this.status = 'start';
|
|
|
+ this.$store.state.vuex_workStatus = 'start';
|
|
|
+ this.curWorkStutesText='设备启动超时,请重新点击启动'
|
|
|
+ uni.showToast({
|
|
|
+ title: "设备启动超时",
|
|
|
+ duration: 3000
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 发送命令,start 启动,stop 急停,reset 归位
|
|
|
+ sendCmdRabt(cmdCode){
|
|
|
+ // 归位命令
|
|
|
+ let cmd = {
|
|
|
+ orderNo: this.orderNo, // 订单编号
|
|
|
+ operateType: cmdCode, //操作命令
|
|
|
+ washType: this.washCarType,// 洗车模式
|
|
|
+ }
|
|
|
+ this.$store.commit("$sendWebsocket",JSON.stringify(cmd))
|
|
|
+ },
|
|
|
+ // 停止中
|
|
|
+ stoping(){
|
|
|
+ this.showStart = true;
|
|
|
+ this.status = 'stoping';
|
|
|
+ this.$store.state.vuex_workStatus = 'stoping';
|
|
|
+ this.curWorkStutesText='设备停止中';
|
|
|
+ },
|
|
|
+ // 停止成功后或有F类错误时,显示复位弹框
|
|
|
+ showReset(){
|
|
|
+ this.showStart = false;
|
|
|
+ this.showStop = true;
|
|
|
+ this.status = 'reset';
|
|
|
+ this.$store.state.vuex_workStatus = 'reset'
|
|
|
this.resetLoadingStatus();
|
|
|
},
|
|
|
- // 设备异常
|
|
|
- devError(){
|
|
|
- this.stopWashCarSuccess();
|
|
|
+ // 归位中
|
|
|
+ reseting(){
|
|
|
+ this.status = 'reseting';
|
|
|
+ this.$store.state.vuex_workStatus = 'reseting';
|
|
|
+ this.showStart = true;
|
|
|
+ this.showStop = false;
|
|
|
+ },
|
|
|
+ // 归位结束后
|
|
|
+ resetRabtSuccess(){
|
|
|
+ this.curWorkStutesText='设备已归位';
|
|
|
+ this.status = 'end';
|
|
|
+ this.$store.state.vuex_workStatus = 'end';
|
|
|
// 关闭socket
|
|
|
this.$store.commit("$closeWebsocket");
|
|
|
+ // 跳转到复位成功页面
|
|
|
+ uni.redirectTo({
|
|
|
+ url:"/pages/work/success/success?type=1"
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 洗车完成
|
|
|
+ washCarSuccess(){
|
|
|
+ this.status = "end";
|
|
|
+ this.$store.state.vuex_workStatus = 'end'
|
|
|
+ this.curWorkStutesText='洗车已结束';
|
|
|
+ this.resetLoadingStatus();
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
- content: '设备异常,请联系客服',
|
|
|
+ content: '洗车已结束',
|
|
|
showCancel: false,
|
|
|
success: function (res) {
|
|
|
if (res.confirm) {
|
|
|
- uni.navigateBack()
|
|
|
+ // 跳转到成功页面
|
|
|
+ uni.redirectTo({
|
|
|
+ url:"/pages/work/success/success?type=0"
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
+ // 关闭socket
|
|
|
+ this.$store.commit("$closeWebsocket")
|
|
|
},
|
|
|
- // 洗车完成
|
|
|
- washCarSuccess(){
|
|
|
- this.status = "success";
|
|
|
- this.$store.state.vuex_workStatus = 'stop'
|
|
|
- this.curWorkStutesText='洗车已结束';
|
|
|
+ // 设备异常
|
|
|
+ devError(){
|
|
|
+ this.status = "end";
|
|
|
+ this.$store.state.vuex_workStatus = 'end'
|
|
|
this.resetLoadingStatus();
|
|
|
uni.showModal({
|
|
|
title: '提示',
|
|
|
- content: '洗车已结束',
|
|
|
+ content: '设备异常,请联系客服',
|
|
|
showCancel: false,
|
|
|
success: function (res) {
|
|
|
if (res.confirm) {
|
|
@@ -345,49 +396,9 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
- console.log('washCarSuccess')
|
|
|
- // 关闭socket
|
|
|
- this.$store.commit("$closeWebsocket")
|
|
|
- },
|
|
|
- // 重置到进度条初始状态
|
|
|
- resetLoadingStatus(){
|
|
|
- // 停止进度
|
|
|
- this.rdeg= -135;
|
|
|
- this.ldeg= -135;
|
|
|
- clearInterval(this.interId);
|
|
|
- this.interId = null;
|
|
|
- },
|
|
|
- // 洗车机进度条动画
|
|
|
- loading(second) {
|
|
|
- if (second <= 30) {
|
|
|
- this.rdeg = -135 + 6 * second;
|
|
|
- this.ldeg = -135;
|
|
|
- } else {
|
|
|
- this.rdeg = 45;
|
|
|
- this.ldeg = -135 + 6 * (second - 30);
|
|
|
- }
|
|
|
- },
|
|
|
- // 归位机器
|
|
|
- resetRabt(){
|
|
|
- // 归位命令
|
|
|
- let cmd = {
|
|
|
- orderNo: this.orderNo, // 订单编号
|
|
|
- operateType: 'reset', //操作命令
|
|
|
- washType: this.washCarType,// 洗车模式
|
|
|
- }
|
|
|
- this.$store.commit("$sendWebsocket",JSON.stringify(cmd))
|
|
|
- },
|
|
|
- // 归位结束后
|
|
|
- resetRabtSuccess(){
|
|
|
- this.curWorkStutesText='设备已归位';
|
|
|
- this.status = 'reseting';
|
|
|
- this.$store.state.vuex_workStatus = 'stop';
|
|
|
// 关闭socket
|
|
|
this.$store.commit("$closeWebsocket");
|
|
|
- uni.redirectTo({
|
|
|
- url:"/pages/work/success/success"
|
|
|
- })
|
|
|
- }
|
|
|
+ },
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
@@ -532,10 +543,14 @@ export default {
|
|
|
background: #ff0000;
|
|
|
}
|
|
|
}
|
|
|
- .work-button-tips {
|
|
|
- color: #eee;
|
|
|
- text-align: center;
|
|
|
- padding-top: 30rpx;
|
|
|
+ }
|
|
|
+ .work-button-tips {
|
|
|
+ width: 80%;
|
|
|
+ color: #eee;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 30rpx;
|
|
|
+ .u-swiper-item{
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
}
|
|
|
}
|