From ad9609c60f8fd0fffecfb0b8c03682caef1f3db8 Mon Sep 17 00:00:00 2001
From: whycq <you@example.com>
Date: 星期三, 16 十一月 2022 23:32:50 +0800
Subject: [PATCH] #

---
 Monitor-APP/pages/home/home.vue |  161 ++++++++++++++++++++++++++++++++++++++++++++++++++---
 1 files changed, 150 insertions(+), 11 deletions(-)

diff --git a/Monitor-APP/pages/home/home.vue b/Monitor-APP/pages/home/home.vue
index 375516a..098cfa0 100644
--- a/Monitor-APP/pages/home/home.vue
+++ b/Monitor-APP/pages/home/home.vue
@@ -10,12 +10,67 @@
 				<view class="time-tools">{{calendar}}</view>
 				<view class="button-left"></view>
 				<view class="button-right"></view>
-			</view>
-			<view class="main">
-				<view class="home-left">
-					<y-box></y-box>
+				<!-- 涓讳綋 -->
+				<view class="main">
+					<view class="mian-item">
+						<view class="mian-item-box">
+							<y-box>
+								<view class="box-item">
+									<text class="item-title">鑷姩鍖栫珛浣撲粨搴�</text>
+									<text class="item-subTitle">Automatic Storageand Retrieval System</text>
+									<text class="item-text">鍒╃敤绔嬩綋浠撳簱璁惧鍙疄鐜颁粨搴撻珮灞傚悎鐞嗗寲銆佸瓨鍙栬嚜鍔ㄥ寲銆佹搷浣滅畝渚垮寲锛涜嚜鍔ㄥ寲绔嬩綋浠撳簱鏄綋鍓嶆妧鏈按骞宠緝楂樼殑褰㈠紡銆傝嚜鍔ㄥ寲绔嬩綋浠撳簱鐨勪富浣撶敱璐ф灦銆佸贩閬撳紡鍫嗗灈璧烽噸鏈恒�佸叆锛堝嚭锛夊簱宸ヤ綔鍙板拰鑷姩杩愯繘锛堝嚭锛夊強鎿嶄綔鎺у埗绯荤粺缁勬垚銆傝揣鏋舵槸閽㈢粨鏋勬垨閽㈢瓔娣峰嚌鍦熺粨鏋勭殑寤虹瓚鐗╂垨缁撴瀯浣擄紝璐ф灦鍐呮槸鏍囧噯灏哄鐨勮揣浣嶇┖闂达紝宸烽亾鍫嗗灈璧烽噸鏈虹┛琛屼簬璐ф灦涔嬮棿鐨勫贩閬撲腑锛屽畬鎴愬瓨銆佸彇璐х殑宸ヤ綔銆傜鐞嗕笂閲囩敤璁$畻鏈哄強鏉″舰鐮佹妧鏈��</text>
+								</view>
+								<view class="box-item">
+									<text class="item-title">浠撳簱鏁版嵁</text>
+									<text class="item-subTitle">warehouse data</text>
+									<view class="img-box">
+										<view class="item-img">
+											<image src="../../static/a1.png" mode="aspectFit"></image>
+											
+											<view>绱璧拌璺濈(绫�)</view>
+										</view>
+										<view class="item-img">
+											<image src="../../static/a1.png" mode="aspectFit"></image>
+											
+											<view>绱璧拌璺濈(绫�)</view>
+										</view>
+										<view class="item-img">
+											<image src="../../static/a1.png" mode="aspectFit"></image>
+											
+											<view>绱璧拌璺濈(绫�)</view>
+										</view>
+										<view class="item-img">
+											<image src="../../static/a1.png" mode="aspectFit"></image>
+											
+											<view>绱璧拌璺濈(绫�)</view>
+										</view>
+									</view>
+								</view>
+								<view class="box-item">
+									<text class="item-title">搴撲綅浣跨敤鐜�</text>
+									<text class="item-subTitle">EQUIPMENT USAGE THIS MONTH</text>
+								</view>
+							</y-box>
+						</view>
+					</view>
+					<view class="mian-item">
+						<view class="mian-item-box">
+							<view style="width: 100%;height: 100%;">
+								<view style="height: 38%;">
+									<y-box></y-box>
+								</view>
+								<view style="height: 2%;"></view>
+								<view style="height: 38%;">
+									<y-box></y-box>
+								</view>
+								<view style="height: 2%;"></view>
+								<view style="height: 20%;">
+									<y-box></y-box>
+								</view>
+							</view>
+						</view>
+					</view>
 				</view>
-				<view class="home-right"></view>
 			</view>
 		</uni-transition>
 		<!-- 鍏ㄦ澘/鎷f枡淇℃伅 -->
@@ -44,12 +99,20 @@
 					boxShadow: '0 0 5px 1px rgba(0,0,0,0.2)'
 				},
 				duration: 1000,
-				calendar: ''
+				calendar: '',
+				xDistance: '',
+				yDistance: '',
+				xDuration: '',
+				yDuration: '',
+				fontSize: '',
+				height: ''
 			}
 		},
 		onShow() {
 			// 闅愯棌鏃堕棿,鐢甸噺,淇″彿绛�
+			// #ifdef APP-PLUS
 			plus.navigator.setFullscreen(true)
+			// #endif
 		},
 		onLoad() {
 			this.getDate()
@@ -93,6 +156,7 @@
 </script>
 
 <style>
+	@import url("../../static/css/common.css");
 	.container{
 		width: 100vw;
 		min-height: 100vh;
@@ -101,6 +165,7 @@
 		flex-direction: column;
 		align-items: center;
 		color: #fff;
+		
 	}
 	/* 涓昏鍥� */
 	.home-view {
@@ -109,20 +174,31 @@
 		background-image: url(../../static/background.png);
 		background-size: 100vw 100vh;
 	}
+	.home-right {
+		width: 50vw;
+		height: 89vh;
+		/* background-color: cadetblue; */
+	}
+	.home-right-box {
+		width: 98%;
+		height: 98%;
+	}
 	.head {
 		width: 100vw;
-		height: 10vh;
-		font-size: 4vh;
+		height: 11vh;
+		font-size:4vw;
 		font-weight: 700;
 		display: flex;
 		align-items: center;
 		justify-content: center;
+		transform: scale(0.7);
 	}
 	.time-tools {
 		position: absolute;
 		right: 2%;
 		top: 2%;
-		font-size: 1.5vh;
+		font-size:1vw;
+		transform: scale(0.8);
 	}
 	.button-left {
 		position: absolute;
@@ -143,6 +219,71 @@
 		width: 13.5%;
 		height: 8.5%;
 	}
+	
+	
+	
+	/* 鍏辩敤 */
+	.main {
+		width: 100vw;
+		height: 88vh;
+		margin-top: 1vh;
+		display: flex;
+		
+	}
+	.mian-item {
+		width: 50%;
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+	}
+	.mian-item-box {
+		width: 98%;
+		height: 98%;
+	}
+	.box-item {
+		width: 100%;
+		margin-top: 2%;
+		display: flex;
+		flex-direction: column;
+		align-items: flex-start;
+		justify-content: flex-start;
+	}
+	.item-title {
+		font-size:1.5vw;
+		font-weight: 700;
+	}
+	.item-subTitle {
+		font-size:0.5vw;
+		text-indent: 1em;
+	}
+	.item-text {
+		font-size: 1vw;
+		text-indent: 2em;
+		letter-spacing: 1px;
+	}
+	.img-box {
+		width: 100%;
+		background-color: #666666;
+		display: flex;
+		flex-direction: row;
+		justify-content: flex-start;
+		flex-wrap: wrap;
+	}
+	.item-img {
+		width: 50%;
+		margin-top: 3%;
+		background-color: #00ffff;
+		display: flex;
+		flex-direction: row;
+		justify-content: flex-start;
+		align-items: flex-start;
+	}
+	.item-img image {
+		height: 5vw;
+		width: 5vw;
+	}
 	/* 鍏ㄦ澘/鎷f枡淇℃伅 */
 	.info {
 		width: 100vw;
@@ -155,6 +296,4 @@
 		min-height: 100vh;
 		background-color: #00ffff;
 	}
-	/* 鍏辩敤 */
-	
 </style>
\ No newline at end of file

--
Gitblit v1.9.1