订单列表完成
This commit is contained in:
		
							parent
							
								
									933673b092
								
							
						
					
					
						commit
						f625f398c7
					
				| @ -33,3 +33,4 @@ | ||||
|     - orderconfirm/chooseway 选择方式 | ||||
|     - orderconfirm/ordershopinfo 顶部的商品信息 | ||||
|     - orderconfirm/orderyf 运费 | ||||
|     - pages/order/order 订单列表 | ||||
|  | ||||
							
								
								
									
										1
									
								
								app.json
									
									
									
									
									
								
							
							
						
						
									
										1
									
								
								app.json
									
									
									
									
									
								
							| @ -1,5 +1,6 @@ | ||||
| { | ||||
|   "pages": [ | ||||
|     "pages/order/order", | ||||
|     "pages/orderconfirm/orderconfirm", | ||||
|     "pages/message/message", | ||||
|     "pages/personal/personal", | ||||
|  | ||||
							
								
								
									
										66
									
								
								pages/order/order.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										66
									
								
								pages/order/order.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,66 @@ | ||||
| // pages/order/order.js
 | ||||
| Page({ | ||||
| 
 | ||||
|   /** | ||||
|    * 页面的初始数据 | ||||
|    */ | ||||
|   data: { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 生命周期函数--监听页面加载 | ||||
|    */ | ||||
|   onLoad: function (options) { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 生命周期函数--监听页面初次渲染完成 | ||||
|    */ | ||||
|   onReady: function () { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 生命周期函数--监听页面显示 | ||||
|    */ | ||||
|   onShow: function () { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 生命周期函数--监听页面隐藏 | ||||
|    */ | ||||
|   onHide: function () { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 生命周期函数--监听页面卸载 | ||||
|    */ | ||||
|   onUnload: function () { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 页面相关事件处理函数--监听用户下拉动作 | ||||
|    */ | ||||
|   onPullDownRefresh: function () { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 页面上拉触底事件的处理函数 | ||||
|    */ | ||||
|   onReachBottom: function () { | ||||
| 
 | ||||
|   }, | ||||
| 
 | ||||
|   /** | ||||
|    * 用户点击右上角分享 | ||||
|    */ | ||||
|   onShareAppMessage: function () { | ||||
| 
 | ||||
|   } | ||||
| }) | ||||
							
								
								
									
										6
									
								
								pages/order/order.json
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										6
									
								
								pages/order/order.json
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,6 @@ | ||||
| { | ||||
|   "usingComponents": { | ||||
|     "van-tab": "../utils/dist/tab/index", | ||||
|     "van-tabs": "../utils/dist/tabs/index" | ||||
|   } | ||||
| } | ||||
							
								
								
									
										92
									
								
								pages/order/order.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										92
									
								
								pages/order/order.scss
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,92 @@ | ||||
| .box { | ||||
|   display: flex; | ||||
|   flex-direction: column; | ||||
|   align-items: center; | ||||
|   .tab { | ||||
|     width: 100%; | ||||
|     .commodity { | ||||
|       margin-top: 20rpx; | ||||
|       background-color: #fff; | ||||
|       .message { | ||||
|           padding: 35rpx; | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         border-bottom: 1rpx solid #F2F2F2; | ||||
|         .image { | ||||
|           width: 141rpx; | ||||
|           height: 150rpx; | ||||
|           background-color: #000; | ||||
|           margin-left: 34rpx; | ||||
|         } | ||||
|         .introduce { | ||||
|           margin-left: 32rpx; | ||||
|           height: 120rpx; | ||||
|           display: flex; | ||||
|           flex-direction: column; | ||||
|           justify-content: space-between; | ||||
|           width: 362rpx; | ||||
|           .title { | ||||
|             font-size: 28rpx; | ||||
|             color: #333; | ||||
|           } | ||||
|           .count { | ||||
|             font-size: 24rpx; | ||||
|             color: #999; | ||||
|             display: flex; | ||||
|             > view { | ||||
|               margin-right: 27rpx; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|         .parameter { | ||||
|           width: 150rpx; | ||||
|           height: 120rpx; | ||||
|           display: flex; | ||||
|           flex-direction: column; | ||||
|           justify-content: space-between; | ||||
|           align-items: flex-end; | ||||
|         } | ||||
|       } | ||||
|       .aggregate{ | ||||
|           display: flex; | ||||
|         box-sizing: border-box; | ||||
|         padding: 30rpx; | ||||
|         justify-content: flex-end; | ||||
|         font-size: 22rpx; | ||||
|         color: #999; | ||||
|         height: 78rpx; | ||||
|         border-bottom: 1rpx solid #F2F2F2; | ||||
| 
 | ||||
|         >text{ | ||||
|             color: #333; | ||||
|             margin: 0 5rpx; | ||||
|         } | ||||
|       } | ||||
|       .operation{ | ||||
|           height: 84rpx; | ||||
|           display: flex; | ||||
|           justify-content: flex-end; | ||||
|           padding:0 30rpx; | ||||
|           align-items: center; | ||||
|           .button{ | ||||
|               width: 133rpx; | ||||
|               height: 51rpx; | ||||
|               border:2rpx solid #999999; | ||||
|               border-radius: 26rpx; | ||||
|               text-align: center; | ||||
|               font-size: 22rpx; | ||||
|               color:#999999; | ||||
|               line-height: 51rpx; | ||||
|               margin-right: 8rpx; | ||||
|           } | ||||
|           .hlight{ | ||||
|             border:2rpx solid rgba(71,200,119,1); | ||||
|             color: #47C877; | ||||
|           } | ||||
|         } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| page { | ||||
|   background-color: #efefef; | ||||
| } | ||||
							
								
								
									
										141
									
								
								pages/order/order.wxml
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										141
									
								
								pages/order/order.wxml
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,141 @@ | ||||
| <view class="box"> | ||||
|     <van-tabs class="tab" swipe-threshold="5"> | ||||
|         <van-tab title="待付款"> | ||||
|             <view class="commodity"> | ||||
|                 <view class="message"> | ||||
|                     <image class="image"></image> | ||||
|                     <view class="introduce"> | ||||
|                         <view class="title">001|德国双心药房版 胶原蛋白美容口服液养颜</view> | ||||
|                         <view class="count"> | ||||
|                             <view>30只</view> | ||||
|                             <view>1.0356kg</view> | ||||
|                         </view> | ||||
|                     </view> | ||||
|                     <view class="parameter"> | ||||
|                         <view class="price">¥29.80</view> | ||||
|                         <view class="num">x2</view> | ||||
|                     </view> | ||||
|                 </view> | ||||
|                 <view class="aggregate"> | ||||
|                     共计1件商品  合计:  | ||||
|                     <text>¥29.80</text>  | ||||
|                     (含运费¥0.00) | ||||
|                 </view> | ||||
|                 <view class="operation"> | ||||
|                     <view class="button">评价</view> | ||||
| 
 | ||||
|                     <view class="button hlight">评价</view> | ||||
| 
 | ||||
|                 </view> | ||||
|             </view> | ||||
|         </van-tab> | ||||
|         <van-tab title="代发货"> <view class="commodity"> | ||||
|                 <view class="message"> | ||||
|                     <image class="image"></image> | ||||
|                     <view class="introduce"> | ||||
|                         <view class="title">001|德国双心药房版 胶原蛋白美容口服液养颜</view> | ||||
|                         <view class="count"> | ||||
|                             <view>30只</view> | ||||
|                             <view>1.0356kg</view> | ||||
|                         </view> | ||||
|                     </view> | ||||
|                     <view class="parameter"> | ||||
|                         <view class="price">¥29.80</view> | ||||
|                         <view class="num">x2</view> | ||||
|                     </view> | ||||
|                 </view> | ||||
|                 <view class="aggregate"> | ||||
|                     共计1件商品  合计:  | ||||
|                     <text>¥29.80</text>  | ||||
|                     (含运费¥0.00) | ||||
|                 </view> | ||||
|                 <view class="operation"> | ||||
|                     <view class="button">评价</view> | ||||
| 
 | ||||
|                     <view class="button hlight">评价</view> | ||||
| 
 | ||||
|                 </view> | ||||
|             </view></van-tab> | ||||
|         <van-tab title="待收货"> <view class="commodity"> | ||||
|                 <view class="message"> | ||||
|                     <image class="image"></image> | ||||
|                     <view class="introduce"> | ||||
|                         <view class="title">001|德国双心药房版 胶原蛋白美容口服液养颜</view> | ||||
|                         <view class="count"> | ||||
|                             <view>30只</view> | ||||
|                             <view>1.0356kg</view> | ||||
|                         </view> | ||||
|                     </view> | ||||
|                     <view class="parameter"> | ||||
|                         <view class="price">¥29.80</view> | ||||
|                         <view class="num">x2</view> | ||||
|                     </view> | ||||
|                 </view> | ||||
|                 <view class="aggregate"> | ||||
|                     共计1件商品  合计:  | ||||
|                     <text>¥29.80</text>  | ||||
|                     (含运费¥0.00) | ||||
|                 </view> | ||||
|                 <view class="operation"> | ||||
|                     <view class="button">评价</view> | ||||
| 
 | ||||
|                     <view class="button hlight">评价</view> | ||||
| 
 | ||||
|                 </view> | ||||
|             </view></van-tab> | ||||
|         <van-tab title="已完成"> <view class="commodity"> | ||||
|                 <view class="message"> | ||||
|                     <image class="image"></image> | ||||
|                     <view class="introduce"> | ||||
|                         <view class="title">001|德国双心药房版 胶原蛋白美容口服液养颜</view> | ||||
|                         <view class="count"> | ||||
|                             <view>30只</view> | ||||
|                             <view>1.0356kg</view> | ||||
|                         </view> | ||||
|                     </view> | ||||
|                     <view class="parameter"> | ||||
|                         <view class="price">¥29.80</view> | ||||
|                         <view class="num">x2</view> | ||||
|                     </view> | ||||
|                 </view> | ||||
|                 <view class="aggregate"> | ||||
|                     共计1件商品  合计:  | ||||
|                     <text>¥29.80</text>  | ||||
|                     (含运费¥0.00) | ||||
|                 </view> | ||||
|                 <view class="operation"> | ||||
|                     <view class="button">评价</view> | ||||
| 
 | ||||
|                     <view class="button hlight">评价</view> | ||||
| 
 | ||||
|                 </view> | ||||
|             </view></van-tab> | ||||
|         <van-tab title="售后"> <view class="commodity"> | ||||
|                 <view class="message"> | ||||
|                     <image class="image"></image> | ||||
|                     <view class="introduce"> | ||||
|                         <view class="title">001|德国双心药房版 胶原蛋白美容口服液养颜</view> | ||||
|                         <view class="count"> | ||||
|                             <view>30只</view> | ||||
|                             <view>1.0356kg</view> | ||||
|                         </view> | ||||
|                     </view> | ||||
|                     <view class="parameter"> | ||||
|                         <view class="price">¥29.80</view> | ||||
|                         <view class="num">x2</view> | ||||
|                     </view> | ||||
|                 </view> | ||||
|                 <view class="aggregate"> | ||||
|                     共计1件商品  合计:  | ||||
|                     <text>¥29.80</text>  | ||||
|                     (含运费¥0.00) | ||||
|                 </view> | ||||
|                 <view class="operation"> | ||||
|                     <view class="button">评价</view> | ||||
| 
 | ||||
|                     <view class="button hlight">评价</view> | ||||
| 
 | ||||
|                 </view> | ||||
|             </view></van-tab> | ||||
|     </van-tabs> | ||||
| </view> | ||||
							
								
								
									
										1
									
								
								pages/order/order.wxss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								pages/order/order.wxss
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1 @@ | ||||
| .box{display:flex;flex-direction:column;align-items:center}.box .tab{width:100%}.box .tab .commodity{margin-top:20rpx;background-color:#fff}.box .tab .commodity .message{padding:35rpx;display:flex;align-items:center;border-bottom:1rpx solid #F2F2F2}.box .tab .commodity .message .image{width:141rpx;height:150rpx;background-color:#000;margin-left:34rpx}.box .tab .commodity .message .introduce{margin-left:32rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;width:362rpx}.box .tab .commodity .message .introduce .title{font-size:28rpx;color:#333}.box .tab .commodity .message .introduce .count{font-size:24rpx;color:#999;display:flex}.box .tab .commodity .message .introduce .count>view{margin-right:27rpx}.box .tab .commodity .message .parameter{width:150rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end}.box .tab .commodity .aggregate{display:flex;box-sizing:border-box;padding:30rpx;justify-content:flex-end;font-size:22rpx;color:#999;height:78rpx;border-bottom:1rpx solid #F2F2F2}.box .tab .commodity .aggregate>text{color:#333;margin:0 5rpx}.box .tab .commodity .operation{height:84rpx;display:flex;justify-content:flex-end;padding:0 30rpx;align-items:center}.box .tab .commodity .operation .button{width:133rpx;height:51rpx;border:2rpx solid #999999;border-radius:26rpx;text-align:center;font-size:22rpx;color:#999999;line-height:51rpx;margin-right:8rpx}.box .tab .commodity .operation .hlight{border:2rpx solid #47c877;color:#47C877}page{background-color:#efefef} | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user