From 29658de29b2eb5292bf0c2fad7427b374b769ebc Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期三, 10 五月 2023 20:29:31 +0800 Subject: [PATCH] 样式修改,引入字体,修改逻辑 --- pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue | 97 ++++++++++++++++++++++++++++++++++-------------- 1 files changed, 69 insertions(+), 28 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 e6bbd9d..0515852 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 @@ -34,18 +34,22 @@ </view> --> <view class="bottom"><text>TIP:褰撳墠鐘舵�佷负姝e父鏃跺彲浠ョО閲�</text></view> </view> - <view class="middle-block"> + <view class="middle-block" v-if="firstHairCustomernameShow || sideline"> <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 class="label-text" :class="{ focusClass: isfocus1 }">鐨噸</view> + <view class="input-container" :class="{ inputClass: isfocus1 }"> + <u--input placeholder="璇疯緭鍏ョ毊閲�" border="surround" v-model="weighData.coalContactSkin" @focus="inputFocus(1)" @blur="inputBlur"></u--input> + </view> + <view class="unit" :class="{ focusClass: isfocus1 }">鍚�</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 class="label-text" :class="{ focusClass: isfocus2 }">姣涢噸</view> + <view class="input-container" :class="{ inputClass: isfocus2 }"> + <u--input placeholder="璇疯緭鍏ユ瘺閲�" border="surround" v-model="weighData.coalContactHair" @focus="inputFocus(2)" @blur="inputBlur"></u--input> + </view> + <view class="unit" :class="{ focusClass: isfocus2 }">鍚�</view> </view> <view class="second-line"> <view class="label-text">鍑�閲�</view> @@ -53,7 +57,7 @@ <view class="unit">鍚�</view> </view> </view> - <view class="block-sideline" v-if="weighList.orderType == '鍐呰喘' || weighList.orderType == '杞嚭'"> + <view class="block-sideline" v-if="sideline"> <view class="first-line"><combined-title title="鍘熷彂淇℃伅"></combined-title></view> <view class="weigh-item"> <view class="item"> @@ -71,6 +75,7 @@ </view> </view> </view> + <view v-else style="width: 100%;height: vww(20);"></view> <view class="bottom-block"> <view class="block-main"> <view class="main-information"> @@ -199,8 +204,10 @@ // 澶栬喘绫诲瀷绉伴噸濉啓姣涳紝鐨紝 firstHairCustomernameShow: false, coalContactHair: '', - coalContactSkin: '' - // 浜屾纭 + coalContactSkin: '', + // 鑱氱劍鏃舵敼鍙樻牱寮� + isfocus1: false, + isfocus2: false }; }, watch: { @@ -257,13 +264,14 @@ }, // 鍔犲噺鐓ゆ寜閽鐢ㄤ笌鍚� addAndSubtractCoalDisabled() { - if (this.weighList.orderType == '澶栭攢' || this.weighList.orderType == '鍐呴攢' || this.weighList.orderType == '杞嚭') { - if (this.weighList.hair == 0) { - return true; - } else if (this.weighList.hair != 0) { - return false; - } - } + return this.realTimeWeigh == 0; + // if (this.weighList.orderType == '澶栭攢' || this.weighList.orderType == '鍐呴攢' || this.weighList.orderType == '杞嚭') { + // if (this.weighList.hair == 0) { + // return true; + // } else if (this.weighList.hair != 0) { + // return false; + // } + // } }, // 鏄惁鏀剧┖鎸夐挳绂佺敤 isEvacuation() { @@ -273,6 +281,9 @@ if (this.weighList.orderType == '澶栬喘' || this.weighList.orderType == '鍐呰喘' || this.weighList.orderType == '杞叆') { return this.weighList.hair == this.temporaryWeighObj.skin || this.temporaryWeighObj.skin == this.temporaryWeighObj.hair; } + }, + sideline() { + return this.weighList.orderType == '鍐呰喘' || this.weighList.orderType == '杞嚭'; } }, methods: { @@ -375,6 +386,19 @@ // 鏀剧┖寮圭獥鍙栨秷 evacuationCancel() { this.evacuationModalShow = false; + }, + // input鑱氱劍 + inputFocus(v) { + if (v == 1) { + this.isfocus1 = true; + } else { + this.isfocus2 = true; + } + }, + // input澶辩劍 + inputBlur() { + this.isfocus1 = false; + this.isfocus2 = false; } } }; @@ -406,11 +430,13 @@ 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); + text { + font-family: weighting; + } } .top_right { display: flex; @@ -418,7 +444,6 @@ justify-content: center; flex: 2; font-size: 31rpx; - font-family: Microsoft YaHei; font-weight: 300; color: #ffffff; view { @@ -435,11 +460,8 @@ 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 { @@ -449,17 +471,28 @@ 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; + @include flex; + justify-content: center; overflow: hidden; .block-main { width: 650rpx; height: 350rpx; - @include flex flex-direction: column; + @include flex; + flex-direction: column; margin-bottom: vww(20); + position: relative; .first-line, .second-line { width: 90%; height: vww(44); + .focusClass { + color: #5b95fd; + } + .inputClass { + border: 1px solid rgba(73, 95, 252, 0.6) !important; + box-shadow: 0rpx 5rpx 13rpx 0rpx rgba(73, 95, 252, 0.6) !important; + border-radius: 12rpx !important; + } .input-container { border: 2px solid #c5c5c5; box-shadow: 0rpx 5rpx 13rpx 0rpx #c5c5c5; @@ -468,6 +501,8 @@ } .first-line { @include flex; + position: relative; + top: vww(8); } .second-line { @include flex; @@ -489,7 +524,6 @@ min-width: vww(50); height: vww(45); font-size: 21rpx; - font-family: Microsoft YaHei; font-weight: 400; color: #ffffff; text-align: center; @@ -501,7 +535,6 @@ } .num { font-size: 40rpx; - font-family: Microsoft YaHei; font-weight: 300; color: #303030; } @@ -527,13 +560,21 @@ align-items: flex-start; flex-direction: column; .main-information { - width: 50%; + width: 100%; height: 28rpx; font-size: 28rpx; - font-family: Microsoft YaHei; font-weight: 300; color: #303030; @include flex; + justify-content: flex-start; + .prefix { + min-width: vww(60); + } + .suffix { + flex: 1; + margin-left: vww(12); + text-align: left; + } } } } -- Gitblit v1.9.1