From f880863b9292a4cc4c0a484f721bb87bf42e57ed Mon Sep 17 00:00:00 2001
From: yangan <yangan0921@163.com>
Date: 星期五, 10 十一月 2023 17:32:32 +0800
Subject: [PATCH] 质检完成修改为处理完成

---
 pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue |  585 ++++++++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 489 insertions(+), 96 deletions(-)

diff --git a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue
index 348131f..bd74b53 100644
--- a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue
+++ b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue
@@ -1,116 +1,509 @@
 <template>
-	<view class="fayunPlan">
-		<view>
-			<view class="compDetails">
-				<view class="comp">{{ orderPlanDetail.compName }}</view>
-				<uni-table border stripe emptyText="鏆傛棤鏇村鏁版嵁">
-					<uni-tr>
-						<uni-th align="left">鎬婚鍙栭噺</uni-th>
-						<uni-td align="left">{{ orderPlanDetail.fowerdsum || 0 }}寮�</uni-td>
-					</uni-tr>
-					<uni-tr>
-						<uni-th align="left">杞﹂槦鍜岃揣浠�</uni-th>
-						<uni-td align="left">{{ orderPlanDetail.fleetOrHuodaiNub || 0 }}寮�</uni-td>
-					</uni-tr>
-					<uni-tr>
-						<uni-th align="left">杞﹂槦</uni-th>
-						<uni-td align="left">{{ orderPlanDetail.cheduiList || 0 }}寮�</uni-td>
-					</uni-tr>
-					<uni-tr>
-						<uni-th align="left">璐т唬</uni-th>
-						<uni-td align="left">{{ orderPlanDetail.huodaiList || 0 }}寮�</uni-td>
-					</uni-tr>
-					<uni-tr>
-						<uni-th align="left">鍙告満</uni-th>
-						<uni-td align="left">{{ orderPlanDetail.sijiSum || 0 }}寮�</uni-td>
-					</uni-tr>
-				</uni-table>
+	<view class="">
+		<view class="fayunPlan">
+			<view class="plan-banner">
+				<view class="top-container">
+					<view class="back-icon"
+						@click="backPage"><u-icon name="arrow-left"
+							size="50"
+							color="#fff"></u-icon></view>
+					<view class="top-title">鍙戣繍璁″垝璇︽儏</view>
+				</view>
+				<view class="middle-container">
+					<view class="dept-name">
+						{{ deptName }}
+						<text v-show="deptName">({{ coalName }})</text>
+					</view>
+					<view class="dept-num">
+						<text style="font-size: 46rpx;
+						font-weight: 400;
+						color: #FFFFFF;
+						text-shadow: 0rpx 4rpx 0rpx #1A66FE;">
+							{{ orderPlanDetail.fowardSum || 0 }}
+						</text>
+						<text style="font-size: 24rpx;
+						font-weight: 400;
+						color: #F81414;
+						text-shadow: 0rpx 4rpx 0rpx #1A66FE;">
+							/{{ (cars2||'') ||(carNum||'')||'' }}
+						</text>
+					</view>
+				</view>
+				<view class="bottom-container">
+					<view class="bottom-block">
+						<view class="bottom-content"
+							v-for="(item, index) in orderPlanDetail.huodaiList"
+							:key="index">
+							<view class="forward-name">{{ item.huoDaiName }}</view>
+							<view class="forward-num">
+								{{ item.fleetOrHuodaiNub }}
+								<text>寮�</text>
+							</view>
+						</view>
+						<view class="bottom-content"
+							v-for="(item, index) in orderPlanDetail.cheduiList"
+							:key="index">
+							<view class="fleet-name">{{ item.cheduiName }}</view>
+							<view class="fleet-num">
+								{{ item.fleetOrHuodaiNub }}
+								<text>寮�</text>
+							</view>
+						</view>
+						<view class="bottom-content">
+							<view class="fleet-name">鍙告満</view>
+							<view class="fleet-num">
+								{{ orderPlanDetail.sijiSum || 0 }}
+								<text>寮�</text>
+							</view>
+						</view>
+					</view>
+				</view>
 			</view>
-
-			<view class="compDetails">
-				<view class="comp">棰勭害鎯呭喌</view>
-				<uni-table border stripe emptyText="鏆傛棤鏇村鏁版嵁">
-					<uni-tr v-for="(item, index) in orderPlanDetail.yyDailyList">
-						<uni-td align="left">{{ orderPlanDetail.yyDailyList }}</uni-td>
-						<uni-td align="left">{{ orderPlanDetail.yyDailyList }}寮�</uni-td>
-					</uni-tr>
-				</uni-table>
+			<view class="block-top">
+				<combined-title title="閫氱煡鍗曞巻鍙�"></combined-title>
+				<view class="total">
+					鎬诲噣閲�
+					<text>{{ total.toFixed(2) || 0 }}</text>
+				</view>
+			</view>
+			<view class="main-banner">
+				<view class="empty-pointer"
+					v-if="yyDailyList.length===0">鏆傛棤鏇村鏁版嵁</view>
+				<view class="main-block">
+					<view class="main-container">
+						<view class="main-container_content"
+							v-for="(item, index) in yyDailyList"
+							:key="index"
+							@click="showMore(item)">
+							<view class="arrow-icon"><u-icon name="arrow-right"
+									size="30"
+									color="#999999"></u-icon></view>
+							<view class="divider"><u-divider></u-divider></view>
+							<view class="first-line">
+								<view class="car-num">{{ item.carNo || '' }}</view>
+								<view class="order-type">{{ coalStatus[item.statusWeigh]||'' }}</view>
+							</view>
+							<view class="second-line">
+								<view class="line-content">
+									<view class="line-content_text">鍑�閲�</view>
+									<view class="line-content_num">{{ item.clean?item.clean.toFixed(2):''  || '' }}
+									</view>
+								</view>
+								<view class="line-content">
+									<view class="line-content_text">浣欓噺</view>
+									<view class="line-content_num">{{ item.allowance.toFixed(2)  || 0 }}</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
 			</view>
 		</view>
+		<view class="white-block"></view>
 	</view>
 </template>
 
 <script>
-export default {
-	onLoad(value) {
-		console.log('椤甸潰鍔犺浇', value);
-		if (value.orderPlanId) {
-			this.orderPlanId = value.orderPlanId;
-		}
-	},
-	data() {
-		return {
-			orderPlanId: null,
-			orderPlanDetail: {}
-		};
-	},
-	onShow(){
-		this.init();
-	},
-	methods: {
-		init() {
-			this.GetOrderPlanDetail();
+	import combinedTitle from '@/components/combined-title/combined-title.vue';
+	export default {
+		components: {
+			combinedTitle
 		},
-		// 鑾峰彇鍙戣繍璁″垝璇︽儏
-		GetOrderPlanDetail() {
-			this.$reqGet('xiangqingList', { orderPlanId: this.orderPlanId }).then(res => {
-				this.orderPlanDetail = res.data;
-			});
+		onLoad(value) {
+			this.orderPlanId = value.orderPlanId;
+			this.orderCode = value.code;
+			this.cars2 = value.cars2 ? value.cars2 : null;
+			this.deptName = value.deptName;
+			this.coalName = value.coalName;
+			this.carNum = value.carNum ? value.carNum : null
+			console.log(value, '鍙戣繍璁″垝鍙傛暟');
+		},
+		data() {
+			return {
+				orderPlanId: null,
+				orderCode: null,
+				orderPlanDetail: {},
+				coalStatus: ['鏈О閲�', '绉伴噸涓�', '楠岃川涓�', '绉伴噸瀹屾垚', '澶勭悊瀹屾垚'],
+				yyDailyList: [],
+				// 棰嗗彇鏁伴噺
+				cars2: '',
+				coalName: '',
+				deptName: '',
+				total: 0,
+				carNum: ''
+			};
+		},
+		onShow() {
+			this.init();
+		},
+		methods: {
+			backPage() {
+				uni.navigateBack({
+					delta: 1
+				});
+			},
+			showMore(item) {
+				uni.navigateTo({
+					url: `/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore?orderPlanId=${this.orderPlanId}&id=${item.id}`
+				});
+			},
+			init() {
+				this.GetOrderPlanDetail();
+			},
+			// 鑾峰彇鍙戣繍璁″垝璇︽儏
+			GetOrderPlanDetail() {
+				uni.showLoading({
+					title: '鍔犺浇涓�...'
+				});
+				this.$reqGet('xiangqingList', { orderPlanId: this.orderPlanId }).then(res => {
+					if (res.code == 0) {
+						this.orderPlanDetail = res.data;
+						this.yyDailyList = res.data.yyDailyList;
+						if (res.data.yyDailyList) {
+							this.total = this.yyDailyList.reduce((prev, cur) => {
+								cur.clean = cur.clean ? cur.clean : 0
+								return prev + cur.clean;
+							}, 0);
+						} else {
+							this.total = 0;
+						}
+						console.log();
+						uni.hideLoading();
+					} else {
+						this.$u.toast('鍔犺浇澶辫触锛岃绋嶅悗閲嶈瘯');
+						uni.hideLoading();
+					}
+				});
+			}
 		}
-	}
-};
+	};
 </script>
 
-<style lang="scss" scoped>
-::v-deep.fayunPlan {
-	width: 100%;
-	margin: 0 auto;
-	display: flex;
-	flex-direction: column;
-	.compDetails {
-		width: 94%;
-		margin: vww(24) auto 0 auto;
-		.comp {
-			font-size: vww(16);
-			font-weight: 400;
-			padding: 0 vww(10);
-			height: vww(40);
-			line-height: vww(40);
-			border: 1px solid #ebeef5;
-			border-bottom: none;
-			background-color: #f5f5f5;
+<style lang="scss"
+	scoped>
+	@mixin flex {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+
+	.empty-pointer {
+		position: absolute;
+		top: 50%;
+		left: 38%;
+		color: #909399;
+	}
+
+	.white-block {
+		width: 100%;
+		height: vww(50);
+		margin-top: vww(10);
+	}
+
+	::v-deep.fayunPlan {
+		width: 100%;
+		margin: 0 auto;
+		background-color: #f4f4f4;
+		display: flex;
+		flex-direction: column;
+
+		.plan-banner {
+			width: 100%;
+			background: linear-gradient(0deg, #ffffff 0%, #0055fe 100%);
+			background-size: contain;
+			position: relative;
+			top: 0;
+
+			.top-container {
+				width: 468rpx;
+				height: 38rpx;
+				position: relative;
+				top: vww(48);
+				@include flex margin-left: vww(10);
+
+				.top-title {
+					width: 226rpx;
+					height: 36rpx;
+					font-size: 38rpx;
+					font-weight: normal;
+					color: #fff;
+					line-height: 69rpx;
+				}
+			}
+
+			.middle-container {
+				width: 626rpx;
+				height: 34rpx;
+				margin: vww(27) vww(31) 0 vww(31);
+				@include flex;
+				position: relative;
+				top: vww(54);
+
+				.dept-name {
+					min-width: 100rpx;
+					font-size: 32rpx;
+					font-weight: normal;
+					color: #ffffff;
+					line-height: 69rpx;
+					text-shadow: 0rpx 4rpx 0rpx #1a66fe;
+				}
+			}
+
+			.bottom-container {
+				width: 100%;
+				@include flex;
+				justify-content: center;
+				margin-top: vww(80);
+
+				.bottom-block {
+					width: 690rpx;
+					min-height: 185rpx;
+					background: #ffffff;
+					box-shadow: 4rpx 6rpx 51rpx 0rpx rgba(73, 120, 240, 0.11);
+					border-radius: 20rpx;
+					@include flex;
+					justify-content: space-around;
+					flex-wrap: wrap;
+					padding: 0 vww(8);
+
+					.bottom-content {
+						@include flex;
+						flex-direction: column;
+						height: vww(56);
+						margin-right: vww(5);
+
+						.forward-name,
+						.fleet-name {
+							font-size: 28rpx;
+							font-weight: normal;
+							color: #757575;
+							line-height: 69rpx;
+						}
+
+						.forward-num,
+						.fleet-num {
+							font-size: 40rpx;
+							font-weight: 400;
+							color: #303030;
+							line-height: 69rpx;
+
+							text {
+								font-size: 30rpx;
+							}
+						}
+					}
+				}
+			}
 		}
-		.uni-table {
-			.uni-table-tr {
-				padding: 0;
-				// .uni-table-th {
-				// 	height: vww(40);
-				// 	line-height: vww(40);
-				// 	padding: vww(5) vww(10);
-				// 	color: #111111;
-				// 	font-weight: 300;
-				// 	background: #f5f5f5;
-				// }
-				.uni-table-td {
+
+		.block-top {
+			width: 94%;
+			margin: vww(15);
+			@include flex;
+
+			.total {
+				height: 30rpx;
+				line-height: vww(15);
+				font-size: 28rpx;
+				font-weight: normal;
+				color: #757575;
+
+				text {
+					width: 118rpx;
+					height: 30rpx;
+					line-height: vww(15);
+					font-size: 40rpx;
+					font-weight: 400;
+					color: #f81414;
+				}
+			}
+		}
+
+		.main-banner {
+			width: 100%;
+			@include flex;
+			justify-content: center;
+
+			.main-block {
+				width: 690rpx;
+				background: #ffffff;
+				box-shadow: 4rpx 6rpx 51rpx 0rpx rgba(73, 120, 240, 0.11);
+				border-radius: 20rpx;
+
+				.main-container {
+					width: 100%;
+					@include flex;
+					justify-content: center;
+					flex-direction: column;
+					background-color: #fff;
+
+					&_content {
+						width: 96%;
+						height: 194rpx;
+						@include flex;
+						flex-direction: column;
+						justify-content: space-around;
+						align-items: flex-start;
+						margin-top: vww(8);
+						position: relative;
+
+						.arrow-icon {
+							position: absolute;
+							right: vww(10);
+							top: vww(17);
+						}
+
+						.divider {
+							position: absolute;
+							width: 94%;
+							height: vww(1);
+							margin: 0 auto;
+							border-bottom: 1px soild #d6d6d6;
+							left: vww(15);
+							bottom: vww(18);
+						}
+
+						.first-line {
+							width: 50%;
+							@include flex;
+							margin: 0 vww(15);
+
+							.car-num {
+								height: 31rpx;
+								font-size: 30rpx;
+								font-weight: 300;
+								color: #303030;
+							}
+
+							.order-type {
+								border: 2px solid #035cfb;
+								border-radius: 4rpx;
+								color: #035cfb;
+								padding: vww(2) vww(4);
+								text-align: center;
+							}
+						}
+
+						.second-line {
+							width: 94%;
+							height: vww(14);
+							margin: 0 vww(15);
+							@include flex;
+							justify-content: space-between;
+
+							.line-content {
+								width: 40%;
+
+								@include flex &_text {
+									width: 69rpx;
+									height: 29rpx;
+									line-height: 29rpx;
+									font-size: 28rpx;
+									font-weight: 400;
+									color: #919090;
+								}
+
+								&_num {
+									height: 29rpx;
+									line-height: 29rpx;
+									font-size: 38rpx;
+									font-weight: 400;
+									color: #035cfb;
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+
+		.fayunPlanBody {
+			width: 94%;
+			margin: 0 auto;
+
+			.compDetails {
+				width: 94%;
+				margin: vww(24) auto 0 auto;
+
+				.comp {
 					font-size: vww(16);
-					font-weight: 300;
+					font-weight: 400;
+					padding: 0 vww(10);
 					height: vww(40);
 					line-height: vww(40);
-					padding: vww(5) vww(10);
-					color: #111111;
+					border: 1px solid #ebeef5;
+					border-bottom: none;
+					background-color: #f5f5f5;
+				}
+			}
+
+			.card {
+				width: 94%;
+				height: vww(150);
+				margin: vww(24) auto 0 auto;
+				background-color: #fff;
+				border-radius: 4px;
+				box-shadow: 0 2px 12px 0 #ebeef5;
+				position: relative;
+				display: flex;
+				justify-content: center;
+				align-items: flex-start;
+
+				.coal-status,
+				.coal-clean,
+				.coal-allowance,
+				.coal-carNo {
+					width: 50%;
+					margin-top: vww(30);
+					height: vww(50);
+					text-align: center;
+
+					.label-title {
+						color: #909399;
+					}
+
+					.label-value {
+						min-width: vww(85);
+						margin-top: vww(10);
+						color: #606266;
+					}
+				}
+
+				.more-button {
+					width: vww(60);
+					position: absolute;
+					top: vww(100);
+					display: flex;
+					justify-content: center;
+				}
+			}
+
+			// 琛ㄦ牸鏍峰紡
+			.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;
+					}
 				}
 			}
 		}
 	}
-}
-</style>
+</style>
\ No newline at end of file

--
Gitblit v1.9.1