From 6087ba7d24f2353c2d01a5e5a384d5a20f97a19b Mon Sep 17 00:00:00 2001
From: qingyiay <2386314947@qq.com>
Date: 星期一, 15 五月 2023 08:10:53 +0800
Subject: [PATCH] 增加路线规划，样式修改

---
 pages/driver-page/driver-index/bill-of-lading-details/weighingDevice/weighingDevice.vue |  548 +++++++++++++++++++++++++++++++++++++++++++-----------
 1 files changed, 435 insertions(+), 113 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 b33e955..138a077 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>
@@ -12,53 +16,165 @@
 					</view>
 					<view class="">
 						绾㈠:
-						<u--text :type="infraredStatus ? 'error' : 'success'" :text="infraredStatus ? '寮傚父' : '姝ｅ父'" size="34"></u--text>
+						<u--text :type="globalinfraredStatus ? 'error' : 'success'" :text="globalinfraredStatus ? '寮傚父' : '姝ｅ父'" size="34"></u--text>
 					</view>
-					<!-- <view class="">
-						闆疯揪:
-						<u--text type="success" text="姝ｅ父" size="34"></u--text>
-					</view> -->
 				</view>
 			</view>
-			<view class="bottom"><text>TIP:褰撳墠鐘舵�佹甯稿彲浠ョО閲�</text></view>
+			<view class="bottom" v-if="weighList.orderType == '鍐呰喘' || weighList.orderType == '杞叆'">
+				<view>
+					<view style="font-weight: 600;">鍘熷彂淇℃伅</view>
+
+					<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:褰撳墠鐘舵�佷负姝ｅ父鏃跺彲浠ョО閲�</text></view>
 		</view>
-		<view class="two">
-			<p>璁㈠崟缂栧彿锛歿{ weighList.code || '' }}</p>
-			<p>璁㈠崟绫诲瀷锛歿{ weighList.orderTye || '' }}</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" 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" :class="{ focusClass: isfocus1 }">鐨噸</view>
+					<view class="input-container" :class="{ inputClass: isfocus1, disabledClass: isInputOrigin }">
+						<u--input
+							placeholder="璇疯緭鍏ョ毊閲�"
+							border="surround"
+							v-model="weighData.coalContactSkin"
+							@focus="inputFocus(1)"
+							@blur="inputBlur"
+							:disabled="isInputOrigin"
+						></u--input>
+					</view>
+					<view class="unit" :class="{ focusClass: isfocus1 }">鍚�</view>
+				</view>
+				<view class="second-line">
+					<view class="label-text" :class="{ focusClass: isfocus2 }">姣涢噸</view>
+					<view class="input-container" :class="{ inputClass: isfocus2, disabledClass: isInputOrigin }">
+						<u--input
+							placeholder="璇疯緭鍏ユ瘺閲�"
+							border="surround"
+							v-model="weighData.coalContactHair"
+							@focus="inputFocus(2)"
+							@blur="inputBlur"
+							:disabled="isInputOrigin"
+						></u--input>
+					</view>
+					<view class="unit" :class="{ focusClass: isfocus2 }">鍚�</view>
+				</view>
+				<view class="second-line">
+					<view class="label-text">鍑�閲�</view>
+					<view class="input-container"><u--input placeholder="鍑�閲�" border="surround" v-model="coalContactClean" :disabled="isInputOrigin"></u--input></view>
+					<view class="unit">鍚�</view>
+				</view>
+			</view>
+			<view class="block-sideline" v-if="sideline">
+				<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 v-else style="width: 100%;height: 40rpx;"></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="纭畾绉伴噸"
-				:disabled="realTimeWeigh == 0 || infraredStatus"
+				:disabled="realTimeWeigh == 0 || globalinfraredStatus || isweigh || isInputOrigin"
 				:loading="isConfirmWeighLoading"
-				loadingText="鍔犺浇涓�"
+				loadingText="纭"
 				@click="confirmWeigh"
 			></u-button>
-			<u-button type="primary" text="杩斿洖鍔犲噺鍚�" :disabled="addAndSubtractCoalDisabled" v-if="weighList.orderTye == '澶栭攢'" @click="addAndSubtractCoal"></u-button>
+			<u-button type="primary" text="杩斿洖鍔犲噺鍚�" :disabled="addAndSubtractCoalDisabled" @click="addAndSubtractCoal" class="jiajian" v-if="outBuy"></u-button>
 		</view>
-		<view class="four">濡傛偍闇�瑕佽皟鏁磋杞借揣鍝佸惃鏁帮紝璇风偣鍑昏繑鍥炲姞鍑忓惃</view>
+		<!-- <view class="four" v-if="weighList.orderType !== '澶栬喘'">濡傛偍闇�瑕佽皟鏁磋杞借揣鍝佸惃鏁帮紝璇风偣鍑昏繑鍥炲姞鍑忓惃</view> -->
+		<!-- 鏀剧┖寮圭獥 -->
+		<view class="evacuationModal">
+			<u-modal
+				:show="evacuationModalShow"
+				:title="evacuationTitle"
+				:content="evacuationContent"
+				:showCancelButton="true"
+				@confirm="evacuationConfirm"
+				@cancel="evacuationCancel"
+			></u-modal>
+		</view>
 	</view>
 </template>
 
 <script>
 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;
 		this.weighData.sceneId = params.sceneId;
 		this.weighData.gateCameraId = params.gateCameraId;
 		this.weighData.equipmentCode = params.gateCameraCode;
+		this.weighData.sceneInOut = params.sceneInOut;
 		this.weighHouseCode = params.weighHouseCode;
+		this.primarySkin = params.primarySkin;
+		this.primaryHair = params.primaryHair;
+		this.primaryClean = params.primaryClean;
+		this.changeweighHouseCode(params.weighHouseCode);
+	},
+	components: {
+		combinedTitle
 	},
 	data() {
 		return {
@@ -71,72 +187,125 @@
 				gateCameraId: '',
 				equipmentCode: '',
 				weigh: 0,
-				tmCode: ''
+				tmCode: '',
+				sceneInOut: '',
+				coalContactClean: 0,
+				coalContactHair: 0,
+				coalContactSkin: 0
 			},
+			// 鏄惁濉啓鍘熷彂淇℃伅
+			isInputOrigin: false,
 			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,
-				hair:0,
-				clean:0
+			temporaryWeighObj: {
+				skin: 0,
+				hair: 0,
+				clean: 0
 			},
-			infraredStatus:false// 绾㈠鐘舵��
+			infraredStatus: false, // 绾㈠鐘舵�侊紝
+			// 鏀剧┖鎺у埗
+			evacuationModalShow: false,
+			evacuationTitle: '鏀剧┖纭',
+			evacuationContent: '鏄惁纭鏀剧┖',
+			// 鑾峰彇鍘熷彂淇℃伅
+			primarySkin: null,
+			primaryHair: null,
+			primaryClean: null,
+			// 鍒ゆ柇绉伴噸鎸夐挳鏄惁鍙敤
+			isweigh: false,
+			// 澶栬喘绫诲瀷绉伴噸濉啓姣涳紝鐨紝
+			firstHairCustomernameShow: false,
+			coalContactHair: '',
+			coalContactSkin: '',
+			// 鑱氱劍鏃舵敼鍙樻牱寮�
+			isfocus1: false,
+			isfocus2: false,
+			// 澶栬喘绗竴娆＄О姣涢噸涓嶉渶瑕佸姞鍑忓惃
+			outBuy: true
 		};
 	},
-	watch:{
-		realTimeWeigh(newV,oldV){
-			if(this.weighList.orderTye == '澶栭攢'){
-				if(this.weighList.skin == 0){
-					this.temporaryWeighObj.skin = this.realTimeWeigh
+	watch: {
+		realTimeWeigh(newV, oldV) {
+			if (this.weighList.orderType == '澶栭攢' || this.weighList.orderType == '鍐呴攢' || this.weighList.orderType == '杞嚭') {
+				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.clean = this.temporaryWeighObj.hair - this.weighList.skin
+					// 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.orderTye == '澶栬喘'){
-				if(this.weighList.hair == 0){
-					this.temporaryWeighObj.hair = this.realTimeWeigh
+			} 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 = this.weighList.hair - this.temporaryWeighObj.skin
+					// 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;
 				}
 			}
+		},
+		// 鐩戝惉閲嶉噺鍙樺寲
+		globalweigh: {
+			handler(v) {
+				this.weighData.weigh = this.realTimeWeigh = v;
+				console.log(this.realTimeWeigh, '鐪熷疄閲嶉噺鏀瑰彉浜�');
+				// setTimeout(() => {
+				// 	this.weighData.weigh = this.realTimeWeigh = v;
+				// }, 0);
+			},
+			deep: true,
+			immediate: true
 		}
 	},
 	onShow() {
 		this.init();
-		this.initWebSocket();
+		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');
 		},
 		// 鍔犲噺鐓ゆ寜閽鐢ㄤ笌鍚�
 		addAndSubtractCoalDisabled() {
-			if (this.weighList.orderTye == '澶栭攢') {
-				if (this.weighList.skin == 0) {
-					return true;
-				} else if (this.weighList.skin != 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() {
+			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;
 			}
 		},
+		sideline() {
+			return this.weighList.orderType == '鍐呰喘' || this.weighList.orderType == '杞嚭';
+		}
 	},
 	methods: {
+		...mapMutations(['changeweighHouseCode']),
 		init() {
 			// 鑾峰彇绉伴噸淇℃伅
 			this.$reqGet('weighList', { id: this.takeCoalId }).then(res => {
@@ -147,6 +316,18 @@
 					this.weighData.tmId = res.data.id;
 					this.weighData.carNo = res.data.carNo;
 					this.weighData.tmCode = res.data.code;
+					this.weighData.filedId = res.data.filedId;
+					this.weighData.coalContactHair = res.data.hairTwo ? res.data.hairTwo : 0;
+					this.weighData.coalContactSkin = res.data.skinTwo ? res.data.skinTwo : 0;
+					if (this.weighList.orderType == '澶栬喘') {
+						this.firstHairCustomernameShow = true;
+						if (this.weighList.hair == 0) {
+							this.outBuy = false;
+						}
+					}
+					if (this.weighData.coalContactHair > 0 && this.weighData.coalContactSkin > 0) {
+						this.isInputOrigin = true;
+					}
 				}
 			});
 		},
@@ -157,7 +338,7 @@
 			if (this.isConfirmWeighLoading == false) {
 				this.isConfirmWeighLoading = true;
 				if (this.weighData.weigh != 0) {
-					if (this.weighList.orderTye == '澶栭攢') {
+					if (this.weighList.orderType == '澶栭攢') {
 						if (this.weighList.skin ? (this.weighList.skin < this.realTimeWeigh ? true : false) : true) {
 							this.saveWeigh();
 						} else {
@@ -175,8 +356,10 @@
 		},
 		// 纭绉伴噸鎺ュ彛
 		saveWeigh() {
+			this.weighData.coalContactClean = this.coalContactClean;
 			this.$reqPost('saveWeigh', this.weighData, 'json')
 				.then(res => {
+					console.log(res, '绉伴噸鎺ュ彛');
 					if (res.code == 0) {
 						this.$u.toast('绉伴噸鎴愬姛');
 						setTimeout(() => {
@@ -185,6 +368,8 @@
 							});
 							this.isConfirmWeighLoading = false;
 						}, 1000);
+					} else {
+						this.$u.toast('绉伴噸澶辫触锛岃绋嶅悗閲嶈瘯');
 					}
 				})
 				.catch(err => {
@@ -207,63 +392,62 @@
 				}
 			});
 		},
-		/**
-		 * 鍒濆鍖� 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缁撴灉');
+		// 鏀剧┖
+		evacuation() {
+			this.evacuationModalShow = true;
+		},
+		// 鏀剧┖寮圭獥纭
+		evacuationConfirm() {
+			this.$reqPost('getTwoEvacuation', this.weighData, 'json').then(res => {
+				console.log(res, '绗簩娆℃斁绌�');
+				if (res.code == 0) {
+					this.$u.toast('鎿嶄綔鎴愬姛');
+					this.evacuationModalShow = false;
+				} else {
+					this.$u.toast(res.msg ? res.msg : '鎿嶄綔澶辫触');
+					this.evacuationModalShow = true;
 				}
 			});
-			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.infraredStatus = true
-						this.weighData.weigh = this.realTimeWeigh = nowWeighObj.weigh;
-					}else{
-						this.infraredStatus = false
-						this.weighData.weigh = this.realTimeWeigh = nowWeighObj.weigh;
-					}
-				}
-			});
-			socket.onClose(() => {
-				console.log('webSocketClose');
-				this.$u.toast('纾呮埧鎺ュ彛缁堢');
-			});
-			socket.onError(err => {
-				console.log('socket鎶ラ敊', err);
-				this.$u.toast('纾呮埧鎺ュ彛鏆傛椂涓嶈兘浣跨敤锛岃閲嶆柊杩涘叆璇ラ〉闈紝閲嶈瘯锛侊紒');
-			});
+		},
+		// 鏀剧┖寮圭獥鍙栨秷
+		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;
 		}
 	}
 };
 </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(1) 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;
@@ -271,32 +455,156 @@
 				display: flex;
 				align-items: center;
 				justify-content: center;
+				font-size: 74rpx;
+				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;
 				flex-direction: column;
 				justify-content: center;
 				flex: 2;
+				font-size: 31rpx;
+				font-weight: 300;
+				color: #ffffff;
 				view {
 					display: flex;
+					align-items: center;
 				}
 			}
 		}
 		.bottom {
 			text-align: center;
+			height: 25%;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			flex-direction: column;
+			font-size: 28rpx;
+			font-weight: 300;
+			color: #d9e1fe;
 		}
 	}
-	.two {
-		flex: 4;
-		border: vww(1) solid #dddddd;
-		margin: vww(20);
-		border-radius: vww(10);
-		padding: vww(20);
-		p {
-			text-align: center;
-			font-size: vww(20);
-			font-weight: 500;
-			margin-top: vww(5);
+	.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);
+			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;
+				}
+				.isInputOrigin {
+					background-color: #f4f4fc;
+				}
+				.input-container {
+					border: 2px solid #c5c5c5;
+					box-shadow: 0rpx 5rpx 13rpx 0rpx #c5c5c5;
+					border-radius: 12rpx;
+				}
+			}
+			.first-line {
+				@include flex;
+				position: relative;
+				top: vww(8);
+			}
+			.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 {
+					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;
+					}
+				}
+			}
+		}
+	}
+	.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(10);
+			@include flex;
+			justify-content: space-around;
+			align-items: flex-start;
+			flex-direction: column;
+			.main-information {
+				width: 100%;
+				height: 28rpx;
+				font-size: 28rpx;
+				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;
+				}
+			}
 		}
 	}
 	.three {
@@ -308,11 +616,25 @@
 			&:nth-of-type(2) {
 				margin-left: vww(10);
 			}
+			&:nth-of-type(3) {
+				margin-left: vww(10);
+			}
 		}
 	}
 	.four {
-		margin: vww(10) auto;
-		flex: 0.5;
+		width: 100%;
+		margin-top: vww(5);
+		text-align: center;
+	}
+}
+.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