From 79993be468244e6cc16ce9c1d7e8736bd359c600 Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期五, 05 五月 2023 14:48:51 +0800 Subject: [PATCH] 样式全面修改,所有页面焕然一新 --- pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue | 331 +++++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 286 insertions(+), 45 deletions(-) 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 a68ff45..96f39bd 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 @@ -1,6 +1,10 @@ <template> <view class="weighingDevice"> - <view class="one"> + <view + class="one" + style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/weighbanner.png') no-repeat; + background-size: cover;" + > <view class="top"> <view class="top_left"> <text>{{ realTimeWeigh }}</text> @@ -14,39 +18,103 @@ 绾㈠: <u--text :type="globalinfraredStatus ? 'error' : 'success'" :text="globalinfraredStatus ? '寮傚父' : '姝e父'" size="34"></u--text> </view> - <!-- <view class=""> - 闆疯揪: - <u--text type="success" text="姝e父" size="34"></u--text> - </view> --> </view> </view> - <view class="bottom" v-if="weighList.orderType == '鍐呰喘' || weighList.orderType == '杞嚭'"> + <view class="bottom" v-if="weighList.orderType == '鍐呰喘' || weighList.orderType == '杞叆'"> <view> <view style="font-weight: 600;">鍘熷彂淇℃伅</view> - <text>鐨噸{{ primarySkin || '' }}姣涢噸{{ primaryHair || '' }}鍑�閲峽{ primaryClean || '' }}</text> + + <text>姣涢噸:{{ primaryHair || '' }}鐨噸:{{ primarySkin || '' }}鍑�閲�:{{ primaryClean || '' }}</text> </view> </view> + <!-- <view class="bottom" v-else-if="weighList.orderType == '澶栬喘' && weighList.hair == 0"> + <text> + 姣涢噸:{{ coalContactHair || '' }}鐨噸:{{ coalContactSkin || '' }}鍑�閲�:{{ (Number(this.coalContactHair) - Number(this.coalContactSkin)).toFixed(2) || '' }} + </text> + </view> --> <view class="bottom"><text>TIP:褰撳墠鐘舵�佷负姝e父鏃跺彲浠ョО閲�</text></view> </view> - <view class="two"> - <p>璁㈠崟缂栧彿锛歿{ weighList.code || '' }}</p> - <p>璁㈠崟绫诲瀷锛歿{ weighList.orderType || '' }}</p> - <p>璁㈠崟浣欓噺锛歿{ weighList.orderSurplus || 0 }}</p> - <p>鐨噸锛歿{ temporaryWeighObj.skin == 0 ? weighList.skin : temporaryWeighObj.skin }}</p> - <p>姣涢噸锛歿{ temporaryWeighObj.hair == 0 ? weighList.hair : temporaryWeighObj.hair }}</p> - <p>鍑�閲嶏細{{ temporaryWeighObj.clean == 0 ? weighList.clean : temporaryWeighObj.clean }}</p> - <p>鐓ょ鍚嶇О锛歿{ weighList.coalName || '' }}</p> - <p>鍗曚綅鍚嶇О锛歿{ weighList.deptName || '' }}</p> - <p>鐭垮満鍚嶇О锛歿{ weighList.filedName || '' }}</p> + <view class="middle-block"> + <view class="block-main" v-if="firstHairCustomernameShow"> + <view class="first-line"><combined-title title="鍘熷彂淇℃伅"></combined-title></view> + <view class="second-line"> + <view class="label-text">鐨噸</view> + <view class="input-container"><u--input placeholder="璇疯緭鍏ョ毊閲�" border="surround" v-model="weighData.coalContactSkin"></u--input></view> + <view class="unit">鍚�</view> + </view> + <view class="second-line"> + <view class="label-text">姣涢噸</view> + <view class="input-container"><u--input placeholder="璇疯緭鍏ユ瘺閲�" border="surround" v-model="weighData.coalContactHair"></u--input></view> + <view class="unit">鍚�</view> + </view> + <view class="second-line"> + <view class="label-text">鍑�閲�</view> + <view class="input-container"><u--input placeholder="璇疯緭鍏ュ噣閲�" border="surround" v-model="coalContactClean"></u--input></view> + <view class="unit">鍚�</view> + </view> + </view> + <view class="block-sideline" v-else> + <view class="first-line"><combined-title title="鍘熷彂淇℃伅"></combined-title></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">{{ weighList.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">{{ weighList.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">{{ weighList.clean }}</view> + </view> + </view> + </view> + </view> + <view class="bottom-block"> + <view class="block-main"> + <view class="main-information"> + <view class="prefix">瀹㈡埛:</view> + <view class="suffix">{{ weighList.customerName }}</view> + </view> + <view class="main-information"> + <view class="prefix">鐭垮満锛�</view> + <view class="suffix">{{ weighList.deptName || '' }}</view> + </view> + <view class="main-information"> + <view class="prefix">鐓ゅ満:</view> + <view class="suffix">{{ weighList.filedName || '' }}</view> + </view> + <view class="main-information"> + <view class="prefix">鐓ょ鍚嶇О:</view> + <view class="suffix">{{ weighList.coalName || '' }}</view> + </view> + <view class="main-information"> + <view class="prefix">鐨噸:</view> + <view class="suffix">{{ temporaryWeighObj.skin == 0 ? weighList.skin : temporaryWeighObj.skin }}</view> + </view> + <view class="main-information"> + <view class="prefix">姣涢噸:</view> + <view class="suffix">{{ temporaryWeighObj.hair == 0 ? weighList.hair : temporaryWeighObj.hair }}</view> + </view> + <view class="main-information"> + <view class="prefix">鍑�閲�:</view> + <view class="suffix">{{ temporaryWeighObj.clean == 0 ? weighList.clean : temporaryWeighObj.clean }}</view> + </view> + <view class="main-information"> + <view class="prefix">璁㈠崟浣欓噺:</view> + <view class="suffix">{{ weighList.orderSurplus || 0 }}</view> + </view> + </view> </view> <view class="three"> <!-- 鏀剧┖ --> - <u-button type="primary" text="鏀剧┖" plain @click="evacuation" throttleTime="500" :disabled="isEvacuation"></u-button> + <u-button type="primary" text="鏀剧┖" plain @click="evacuation" throttleTime="500" :disabled="!isEvacuation"></u-button> <!-- 澶栭攢璁㈠崟绉扮毊鏃讹紝杩斿洖鍔犲噺鍚ㄦ寜閽疆鐏般�傜О姣涙椂鍙敤.澶栬喘璁㈠崟锛屼笉鍑虹幇杩斿洖鍔犲噺鍚ㄧ殑鎸夐挳 --> <u-button type="primary" text="纭畾绉伴噸" - :disabled="realTimeWeigh == 0 || globalinfraredStatus" + :disabled="realTimeWeigh == 0 || globalinfraredStatus || isweigh" :loading="isConfirmWeighLoading" loadingText="纭" @click="confirmWeigh" @@ -72,6 +140,7 @@ let socket = null; import { webSocketUrl } from '@/api/request.js'; import { mapState, mapMutations } from 'vuex'; +import combinedTitle from '@/components/combined-title/combined-title.vue'; export default { onLoad(params) { this.takeCoalId = params.takeCoalId; @@ -85,6 +154,9 @@ this.primaryClean = params.primaryClean; this.changeweighHouseCode(params.weighHouseCode); }, + components: { + combinedTitle + }, data() { return { weighData: { @@ -97,24 +169,16 @@ equipmentCode: '', weigh: 0, tmCode: '', - sceneInOut: '' + sceneInOut: '', + coalContactClean: 0, + coalContactHair: 0, + coalContactSkin: 0 }, takeCoalId: null, weighHouseCode: '', isConfirmWeighLoading: false, //纭畾绉伴噸鎸夐挳 - realTimeWeigh: '', + realTimeWeigh: 0, weighList: {}, - webSocket: null, // webSocket瀹炰緥 - // lockReconnect: false, // 閲嶈繛閿侊紝閬垮厤澶氭閲嶈繛 - // maxReconnect: 6, // 鏈�澶ч噸杩炴鏁帮紝 -1 鏍囪瘑鏃犻檺閲嶈繛 - // reconnectTime: 0, // 閲嶈繛灏濊瘯娆℃暟 - // heartbeat: { - // interval: 30 * 1000, // 蹇冭烦闂撮殧鏃堕棿 - // timeout: 10 * 1000, // 鍝嶅簲瓒呮椂鏃堕棿 - // pingTimeoutObj: null, // 寤舵椂鍙戦�佸績璺崇殑瀹氭椂鍣� - // pongTimeoutObj: null, // 鎺ユ敹蹇冭烦鍝嶅簲鐨勫畾鏃跺櫒 - // pingMessage: JSON.stringify({ type: 'ping' }) // 蹇冭烦璇锋眰淇℃伅 - // } // 涓存椂绉伴噸瀵硅薄 temporaryWeighObj: { skin: 0, @@ -129,7 +193,14 @@ // 鑾峰彇鍘熷彂淇℃伅 primarySkin: null, primaryHair: null, - primaryClean: null + primaryClean: null, + // 鍒ゆ柇绉伴噸鎸夐挳鏄惁鍙敤 + isweigh: false, + // 澶栬喘绫诲瀷绉伴噸濉啓姣涳紝鐨紝 + firstHairCustomernameShow: false, + coalContactHair: '', + coalContactSkin: '' + // 浜屾纭 }; }, watch: { @@ -138,19 +209,23 @@ if (this.weighList.skin == 0) { // this.temporaryWeighObj.skin = this.realTimeWeigh; this.temporaryWeighObj.skin = newV; + this.isweigh = this.temporaryWeighObj.skin > this.weighList.orderSurplus; } else { // this.temporaryWeighObj.hair = this.realTimeWeigh; this.temporaryWeighObj.hair = newV; this.temporaryWeighObj.clean = (this.temporaryWeighObj.hair - this.weighList.skin).toFixed(2); + this.isweigh = this.temporaryWeighObj.clean > this.weighList.orderSurplus; } } else if (this.weighList.orderType == '澶栬喘' || this.weighList.orderType == '鍐呰喘' || this.weighList.orderType == '杞叆') { if (this.weighList.hair == 0) { // this.temporaryWeighObj.hair = this.realTimeWeigh; this.temporaryWeighObj.hair = newV; + this.isweigh = this.temporaryWeighObj.hair > this.weighList.orderSurplus; } else { // this.temporaryWeighObj.skin = this.realTimeWeigh; this.temporaryWeighObj.skin = newV; this.temporaryWeighObj.clean = (this.weighList.hair - this.temporaryWeighObj.skin).toFixed(2); + this.isweigh = this.temporaryWeighObj.clean > this.weighList.orderSurplus; } } }, @@ -160,16 +235,20 @@ this.weighData.weigh = this.realTimeWeigh = v; console.log(this.realTimeWeigh, '鐪熷疄閲嶉噺鏀瑰彉浜�'); }, - immediate: true, - deep: true + deep: true, + immediate: true } }, onShow() { this.init(); + this.realTimeWeigh = 0; // this.initWebSocket(); }, computed: { ...mapState(['globalweigh', 'globalinfraredStatus']), + coalContactClean() { + return (Number(this.weighData.coalContactHair) - Number(this.weighData.coalContactSkin)).toFixed(2); + }, token() { return uni.getStorageSync('token'); }, @@ -185,10 +264,11 @@ }, // 鏄惁鏀剧┖鎸夐挳绂佺敤 isEvacuation() { - if (this.weighList.hair == this.weighList.skin || this.temporaryWeighObj.skin == this.temporaryWeighObj.hair) { - return false; - } else { - return true; + if (this.weighList.orderType == '澶栭攢' || this.weighList.orderType == '鍐呴攢' || this.weighList.orderType == '杞嚭') { + return this.weighList.skin == this.temporaryWeighObj.hair || this.temporaryWeighObj.skin == this.temporaryWeighObj.hair; + } + if (this.weighList.orderType == '澶栬喘' || this.weighList.orderType == '鍐呰喘' || this.weighList.orderType == '杞叆') { + return this.weighList.hair == this.temporaryWeighObj.skin || this.temporaryWeighObj.skin == this.temporaryWeighObj.hair; } } }, @@ -204,6 +284,9 @@ this.weighData.tmId = res.data.id; this.weighData.carNo = res.data.carNo; this.weighData.tmCode = res.data.code; + if (this.weighList.orderType == '澶栬喘' && this.weighList.hair == 0) { + this.firstHairCustomernameShow = true; + } } }); }, @@ -232,6 +315,7 @@ }, // 纭绉伴噸鎺ュ彛 saveWeigh() { + this.weighData.coalContactClean = this.coalContactClean; this.$reqPost('saveWeigh', this.weighData, 'json') .then(res => { console.log(res, '绉伴噸鎺ュ彛'); @@ -316,7 +400,13 @@ evacuationConfirm() { this.$reqPost('getTwoEvacuation', this.weighData, 'json').then(res => { console.log(res, '绗簩娆℃斁绌�'); - this.evacuationModalShow = false; + if (res.code == 0) { + this.$u.toast('鎿嶄綔鎴愬姛'); + this.evacuationModalShow = false; + } else { + this.$u.toast(res.msg ? res.msg : '鎿嶄綔澶辫触'); + this.evacuationModalShow = true; + } }); }, // 鏀剧┖寮圭獥鍙栨秷 @@ -328,18 +418,23 @@ </script> <style lang="scss" scoped> +@mixin flex { + display: flex; + justify-content: space-between; + align-items: center; +} ::v-deep.weighingDevice { width: 100%; height: 100vh; display: flex; flex-direction: column; .one { - flex: 2; - border: vww(2) solid #dddddd; + // flex: 3; + height: 290rpx; margin: vww(20) vww(20) 0 vww(20); border-radius: vww(15); .top { - height: 80%; + height: 75%; display: flex; .top_left { flex: 3; @@ -347,21 +442,134 @@ display: flex; align-items: center; justify-content: center; + font-size: 74rpx; + font-family: Determination Sans; + font-weight: 400; + color: #ffffff; + line-height: 69rpx; + text-shadow: 0rpx 3rpx 14rpx rgba(0, 0, 0, 0.33); } .top_right { display: flex; flex-direction: column; justify-content: center; flex: 2; + font-size: 31rpx; + font-family: Microsoft YaHei; + font-weight: 300; + color: #ffffff; view { display: flex; + align-items: center; } } } .bottom { text-align: center; - position: relative; - top: vww(-30); + height: 25%; + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: column; + font-size: 28rpx; + font-family: Microsoft YaHei; + font-weight: 300; + color: #d9e1fe; + // position: relative; + // top: vww(-10); + } + } + .middle-block { + width: 690rpx; + height: 386rpx; + margin: vww(20) vww(15) vww(13); + background: #ffffff; + box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); + border-radius: 20rpx; + @include flex justify-content: center; + overflow: hidden; + .block-main { + width: 650rpx; + height: 350rpx; + @include flex flex-direction: column; + margin-bottom: vww(20); + .first-line, + .second-line { + width: 90%; + height: vww(44); + .input-container { + border: 2px solid #c5c5c5; + box-shadow: 0rpx 5rpx 13rpx 0rpx #c5c5c5; + border-radius: 12rpx; + } + } + .first-line { + @include flex; + } + .second-line { + @include flex; + } + } + .block-sideline { + width: 94%; + height: vww(100); + @include flex flex-direction: column; + align-items: flex-start; + .first-line { + width: 100%; + } + .weigh-item { + width: 100%; + height: vww(36); + @include flex justify-content: space-around; + .item { + width: vww(50); + height: vww(45); + font-size: 21rpx; + font-family: Microsoft YaHei; + 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-family: Microsoft YaHei; + font-weight: 300; + color: #303030; + } + } + } + } + } + .bottom-block { + width: 690rpx; + height: 630rpx; + margin: 0 vww(15) vww(45) vww(15); + background: #ffffff; + box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); + border-radius: 20rpx; + @include flex justify-content: center; + .block-main { + width: 94%; + height: 565rpx; + margin-top: vww(22); + @include flex; + align-items: flex-start; + flex-direction: column; + .main-information { + width: 50%; + height: 28rpx; + font-size: 28rpx; + font-family: Microsoft YaHei; + font-weight: 300; + color: #303030; + @include flex; + } } } .two { @@ -370,6 +578,29 @@ margin: vww(20); border-radius: vww(10); padding: vww(20); + .uni-table { + .uni-table-tr { + padding: 0; + border: vww(1) solid #c6c6c6; + .uni-table-th { + font-size: vww(14); + height: vww(30); + line-height: vww(30); + padding: vww(5) vww(10); + color: #111111; + font-weight: 500; + background: #e2e2e2; + } + .uni-table-td { + font-size: vww(14); + font-weight: 400; + height: vww(30); + line-height: vww(30); + padding: vww(5) vww(10); + color: #111111; + } + } + } p { text-align: center; font-size: vww(20); @@ -396,4 +627,14 @@ flex: 0.5; } } +.secondary-confirmation__main { + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: center; + .secondary-child { + display: flex; + justify-content: space-between; + } +} </style> -- Gitblit v1.9.1