From d4bffaa2419bc3e3d6b1af4a6314065c67a8cbc0 Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期一, 03 七月 2023 16:57:13 +0800 Subject: [PATCH] ws增加报错关闭重连功能 --- /dev/null | 95 ----------- pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue | 59 ++----- pages/customer-page/customer-index/customer-index.vue | 2 pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail.vue | 4 pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue | 5 pages/driver-page/driver-index/bill-of-lading-details/selectOrderPlan/selectOrderPlan.vue | 4 components/weighItem.vue | 122 +++++++++++++++ pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue | 38 ---- pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore.vue | 38 ---- store/index.js | 82 ++++++++- 10 files changed, 225 insertions(+), 224 deletions(-) diff --git a/components/card/card.vue b/components/card/card.vue deleted file mode 100644 index 4dd5b4f..0000000 --- a/components/card/card.vue +++ /dev/null @@ -1,95 +0,0 @@ -<template> - <view - class="card" - :style="{ - background: - backgroundType == 0 - ? 'url(https://mx.jzeg.cn:9095/appimg/image/background/customer-blue.png) no-repeat' - : backgroundType == 1 - ? 'url(https://mx.jzeg.cn:9095/appimg/image/background/huoDai.png) no-repeat' - : 'url(https://mx.jzeg.cn:9095/appimg/image/background/driver.png) no-repeat', - backgroundSize: '100% 100%' - }" - > - <!-- <view class="icon" @click="iconClick(name)" v-if="icon"><u-icon name="arrow-rightward"></u-icon></view> --> - <view class="card-body" @click="bodyClick"> - <view class="card-left"><slot name="left"></slot></view> - <view class="card-right"> - <view class="card-right-top"><slot name="right-top"></slot></view> - <view class="card-right-bottom"><slot name="right-bottom"></slot></view> - </view> - </view> - </view> -</template> -<script> -export default { - name: 'card', - props: { - // icon: { - // type: Boolean, - // default: false - // }, - backgroundType: { - type: Number, - default: 0 - }, - name: { - type: String, - default: '' - } - }, - data() { - return {}; - }, - methods: { - bodyClick() { - this.$emit('click', this.name); - } - // iconClick() { - // this.$emit('iconClick', this.name); - // } - } -}; -</script> - -<style lang="scss" scoped> -.card { - // padding: vww(7) vww(10) vww(10) vww(10); - width: 100%; - height: vww(138); - // box-shadow: 0px 0px 8px 0px rgba(216, 218, 238, 0.8); - // padding: vww(15); - box-sizing: border-box; - // overflow: hidden; - // margin-top: vww(12); - // border-radius: vww(8); - .icon { - width: vww(20); - height: vww(20); - float: right; - } - .card-body { - font-size: vww(14); - font-weight: 300; - width: 100%; - height: 100%; - display: flex; - .card-left { - width: 40%; - height: 100%; - } - .card-right { - width: 60%; - height: 100%; - &-top { - width: 100%; - height: 65%; - } - &-bottom { - width: 100%; - height: 35%; - } - } - } -} -</style> diff --git a/components/weighItem.vue b/components/weighItem.vue new file mode 100644 index 0000000..9346fd1 --- /dev/null +++ b/components/weighItem.vue @@ -0,0 +1,122 @@ +<template> + <!-- 绉伴噸鍘嗗彶--> + <view class="weigh-history" + v-if="list.length!==0"> + <view class="block-main"> + <view class="weigh-item" + v-for='item in list' + :key="item.id"> + <view class="weigh-time"> + <u-tag :text="item.createTime.slice(-8,-3)" + plain></u-tag> + </view> + <view class="item-block"> + <view class="item"> + <view class="concrete" + :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/skin.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> + 鐨�</view> + <view class="num">{{ item.skin ||'' }}</view> + </view> + <view class="item"> + <view class="concrete" + :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/hair.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> + 姣�</view> + <view class="num">{{ item.hair ||''}}</view> + </view> + <view class="item"> + <view class="concrete" + :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/clean.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> + 鍑�</view> + <view class="num">{{ item.clean||'' }}</view> + </view> + </view> + </view> + </view> + </view> +</template> + +<script> + import { onlineurl } from '@/api/request.js' + export default { + name: "weighItem", + props: { + list: { + type: Array, + default: () => [] + } + }, + data() { + return { + onlineurl, + }; + } + } +</script> + +<style lang="scss" + scoped> + .weigh-history { + width: 690rpx; + height: 100%; + min-height: 420rpx; + margin: vww(20) auto; + background: #ffffff; + box-shadow: 4rpx 6rpx 51rpx 0rpx rgba(73, 120, 240, 0.11); + border-radius: 20rpx; + position: relative; + font-size: 30rpx; + font-weight: 300; + color: #303030; + overflow: hidden; + + .block-main { + display: grid; + grid-template-columns: auto; + grid-template-rows: repeat(auto-fit, minmax(40rpx, 1fr)); + gap: auto 5rpx; + width: 94%; + height: 100%; + min-height: 380rpx; + margin: vww(18) vww(7) vww(11) vww(17); + gap: 10rpx 20rpx; + + .weigh-item { + width: 100%; + height: vww(80); + @include flex; + flex-direction: column; + justify-content: space-around; + align-items: flex-start; + + .item-block { + width: 100%; + height: vww(36); + @include flex; + justify-content: space-around; + + .item { + min-width: vww(50); + height: vww(45); + font-size: 21rpx; + font-weight: 400; + color: #ffffff; + text-align: center; + line-height: vww(30); + @include flex; + + .concrete { + width: vww(36); + height: vww(36); + } + + .num { + font-size: 40rpx; + font-weight: 300; + color: #303030; + } + } + } + } + } + } +</style> \ No newline at end of file diff --git a/pages/customer-page/customer-index/customer-index.vue b/pages/customer-page/customer-index/customer-index.vue index e7df02e..29b8964 100644 --- a/pages/customer-page/customer-index/customer-index.vue +++ b/pages/customer-page/customer-index/customer-index.vue @@ -163,7 +163,6 @@ <script> import { onlineurl } from '@/api/request.js' - import card from '@/components/card/card.vue'; import combinedTitle from '@/components/combined-title/combined-title.vue'; import { customerId } from '@/utils/status'; export default { @@ -174,7 +173,6 @@ } }, components: { - card, combinedTitle }, watch: { diff --git a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue index 6713d78..e3d1cee 100644 --- a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue +++ b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue @@ -68,7 +68,7 @@ </view> <view class="main-banner"> <view class="empty-pointer" - v-if="!yyDailyList">鏆傛棤鏇村鏁版嵁</view> + v-if="yyDailyList.length===0">鏆傛棤鏇村鏁版嵁</view> <view class="main-block"> <view class="main-container"> <view class="main-container_content" @@ -86,7 +86,8 @@ <view class="second-line"> <view class="line-content"> <view class="line-content_text">鍑�閲�</view> - <view class="line-content_num">{{ item.clean.toFixed(2) || 0 }}</view> + <view class="line-content_num">{{ item.clean?item.clean.toFixed(2):'' || '' }} + </view> </view> <view class="line-content"> <view class="line-content_text">浣欓噺</view> diff --git a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore.vue b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore.vue index cb10d83..f75429e 100644 --- a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore.vue +++ b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore.vue @@ -57,49 +57,19 @@ </view> </view> </view> - <view class="weigh-history" - v-if="showWeigh.length!==0"> - <view class="block-main"> - <view class="weigh-item" - v-for='item in showWeigh' - :key="item.id"> - <view class="weigh-time"> - <u-tag :text="item.createTime.slice(-8,-3)" - plain></u-tag> - </view> - <view class="item-block"> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/skin.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 鐨�</view> - <view class="num">{{ item.skin }}</view> - </view> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/hair.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 姣�</view> - <view class="num">{{ item.hair }}</view> - </view> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/clean.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 鍑�</view> - <view class="num">{{ item.clean }}</view> - </view> - </view> - </view> - </view> - </view> + <weigh-item :list="showWeigh"></weigh-item> </view> </view> </template> <script> import combinedTitle from '@/components/combined-title/combined-title.vue'; + import weighItem from '@/components/weighItem.vue' import { onlineurl } from '@/api/request.js' export default { components: { - combinedTitle + combinedTitle, + weighItem }, onLoad(params) { this.id = params.id; diff --git a/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue b/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue index 78d101b..8b6e600 100644 --- a/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue +++ b/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue @@ -44,39 +44,7 @@ </view> <!-- 绉伴噸鍘嗗彶--> - <view class="weigh-history" - v-if="showWeigh.length!==0"> - <view class="block-main"> - <view class="weigh-item" - v-for='item in showWeigh' - :key="item.id"> - <view class="weigh-time"> - <u-tag :text="item.createTime.slice(-8,-3)" - plain></u-tag> - </view> - <view class="item-block"> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/skin.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 鐨�</view> - <view class="num">{{ item.skin }}</view> - </view> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/hair.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 姣�</view> - <view class="num">{{ item.hair }}</view> - </view> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/clean.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 鍑�</view> - <view class="num">{{ item.clean }}</view> - </view> - </view> - </view> - </view> - </view> + <weigh-item :list="showWeigh"></weigh-item> <!-- 鏃堕棿绾� --> <view class="timeLine"> <u-steps :current="dayRZ.length - 1" @@ -155,7 +123,11 @@ import { onlineurl } from '@/api/request.js' import { webSocketUrl } from '@/api/request.js'; import { mapState, mapMutations } from 'vuex'; + import weighItem from '@/components/weighItem.vue' export default { + components: { + weighItem + }, onLoad(value) { this.orderPlanId = value.orderPlanId; this.yyId = value.yyId; diff --git a/pages/driver-page/driver-index/bill-of-lading-details/selectOrderPlan/selectOrderPlan.vue b/pages/driver-page/driver-index/bill-of-lading-details/selectOrderPlan/selectOrderPlan.vue index d6e8dbd..8b0c5ad 100644 --- a/pages/driver-page/driver-index/bill-of-lading-details/selectOrderPlan/selectOrderPlan.vue +++ b/pages/driver-page/driver-index/bill-of-lading-details/selectOrderPlan/selectOrderPlan.vue @@ -1,11 +1,11 @@ <template> <view class="main"> - <view style="position: relative;top: -120px;"> + <view> <u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" textSize="30" iconSize="1000" - v-if="!orderPlanData"></u-empty> + v-if="orderPlanData.length===0"></u-empty> </view> <view class="collection-form"> <view class="collection-form-item" diff --git a/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail.vue b/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail.vue index 281c1c3..ba0d57b 100644 --- a/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail.vue +++ b/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail.vue @@ -142,7 +142,9 @@ this.showWeigh = this.coalDetailsData.tmTaskCoalItems ? this.coalDetailsData .tmTaskCoalItems : [], this.showWeigh.forEach(v => { - v.discount = null + if (!v.discount) { + v.discount = '' + } }) uni.hideLoading() } else { diff --git a/pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue b/pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue index 1defe30..4510c28 100644 --- a/pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue +++ b/pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue @@ -4,8 +4,8 @@ :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/weighbanner.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> <view class="top"> <view class="top_left"> - <text>{{ realTimeWeigh }}</text> - <!-- <text>{{ globalweigh }}</text> --> + <!-- <text>{{ realTimeWeigh }}</text> --> + <text>{{ globalweigh }}</text> </view> <view class="top_right"> <view class=""> @@ -92,41 +92,7 @@ </view> </view> <!-- 绉伴噸鍘嗗彶--> - <transition name="weighHistory"> - <view class="weigh-history" - v-if="weighHistory.length!==0"> - <view class="block-main"> - <view class="weigh-item" - v-for='item in weighHistory' - :key="item.id"> - <view class="weigh-time"> - <u-tag :text="item.createTime.slice(-8,-3)" - plain></u-tag> - </view> - <view class="item-block"> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/skin.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 鐨�</view> - <view class="num">{{ item.skin }}</view> - </view> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/hair.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 姣�</view> - <view class="num">{{ item.hair }}</view> - </view> - <view class="item"> - <view class="concrete" - :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/clean.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }"> - 鍑�</view> - <view class="num">{{ item.clean }}</view> - </view> - </view> - </view> - </view> - </view> - </transition> + <weigh-item :list="weighHistory"></weigh-item> <view class="three"> <!-- 鏀剧┖ --> <u-button type="primary" @@ -153,6 +119,7 @@ @click="UnloadingAgainHandle" :loading="UnloadingAgainLoading" loadingText="纭" + :disabled="isweigh||realTimeWeigh == 0" v-if='canUnload'></u-button> </view> <!-- 鏀剧┖寮圭獥 --> @@ -172,6 +139,7 @@ import { webSocketUrl, onlineurl } from '@/api/request.js'; import { mapState, mapMutations } from 'vuex'; import combinedTitle from '@/components/combined-title/combined-title.vue'; + import weighItem from '@/components/weighItem.vue' export default { onLoad(params) { this.takeCoalId = params.takeCoalId; @@ -187,9 +155,11 @@ this.weighData.overTmWaixiao = 1 } this.changeweighHouseCode(params.weighHouseCode); + this.changeWeigh(0) }, components: { - combinedTitle + combinedTitle, + weighItem }, data() { return { @@ -272,15 +242,18 @@ } }, // 鐩戝惉閲嶉噺鍙樺寲 - globalweigh(newV) { - this.weighData.weigh = this.realTimeWeigh = newV; - console.log(this.realTimeWeigh, '鐪熷疄閲嶉噺鏀瑰彉浜�'); + globalweigh: { + handler: function(newV) { + this.weighData.weigh = this.realTimeWeigh = newV; + console.log(this.realTimeWeigh, '鐪熷疄閲嶉噺鏀瑰彉浜�'); + }, + deep: true } }, onShow() { this.init(); this.changeisLogin(true) - this.realTimeWeigh = 0 + // this.realTimeWeigh = 0 }, computed: { ...mapState(['globalweigh', 'globalinfraredStatus']), @@ -326,7 +299,7 @@ } }, methods: { - ...mapMutations(['changeweighHouseCode', 'changeisLogin']), + ...mapMutations(['changeweighHouseCode', 'changeisLogin', 'changeWeigh']), init() { uni.showLoading({ title: '鍔犺浇涓�' diff --git a/store/index.js b/store/index.js index 5b11172..d5d5ba6 100644 --- a/store/index.js +++ b/store/index.js @@ -103,6 +103,9 @@ socketTask: null, websocketData: null, // 瀛樻斁浠庡悗绔帴鏀跺埌鐨剋ebsocket鏁版嵁 globalIntervalId: null, + is_open_socket: false, //閬垮厤閲嶅杩炴帴 + connectNum: 1, //閲嶈繛娆℃暟, + reconnectTimeOut: null }, mutations: { lengthchange(state, payload) { @@ -114,13 +117,13 @@ // 璁剧疆搴曢儴鏍� setUserTabbar(state, roleType) { state.roleType = roleType - if (roleType == 1) { + if (roleType === 1) { state.userTabbar = userRoleTabbar.first uni.setStorageSync('userTabbar', state.userTabbar) - } else if (roleType == 2 || roleType == 3) { + } else if (roleType === 2 || roleType === 3) { state.userTabbar = userRoleTabbar.second uni.setStorageSync('userTabbar', state.userTabbar) - } else if (roleType == 4) { + } else if (roleType === 4) { state.userTabbar = userRoleTabbar.three uni.setStorageSync('userTabbar', state.userTabbar) } @@ -159,7 +162,15 @@ }, setWebsocketData(state, data) { state.websocketData = data - } + }, + // 鏀瑰彉閲嶈繛鐘舵�� + changereconnectState(state, payload) { + state.is_open_socket = payload + }, + // 鏀瑰彉閲嶈繛娆℃暟 + changereconnectNum(state, payload) { + state.connectNum = payload + }, }, actions: { websocketInit({ state, dispatch, commit }) { @@ -167,20 +178,30 @@ state.socketTast = uni.connectSocket({ url: wsUrl, header: { CLIENT_TOC: 'Y' }, - complete: res => { - console.log(res, 'socket缁撴灉') + success: res => { + console.log(res, 'socketSuccess') if (res.errMsg === 'connectSocket:ok') { commit('changeisconnect', true) + commit('changereconnectState', true) } + }, + fail: res => { + console.log(res, 'socketFail') + console.log('ws澶辫触'); + commit('changereconnectState', false) + dispatch('reconnect') } + }) state.socketTast.onOpen(() => dispatch('websocketOnOpen')) state.socketTast.onMessage(result => dispatch('websocketOnMessage', result.data)) state.socketTast.onClose(e => dispatch('websocketOnClose', e)) - state.socketTast.onError(e => dispatch('websocketOnError')) + state.socketTast.onError(e => dispatch('websocketOnError', e)) }, websocketOnOpen({ state, commit }) { - console.log('onOpen') + console.log('ws鎵撳紑') + clearInterval(state.reconnectTimeOut) + clearInterval(state.globalIntervalId) state.globalIntervalId = setInterval(() => { state.socketTast.send({ data: JSON.stringify({ type: 'ping' }), @@ -190,19 +211,56 @@ }) }, 30000) }, - websocketOnClose({ state, commit }) { + websocketOnClose({ state, commit, dispatch }, e) { if (!state.socketTast) return + console.log('ws鍏抽棴', e) state.socketTast.close(e => { commit('changeisconnect', false) }) - console.log('ws鍏抽棴') + clearInterval(state.globalIntervalId) + clearInterval(state.reconnectTimeOut) + state.socketTast = null + commit('changereconnectState', false) + if (state.connectNum < 6) { + dispatch('reconnect') + } else { + commit('changereconnectNum', 1) + } + }, - websocketOnError(e) { - console.log('socket鎶ラ敊', e) + websocketOnError({ state, commit, dispatch }, e) { + // 濡傛灉閲嶈繛鐘舵�佷负false鍒欎笉杩涜閲嶈繛锛屼负true鎵嶄細 + console.log('ws鎶ラ敊', e) + clearInterval(state.globalIntervalId) + clearInterval(state.reconnectTimeOut) + state.socketTast = null + commit('changereconnectState', false) + if (state.connectNum < 6) { + uni.showToast({ + title: `杩炴帴澶辫触锛屾灏濊瘯绗�${state.connectNum}娆¤繛鎺, + icon: 'none' + }) + let num = 1; + num++; + commit('changereconnectNum', num) + dispatch('reconnect') + } else { + commit('changereconnectNum', 1) + } }, // 鎺ユ敹鏁版嵁 websocketOnMessage({ state, commit }, result) { commit('setWebsocketData', result) + }, + // 閲嶆柊杩炴帴 + reconnect({ state, commit, dispatch }) { + console.log(state.is_open_socket, '閲嶆柊杩炴帴socket鐘舵��'); + clearInterval(state.globalIntervalId) + if (!state.is_open_socket) { + state.reconnectTimeOut = setInterval(() => { + dispatch('websocketInit') + }, 5000) + } } } }) -- Gitblit v1.9.1