From 8dbae264b163b253e46bec4638914c7ec58f28c5 Mon Sep 17 00:00:00 2001
From: zhou zhou <3272660260@qq.com>
Date: 星期五, 19 十二月 2025 15:34:03 +0800
Subject: [PATCH] #

---
 pages/mat/matSelected.vue |  223 ++++++++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 170 insertions(+), 53 deletions(-)

diff --git a/pages/mat/matSelected.vue b/pages/mat/matSelected.vue
index efaaf5a..97fb8b5 100644
--- a/pages/mat/matSelected.vue
+++ b/pages/mat/matSelected.vue
@@ -1,36 +1,64 @@
 <template>
-	<view>
-		<view class="form">
-			<view class="form-item">
-				<view class="form-item-desc"><text>鍟嗗搧缂栫爜</text></view>
-				<view class="form-item-content"><text>{{mat.matnr}}</text></view>
+	<view class="page-container">
+		<!-- 琛ㄥ崟鍖哄煙 -->
+		<view class="form-section">
+			<view class="form-header">
+				<uni-icons type="box" size="24" color="#667eea"></uni-icons>
+				<text class="form-title">鍟嗗搧淇℃伅</text>
 			</view>
+			
 			<view class="form-item">
-				<view class="form-item-desc"><text>鍟嗗搧鍚嶇О</text></view>
-				<view class="form-item-content" style="word-break: break-all;line-height: 1.5;"><text>{{mat.maktx}}</text></view>
-			</view>
-			<view class="form-item">
-				<view class="form-item-desc"><text>瑙勬牸</text></view>
-				<view class="form-item-content"><text>{{mat.specs}}</text></view>
-			</view>
-			<view class="form-item">
-				<view class="form-item-desc"><text>鎵瑰彿</text></view>
-				<view class="form-item-content">
-					<view class="form-input">
-						<input type="text" v-model="mat.batch">
-					</view>
+				<view class="form-label">
+					<text class="label-text">鍟嗗搧缂栫爜</text>
+				</view>
+				<view class="form-value">
+					<text class="value-text code">{{mat.matnr}}</text>
 				</view>
 			</view>
+			
 			<view class="form-item">
-				<view class="form-item-desc"><text>鏁伴噺</text></view>
-				<view class="form-item-content">
-					<uni-number-box :value="mat.anfme" :max="99999999" :step='1' color="#747474" @change="changeValue" />
+				<view class="form-label">
+					<text class="label-text">鍟嗗搧鍚嶇О</text>
+				</view>
+				<view class="form-value">
+					<text class="value-text name">{{mat.maktx}}</text>
+				</view>
+			</view>
+			
+			<view class="form-item">
+				<view class="form-label">
+					<text class="label-text">瑙勬牸</text>
+				</view>
+				<view class="form-value">
+					<text class="value-text">{{mat.specs || '-'}}</text>
+				</view>
+			</view>
+			
+			<view class="form-item">
+				<view class="form-label">
+					<text class="label-text">鎵瑰彿</text>
+				</view>
+				<view class="form-input-wrap">
+					<input class="form-input" type="text" placeholder="璇疯緭鍏ユ壒鍙�" v-model="mat.batch" />
+				</view>
+			</view>
+			
+			<view class="form-item no-border">
+				<view class="form-label">
+					<text class="label-text">鏁伴噺</text>
+				</view>
+				<view class="form-number">
+					<uni-number-box :value="mat.anfme" :max="99999999" :step='1' color="#667eea" @change="changeValue" />
 				</view>
 			</view>
 		</view>
+		
 		<!-- 搴曢儴鎿嶄綔鎸夐挳 -->
-		<view class="buttom">
-			<button size="mini" type="primary" @click="back()">鎻愬彇</button>
+		<view class="bottom-bar">
+			<view class="btn-submit" @click="back()">
+				<uni-icons type="checkbox" size="18" color="#ffffff"></uni-icons>
+				<text class="btn-text">纭鎻愬彇</text>
+			</view>
 		</view>
 	</view>
 </template>
@@ -93,41 +121,130 @@
 
 <style>
 	@import url('../../static/css/wms.css/wms.css');
-	.form {
-		min-height: 80rpx;
-		background-color: #FFF;
-		margin-top: 10px;
-		color: #606266;
-		box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.2) ;
-	}
-	.form-item {
-		min-height: 100rpx;
-		line-height: 1;
-		border-bottom: 1px solid #DCDFE6;
-		margin-left: 40rpx;
-		display: flex;
-		align-items: center;
-	}
-	.form-item-desc {
-		width: 30%;
-	}
-	.form-item-content {
-		width: 60%;
+	
+	page {
+		height: 100%;
+		background: #f5f7fa;
 	}
 	
-	.form-item:last-child {
-		border: none;
+	.page-container {
+		min-height: 100vh;
+		background: linear-gradient(135deg, #f5f7fa 0%, #e4e8eb 100%);
+		padding-bottom: 110rpx;
+		box-sizing: border-box;
 	}
-	.form-input {
+	
+	/* 琛ㄥ崟鍖哄煙 */
+	.form-section {
+		background: #ffffff;
+		margin: 20rpx;
+		border-radius: 16rpx;
+		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
+		overflow: hidden;
+	}
+	
+	.form-header {
 		display: flex;
 		align-items: center;
-		width: 50vw;
-		height: 50rpx;
-		padding: 2px 5px;
-		border-bottom: 1px solid #E4E7ED;
-		border-radius: 5rpx;
+		padding: 24rpx;
+		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
 	}
-	.form-input input{
-		color: #606266;
+	
+	.form-title {
+		font-size: 30rpx;
+		color: #ffffff;
+		font-weight: 600;
+		margin-left: 12rpx;
+	}
+	
+	.form-item {
+		display: flex;
+		align-items: center;
+		padding: 20rpx 24rpx;
+		border-bottom: 1rpx solid #f0f0f0;
+	}
+	
+	.form-item.no-border {
+		border-bottom: none;
+	}
+	
+	.form-label {
+		width: 150rpx;
+		flex-shrink: 0;
+	}
+	
+	.label-text {
+		font-size: 26rpx;
+		color: #909399;
+	}
+	
+	.form-value {
+		flex: 1;
+	}
+	
+	.value-text {
+		font-size: 28rpx;
+		color: #303133;
+		word-break: break-all;
+		line-height: 1.5;
+	}
+	
+	.value-text.code {
+		color: #667eea;
+		font-weight: 600;
+	}
+	
+	.value-text.name {
+		font-weight: 500;
+	}
+	
+	.form-input-wrap {
+		flex: 1;
+		background: #f5f7fa;
+		border-radius: 8rpx;
+		padding: 0 16rpx;
+		height: 64rpx;
+		display: flex;
+		align-items: center;
+	}
+	
+	.form-input {
+		flex: 1;
+		height: 64rpx;
+		font-size: 28rpx;
+		color: #303133;
+	}
+	
+	.form-number {
+		flex: 1;
+		display: flex;
+		justify-content: flex-start;
+	}
+	
+	/* 搴曢儴鎿嶄綔鏍� */
+	.bottom-bar {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		padding: 16rpx 20rpx;
+		background: #ffffff;
+		box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.06);
+	}
+	
+	.btn-submit {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		height: 80rpx;
+		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+		border-radius: 40rpx;
+	}
+	
+	.btn-submit .btn-text {
+		font-size: 30rpx;
+		color: #ffffff;
+		font-weight: 500;
+		margin-left: 8rpx;
 	}
 </style>
\ No newline at end of file

--
Gitblit v1.9.1