From 987972474c72fbc1e3705207bb2b48dfbd8e0c18 Mon Sep 17 00:00:00 2001
From: BigBoss <2280520255@qq.com>
Date: Sat, 2 May 2020 22:59:44 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E9=A1=B5card=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E6=8F=90=E5=8F=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages.json                  |  7 -----
 src/pages/myOrder/myOrder.vue   | 57 +++++++++++++++++++++++++++++++++++++----
 src/pages/myOrder/orderCard.vue | 12 +++++++--
 3 files changed, 62 insertions(+), 14 deletions(-)

diff --git a/src/pages.json b/src/pages.json
index ba0036a..d4df2a5 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -1,12 +1,5 @@
 {
 	"pages": [ 
-		{
-			"path": "pages/index/index",
-			"style": {
-				"navigationBarTitleText": "商城一览"
-				// "enablePullDownRefresh":true
-			}
-		},
         {
             "path" : "pages/myOrder/myOrder",
             "style" : {
diff --git a/src/pages/myOrder/myOrder.vue b/src/pages/myOrder/myOrder.vue
index bc9e4fb..ac9e18c 100644
--- a/src/pages/myOrder/myOrder.vue
+++ b/src/pages/myOrder/myOrder.vue
@@ -4,20 +4,44 @@
 			<!-- 搜索-->
 			<view class="searchBar">
 				<icon class="searchIcon" type="search" size="14"></icon>
-				<input class="searchIpt" placeholder="老花镜" confirm-type="search"/>
+				<input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/>
+			</view>
+			<view class="screenBar">
+				<view  v-for="item in screenItems" :key="item.current" @click="onClickItem(item.current)"  >
+						<view class="screenItem"  v-bind:class="{ active: current === item.current }">{{ item.text }}</view>
+				</view>
 			</view>
-			
 		</view>
+		<OrderCard></OrderCard>
 		
 	</view>
 </template>
 
-<script>
-	export default {
+<script>
+	import OrderCard from './OrderCard.vue'
+	export default {
+		components:{
+			'OrderCard':OrderCard
+		},
 		data() {
-			return {
+			return {
+				screenItems: [
+					{current:0,text:'全部'},
+					{current:1,text:'待付款'},
+					{current:2,text:'待发货'},
+					{current:3,text:'待收货'},
+					{current:4,text:'退款售后'},
+					],
+				current: 0,
 				
 			};
+		},
+		methods:{
+			onClickItem(e) {
+				if (this.current !== e) {
+					this.current = e;
+				}
+			}
 		}
 	}
 </script>
@@ -48,6 +72,29 @@
 			background-color: #ffffff;
 		}
 		
+		.screenBar{
+			width: 670rpx;
+			height: 110rpx;
+			display: flex;
+			flex-direction: row;
+			justify-content: space-between;
+			align-items: center;
+			color: #333333;
+			font-size: 32rpx;
+		}
+		.screenItem{
+			height: 50rpx;
+			font-size: 32rpx;
+			color: #333333;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			transition:all 0.2s;
+		}
+		.active{
+			// font-size: 34rpx;
+			color: #EC5D3B;
+		}
 		.searchIpt {
 			height: 68rpx;
 			width: 670rpx;
diff --git a/src/pages/myOrder/orderCard.vue b/src/pages/myOrder/orderCard.vue
index 8c3b35f..339dac9 100644
--- a/src/pages/myOrder/orderCard.vue
+++ b/src/pages/myOrder/orderCard.vue
@@ -1,5 +1,5 @@
 <template>
-	<view>
+	<view class="card">
 		
 	</view>
 </template>
@@ -15,5 +15,13 @@
 </script>
 
 <style lang="scss">
-
+	.card{
+		width: 670rpx;
+		height: 478rpx;
+		background: #FFFFFF;
+		box-shadow: 0 0 10px 0 rgba(177,128,128,0.06);
+		border-radius: 8px;
+		border-radius: 8px;
+		margin-top: 20rpx;
+	}
 </style>
-- 
2.0.0