diff --git a/.hbuilderx/launch.json b/.hbuilderx/launch.json
new file mode 100644
index 0000000..582561b
--- /dev/null
+++ b/.hbuilderx/launch.json
@@ -0,0 +1,16 @@
+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"app-plus" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}
diff --git a/common/common.scss b/common/common.scss
index d01168d..7efe9e0 100644
--- a/common/common.scss
+++ b/common/common.scss
@@ -1,9 +1,15 @@
+.status_bar {
+	height: var(--status-bar-height);
+	width: 100%;
+}
+
 // 导航栏
 .nav_title{
 	position: fixed;
 	z-index: 99;
 	top: 0;
 	width: 100%;
+	background-color: white;
 	&::after{
 		content: "";
 		background-color: #F6F5FA;
@@ -19,9 +25,63 @@
 	
 }
 .nav_body{
-	padding-top: 100rpx;
+	padding-top: 100rpx + var(--status-bar-height);
+}
+
+//地址信息
+.address{
+	padding-top: 33.33rpx;
+	padding-bottom: 36rpx;
+	padding-left: 29.33rpx;
+	padding-right: 22.67rpx;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	border-bottom: 14.67rpx #F6F5FA solid;
+	position: relative;
+	.address_left{
+		
+		.address_title{
+			display: flex;
+			align-items: center;
+			color: #666666;
+			font-size: 24rpx;
+			margin-bottom: 30.67rpx;
+			
+			image{
+				width: 32rpx;
+				height: 32rpx;
+			}
+			.address_title_name{
+				font-size: 28rpx;
+				color: black;
+				font-weight: bold;
+				margin-left: 24rpx;
+				margin-right: 38.67rpx;
+			}
+		}
+		.address_content{
+			padding-left: 56rpx;
+			color: #666666;
+			font-size: 24rpx;
+			font-weight: bold;
+		}
+	}
+		
+	.address_xian{
+		height: 4rpx;
+		width: 100%;
+		position: absolute;
+		left: 0;
+		bottom: 0;
+	}
+}
+.address_more{
+	width: 20rpx;
+	height: 20rpx;
 }
 
+// 遮罩层
 .mask{
 	position: fixed;
 	width: 100%;
@@ -96,7 +156,7 @@
 		justify-content: space-between;
 		align-items: center;
 		
-		img{
+		image{
 			width: 36rpx;
 			height: 36rpx;
 			margin-right: 9.33rpx;
diff --git a/common/scss/order.scss b/common/scss/order.scss
new file mode 100644
index 0000000..9ae7d00
--- /dev/null
+++ b/common/scss/order.scss
@@ -0,0 +1,73 @@
+.order_popup_commodity{
+	padding:0 26rpx;
+	
+	.good_info{
+		padding: 40rpx 0;
+		font-size: 22.67rpx;
+		color: #666666;
+		font-weight: bold;
+		border-bottom: 2.67rpx solid #F1F1F1;
+		&:last-child{
+			border-bottom: none;
+		}
+		.good_info_left{
+			display: flex;
+			align-items: center;
+			width: 100%;
+			.good_info_image{
+				width: 200rpx ;
+				height: 200rpx;
+				background-color: #999999;
+				margin-right: 32.67rpx;
+			}
+			.left_info{
+				
+				.info_name{
+					font-size: 26.67rpx;
+					font-weight: 400;
+					width: 461.33rpx;
+				}
+				.left_info_bottom{
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					font-size: 32rpx;
+					color: #909090;
+					margin-top: 24rpx;
+					.info_lable{
+						padding: 5.33rpx 20rpx;
+						font-size: 22.67rpx;
+						border-radius: 33.33rpx;
+						border: 1px solid #D3D3D3;
+						image{
+							width: 17.33rpx;
+							height: 17.33rpx;
+							margin-left: 14.67rpx;
+						}
+					}
+				}
+				.info_price{
+					font-size: 28rpx;
+					color: black;
+					font-weight: bold;
+					margin-top: 43.33rpx;
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+					
+					button{
+						margin: 0;
+						height: 45.33rpx;
+						line-height: 45.33rpx;
+						border: #999999 solid 1px;
+						font-size: 17.33rpx;
+						color: #999999;
+						&::after{
+							content: none;
+						}
+					}
+				}
+			}
+		}
+	}
+}
\ No newline at end of file
diff --git a/pages.json b/pages.json
index 77019f3..2ea5007 100644
--- a/pages.json
+++ b/pages.json
@@ -137,6 +137,28 @@
 			"style": {
 				"titleNView":false
 			}
+		},
+		{
+			"path": "pages/order/details",
+			"style": {
+				"navigationBarTitleText": "Order details",
+				"navigationBarBackgroundColor":"#FFFFFF"
+				// "app-plus": {
+				// 	"titleNView": {
+				// 		"splitLine":{
+				// 			"color":"#F6F5FA",
+				// 			"height":"5px"
+				// 		}
+				// 	}
+				// }
+			}
+		},
+		{
+			"path": "pages/order/logisticsDetails",
+			"style": {
+				"navigationBarTitleText": "Logistics details",
+				"navigationBarBackgroundColor":"#FFFFFF"
+			}
 		}
 	],
 	"globalStyle": {
diff --git a/pages/account/favorites.vue b/pages/account/favorites.vue
index 394e4b4..1f1c1d9 100644
--- a/pages/account/favorites.vue
+++ b/pages/account/favorites.vue
@@ -1,20 +1,21 @@
 <template>
 	<view class="wishlist_body">
+		<view class="status_bar"></view>
 		<uni-nav-bar  left-icon="left"  :rightText="isDelete?'Done':'Delete'" title="Favorites" color="#000000" @clickLeft="back" @clickRight="isDelete=!isDelete"/>
 		<view class="wishlist">
 			<view class="wishlist_item" v-for="(item,index) in 9" :key="index">
 				<view class="wishlist_item_img">
-					<img src="/static/img/select.png" alt="" class="select" v-show="isDelete">
+					<image src="../../static/img/select.png" mode=""  class="select" v-show="isDelete"></image>
 				</view>
 				<view class="wishlist_item_bottom">
 					<text>US$31234.00</text>
-					<img src="/static/img/like.png" alt="" class="wishlist_item_bottom_icon">
+					<image src="../../static/img/like.png" mode="" class="wishlist_item_bottom_icon"></image>
 				</view>
 			</view>
 		</view>
 		<view class="wishlist_foot" v-show="isDelete">
 			<view class="wishlist_foot_left">
-				<img src="/static/img/select2.png" alt="">
+				<image src="../../static/img/select2.png" mode=""></image>
 				<text>All</text>
 			</view>
 			<view class="wishlist_foot_right">
diff --git a/pages/account/index.vue b/pages/account/index.vue
index 6ea7e0b..4067298 100644
--- a/pages/account/index.vue
+++ b/pages/account/index.vue
@@ -1,8 +1,9 @@
 <template>
 	<view>
+		<view class="status_bar"></view>
+		
 		<view class="account_info">
-			<img src="/static/img/logo.png" alt="" class="header_img">
-			
+			<image src="../../static/img/logo.png" mode="" class="header_img"></image>
 			<view class="info_name" v-if="!isLogin">
 				<navigator url="/pages/login/index" >
 					LOGIN / SIGUP>
@@ -24,11 +25,11 @@
 					<text class="info_like_item_span">Points</text>
 				</navigator>
 				<navigator url="/pages/account/wishlist" class="info_like_item">
-					<img src="/static/img/like.png" alt="" class="info_like_item_img">
+					<image src="../../static/img/like.png" mode="" class="info_like_item_img"></image>
 					<text class="info_like_item_span">Wishlist</text>
 				</navigator>
 				<navigator url="/pages/account/favorites" class="info_like_item">
-					<img src="/static/img/favorites.png" alt="" class="info_like_item_img">
+					<image src="../../static/img/favorites.png" mode="" class="info_like_item_img"></image>
 					<text class="info_like_item_span">Favorites</text>
 				</navigator>
 			</view>
@@ -38,19 +39,19 @@
 			<view class="order_title">My Orders</view>
 			<view class="order_info">
 				<navigator url="/pages/account/myOrders" class="order_info_item">
-					<img src="/static/img/unpaid.png" alt="" class="info_img">
+					<image src="../../static/img/unpaid.png" mode="" class="info_img"></image>
 					<text>Unpaid</text>
 				</navigator>
 				<view class="order_info_item">
-					<img src="/static/img/Processing.png" alt="" class="info_img">
+					<image src="../../static/img/Processing.png" mode="" class="info_img"></image>
 					<text>Processing</text>
 				</view>
 				<view class="order_info_item">
-					<img src="/static/img/Shipped.png" alt="" class="info_img">
+					<image src="../../static/img/Shipped.png" class="info_img" mode=""></image>
 					<text>Shipped</text>
 				</view>
 				<view class="order_info_item">
-					<img src="/static/img/Returns.png" alt="" class="info_img">
+					<image src="../../static/img/Returns.png" class="info_img" mode=""></image>
 					<text>Returns</text>
 				</view>
 			</view>
@@ -60,43 +61,43 @@
 			<view class="order_title">My Service</view>
 			<view class="order_info">
 				<navigator url="/pages/account/message" class="order_info_item">
-					<img src="/static/img/msg.png" alt="" class="info_img">
+					<image src="../../static/img/msg.png" class="info_img" mode=""></image>
 					<text>Message</text>
 				</navigator>
 				<view class="order_info_item">
-					<img src="/static/img/My Review.png" alt="" class="info_img">
+					<image src="../../static/img/My Review.png" class="info_img" mode=""></image>
 					<text>My Review</text>
 				</view>
 				<navigator url="/pages/account/address" class="order_info_item">
-					<img src="/static/img/My Address.png" alt="" class="info_img">
+					<image src="../../static/img/My Address.png" class="info_img" mode=""></image>
 					<text>My Address</text>
 				</navigator>
 				<view class="order_info_item">
-					<img src="/static/img/Return Policy.png" alt="" class="info_img">
+					<image src="../../static/img/Return Policy.png" class="info_img" mode=""></image>
 					<text>Return Policy</text>
 				</view>
 				<view class="order_info_item">
-					<img src="/static/img/Help Center.png" alt="" class="info_img">
+					<image src="../../static/img/Help Center.png" class="info_img" mode=""></image>
 					<text>Help Center</text>
 				</view>
 				<view class="order_info_item">
-					<img src="/static/img/Attention CHIC.png" alt="" class="info_img">
+					<image src="../../static/img/Attention CHIC.png" class="info_img" mode=""></image>
 					<text>Attention CHIC</text>
 				</view>
 				<view class="order_info_item">
-					<img src="/static/img/About CHIC.png" alt="" class="info_img">
+					<image src="../../static/img/About CHIC.png" class="info_img" mode=""></image>
 					<text>About CHIC</text>
 				</view>
 				
 				<navigator url="/pages/account/settings" class="order_info_item">
 					<!-- <view class="order_info_item"> -->
-						<img src="/static/img/Setting.png" alt="" class="info_img">
+						<image src="../../static/img/Setting.png" class="info_img" mode=""></image>
 						<text>Setting</text>
 					<!-- </view> -->
 				</navigator>
 			</view>
 			
-			<img src="/static/img/mine_banner.png" alt="" class="mine_banner">
+			<image src="../../static/img/mine_banner.png" class="mine_banner" mode=""></image>
 			<view class="order_title">Recommend</view>
 			
 			<scroll-view class="spike1" scroll-x="true" :show-scrollbar="false">
diff --git a/pages/account/message.vue b/pages/account/message.vue
index 46153d4..de03360 100644
--- a/pages/account/message.vue
+++ b/pages/account/message.vue
@@ -1,5 +1,6 @@
 <template>
 	<view>
+		<view class="status_bar"></view>
 		<uni-nav-bar  left-icon="left"   title="Message" color="#000000" rightIcon="info" @clickLeft="back" @clickRight="isDelete=!isDelete" :border="false"/>
 		<view class="body">
 			<view class="msg_item">
diff --git a/pages/account/myCoupons.vue b/pages/account/myCoupons.vue
index bfb3c51..c60a4c3 100644
--- a/pages/account/myCoupons.vue
+++ b/pages/account/myCoupons.vue
@@ -1,5 +1,7 @@
 <template>
 	<view>
+		<view class="status_bar"></view>
+		
 		<uni-nav-bar  left-icon="left"   title="My Coupons" color="#000000" rightIcon="info" @clickLeft="back" @clickRight="goPage" :border="false"/>
 		<view class="body">
 			<view class="coupons_item" v-for="(item,index) in 3 " :key="index">
diff --git a/pages/account/myOrders.vue b/pages/account/myOrders.vue
index f509b55..0cb5970 100644
--- a/pages/account/myOrders.vue
+++ b/pages/account/myOrders.vue
@@ -39,29 +39,29 @@
 					</view>
 				</navigator>
 				
-				
-				<view class="order">
-					<view class="order_title">
-						<text>To be shipped</text>
-						<view class="order_title_right">
-							<text>order#20245512141212</text>
-							<image src="../../static/img/right.png" mode=""></image>
-						</view>
-					</view>
-					<view class="order_content">
-						<view class="good_info">
-							<view class="good_info_left">
-								<view class="good_info_image" v-for="(item,index) in 2" :key="index"></view>
-							</view>
-							<view class="good_info_right">
-								<text>2 ltems</text>
+				<navigator url="/pages/order/details">
+					<view class="order">
+						<view class="order_title">
+							<text>To be shipped</text>
+							<view class="order_title_right">
+								<text>order#20245512141212</text>
 								<image src="../../static/img/right.png" mode=""></image>
 							</view>
 						</view>
-						<view class="good_price">total:US$12.5</view>
+						<view class="order_content">
+							<view class="good_info">
+								<view class="good_info_left">
+									<view class="good_info_image" v-for="(item,index) in 2" :key="index"></view>
+								</view>
+								<view class="good_info_right">
+									<text>2 ltems</text>
+									<image src="../../static/img/right.png" mode=""></image>
+								</view>
+							</view>
+							<view class="good_price">total:US$12.5</view>
+						</view>
 					</view>
-				</view>
-				
+				</navigator>
 				<view class="order">
 					<view class="order_title">
 						<text>Shipped</text>
diff --git a/pages/account/myProfile.vue b/pages/account/myProfile.vue
index 06d7fe5..2ddb059 100644
--- a/pages/account/myProfile.vue
+++ b/pages/account/myProfile.vue
@@ -1,5 +1,6 @@
 <template>
 	<view>
+		
 		<view class="profile_item profile_item1">
 			<text>Photo</text>
 			<view class="profile_item_right">
diff --git a/pages/account/pointsDetails.vue b/pages/account/pointsDetails.vue
index f84a763..d22ca1a 100644
--- a/pages/account/pointsDetails.vue
+++ b/pages/account/pointsDetails.vue
@@ -1,13 +1,16 @@
 <template>
 	<view>
+		
 		<view class="nav_title">
+			<view class="status_bar"></view>
 			<uni-nav-bar  left-icon="left"   title="Points Details" color="#000000" rightIcon="info" @clickLeft="back"  :border="false"/>
 		</view>
 		<view class="nav_body">
 			<view class="points">
+				
 				<view class="points_item" v-for="(item,index) in 10" :key="index">
 					<view class="points_item_title">
-						<text>Order return：202012245212</text>
+						<text>Order return</text>
 						<text class="item_title_price">+US$314.00</text>
 					</view>
 					<text>21/04/2022 15:42:31</text>
diff --git a/pages/account/settings.vue b/pages/account/settings.vue
index 8bf556f..e9645f6 100644
--- a/pages/account/settings.vue
+++ b/pages/account/settings.vue
@@ -2,23 +2,24 @@
 	<view>
 		<view class="profile_item ">
 			<text>Country</text>
-			<img src="/static/img/right1.png" alt="" class="right_img">
+			<image src="../../static/img/right1.png" mode="" class="right_img"></image>
 		</view>
 		<view class="profile_item ">
 			<text>Language</text>
-			<img src="/static/img/right1.png" alt="" class="right_img">
+			<image src="../../static/img/right1.png" mode="" class="right_img"></image>
 		</view>
 		<view class="profile_item ">
 			<text>My account</text>
-			<img src="/static/img/right1.png" alt="" class="right_img">
+			<image src="../../static/img/right1.png" mode="" class="right_img"></image>
 		</view>
 		<view class="profile_item ">
 			<text>Privacy policy</text>
-			<img src="/static/img/right1.png" alt="" class="right_img">
+			<image src="../../static/img/right1.png" mode="" class="right_img"></image>
 		</view>
 		<view class="profile_item ">
 			<text>Legal</text>
-			<img src="/static/img/right1.png" alt="" class="right_img">
+			<image src="../../static/img/right1.png" mode="" class="right_img"></image>
+			
 		</view>
 		<view class="set_button">
 			<button>SIGN OUT</button>
@@ -42,11 +43,17 @@
 		}
 	}
 </script>
-
-<style lang="scss" scoped>
+<style lang="scss">
 	page{
 		border-top: 14.67rpx #F7F7F7 solid;
 		padding-left: 26.67rpx;
+		box-sizing: border-box;
+		
+	}
+</style>
+<style lang="scss" scoped>
+	page{
+		
 	}
 	.profile_item{
 		width: 100%;
diff --git a/pages/account/wishlist.vue b/pages/account/wishlist.vue
index 4a66be8..c8b3f34 100644
--- a/pages/account/wishlist.vue
+++ b/pages/account/wishlist.vue
@@ -1,20 +1,21 @@
 <template>
 	<view class="wishlist_body">
+		<view class="status_bar"></view>
 		<uni-nav-bar  left-icon="left"  :rightText="isDelete?'Done':'Delete'" title="Wishlist" color="#000000" @clickLeft="back" @clickRight="isDelete=!isDelete"/>
 		<view class="wishlist">
 			<view class="wishlist_item" v-for="(item,index) in 9" :key="index">
 				<view class="wishlist_item_img">
-					<img src="/static/img/select.png" alt="" class="select" v-show="isDelete">
+					<image src="../../static/img/select.png" mode=""  class="select" v-show="isDelete"></image>
 				</view>
 				<view class="wishlist_item_bottom">
 					<text>US$31234.00</text>
-					<img src="/static/img/cart2.png" alt="" class="wishlist_item_bottom_icon">
+					<image src="../../static/img/cart2.png" mode="" class="wishlist_item_bottom_icon"></image>
 				</view>
 			</view>
 		</view>
 		<view class="wishlist_foot" v-show="isDelete">
 			<view class="wishlist_foot_left">
-				<img src="/static/img/select2.png" alt="">
+				<image src="../../static/img/select2.png" mode=""></image>
 				<text>All</text>
 			</view>
 			<view class="wishlist_foot_right">
diff --git a/pages/category/index.vue b/pages/category/index.vue
index 8c39770..87ed601 100644
--- a/pages/category/index.vue
+++ b/pages/category/index.vue
@@ -1,18 +1,23 @@
 <template>
 	<view class="body">
+		
 		<view class="search">
-			<navigator url="/pages/index/search">
-				<view class="navigation_seach">
-						<img src="/static/img/seach.png" alt="">
-						<text>search</text>
+			<view class="status_bar"></view>
+			<view class="search1">
+				<navigator url="/pages/index/search">
+					<view class="navigation_seach">
+							<image src="../../static/img/seach.png" mode=""></image>
+							<text>search</text>
+					</view>
+				</navigator>
+				<view class="navigation_title_right">
+					<image src="../../static/img/like.png" mode=""></image>
+					<uni-badge :text="5" type="error" absolute="rightTop">
+						<image src="../../static/img/shop_cart.png" mode=""></image>
+					</uni-badge>  
 				</view>
-			</navigator>
-			<view class="navigation_title_right">
-				<img src="/static/img/like.png" alt="">
-				<uni-badge :text="5" type="error" absolute="rightTop">
-					<img src="/static/img/shop_cart.png" alt="">
-				</uni-badge>  
 			</view>
+			
 		</view>
 		<view class="category">
 			<view class="category_left">
@@ -59,11 +64,14 @@
 	}
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
+	
 	page{
-		padding-top: 130rpx;
+		padding-top: 200rpx;
 		height: 100%;
 	}
+</style>
+<style lang="scss" scoped>
 	.body{
 		height: 100%;
 	}
@@ -72,44 +80,50 @@
 		background-color: white;
 		box-sizing: border-box;
 		padding: 33.33rpx 26.67rpx;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
+		
 		position: fixed;
 		top: 0;
 		z-index: 99;
 		border-bottom: 1px solid #F5F6FA;
 		
-		.navigation_seach{
-			width: 546.67rpx;
-			background-color: #F5F6FA;
-			border-radius: 6.67rpx;
-			height: 66.67rpx;
-			display: flex;
-			align-items: center;
-			color: #8F9094;
-			font-size: 26.67rpx;
-			padding-left: 22rpx;
-			box-sizing: border-box;
-			
-			img{
-				width: 29.33rpx;
-				height: 29.33rpx;
-				margin-right: 22rpx;
-			}
-		}
-		.navigation_title_right{
+		.search1{
 			display: flex;
 			align-items: center;
+			justify-content: space-between;
 			
-			img{
-				width: 44rpx;
-				height: 44rpx;
+			.navigation_seach{
+				width: 546.67rpx;
+				background-color: #F5F6FA;
+				border-radius: 6.67rpx;
+				height: 66.67rpx;
+				display: flex;
+				align-items: center;
+				color: #8F9094;
+				font-size: 26.67rpx;
+				padding-left: 22rpx;
+				box-sizing: border-box;
+				
+				image{
+					width: 29.33rpx;
+					height: 29.33rpx;
+					margin-right: 22rpx;
+				}
 			}
-			>img:first-child{
-				margin-right: 32.67rpx;
+			.navigation_title_right{
+				display: flex;
+				align-items: center;
+				
+				image{
+					width: 44rpx;
+					height: 44rpx;
+				}
+				>image:first-child{
+					margin-right: 32.67rpx;
+				}
 			}
+			
 		}
+		
 	}
 	.category{
 		height: 100%;
diff --git a/pages/index/index.vue b/pages/index/index.vue
index feefe8c..1b1a994 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,28 +1,31 @@
 <template>
 	
-	<view >
+	<view class="body">
+		
+		
 		<!-- 头部导航栏 -->
 		<view class="navigation page_padding">
+			<view class="status_bar"></view>
 			<view class="navigation_title" :class="isScrollShow?'isScrollShow':'' ">
 				<template v-if="!isScrollShow ">
 					<navigator url="/pages/account/message" class="order_info_item">
 						<uni-badge :text="5" type="error" absolute="rightTop">
-							<img src="/static/img/msg.png" alt="">
+							<image src="../../static/img/msg.png" mode=""></image>
 						</uni-badge>
 					</navigator>
 					<text>Dope VIDEO</text>
 				</template>
 				
 				<view class="navigation_title_right">
-					<img src="/static/img/like.png" alt="">
+					<image src="../../static/img/like.png" mode=""></image>
 					<uni-badge :text="5" type="error" absolute="rightTop">
-						<img src="/static/img/shop_cart.png" alt="">
+							<image src="../../static/img/shop_cart.png" mode=""></image>
 					</uni-badge>  
 				</view>
 			</view>
 			<navigator url="/pages/index/search">
 				<view class="navigation_seach" :class="isScrollShow?'isScrollShow1':'' ">
-						<img src="/static/img/seach.png" alt="">
+						<image src="../../static/img/seach.png" mode=""></image>
 						<text>search</text>
 				</view>
 			</navigator>
@@ -71,14 +74,14 @@
 		</uni-swiper-dot>
 		
 		<!-- 打折 -->
-		<img src="/static/index_discount.png" alt="" class="discount page_padding">
+		<image src="../../static/img/index_discount.png" mode="" class="discount page_padding"></image>
 		
 		<!-- 标题 -->
 		<view class="index_title page_padding">
 			<text>Flash Sale</text>
 			<view class="title_right">
 				<uni-countdown :showDay="false" :hour="23" :minute="0" :second="0" color="#FFFFFF" background-color="#1B1B1B" />
-				<img src="/static/img/right.png" alt="">
+				<image src="../../static/img/right.png" mode=""></image>
 			</view>
 		</view>
 		
@@ -98,7 +101,7 @@
 		<view class="index_title page_padding">
 			<text>Hot Selle</text>
 			<view class="title_right">
-				<img src="/static/img/right.png" alt="">
+				<image src="../../static/img/right.png" mode=""></image>
 			</view>
 		</view>
 		
@@ -119,7 +122,7 @@
 		<view class="index_title page_padding">
 			<text>Hot Selle</text>
 			<view class="title_right">
-				<img src="/static/img/right.png" alt="">
+				<image src="../../static/img/right.png" mode=""></image>
 			</view>
 		</view>
 		
@@ -134,7 +137,7 @@
 		<view class="index_title page_padding">
 			<text>Hot Selle</text>
 			<view class="title_right">
-				<img src="/static/img/right.png" alt="">
+				<image src="../../static/img/right.png" mode=""></image>
 			</view>
 		</view>
 		
@@ -239,8 +242,12 @@
 	page{
 		background-color: white;
 		// position: relative;
+	}
+	.body{
 		padding-top: 361.33rpx;
 	}
+	
+	
 	.isScrollShow{
 		float: right;
 	}
@@ -272,7 +279,7 @@
 			align-items: center;
 			justify-content: space-between;
 			
-			img{
+			image{
 				width: 44rpx;
 				height: 44rpx;
 			}
@@ -286,7 +293,7 @@
 				display: flex;
 				align-items: center;
 				
-				>img:first-child{
+				>image:first-child{
 					margin-right: 32.67rpx;
 				}
 			}
@@ -304,7 +311,7 @@
 			padding-left: 22rpx;
 			box-sizing: border-box;
 			
-			img{
+			image{
 				width: 29.33rpx;
 				height: 29.33rpx;
 				margin-right: 22rpx;
@@ -421,7 +428,7 @@
 			display: flex;
 			align-items: center;
 			
-			img{
+			image{
 				width: 22rpx;
 				height: 22rpx;
 				margin-left: 11.33rpx;
diff --git a/pages/index/pickUpCentre.vue b/pages/index/pickUpCentre.vue
index f59c6eb..758bf62 100644
--- a/pages/index/pickUpCentre.vue
+++ b/pages/index/pickUpCentre.vue
@@ -1,5 +1,6 @@
 <template>
 	<view>
+		<view class="status_bar"></view>
 		<uni-nav-bar  left-icon="left"   title="Pick up centre" color="#000000"  @clickLeft="back" @clickRight="goPage" :border="false">
 			<block slot="right">
 				<view class="head_coupons">
diff --git a/pages/index/search.vue b/pages/index/search.vue
index 388ccfd..92f44cf 100644
--- a/pages/index/search.vue
+++ b/pages/index/search.vue
@@ -1,15 +1,16 @@
 <template>
 	<view>
+		<view class="status_bar"></view>
 		<view class="search_title">
 			<navigator data="1" open-type="navigateBack">
-				<img src="/static/img/left.png" alt="">
+				<image src="../../static/img/left.png" mode=""></image>
 			</navigator>
 			<uni-search-bar @confirm="search"  v-model="searchValue" class="search_title_input" cancelText="Cancel" placeholder="search"></uni-search-bar>
 		</view>
 		<view class="history">
 			<view class="history_title">
 				<text>Recently Searched</text>
-				<img src="/static/img/delete.png" alt="">
+				<image src="../../static/img/delete.png" mode=""></image>
 			</view>
 			<view class="history_lable">
 				<view class="lable_item">Gold Necklaces</view>
@@ -62,7 +63,7 @@
 		display: flex;
 		align-items: center;
 		
-		img{
+		image{
 			width: 36rpx;
 			height: 36rpx;
 		}
@@ -82,7 +83,7 @@
 			font-size: 28rpx;
 			font-weight: 500;
 			margin-bottom: 26.67rpx;
-			img{
+			image{
 				width: 29.33rpx;
 				height: 29.33rpx;
 			}
diff --git a/pages/login/changePwd.vue b/pages/login/changePwd.vue
index 5adf6a4..6c7162d 100644
--- a/pages/login/changePwd.vue
+++ b/pages/login/changePwd.vue
@@ -25,12 +25,14 @@
 		}
 	}
 </script>
-
-<style lang="scss" scoped>
+<style lang="scss">
 	page{
 		border-top: 13.33rpx #F7F7F7 solid;
 		padding-top: 48rpx;
 	}
+</style>
+<style lang="scss" scoped>
+	
 	.login_submit{
 		font-size: 26.67rpx;
 	}
diff --git a/pages/login/index.vue b/pages/login/index.vue
index 471a963..6ec3253 100644
--- a/pages/login/index.vue
+++ b/pages/login/index.vue
@@ -1,5 +1,6 @@
 <template>
 	<view class="login_body">
+		<view class="status_bar"></view>
 		<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text" activeColor="#010101" class="select"></uni-segmented-control>
 		<view class="body">
 			<view class="login" v-show="current==0">
@@ -11,7 +12,7 @@
 				</navigator>
 				<button class="login_submit" >SIGN IN</button>
 				<view class="agreement">
-					<img src="../../static/img/select2.png" mode="" class="agreement_image"></img>
+					<image src="../../static/img/select2.png" mode="" class="agreement_image"></image>
 					<view class="">
 						by continuong, you agree to be <text class="text"> terms of use </text> and <text class="text"> privacy policy</text>.
 					</view>
@@ -25,7 +26,7 @@
 				
 				<button class="login_submit">REGISTER</button>
 				<view class="agreement">
-					<img src="../../static/img/select2.png" mode="" class="agreement_image"></img>
+					<image src="../../static/img/select2.png" mode="" class="agreement_image"></image>
 					<view class="">
 						by continuong, you agree to be <text class="text"> terms of use </text> and <text class="text"> privacy policy</text>.
 					</view>
@@ -119,6 +120,9 @@
 				width: 54.67rpx;
 				height: 54.67rpx;
 				margin-right: 49.33rpx;
+				&:last-child{
+					margin-right: 0;
+				}
 			}
 		}
 	}
diff --git a/pages/login/verifyEmail.vue b/pages/login/verifyEmail.vue
index de08059..7cd5bc3 100644
--- a/pages/login/verifyEmail.vue
+++ b/pages/login/verifyEmail.vue
@@ -35,12 +35,13 @@
 		}
 	}
 </script>
-
-<style lang="scss" scoped>
+<style lang="scss">
 	page{
 		border-top: 13.33rpx #F7F7F7 solid;
 		padding-top: 49.33rpx;
 	}
+</style>
+<style lang="scss" scoped>
 	.verify_tips{
 		font-size: 28rpx;
 		font-weight: bold;
diff --git a/pages/order/confirmation.vue b/pages/order/confirmation.vue
index 73db141..5bbf117 100644
--- a/pages/order/confirmation.vue
+++ b/pages/order/confirmation.vue
@@ -202,61 +202,13 @@
 </script>
 
 <style lang="scss" scoped>
+	@import "@/common/scss/order.scss";
 	page{
 		border-top:14.67rpx #F6F5FA solid ;
 		padding-bottom: 140rpx;
 	}
-	.address_more{
-		width: 20rpx;
-		height: 20rpx;
-	}
-	.address{
-		padding-top: 33.33rpx;
-		padding-bottom: 36rpx;
-		padding-left: 29.33rpx;
-		padding-right: 22.67rpx;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		border-bottom: 14.67rpx #F6F5FA solid;
-		position: relative;
-		.address_left{
-			
-			.address_title{
-				display: flex;
-				align-items: center;
-				color: #666666;
-				font-size: 24rpx;
-				margin-bottom: 30.67rpx;
-				
-				image{
-					width: 32rpx;
-					height: 32rpx;
-				}
-				.address_title_name{
-					font-size: 28rpx;
-					color: black;
-					font-weight: bold;
-					margin-left: 24rpx;
-					margin-right: 38.67rpx;
-				}
-			}
-			.address_content{
-				padding-left: 56rpx;
-				color: #666666;
-				font-size: 24rpx;
-				font-weight: bold;
-			}
-		}
-			
-		.address_xian{
-			height: 4rpx;
-			width: 100%;
-			position: absolute;
-			left: 0;
-			bottom: 0;
-		}
-	}
+	
+	
 	.order_info{
 		padding-left: 26.67rpx;
 		padding-right: 22.67rpx;
@@ -451,72 +403,17 @@
 			}
 			
 		}
+		.order_popup_commodity{
+			border-bottom:1px solid #E2E2E2 ;
+			padding-bottom: 40rpx;
+		}
 		.order_popup_coupons{
 			padding:0 26.67rpx;
 			padding-top: 28rpx;
 			padding-bottom: 106.67rpx;
 			
 		}
-		.order_popup_commodity{
-			padding:0 26rpx;
-			padding-bottom: 40rpx;
-			border-bottom:1px solid #E2E2E2 ;
-			
-			.good_info{
-				padding: 40rpx 0;
-				font-size: 22.67rpx;
-				color: #666666;
-				font-weight: bold;
-				border-bottom: 2.67rpx solid #F1F1F1;
-				&:last-child{
-					border-bottom: none;
-				}
-				.good_info_left{
-					display: flex;
-					align-items: center;
-					width: 100%;
-					.good_info_image{
-						width: 200rpx ;
-						height: 200rpx;
-						background-color: #999999;
-						margin-right: 32.67rpx;
-					}
-					.left_info{
-						
-						.info_name{
-							font-size: 26.67rpx;
-							font-weight: 400;
-							width: 461.33rpx;
-						}
-						.left_info_bottom{
-							display: flex;
-							align-items: center;
-							justify-content: space-between;
-							font-size: 32rpx;
-							color: #909090;
-							margin-top: 24rpx;
-							.info_lable{
-								padding: 5.33rpx 20rpx;
-								font-size: 22.67rpx;
-								border-radius: 33.33rpx;
-								border: 1px solid #D3D3D3;
-								image{
-									width: 17.33rpx;
-									height: 17.33rpx;
-									margin-left: 14.67rpx;
-								}
-							}
-						}
-						.info_price{
-							font-size: 28rpx;
-							color: black;
-							font-weight: bold;
-							margin-top: 43.33rpx;
-						}
-					}
-				}
-			}
-		}
+		
 		.order_popup_pay{
 			padding: 0 26.67rpx;
 			padding-bottom: 56.67rpx;
diff --git a/pages/order/details.vue b/pages/order/details.vue
new file mode 100644
index 0000000..78dc8a2
--- /dev/null
+++ b/pages/order/details.vue
@@ -0,0 +1,369 @@
+<template>
+	<view class="body">
+		<view class="details_title">
+			<view class="shipped" v-if="details_index==0">
+				<view class="shipped_left">
+					<image src="../../static/img/order_shipped.png" mode=""></image>
+				</view>
+				<view>
+					<text class="shipped_right_text">Ready for shipment</text>
+					<view>The buyer has paid,Waiting for the merchant to deliver</view>
+				</view>
+			</view>
+			
+			<view class="cancelled" v-if="details_index==1">
+				<view class="cancelled_left">
+					<image src="../../static/img/close2.png" mode=""></image>
+					<view class="cancelled_left_info">
+						<text class="shipped_right_text">Deal’s off</text>
+						<view>The transaction has been closed, looking forward to your re-selection</view>
+					</view>
+				</view>
+				
+			</view>
+			
+			<view class="cancelled completed" v-if="details_index==2">
+				<view class="cancelled_left">
+					<image src="../../static/img/completed.png" mode=""></image>
+					<view class="cancelled_left_info">
+						<text class="shipped_right_text">Signed for</text>
+						<view>2022-04-27  21:15:55</view>
+					</view>
+				</view>
+				<view class="cancelled_right">
+					<image src="../../static/img/right2.png" mode=""></image>
+				</view>
+			</view>
+			
+			<view class="cancelled toPaid" v-if="details_index==3">
+				<view class="cancelled_left">
+					<view >
+						<text class="shipped_right_text">Waiting for payment</text>
+						<view>The timeout order will be closed automatically</view>
+					</view>
+				</view>
+				<view class="cancelled_right">
+					<text class="shipped_right_text">23:59:58</text>
+					<view>T-minus payment</view>
+				</view>
+			</view>
+			<navigator url="/pages/order/logisticsDetails" class="cancelled transit" v-if="details_index==4">
+				<view class="cancelled_left">
+					<image src="../../static/img/transit.png" mode=""></image>
+					<view class="cancelled_left_info">
+						<view class="shipped_right_text">【New York】Has arrived statesHas arrived states</view>
+						<view>2022-04-27  21:15:55</view>
+					</view>
+				</view>
+				<view class="cancelled_right">
+					<image src="../../static/img/right2.png" mode=""></image>
+				</view>
+			</navigator>
+			
+		</view>
+		<view class="address">
+			<view class="address_left">
+				<view class="address_title">
+					<image src="../../static/img/address.png" mode=""></image>
+					<view class="address_title_name">Nathanael</view>
+					<text>5838590290</text>
+				</view>
+				<view class="address_content">
+					<text>B Oakdale Mall</text>
+					<view >Johnson City NEW YORKUnitedStates13790-1294</view>
+				</view>
+			</view>
+			<image src="../../static/img/right.png" class="address_more"></image>
+			<image src="../../static/img/address_xian.png" class="address_xian" mode=""></image>
+		</view>
+		
+		<view class="order_popup_commodity">
+			<view class="good_info" v-for="(item,index) in 3 " :key="index">
+				<view class="good_info_left ">
+					<view class="good_info_image" v-for="(item,index) in 1" :key="index"></view>
+					<view class="left_info">
+						<view class="info_name">Adidas Yeezy Boost 350 V2  DazzlingBlue Black GY7164 Men's</view>
+						<view class="left_info_bottom">
+							<view class="info_lable">
+								<text>Multicolor;41</text>
+								<image src="/static/img/bottom.png" mode=""></image>
+							</view>
+							<text>x1</text>
+						</view>
+						<view class="info_price">
+							<text>US$314.00</text>
+							<button>Rrefund</button>
+						</view>
+					</view>
+				</view>
+			</view>
+			
+		</view>
+		
+		<view class="summary">
+			<view class="summary_title">Order summary</view>
+			<view class="summary_item">
+				<view>
+					Subtotal
+					<text class="summary_item_text">（Tax included）</text>
+				</view>
+				<view class="summary_item_right">US$12.5</view>
+			</view>
+			<view class="summary_item">
+				<view>Shipping</view>
+				<view class="summary_item_right">US$12.5</view>
+			</view>
+			<view class="summary_item">
+				<view>Coupon</view>
+				<view class="summary_item_right1">-US$12.5</view>
+			</view>
+			<view class="summary_item">
+				<view>Order total</view>
+				<view>US$12.5</view>
+			</view>
+			<view class="summary_tips">
+				<image src="../../static/img/gantan1.png" mode=""></image>
+				<text>Reward 10 points</text>
+			</view>
+		</view>
+		
+		<view class="summary">
+			<view class="summary_title">Order information</view>
+			<view class="summary_item">
+				<view>Order id</view>
+				<view class="summary_item_right">
+					<text>2013461121212</text>
+					<button>copy</button>
+				</view>
+			</view>
+			<view class="summary_item">
+				<view>Shipping</view>
+				<view class="summary_item_right">standard shipping</view>
+			</view>
+			<view class="summary_item">
+				<view>Coupon</view>
+				<view class="summary_item_right">21/04/2022 15:42:31</view>
+			</view>
+			<view class="summary_item">
+				<view>Payment time</view>
+				<view class="summary_item_right">21/04/2022 15:42:31</view>
+			</view>
+		</view>
+		
+		<view class="details_footer" v-if="details_index!=0">
+			<button class="white" v-if="details_index==2 || details_index==4">LOGISTICS</button>
+			<button class="white" v-if="details_index==1 || details_index==2">DELETE ORDER</button>
+			<button class="black" v-if="details_index==2">COMMENT</button>
+			
+			<button class="white" v-if="details_index==3 ">CANCEL ORDER</button>
+			<button class="black" v-if="details_index==3">PAY NOW</button>
+			
+			<button class="black" v-if="details_index==4">CONFIRM RECEIPT</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				details_index:4
+			}
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import "@/common/scss/order.scss";
+	page{
+		
+	}
+	.body{
+		padding-bottom: 80rpx;
+	}
+	.details_title{
+		height: 176.67rpx;
+		background-color: #2C2C38;
+		width: 100%;
+		color: white;
+		font-size: 18.67rpx;
+		font-weight: bold;
+		border-top: 14.67rpx #F6F5FA solid;
+		
+		.shipped_right_text{
+			width: 497.33rpx;
+			font-size: 33.33rpx;
+			overflow: hidden;
+			text-overflow: ellipsis;
+			white-space: nowrap;
+		}
+		
+		.cancelled{
+			padding-left: 55.33rpx;
+			display: flex;
+			align-items: center;
+			height: 100%;
+			justify-content: space-between;
+			
+			.cancelled_left{
+				display: flex;
+				align-items: center;
+				
+				image{
+					width: 61.33rpx;
+					height: 61.33rpx;
+				}
+				.cancelled_left_info{
+					margin-left: 52.67rpx;
+				}
+			}
+			.cancelled_right{
+				image{
+					width: 34.67rpx;
+					height: 34.67rpx;
+				}
+			}
+			
+		}
+		.transit{
+			padding-left: 74.67rpx;
+			padding-right: 16rpx;
+			
+			.cancelled_left{
+				
+				image{
+					width: 58.67rpx;
+					height: 58.67rpx;
+				}
+				.cancelled_left_info{
+					margin-left: 49.33rpx;
+				}
+			}
+		}
+		.completed{
+			padding-right: 20rpx;
+			
+		}
+		.toPaid{
+			padding:0  31.33rpx;
+		}
+		.shipped{
+			padding-left: 47.33rpx;
+			display: flex;
+			align-items: center;
+			height: 100%;
+			
+			.shipped_left{
+				background-image: url("@/static/img/order_bg.png");
+				background-size: 100% 100%;
+				width: 114rpx;
+				height: 158.67rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-right: 30rpx;
+				image{
+					width: 62.67rpx;
+					height: 62.67rpx;
+				}
+			}
+			
+		}
+	}
+	.order_popup_commodity{
+		border-bottom: 14.67rpx solid #F6F5FA;
+	}
+	.summary{
+		border-bottom: 14.67rpx solid #F6F5FA;
+		padding:0 26rpx;
+		padding-top: 44rpx;
+		padding-bottom: 47.33rpx;
+		font-size: 28rpx;
+		&:last-child{
+			border-bottom: none;
+		}
+		.summary_title{
+			font-weight: bold;
+			margin-bottom: 35.33rpx;
+		}
+		.summary_item{
+			display: flex;
+			align-items: center;
+			margin-bottom: 41.33rpx;
+			justify-content: space-between;
+			width: 100%;
+			.summary_item_text{
+				color: #777777;
+			}
+			.summary_item_right{
+				color: #3C3B6E;
+				display: flex;
+				align-items: center;
+				
+				button{
+					font-size: 20rpx;
+					color: black;
+					height: 28.67rpx;
+					border-radius: 0;
+					padding:0 15rpx;
+					line-height: 28.67rpx;
+					background:none;
+					margin-left: 15.33rpx;
+				}
+			}
+			.summary_item_right1{
+				color: #B22234;
+			}
+		}
+		.summary_tips{
+			display: flex;
+			align-items: center;
+			justify-content: flex-end;
+			color: #B22234;
+			font-size: 24rpx;
+			font-weight: 400;
+			image{
+				width: 28rpx;
+				height: 28rpx;
+				margin-right: 13.33rpx;
+			}
+		}
+	}
+	
+	.details_footer{
+		padding: 34rpx 26rpx;
+		background-color: white;
+		display: flex;
+		align-items: center;
+		justify-content: flex-end;
+		position: fixed;
+		bottom: 0;
+		width: 100%;
+		box-sizing: border-box;
+		button{
+			height: 62.67rpx;
+			line-height:62.67rpx;
+			border-radius: 0;
+			margin: 0;
+			margin-left: 18rpx;
+			background-color: white;
+			border: none;
+			font-size: 22.67rpx;
+			&::after{
+				content: none;
+			}
+		}
+		.black{
+			color: white;
+			background-color: black;
+		}
+		.white{
+			border: 1px solid #666666;
+			color: #666666;
+			
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages/order/logisticsDetails.vue b/pages/order/logisticsDetails.vue
new file mode 100644
index 0000000..20463e8
--- /dev/null
+++ b/pages/order/logisticsDetails.vue
@@ -0,0 +1,173 @@
+<template>
+	<view>
+		<view class="logistics_info">
+			<view class="logistics_info_image"></view>
+			<view class="logistics_info_right">
+				<view class="info_right_title">Signed for</view>
+				<text>FedEx  Express</text>
+				<view class="info_right_num">
+					<text>Order number : 5859595940</text>
+					<view class="copy">Copy</view>
+				</view>
+			</view>
+		</view>
+		<view class="logistics_details">
+			<view class="logistics_step step_active">
+				<text>
+					 Your express delivery has been signed, the signer is 
+					 your little rabbit, Zhang has unusual problems or need 
+					 to complain please call if there is unusual, problems or 
+					 need to complain please call abnormal problems or 
+					 need to complain
+				</text>
+				<view class="logistics_step_time">2020.12.13  23:54:12</view>
+			</view>
+			<view class="logistics_step">
+				<text>
+					 【cotton town, Shantou】your bunny, Xiao Zhang,has 
+					 been picked up. If you have any unusual problems 
+					 or need to complain, please call 12563555
+				</text>
+				<view class="logistics_step_time">2020.12.13  23:54:12</view>
+			</view>
+			<view class="logistics_step">
+				<text>
+					 The order is confirmed, the merchant has been order
+					 informed of the distribution
+				</text>
+				<view class="logistics_step_time">2020.12.13  23:54:12</view>
+			</view>
+			<view class="logistics_step">
+				<text>
+					 You have submitted your order, please wait for 
+					 system confirmation
+				</text>
+				<view class="logistics_step_time">2020.12.13  23:54:12</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				active: 0,
+				
+
+			}
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.logistics_info{
+		border-top: 14.67rpx #F6F5FA solid;
+		padding: 32rpx 0;
+		padding-left: 29.33rpx;
+		display: flex;
+		align-items: center;
+		
+		.logistics_info_image{
+			width: 133.33rpx;
+			height: 133.33rpx;
+			background-color: #999999;
+			
+		}
+		.logistics_info_right{
+			margin-left: 33.33rpx;
+			font-size: 28rpx;
+			font-weight: 400;
+			color: #333333;
+			
+			.info_right_title{
+				color: #DE3139;
+				font-size: 29.33rpx;
+				font-weight: bold;
+				margin-bottom: 10.33rpx;
+			}
+			.info_right_num{
+				display: flex;
+				align-items: center;
+				margin-top: 9.67rpx;
+				.copy{
+					height: 41.33rpx;
+					line-height: 41.33rpx;
+					text-align: center;
+					background-color: #F6F5FA;
+					font-size: 24rpx;
+					border-radius: 20.67rpx;
+					margin-left: 26.67rpx;
+					padding: 0 18.67rpx	;
+				}
+			}
+		}
+	}
+	
+	.logistics_details{
+		border-top: 14.67rpx #F6F5FA solid;
+		padding-left: 28rpx;
+		padding-right: 24rpx;
+		padding-top: 64rpx;
+		
+		.logistics_step{
+			color: #999999;
+			font-size: 26.67rpx;
+			font-weight: 400;
+			padding-bottom: 74rpx;
+			padding-left: 33.33rpx;
+			position: relative;
+			&:before{
+				content: "";
+				width: 17.33rpx;
+				height: 17.33rpx;
+				background-color: #EDEDED;
+				position: absolute;
+				left: 0;
+				top: 0;
+				border-radius: 50%;
+				z-index: 99;
+			}
+			&::after{
+				content: "";
+				width: 1px;
+				height: 95%;
+				background-color: #EDEDED;
+				position: absolute;
+				left: 9.5rpx;
+				bottom: 0;
+				border-radius: 50%;
+				
+			}
+			&:last-child{
+				
+				&::after{
+					content: none;
+				}
+			}
+			
+			.logistics_step_time{
+				
+				font-size: 22rpx;
+				margin-top: 13.33rpx;
+			}
+		}
+	}
+	.step_active{
+		color: #333333 !important;
+		
+		&:before{
+			background-color:#333333 !important;
+		}
+		
+	}
+	.step_active1{
+		&::after{
+			background-color: #333333 !important;
+			
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/static/img/close2.png b/static/img/close2.png
new file mode 100644
index 0000000..2847c11
Binary files /dev/null and b/static/img/close2.png differ
diff --git a/static/img/completed.png b/static/img/completed.png
new file mode 100644
index 0000000..c48dae0
Binary files /dev/null and b/static/img/completed.png differ
diff --git a/static/img/order_bg.png b/static/img/order_bg.png
new file mode 100644
index 0000000..2d41905
Binary files /dev/null and b/static/img/order_bg.png differ
diff --git a/static/img/order_shipped.png b/static/img/order_shipped.png
new file mode 100644
index 0000000..4baec25
Binary files /dev/null and b/static/img/order_shipped.png differ
diff --git a/static/img/right2.png b/static/img/right2.png
new file mode 100644
index 0000000..1d778d1
Binary files /dev/null and b/static/img/right2.png differ
diff --git a/static/img/transit.png b/static/img/transit.png
new file mode 100644
index 0000000..94b9310
Binary files /dev/null and b/static/img/transit.png differ