作者 wumengyu

优化参与人列表,订单详情

@@ -212,7 +212,7 @@ swiper { @@ -212,7 +212,7 @@ swiper {
212 box-sizing: border-box; 212 box-sizing: border-box;
213 display: flex; 213 display: flex;
214 align-items: center; 214 align-items: center;
215 - justify-content: flex-start; 215 + justify-content: space-between;
216 overflow-x: scroll; 216 overflow-x: scroll;
217 /* display: -webkit-box; */ 217 /* display: -webkit-box; */
218 -webkit-overflow-scrolling: touch; 218 -webkit-overflow-scrolling: touch;
@@ -222,11 +222,12 @@ swiper { @@ -222,11 +222,12 @@ swiper {
222 display: flex; 222 display: flex;
223 flex-direction: column; 223 flex-direction: column;
224 align-items: center; 224 align-items: center;
225 - margin-right: 60rpx; 225 + justify-content: center;
  226 + /* margin-right: 60rpx; */
226 } 227 }
227 .people:nth-last-child(1){ 228 .people:nth-last-child(1){
228 margin-right: 0; 229 margin-right: 0;
229 - padding-right: 36rpx; 230 + /* padding-right: 36rpx; */
230 } 231 }
231 .people-img { 232 .people-img {
232 width: 40rpx; 233 width: 40rpx;
@@ -245,7 +246,7 @@ swiper { @@ -245,7 +246,7 @@ swiper {
245 align-items: center; 246 align-items: center;
246 } 247 }
247 .people-num .name { 248 .people-num .name {
248 - /* width:100rpx; */ 249 + max-width:100rpx;
249 margin-right:10rpx; 250 margin-right:10rpx;
250 text-align: center; 251 text-align: center;
251 /* margin-right: 10rpx; */ 252 /* margin-right: 10rpx; */
@@ -259,6 +260,7 @@ swiper { @@ -259,6 +260,7 @@ swiper {
259 -webkit-box-orient: vertical; 260 -webkit-box-orient: vertical;
260 } 261 }
261 .people-num .num { 262 .people-num .num {
  263 + /* width:40%; */
262 color: #333333; 264 color: #333333;
263 font-size: 22rpx; 265 font-size: 22rpx;
264 } 266 }
@@ -24,18 +24,20 @@ @@ -24,18 +24,20 @@
24 </view> 24 </view>
25 25
26 <view class="box" bindtap="goDetail"> 26 <view class="box" bindtap="goDetail">
27 - <image src="{{detail.pic}}" class="banner"></image>  
28 - <view class="order-info">  
29 <view class="top"> 27 <view class="top">
30 <!--<image src="../../../images/avatar@2x.png"></image>--> 28 <!--<image src="../../../images/avatar@2x.png"></image>-->
31 <image src="{{detail.userPic}}" class="user-avatar"></image> 29 <image src="{{detail.userPic}}" class="user-avatar"></image>
32 <image src="{{detail.userSex === 1?'../../../images/man.png':'../../../images/women.png'}}" class="sex-icon"></image> 30 <image src="{{detail.userSex === 1?'../../../images/man.png':'../../../images/women.png'}}" class="sex-icon"></image>
33 <text class="name">{{detail.userName}}</text> 31 <text class="name">{{detail.userName}}</text>
34 </view> 32 </view>
  33 + <view class="order-info">
  34 + <image src="{{detail.pic}}" class="banner" mode="aspectFill"></image>
  35 + <view class="info-right">
35 <text class="address">{{detail.title}}</text> 36 <text class="address">{{detail.title}}</text>
36 <text class="time">{{detail.time}}</text> 37 <text class="time">{{detail.time}}</text>
37 </view> 38 </view>
38 </view> 39 </view>
  40 + </view>
39 41
40 42
41 <view class="complain" catchtap="goComplain"><text>去投诉</text></view> 43 <view class="complain" catchtap="goComplain"><text>去投诉</text></view>
@@ -49,27 +49,32 @@ @@ -49,27 +49,32 @@
49 } 49 }
50 .box { 50 .box {
51 display: flex; 51 display: flex;
52 - align-items: center;  
53 - padding: 20rpx; 52 + flex-direction: column;
  53 + align-items: flex-start;
  54 + padding: 40rpx 20rpx 40rpx 20rpx;
54 -webkit-box-sizing: border-box; 55 -webkit-box-sizing: border-box;
55 -moz-box-sizing: border-box; 56 -moz-box-sizing: border-box;
56 box-sizing: border-box; 57 box-sizing: border-box;
57 border-bottom: 1rpx solid #f2f2f2; 58 border-bottom: 1rpx solid #f2f2f2;
58 } 59 }
59 .box image { 60 .box image {
60 - width: 153rpx;  
61 - height: 153rpx; 61 + width: 110rpx;
  62 + height: 110rpx;
62 margin-right: 20rpx; 63 margin-right: 20rpx;
63 } 64 }
64 .order-info { 65 .order-info {
65 display: flex; 66 display: flex;
66 - flex-direction: column;  
67 - padding: 40rpx 20rpx 0 20rpx; 67 + padding: 30rpx 20rpx 0 0rpx;
68 -webkit-box-sizing: border-box; 68 -webkit-box-sizing: border-box;
69 -moz-box-sizing: border-box; 69 -moz-box-sizing: border-box;
70 box-sizing: border-box; 70 box-sizing: border-box;
71 } 71 }
72 -.order-info .top { 72 +.info-right {
  73 + display: flex;
  74 + flex-direction: column;
  75 + justify-content: space-around;
  76 +}
  77 +.box .top {
73 display: flex; 78 display: flex;
74 align-items: center; 79 align-items: center;
75 position: relative; 80 position: relative;
@@ -96,10 +101,10 @@ @@ -96,10 +101,10 @@
96 color: #666666; 101 color: #666666;
97 } 102 }
98 .address { 103 .address {
99 - padding: 28rpx 0 32rpx 0; 104 + /* padding: 28rpx 0 32rpx 0; */
100 } 105 }
101 .time { 106 .time {
102 - padding-bottom: 40rpx; 107 + /* padding-bottom: 40rpx; */
103 } 108 }
104 .order-detail { 109 .order-detail {
105 /* margin-top: 58rpx; */ 110 /* margin-top: 58rpx; */