From ae1aad66a165ee7253bed2127a3b53baa40c2361 Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期三, 17 五月 2023 08:35:33 +0800 Subject: [PATCH] 修复错误,增加验证 --- pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue | 479 ++++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 343 insertions(+), 136 deletions(-) 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 f1d9e15..78cd944 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 @@ -1,38 +1,72 @@ <template> <view class="bill-of-lading-details"> - <view class="bangDanMessage"> - <view class=""> - <text>瀹㈡埛锛歿{ coalDetailsData.customerName || '' }}</text> - <text>鐭垮巶锛歿{ coalDetailsData.deptName || '' }}</text> + <view class="top-banner" style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/loadingbanner.png') no-repeat;background-size: cover;"> + <view class="top-information"> + <view class="cutomer-name" v-if="orderType == '杞叆' || orderType == '杞嚭'">鐓ゅ満:{{ coalDetailsData.filedName || '' }}</view> + <view class="cutomer-name" v-else>瀹㈡埛:{{ coalDetailsData.customerName || '' }}</view> + <view class="fild-name"> + <view class="">鐭垮満:{{ coalDetailsData.deptName || '鏆傛棤' }}</view> + <view class="">鐓ゅ満:{{ coalDetailsData.filedName || '鏆傛棤' }}</view> + </view> </view> - <view class=""> - <text>鐨噸锛歿{ coalDetailsData.skin || '' }}</text> - <text>姣涢噸锛歿{ coalDetailsData.hair || '' }}</text> - <text>鍑�閲嶏細{{ coalDetailsData.clean || '' }}</text> - </view> - <view class=""> - <text>纾呭崟绫诲瀷锛歿{ coalDetailsData.orderTye || '' }}</text> - <text>鐘舵�侊細{{ coalStatus[coalDetailsData.status] }}</text> - </view> - <view class=""> - <text>鐓ゅ満锛歿{ coalDetailsData.filedName || '' }}</text> - <text>鍙戣繍鏃堕棿锛歿{ coalDetailsData.sendDate || '' }}</text> - <text>鎻愮叅鍗曠紪鍙凤細{{ coalDetailsData.code || '' }}</text> - <text>璁㈠崟缂栧彿锛歿{ coalDetailsData.orderCode || '' }}</text> + <view class="block-information"> + <view class="block-main"> + <view class="basic"> + <view class="coalName">{{ coalDetailsData.coalName }}</view> + <!-- <view class="black-block"></view> + <view class="order-type">{{ coalDetailsData.orderType }}</view> --> + <view + class="status-button" + style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/statusbutton.png') no-repeat; + background-size: cover;" + > + {{ coalStatus[coalDetailsData.status] || '' }} + </view> + </view> + <view class="time"> + <view class="time-icon"><u-icon name="clock" color="#515151" size="40"></u-icon></view> + <view class="send-date">{{ coalDetailsData.sendDate }}</view> + </view> + <view class="coal-code">鎻愮叅鍗曠紪鍙�: {{ coalDetailsData.code || '' }}</view> + <view class="order-code">璁㈠崟缂栧彿: {{ coalDetailsData.orderCode || '' }}</view> + <view class="weigh-item"> + <view class="item"> + <view class="concrete" style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/skin.png') no-repeat;background-size: cover;">鐨�</view> + <view class="num">{{ coalDetailsData.skin }}</view> + </view> + <view class="item"> + <view class="concrete" style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/hair.png') no-repeat;background-size: cover;">姣�</view> + <view class="num">{{ coalDetailsData.hair }}</view> + </view> + <view class="item"> + <view class="concrete" style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/clean.png') no-repeat;background-size: cover;">鍑�</view> + <view class="num">{{ coalDetailsData.clean }}</view> + </view> + </view> + </view> </view> </view> - <view class="timeLine" style="font-size: 16rpx;"> - <u--text type="primary" size="30" plain v-for="(item, index) in dayRZ" :key="index" :text="item.taskStatusDes"></u--text> + + <view class="timeLine"> + <u-steps :current="dayRZ.length - 1" direction="column" dot> + <u-steps-item :title="item.taskStatusDes" v-for="(item, index) in dayRZ" :key="index"></u-steps-item> + </u-steps> </view> <view class="utilsBox"> <view class="utils_chil utils_chilTop"> - <u-button text="绛惧埌" type="primary" plain @click="arriveClick"></u-button> - <u-button text="鍏ュ満鐢宠" type="primary" plain @click="rcsqClick"></u-button> - <u-button text="鏀剧┖" type="primary" plain @click="evacuation" throttleTime="500"></u-button> - <u-button text="鍛煎彨瀹㈡湇" type="primary" plain @click="callCustomerService"></u-button> + <view class="top-button"> + <u-button text="绛惧埌" type="primary" plain @click="arriveClick" shape="circle"></u-button> + <u-button text="鍏ュ満鐢宠" type="primary" plain @click="rcsqClick" shape="circle"></u-button> + </view> + <view class="bottom-button"> + <u-button text="鏀剧┖" type="primary" plain @click="evacuation" throttleTime="500" shape="circle" :disabled="isEvacuation || isapproach"></u-button> + <u-button text="鍛煎彨瀹㈡湇" type="primary" plain @click="callCustomerService" shape="circle"></u-button> + </view> </view> - <view class="utils_chil"><u-button text="灞曠ず鎻愮叅鍗�" @click="showCaolPickUpBill" type="primary"></u-button></view> - <view class="utils_chil"><u-button text="涓婄璁¢噺" @click="cengZhongClick" type="primary"></u-button></view> + </view> + <view class="weigh-ability"> + <view class="weigh-button"><u-button text="灞曠ず鎻愮叅鍗�" @click="showCaolPickUpBill" type="primary" shape="circle"></u-button></view> + <view class="weigh-button"><u-button text="涓婄璁¢噺" @click="cengZhongClick" type="primary" shape="circle"></u-button></view> </view> <view class="evacuationModal"> <u-modal @@ -48,8 +82,8 @@ </template> <script> -let socket = null; import { webSocketUrl } from '@/api/request.js'; +import { mapState, mapMutations } from 'vuex'; export default { onLoad(value) { if (value.orderPlanId && value.yyId) { @@ -89,7 +123,7 @@ openId: null, openName: '' }, - coalStatus: ['棰嗗彇', '棰勭害', '绛惧埌', '鍏ュ満', '绉扮毊', '绉版瘺', '绂诲満', '鍏ョ鎴�', '鍑虹鎴�', '鍏ョ叅鍦�', '鍑虹叅浠�', '鏀剧┖'], // 鐘舵�� + coalStatus: ['棰嗗彇', '棰勭害', '绛惧埌', '鍏ュ満', '绉扮毊', '绉版瘺', '绂诲満', '鍏ョ鎴�', '鍑虹鎴�', '鍏ョ叅浠�', '鍑虹叅浠�', '鏀剧┖', '浣滃簾', '鍏ュ満鐢宠', '杩涘叆鍦洪櫌'], // 鐘舵�� weighHouseCode: '', // 鏀剧┖寮圭獥鎺у埗鍙橀噺 evacuationModalShow: false, @@ -100,23 +134,67 @@ sceneId: '', gateCameraId: '', equipmentCode: '', - weigh: 30 - } + weigh: 0, + sceneInOut: '' + }, + // 鍘熷彂淇℃伅 + primarySkin: null, + primaryHair: null, + primaryClean: null, + scrollTop: 0, + // 纾呭崟绫诲瀷 + orderType: '', + interval: '' }; }, onShow() { this.init(); }, + beforeDestroy() { + clearInterval(this.interval); + }, computed: { + ...mapState(['globalweigh', 'globalinfraredStatus']), name() { return uni.getStorageSync('name'); }, openid() { return uni.getStorageSync('openid'); + }, + // 鑾峰彇浠婂ぉ鏃ユ湡 + currentDate() { + let time = new Date(); + let year = time.getFullYear(); + let month = time.getMonth() + 1; + month = month < 10 ? '0' + month : month; + let date = time.getDate(); + date = date < 10 ? '0' + date : date; + return `${year}-${month}-${date}`; + }, + // + isEvacuation() { + return this.coalDetailsData.hair == 0 || this.coalDetailsData.skin == 0; + }, + isapproach() { + return this.currentPageCoalStatus < 3; } }, methods: { init() { + this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => { + if (res.code == 0) { + this.dayRZ = res.data; + this.dayRZ = this.dayRZ.map(v => { + let slicedate = v.taskStatusDes.slice(0, 10); + if (slicedate == this.currentDate) { + return { + ...v, + taskStatusDes: v.taskStatusDes.slice(10) + }; + } + }); + } + }); this.coalDayPage(); //鑾峰彇鏃ュ織 this.getTakeCoal(); //鑾峰彇鎻愮叅鍗曡鎯� this.getgetService(); //鑾峰彇瀹㈡湇 @@ -139,9 +217,15 @@ }, // 鑾峰彇鎻愮叅鍗曡鎯� getTakeCoal() { + uni.showLoading({ + title: '鍔犺浇涓�' + }); this.$reqGet('getTakeCoal', { takeCoalId: this.orderPlanId }).then(res => { if (res.code == 0) { - this.coalDetailsData = res.data[0]; + uni.hideLoading(); + console.log(res, '鎻愮叅鍗曡鎯�'); + this.coalDetailsData = res.data; + this.orderType = this.coalDetailsData.orderType; // 鑾峰彇鎵�鍦ㄧ鎴垮弬鏁拌祴鍊� this.getWeightHouseObj.deptId = this.coalDetailsData.deptId; this.getWeightHouseObj.filedId = this.coalDetailsData.filedId; @@ -157,16 +241,33 @@ this.getServiceOpenid.filedId = this.coalDetailsData.filedId; // 鑾峰彇鎻愮叅鍗曠姸鎬� this.currentPageCoalStatus = this.coalDetailsData.status; + // 鑾峰彇鍘熷彂淇℃伅 + this.primarySkin = this.coalDetailsData.skinTwo; + this.primaryHair = this.coalDetailsData.hairTwo; + this.primaryClean = this.coalDetailsData.cleanTwo; + } else { + this.$u.toast('鍔犺浇澶辫触'); } }); }, // 鏃ュ織鏌ヨ coalDayPage() { - this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => { - if (res.code == 0) { - this.dayRZ = res.data; - } - }); + this.interval = setInterval(() => { + this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => { + if (res.code == 0) { + this.dayRZ = res.data; + this.dayRZ = this.dayRZ.map(v => { + let slicedate = v.taskStatusDes.slice(0, 10); + if (slicedate == this.currentDate) { + return { + ...v, + taskStatusDes: v.taskStatusDes.slice(10) + }; + } + }); + } + }); + }, 5000); }, // 灞曠ず鎻愮叅鍗曡鎯� showCaolPickUpBill() { @@ -244,53 +345,18 @@ this.weighData.sceneId = res.data.id; this.weighData.gateCameraId = res.data.lastEquipmentId; this.weighData.equipmentCode = res.data.lastEquipmentCode; + this.weighData.sceneInOut = res.data.sceneInOut; this.weighHouseCode = res.data.code; uni.navigateTo({ url: `/pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice?takeCoalId=${this.orderPlanId}&sceneId=${ res.data.id - }&gateCameraId=${res.data.lastEquipmentId}&gateCameraCode=${res.data.lastEquipmentCode}&weighHouseCode=${res.data.code}` + }&gateCameraId=${res.data.lastEquipmentId}&gateCameraCode=${res.data.lastEquipmentCode}&weighHouseCode=${res.data.code}&primarySkin=${ + this.primarySkin + }&primaryHair=${this.primaryHair}&psrimaryClean=${this.primaryClean}&sceneInOut=${res.data.sceneInOut}` }); } else { this.$u.toast('鏈湪纾呮埧锛岃鍓嶅線纾呮埧鍚庡啀璇曪紒锛�'); } - }); - }, - /** - * 鍒濆鍖� weoSocket - */ - initWebSocket() { - let wsUrl = `${webSocketUrl}?access_token=${uni.getStorageSync('token')}`; - socket = uni.connectSocket({ - url: wsUrl, - header: { - CLIENT_TOC: 'Y' - }, - complete: res => { - console.log(res, 'socket缁撴灉'); - } - }); - socket.onOpen(() => { - console.log('onOpen'); - }); - // 鑾峰彇鏈嶅姟鍣ㄤ紶鏉ョ殑鏁版嵁锛屽仛鐩稿簲澶勭悊 - socket.onMessage(res => { - console.log('socketWeigh', res); - let nowWeighObj = JSON.parse(res.data.slice(7)); - if (nowWeighObj.eqCode == this.weighHouseCode) { - if (nowWeighObj.eqInfraredStatus) { - this.weighData.weigh = nowWeighObj.weigh; - } else { - this.weighData.weigh = nowWeighObj.weigh; - } - } - }); - socket.onClose(() => { - console.log('webSocketClose'); - this.$u.toast('纾呮埧涓柇'); - }); - socket.onError(err => { - console.log('socket鎶ラ敊', err); - this.$u.toast('鍑虹幇閿欒锛岃閲嶆柊杩涘叆璇ラ〉闈紝閲嶈瘯锛侊紒'); }); }, // 鏀剧┖ @@ -299,14 +365,18 @@ }, // 鏀剧┖寮圭獥纭 evacuationConfirm() { + this.weighData = { + ...this.weighData, + weigh: this.globalweigh + }; let mix = Object.assign(this.weighData, this.getWeightHouseObj); this.$reqPost('getOneEvacuation', mix, 'json').then(res => { console.log(res, '绗竴娆℃斁绌�'); if (res.code == 0) { - this.$u.toast('宸叉斁绌�'); + this.$u.toast('鎿嶄綔鎴愬姛'); this.evacuationModalShow = false; } else { - this.$u.toast('鏀剧┖澶辫触锛岃绋嶅悗閲嶈瘯'); + this.$u.toast('鎿嶄綔澶辫触锛岃绋嶅悗閲嶈瘯'); this.evacuationModalShow = false; } }); @@ -320,86 +390,223 @@ </script> <style lang="scss" scoped> +/deep/.u-steps { + .u-steps-item { + .u-steps-item__content { + .u-text { + .u-text__value { + font-size: 31rpx !important; + font-weight: 300; + color: #303030; + } + } + } + } +} +@mixin flex { + display: flex; + justify-content: space-between; + align-items: center; +} ::v-deep.bill-of-lading-details { width: 100%; height: 100vh; margin: 0 auto; display: flex; flex-direction: column; - .bangDanMessage { - padding: vww(10); - border: vww(2) solid #dddddd; - border-radius: vww(20); - margin: vww(20); - margin-bottom: vww(10); - height: 40%; - font-size: vww(18); - font-weight: 600; - view { - margin-bottom: vww(10); - } - view:nth-of-type(1) { - display: flex; - text { - width: 50%; - text-align: center; - } - } - view:nth-of-type(2) { - display: flex; - text { - width: 33%; - text-align: center; - } - } - view:nth-of-type(3) { - display: flex; - text { - width: 50%; - text-align: center; - } - } - view:nth-of-type(4) { - display: flex; + .top-banner { + width: 100%; + height: 346rpx; + .top-information { + width: 94%; + margin: 0 auto; + height: vww(52); + @include flex position: relative; flex-direction: column; - text { - margin-bottom: vww(10); + justify-content: space-between; + align-items: flex-start; + top: vww(25); + color: #ffffff; + font-size: 31rpx; + font-weight: 300; + .fild-name { + @include flex; + justify-content: space-between; + width: 100%; + view { + min-width: 296rpx; + } + } + } + .block-information { + width: 690rpx; + height: 396rpx; + margin: vww(40) 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 { + @include flex width: 94%; + height: 336rpx; + margin: vww(18) vww(7) vww(11) vww(17); + flex-direction: column; + justify-content: space-between; + align-items: flex-start; + } + .status-button { + width: vww(71); + height: vww(36); text-align: center; + line-height: vww(33); + font-size: 28rpx; + font-weight: 300; + position: absolute; + right: vww(10); + color: #fff; + } + .basic { + width: 100%; + height: vww(15); + @include flex; + justify-content: flex-start; + .coalName, + .order-type { + width: 45%; + height: 30rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + position: relative; + } + .black-block { + width: 2rpx; + height: 30rpx; + background: #515151; + position: relative; + top: vww(2); + } + } + .time { + width: 35%; + height: vww(12); + display: flex; + justify-content: flex-start; + .send-date { + width: 148rpx; + height: 24rpx; + margin-left: vww(14); + font-size: 28rpx; + font-weight: 300; + color: #515151; + } + } + .coal-code, + .order-code { + width: 100%; + height: 24rpx; + font-size: 28rpx; + font-weight: 300; + color: #7d7d7d; + } + .weigh-item { + 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; + } + } } } } .timeLine { - height: 25%; + height: 40%; margin: vww(20); - margin-top: vww(10); - margin-bottom: vww(10); - border: vww(2) solid #dddddd; - border-radius: vww(20); + position: relative; + top: vww(120); + overflow-y: overlay; padding: vww(20); - box-sizing: border-box; - overflow-y: overlay; //琛屼负涓� auto 鐩稿悓锛屼絾鏄粴鍔ㄦ潯缁樺埗鍦ㄥ唴瀹逛箣涓婏紝鑰屼笉鏄崰鎹┖闂淬�� - .u-text { - margin-bottom: vww(5) !important; + .u-steps { + .u-steps-item { + padding-bottom: vww(35); + .u-steps-item__wrapper { + .u-steps-item__wrapper__dot { + background: linear-gradient(-29deg, #426cff 0%, #7991ff 100%); + box-shadow: 2rpx 7rpx 10rpx 0rpx rgba(172, 172, 172, 0.64); + } + } + .u-steps-item__line { + height: vww(52) !important; + background: #e9e6ea !important; + } + } } } .utilsBox { - padding: vww(10) vww(20); - flex: 1; - display: flex; - flex-direction: column; + width: 94%; + margin: 0 auto; + position: relative; + top: vww(80); .utils_chil { - flex: 1; - display: flex; - align-items: center; - } - .utils_chilTop { - .u-button { - margin-right: vww(4); - &:nth-child(4) { - margin-right: 0; + width: 100%; + margin: 0 auto; + .top-button, + .bottom-button { + width: 100%; + height: vww(47); + @include flex; + .u-button { + width: 40%; + height: 60rpx; + font-size: 28rpx; + font-weight: 300; + color: #497bfb; + border: 2px solid #3b56eb; } } } } + .weigh-ability { + width: 631rpx; + height: vww(100); + margin: vww(80) auto; + margin-bottom: vww(10); + @include flex; + flex-direction: column; + .weigh-button { + width: 631rpx; + height: vww(89); + .u-button { + font-size: 28rpx; + font-weight: 300; + color: #ffffff; + background: #497bfb; + letter-spacing: 4rpx; + border-radius: 37rpx 37rpx 37rpx 37rpx; + box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43, 98, 239, 0.5), 0rpx 0rpx 9rpx 0rpx rgba(247, 250, 253, 0.29); + } + } + } } </style> -- Gitblit v1.9.1