Commit d02cd3bac2d9dffd687e96997fa7be7da9d4339a
1 parent
1072ea92
秒杀，拼单页面优化
Showing
4 changed files
with
396 additions
and
417 deletions
components/diy_pingd_buy/diy_pingd_buy.wxml
| 1 | <!--pages/wp/wp.wxml--> | 1 | <!--pages/wp/wp.wxml--> |
| 2 | <block wx:if="goods_array.length>0"> | 2 | <block wx:if="goods_array.length>0"> |
| 3 | - <!--拼单--> | ||
| 4 | - <view class='top_p'> | ||
| 5 | - <view class='t_left_p'></view> | ||
| 6 | - <view class='t_ms_p'>拼单</view> | ||
| 7 | - <view class='right_p' bindtap="go_to_pindlist"> | ||
| 8 | - <image src="{{iurl}}/miniapp/images/icon-arrowdown.png"></image> | ||
| 9 | - </view> | 3 | + <!--拼单--> |
| 4 | + <view class='top_p'> | ||
| 5 | + <view class="top"> | ||
| 6 | + <view class='t_left_p'></view> | ||
| 7 | + <view class='t_ms_p'>拼单</view> | ||
| 10 | </view> | 8 | </view> |
| 11 | - <!--商品展示--> | ||
| 12 | - <swiper class="s_prom" indicator-active-color='red' indicator-dots="false" wx:if="{{object.style==1}}"> | ||
| 13 | - <view class='sp_p' wx:if="{{object.style==1}}"> | ||
| 14 | - <swiper-item class="s_it" wx:for="{{goods_array}}" > | ||
| 15 | - <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind" > | ||
| 16 | - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 17 | - <view class='one_p'> | ||
| 18 | - <view class='sp_top_p'> | ||
| 19 | - | ||
| 20 | - <block wx:if="{{aitem.start_time>newTime}}"> | ||
| 21 | - <span class='s_top_p' style="background-color: #ffe718;color: #3c3b31;font-weight: bold">即将开始</span> | ||
| 22 | - </block> | ||
| 23 | - <block wx:if="{{aitem.start_time<newTime}}"> | ||
| 24 | - <span class='s_top_p'>火热进行</span> | ||
| 25 | - </block> | ||
| 26 | - | ||
| 27 | - <!-- <span class='s_top_p'>火热进行</span> --> | ||
| 28 | - | ||
| 29 | - <view class='s_img_p'> | ||
| 30 | - <image src="{{iurl+aitem.original_img}}" | ||
| 31 | - data-errorimg="goods_array[{{index}}][{{aind}}].original_img" | ||
| 32 | - binderror="bind_bnerr3"></image> | ||
| 33 | - </view> | 9 | + <view class='right_p' bindtap="go_to_pindlist"> |
| 10 | + <image src="{{iurl}}/miniapp/images/icon-arrowdown.png" lazy-load="true"></image> | ||
| 11 | + </view> | ||
| 12 | + </view> | ||
| 13 | + <!--商品展示--> | ||
| 14 | + <swiper class="s_prom" indicator-active-color='red' indicator-dots="false" wx:if="{{object.style==1}}"> | ||
| 15 | + <view class='sp_p' wx:if="{{object.style==1}}"> | ||
| 16 | + <swiper-item class="s_it" wx:for="{{goods_array}}"> | ||
| 17 | + <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | ||
| 18 | + <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 19 | + <view class='one_p'> | ||
| 20 | + <view class='sp_top_p'> | ||
| 34 | 21 | ||
| 35 | - <!--<view class='s_foot_p'>--> | ||
| 36 | - <!--<text>{{aitem.djs.hou}}天</text>--> | ||
| 37 | - <!--<text>{{aitem.djs.hou}}时</text>--> | ||
| 38 | - <!--<text>{{aitem.djs.min}}分</text>--> | ||
| 39 | - <!--<text>{{aitem.djs.sec}}秒</text>--> | ||
| 40 | - <!--</view>--> | 22 | + <block wx:if="{{aitem.start_time>newTime}}"> |
| 23 | + <span class='s_top_p' style="background-color: #ffe718;color: #3c3b31;font-weight: bold">即将开始</span> | ||
| 24 | + </block> | ||
| 25 | + <block wx:if="{{aitem.start_time<newTime}}"> | ||
| 26 | + <span class='s_top_p'>火热进行</span> | ||
| 27 | + </block> | ||
| 41 | 28 | ||
| 42 | - <view class='sp_sj_p' wx:if="{{aitem.kttype==1}}">商家</view> | ||
| 43 | - <view class='sp_sj_p' wx:if="{{aitem.kttype==2}}">会员</view> | ||
| 44 | - <view class='sp_sj_p' wx:if="{{aitem.kttype==3}}">阶梯</view> | ||
| 45 | - </view> | 29 | + <!-- <span class='s_top_p'>火热进行</span> --> |
| 46 | 30 | ||
| 47 | - <view class='sp_wz_p'> | ||
| 48 | - <view class='sp_wzi_p'>{{aitem.goods_name}}</view> | ||
| 49 | - <view class='sp_jg_p'>￥{{aitem.price}}</view> | ||
| 50 | - <!--<view class='sp_jgx_p'>￥{{aitem.market_price}}</view>--> | 31 | + <view class='s_img_p'> |
| 32 | + <image src="{{iurl+aitem.original_img}}" data-errorimg="goods_array[{{index}}][{{aind}}].original_img" binderror="bind_bnerr3"></image> | ||
| 33 | + </view> | ||
| 51 | 34 | ||
| 52 | - <view class="tuan_set_num"> | ||
| 53 | - <view class="co-red2">{{aitem.ct_num}}人团</view> | 35 | + <!--<view class='s_foot_p'>--> |
| 36 | + <!--<text>{{aitem.djs.hou}}天</text>--> | ||
| 37 | + <!--<text>{{aitem.djs.hou}}时</text>--> | ||
| 38 | + <!--<text>{{aitem.djs.min}}分</text>--> | ||
| 39 | + <!--<text>{{aitem.djs.sec}}秒</text>--> | ||
| 40 | + <!--</view>--> | ||
| 54 | 41 | ||
| 55 | - <view wx:if="{{aitem.kttype==1 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去参团</view> | ||
| 56 | - <view wx:if="{{aitem.kttype==2 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去开团</view> | ||
| 57 | - <view wx:if="{{aitem.kttype==3 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去开团</view> | ||
| 58 | - <view wx:if="{{aitem.goods_num<=aitem.buy_num }}" class="cantuan huise">已抢光</view> | ||
| 59 | - </view> | ||
| 60 | - </view> | ||
| 61 | - </view> | ||
| 62 | - </navigator> | ||
| 63 | - </block> | ||
| 64 | - </swiper-item> | 42 | + <view class='sp_sj_p' wx:if="{{aitem.kttype==1}}">商家</view> |
| 43 | + <view class='sp_sj_p' wx:if="{{aitem.kttype==2}}">会员</view> | ||
| 44 | + <view class='sp_sj_p' wx:if="{{aitem.kttype==3}}">阶梯</view> | ||
| 45 | + </view> | ||
| 65 | 46 | ||
| 66 | - </view> | ||
| 67 | - </swiper> | ||
| 68 | - <view class="sp2_p" wx:if="{{object.style==2}}"> | ||
| 69 | - <block wx:for="{{goods_array}}" > | ||
| 70 | - <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind" > | ||
| 71 | - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 72 | - <view class='one1_p'> | ||
| 73 | - <block> | ||
| 74 | - <view class="o1_img_p"> | ||
| 75 | - <image src="{{iurl+aitem.original_img}}" | ||
| 76 | - data-errorimg="goods_array[{{index}}][{{aind}}].original_img" | ||
| 77 | - binderror="bind_bnerr3"></image> | ||
| 78 | - <view class='sp_sj1_p' wx:if="{{aitem.kttype==1}}">商家</view> | ||
| 79 | - <view class='sp_sj1_p' wx:if="{{aitem.kttype==2}}">会员</view> | ||
| 80 | - <view class='sp_sj1_p' wx:if="{{aitem.kttype==3}}">阶梯</view> | ||
| 81 | - </view> | ||
| 82 | - </block> | 47 | + <view class='sp_wz_p'> |
| 48 | + <view class='sp_wzi_p'>{{aitem.goods_name}}</view> | ||
| 49 | + <view class='sp_jg_p'>￥{{aitem.price}}</view> | ||
| 50 | + <!--<view class='sp_jgx_p'>￥{{aitem.market_price}}</view>--> | ||
| 83 | 51 | ||
| 84 | - <view class="o1_right_p"> | 52 | + <view class="tuan_set_num"> |
| 53 | + <view class="co-red2">{{aitem.ct_num}}人团</view> | ||
| 85 | 54 | ||
| 86 | - <view class="sp_wzi_p">{{aitem.title}}</view> | ||
| 87 | - <view class="co-red2"> | ||
| 88 | - <text class="yituan_num">已团{{aitem.buy_num}}件</text> | ||
| 89 | - {{aitem.ct_num}}人团 | ||
| 90 | - </view> | ||
| 91 | - <view class='sp_jg_p'>￥{{aitem.price}}</view> | ||
| 92 | - <view class='sp_jgx_p'>￥{{aitem.market_price}}</view> | ||
| 93 | - | ||
| 94 | - <view class="o1_sj_p"> | ||
| 95 | - <image class="time_img" src="/public/static/images/model/time.png"></image><block wx:if="aitem.djs.day>0">{{aitem.djs.day}}天</block>{{aitem.djs.hou}}时{{aitem.djs.min}}分{{aitem.djs.sec}}秒 | ||
| 96 | - </view> | ||
| 97 | - | ||
| 98 | - <view wx:if="{{aitem.kttype==1 && aitem.goods_num>aitem.buy_num }}" class="wo_p">去参团</view> | ||
| 99 | - <view wx:if="{{aitem.kttype==2 && aitem.goods_num>aitem.buy_num }}" class="wo_p">去开团</view> | ||
| 100 | - <view wx:if="{{aitem.kttype==3 && aitem.goods_num>aitem.buy_num }}" class="wo_p">去参团</view> | ||
| 101 | - <view wx:if="{{aitem.goods_num<=aitem.buy_num }}" class="wo_p huise">已抢光</view> | ||
| 102 | - | ||
| 103 | - </view> | ||
| 104 | - </view> | ||
| 105 | - </navigator> | ||
| 106 | - </block> | 55 | + <view wx:if="{{aitem.kttype==1 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去参团</view> |
| 56 | + <view wx:if="{{aitem.kttype==2 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去开团</view> | ||
| 57 | + <view wx:if="{{aitem.kttype==3 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去开团</view> | ||
| 58 | + <view wx:if="{{aitem.goods_num<=aitem.buy_num }}" class="cantuan huise">已抢光</view> | ||
| 59 | + </view> | ||
| 60 | + </view> | ||
| 61 | + </view> | ||
| 62 | + </navigator> | ||
| 107 | </block> | 63 | </block> |
| 64 | + </swiper-item> | ||
| 65 | + | ||
| 108 | </view> | 66 | </view> |
| 67 | + </swiper> | ||
| 68 | + <view class="sp2_p" wx:if="{{object.style==2}}"> | ||
| 69 | + <block wx:for="{{goods_array}}"> | ||
| 70 | + <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | ||
| 71 | + <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 72 | + <view class='one1_p'> | ||
| 73 | + <block> | ||
| 74 | + <view class="o1_img_p"> | ||
| 75 | + <image src="{{iurl+aitem.original_img}}" data-errorimg="goods_array[{{index}}][{{aind}}].original_img" binderror="bind_bnerr3"></image> | ||
| 76 | + <view class='sp_sj1_p' wx:if="{{aitem.kttype==1}}">商家</view> | ||
| 77 | + <view class='sp_sj1_p' wx:if="{{aitem.kttype==2}}">会员</view> | ||
| 78 | + <view class='sp_sj1_p' wx:if="{{aitem.kttype==3}}">阶梯</view> | ||
| 79 | + </view> | ||
| 80 | + </block> | ||
| 81 | + | ||
| 82 | + <view class="o1_right_p"> | ||
| 83 | + | ||
| 84 | + <view class="sp_wzi_p">{{aitem.title}}</view> | ||
| 85 | + <view class="co-red2"> | ||
| 86 | + <text class="yituan_num">已团{{aitem.buy_num}}件</text> {{aitem.ct_num}}人团 | ||
| 87 | + </view> | ||
| 88 | + <view class="money"> | ||
| 89 | + <view class='sp_jg_p'>￥{{aitem.price}}</view> | ||
| 90 | + <view class='sp_jgx_p'>￥{{aitem.market_price}}</view> | ||
| 91 | + </view> | ||
| 92 | + <view class="o1_sj_p"> | ||
| 93 | + <image class="time_img" src="/public/static/images/model/time.png"></image> | ||
| 94 | + <block wx:if="aitem.djs.day>0">{{aitem.djs.day}}天</block>{{aitem.djs.hou}}时{{aitem.djs.min}}分{{aitem.djs.sec}}秒 | ||
| 95 | + </view> | ||
| 96 | + | ||
| 97 | + <view wx:if="{{aitem.kttype==1 && aitem.goods_num>aitem.buy_num }}" class="wo_p">去参团</view> | ||
| 98 | + <view wx:if="{{aitem.kttype==2 && aitem.goods_num>aitem.buy_num }}" class="wo_p">去开团</view> | ||
| 99 | + <view wx:if="{{aitem.kttype==3 && aitem.goods_num>aitem.buy_num }}" class="wo_p">去参团</view> | ||
| 100 | + <view wx:if="{{aitem.goods_num<=aitem.buy_num }}" class="wo_p huise">已抢光</view> | ||
| 101 | + | ||
| 102 | + </view> | ||
| 103 | + </view> | ||
| 104 | + </navigator> | ||
| 105 | + </block> | ||
| 106 | + </block> | ||
| 107 | + </view> | ||
| 109 | 108 | ||
| 110 | </block> | 109 | </block> |
| 111 | \ No newline at end of file | 110 | \ No newline at end of file |
components/diy_pingd_buy/diy_pingd_buy.wxss
| 1 | /* pages/wp/wp.wxss */ | 1 | /* pages/wp/wp.wxss */ |
| 2 | - | 2 | +.top{ |
| 3 | + display: flex; | ||
| 4 | + align-items: center; | ||
| 5 | +} | ||
| 3 | .top_p { | 6 | .top_p { |
| 4 | - width: 100%; | 7 | + padding:0rpx 20rpx; |
| 5 | background-color: white; | 8 | background-color: white; |
| 6 | height: 70rpx; | 9 | height: 70rpx; |
| 7 | line-height: 70rpx; | 10 | line-height: 70rpx; |
| @@ -9,12 +12,12 @@ | @@ -9,12 +12,12 @@ | ||
| 9 | text-align: left; | 12 | text-align: left; |
| 10 | border-bottom: 2rpx solid #eee; | 13 | border-bottom: 2rpx solid #eee; |
| 11 | display: flex; | 14 | display: flex; |
| 15 | + justify-content: space-between; | ||
| 16 | + align-items: center; | ||
| 12 | } | 17 | } |
| 13 | 18 | ||
| 14 | .right_p { | 19 | .right_p { |
| 15 | width: 30rpx; | 20 | width: 30rpx; |
| 16 | - height: 100%; | ||
| 17 | - margin-left: 580rpx; | ||
| 18 | } | 21 | } |
| 19 | 22 | ||
| 20 | .right_p image { | 23 | .right_p image { |
| @@ -26,9 +29,7 @@ | @@ -26,9 +29,7 @@ | ||
| 26 | width: 10rpx; | 29 | width: 10rpx; |
| 27 | height: 38rpx; | 30 | height: 38rpx; |
| 28 | background: #c4182e; | 31 | background: #c4182e; |
| 29 | - margin-top: 18rpx; | ||
| 30 | margin-right: 12rpx; | 32 | margin-right: 12rpx; |
| 31 | - margin-left: 20rpx; | ||
| 32 | } | 33 | } |
| 33 | 34 | ||
| 34 | .sp_p { | 35 | .sp_p { |
| @@ -42,7 +43,7 @@ | @@ -42,7 +43,7 @@ | ||
| 42 | .sp_p .sp_top_p { | 43 | .sp_p .sp_top_p { |
| 43 | height: 220rpx; | 44 | height: 220rpx; |
| 44 | min-width: 30%; | 45 | min-width: 30%; |
| 45 | - position: relative; | 46 | + position: relative; |
| 46 | } | 47 | } |
| 47 | 48 | ||
| 48 | .sp_p .sp_top_p .s_img_p { | 49 | .sp_p .sp_top_p .s_img_p { |
| @@ -206,21 +207,24 @@ swiper { | @@ -206,21 +207,24 @@ swiper { | ||
| 206 | } | 207 | } |
| 207 | 208 | ||
| 208 | .sp2_p .one1_p { | 209 | .sp2_p .one1_p { |
| 209 | - width: 100%; | ||
| 210 | background-color: white; | 210 | background-color: white; |
| 211 | height: 252rpx; | 211 | height: 252rpx; |
| 212 | display: flex; | 212 | display: flex; |
| 213 | padding: 20rpx; | 213 | padding: 20rpx; |
| 214 | border-bottom: 6rpx#eee solid; | 214 | border-bottom: 6rpx#eee solid; |
| 215 | + align-items: center; | ||
| 215 | } | 216 | } |
| 216 | 217 | ||
| 217 | .sp2_p .one1_p .o1_img_p { | 218 | .sp2_p .one1_p .o1_img_p { |
| 218 | - width: 200rpx; | ||
| 219 | - height: 240rpx; | ||
| 220 | - margin-right: 24rpx; | 219 | + width: 220rpx; |
| 220 | + height: 220rpx; | ||
| 221 | + margin-right: 25rpx; | ||
| 221 | } | 222 | } |
| 222 | 223 | ||
| 223 | -.o1_right_p{position: relative; width: 485rpx;} | 224 | +.o1_right_p { |
| 225 | + position: relative; | ||
| 226 | + width: 465rpx; | ||
| 227 | +} | ||
| 224 | 228 | ||
| 225 | .o1_right_p .sp_wzi_p { | 229 | .o1_right_p .sp_wzi_p { |
| 226 | font-size: 36rpx; | 230 | font-size: 36rpx; |
| @@ -228,16 +232,16 @@ swiper { | @@ -228,16 +232,16 @@ swiper { | ||
| 228 | width: 100%; | 232 | width: 100%; |
| 229 | text-align: left; | 233 | text-align: left; |
| 230 | padding: 4rpx 0; | 234 | padding: 4rpx 0; |
| 231 | - overflow: hidden; | ||
| 232 | height: 48rpx; | 235 | height: 48rpx; |
| 236 | + overflow: hidden; | ||
| 237 | + white-space: nowrap; | ||
| 233 | text-overflow: ellipsis; | 238 | text-overflow: ellipsis; |
| 234 | } | 239 | } |
| 235 | 240 | ||
| 236 | .o1_right_p .o1_sj_p { | 241 | .o1_right_p .o1_sj_p { |
| 237 | height: 60rpx; | 242 | height: 60rpx; |
| 238 | - margin-bottom: 10rpx; | ||
| 239 | - font-size: 28rpx; | ||
| 240 | - line-height: 40rpx; | 243 | + font-size: 28rpx; |
| 244 | + line-height: 40rpx; | ||
| 241 | } | 245 | } |
| 242 | 246 | ||
| 243 | .o1_right_p .o1_sj_p text { | 247 | .o1_right_p .o1_sj_p text { |
| @@ -269,8 +273,6 @@ swiper { | @@ -269,8 +273,6 @@ swiper { | ||
| 269 | height: 100%; | 273 | height: 100%; |
| 270 | background-color: blueviolet; | 274 | background-color: blueviolet; |
| 271 | position: relative; | 275 | position: relative; |
| 272 | - top: -8rpx; | ||
| 273 | - left: 0rpx; | ||
| 274 | } | 276 | } |
| 275 | 277 | ||
| 276 | .o1_right_p .wo_p { | 278 | .o1_right_p .wo_p { |
| @@ -280,11 +282,11 @@ swiper { | @@ -280,11 +282,11 @@ swiper { | ||
| 280 | line-height: 60rpx; | 282 | line-height: 60rpx; |
| 281 | color: white; | 283 | color: white; |
| 282 | text-align: center; | 284 | text-align: center; |
| 283 | - font-size: 26rpx; | 285 | + font-size: 32rpx; |
| 284 | border-radius: 14rpx; | 286 | border-radius: 14rpx; |
| 285 | - position: absolute; | ||
| 286 | - right: 0; | ||
| 287 | - bottom:46rpx; | 287 | + position: absolute; |
| 288 | + right: 0; | ||
| 289 | + bottom: 46rpx; | ||
| 288 | } | 290 | } |
| 289 | 291 | ||
| 290 | .sp_sj_p { | 292 | .sp_sj_p { |
| @@ -295,12 +297,11 @@ swiper { | @@ -295,12 +297,11 @@ swiper { | ||
| 295 | position: absolute; | 297 | position: absolute; |
| 296 | bottom: 300rpx; | 298 | bottom: 300rpx; |
| 297 | right: 0rpx; | 299 | right: 0rpx; |
| 298 | - top: 0; | 300 | + top: 0; |
| 299 | width: 60rpx; | 301 | width: 60rpx; |
| 300 | height: 60rpx; | 302 | height: 60rpx; |
| 301 | text-align: center; | 303 | text-align: center; |
| 302 | line-height: 60rpx; | 304 | line-height: 60rpx; |
| 303 | - | ||
| 304 | } | 305 | } |
| 305 | 306 | ||
| 306 | .sp_sj1_p { | 307 | .sp_sj1_p { |
| @@ -315,20 +316,48 @@ swiper { | @@ -315,20 +316,48 @@ swiper { | ||
| 315 | text-align: center; | 316 | text-align: center; |
| 316 | line-height: 60rpx; | 317 | line-height: 60rpx; |
| 317 | } | 318 | } |
| 318 | -.tuan_set_num{ | ||
| 319 | - display: flex;justify-content: space-between; font-size: 28rpx; | 319 | + |
| 320 | +.tuan_set_num { | ||
| 321 | + display: flex; | ||
| 322 | + justify-content: space-between; | ||
| 323 | + font-size: 28rpx; | ||
| 324 | +} | ||
| 325 | + | ||
| 326 | +.tuan_set_num .co-red2 { | ||
| 327 | + color: #b2aea8; | ||
| 328 | + font-size: 26rpx; | ||
| 329 | +} | ||
| 330 | + | ||
| 331 | +.tuan_set_num .cantuan { | ||
| 332 | + background: #c4182e; | ||
| 333 | + color: #fff; | ||
| 334 | + padding: 4rpx 10rpx; | ||
| 335 | + border-radius: 5rpx; | ||
| 320 | } | 336 | } |
| 321 | 337 | ||
| 322 | -.tuan_set_num .co-red2{ | ||
| 323 | - color: #B2AEA8;font-size: 26rpx; | 338 | +.tuan_set_num .cantuan.huise { |
| 339 | + background: gainsboro; | ||
| 340 | + color: #666; | ||
| 324 | } | 341 | } |
| 325 | -.tuan_set_num .cantuan{ | ||
| 326 | - background:#c4182e; color: #fff; padding: 4rpx 10rpx; border-radius:5rpx ; | 342 | + |
| 343 | +.o1_sj_p .time_img { | ||
| 344 | + width: 40rpx; | ||
| 345 | + height: 40rpx; | ||
| 346 | + vertical-align: top; | ||
| 347 | + margin-right: 10rpx; | ||
| 327 | } | 348 | } |
| 328 | -.tuan_set_num .cantuan.huise{ | ||
| 329 | - background:gainsboro; color: #666; | 349 | + |
| 350 | +.o1_right_p .co-red2 { | ||
| 351 | + font-size: 30rpx; | ||
| 352 | + color: #999; | ||
| 330 | } | 353 | } |
| 331 | 354 | ||
| 332 | -.o1_sj_p .time_img{width: 40rpx; height: 40rpx; vertical-align: top; margin-right: 10rpx;} | ||
| 333 | -.o1_right_p .co-red2{font-size:30rpx; color: #999;} | ||
| 334 | -.o1_right_p .co-red2 .yituan_num{font-size:30rpx; margin-right: 10rpx; color: #333;} | 355 | +.o1_right_p .co-red2 .yituan_num { |
| 356 | + font-size: 30rpx; | ||
| 357 | + margin-right: 10rpx; | ||
| 358 | + color: #333; | ||
| 359 | +} | ||
| 360 | +.money{ | ||
| 361 | + display: flex; | ||
| 362 | + align-items: center; | ||
| 363 | +} | ||
| 335 | \ No newline at end of file | 364 | \ No newline at end of file |
components/diy_seckill/diy_seckill.wxml
| 1 | <block wx:if="goods_array.length>0"> | 1 | <block wx:if="goods_array.length>0"> |
| 2 | - <!--秒杀--> | ||
| 3 | - <view class='top'> | ||
| 4 | - <view class='t_left'></view> | ||
| 5 | - <view class='t_ms'>秒杀</view> | 2 | + <!--秒杀--> |
| 3 | + <view class='top'> | ||
| 4 | + <view class="flex"> | ||
| 5 | + <view class='t_left'></view> | ||
| 6 | + <view class='t_ms'>秒杀</view> | ||
| 7 | + </view> | ||
| 6 | <view class='right_k' bindtap="go_to_skill"> | 8 | <view class='right_k' bindtap="go_to_skill"> |
| 7 | - <image src="{{imghost}}/miniapp/images/icon-arrowdown.png"></image> | 9 | + <image src="{{imghost}}/miniapp/images/icon-arrowdown.png" lazy-load="true"></image> |
| 8 | </view> | 10 | </view> |
| 9 | - </view> | 11 | + </view> |
| 10 | 12 | ||
| 11 | - <!--商品展示--> | ||
| 12 | - <swiper class="s_prom" indicator-active-color='red' indicator-dots="false" wx:if="{{object.style==1}}"> | 13 | + <!--商品展示--> |
| 14 | + <swiper class="s_prom" indicator-active-color='red' indicator-dots="false" wx:if="{{object.style==1}}"> | ||
| 13 | <view class='sp' wx:if="{{object.style==1}}"> | 15 | <view class='sp' wx:if="{{object.style==1}}"> |
| 14 | - <swiper-item class="s_it" wx:for="{{goods_array}}" > | ||
| 15 | - <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | ||
| 16 | - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 17 | - <view class='one'> | ||
| 18 | - <view class='sp_top'> | ||
| 19 | - <view class='po'></view> | ||
| 20 | - <block wx:if="{{aitem.start_time>newTime}}"> | ||
| 21 | - <span class='s_top_kill' style="background-color: #ffe718;color: #3c3b31;font-weight: bold">即将开始</span> | ||
| 22 | - </block> | ||
| 23 | - <block wx:if="{{aitem.start_time<newTime}}"> | ||
| 24 | - <span class='s_top_kill'>火热进行</span> | ||
| 25 | - </block> | ||
| 26 | - <view class='clear'></view> | 16 | + <swiper-item class="s_it" wx:for="{{goods_array}}"> |
| 17 | + <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | ||
| 18 | + <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 19 | + <view class='one'> | ||
| 20 | + <view class='sp_top'> | ||
| 21 | + <view class='po'></view> | ||
| 22 | + <block wx:if="{{aitem.start_time>newTime}}"> | ||
| 23 | + <span class='s_top_kill' style="background-color: #ffe718;color: #3c3b31;font-weight: bold">即将开始</span> | ||
| 24 | + </block> | ||
| 25 | + <block wx:if="{{aitem.start_time<newTime}}"> | ||
| 26 | + <span class='s_top_kill'>火热进行</span> | ||
| 27 | + </block> | ||
| 28 | + <view class='clear'></view> | ||
| 27 | 29 | ||
| 28 | - <view class='s_img'> | ||
| 29 | - <image src="{{imghost+aitem.original_img}}" | ||
| 30 | - data-errorimg="goods_array[{{index}}][{{aind}}].original_img" | ||
| 31 | - binderror="bind_bnerr3"></image> | ||
| 32 | - </view> | 30 | + <view class='s_img'> |
| 31 | + <image src="{{imghost+aitem.original_img}}" data-errorimg="goods_array[{{index}}][{{aind}}].original_img" binderror="bind_bnerr3"></image> | ||
| 32 | + </view> | ||
| 33 | 33 | ||
| 34 | - <view class='s_foot_kill'> | ||
| 35 | - <text>{{aitem.djs.day}}天</text> | ||
| 36 | - <text>{{aitem.djs.hou}}时</text> | ||
| 37 | - <text>{{aitem.djs.min}}分</text> | ||
| 38 | - <text>{{aitem.djs.sec}}秒</text> | ||
| 39 | - </view> | ||
| 40 | - <view class='clear'></view> | 34 | + <view class='s_foot_kill'> |
| 35 | + <text>{{aitem.djs.day}}天</text> | ||
| 36 | + <text>{{aitem.djs.hou}}时</text> | ||
| 37 | + <text>{{aitem.djs.min}}分</text> | ||
| 38 | + <text>{{aitem.djs.sec}}秒</text> | ||
| 39 | + </view> | ||
| 40 | + <view class='clear'></view> | ||
| 41 | 41 | ||
| 42 | - </view> | 42 | + </view> |
| 43 | 43 | ||
| 44 | - <view class='sp_wz'> | ||
| 45 | - <view class='sp_wzi'>{{aitem.goods_name}}</view> | ||
| 46 | - <view class='sp_jg'>￥{{aitem.price}}</view> | ||
| 47 | - <view class='sp_jgx'>￥{{aitem.market_price}}</view> | ||
| 48 | - </view> | 44 | + <view class='sp_wz'> |
| 45 | + <view class='sp_wzi'>{{aitem.goods_name}}</view> | ||
| 46 | + <view class='sp_jg'>￥{{aitem.price}}</view> | ||
| 47 | + <view class='sp_jgx'>￥{{aitem.market_price}}</view> | ||
| 48 | + </view> | ||
| 49 | 49 | ||
| 50 | - </view> | ||
| 51 | - </navigator> | ||
| 52 | - </block> | ||
| 53 | - </swiper-item> | 50 | + </view> |
| 51 | + </navigator> | ||
| 52 | + </block> | ||
| 53 | + </swiper-item> | ||
| 54 | </view> | 54 | </view> |
| 55 | - </swiper> | 55 | + </swiper> |
| 56 | 56 | ||
| 57 | - <view class="sp2" wx:if="{{object.style==2}}"> | ||
| 58 | - <block wx:for="{{goods_array}}" > | ||
| 59 | - <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind" > | ||
| 60 | - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 61 | - <view class='one1'> | ||
| 62 | - | ||
| 63 | - <view class="o1_img"> | ||
| 64 | - <image src="{{imghost+aitem.original_img}}" | ||
| 65 | - data-errorimg="goods_array[{{index}}][{{aind}}].original_img" | ||
| 66 | - binderror="bind_bnerr3"></image> | ||
| 67 | - </view> | ||
| 68 | - | ||
| 69 | - <view class="o1_right"> | ||
| 70 | - <view class="sp_wzi">{{aitem.goods_name}}</view> | ||
| 71 | - <view class="o1_sj_kill"> | ||
| 72 | - <text>{{aitem.djs.day}}</text> | ||
| 73 | - 天 | ||
| 74 | - <text>{{aitem.djs.hou}}</text> | ||
| 75 | - : | ||
| 76 | - <text>{{aitem.djs.min}}</text> | ||
| 77 | - : | ||
| 78 | - <text>{{aitem.djs.sec}}</text> | 57 | + <view class="sp2" wx:if="{{object.style==2}}"> |
| 58 | + <block wx:for="{{goods_array}}"> | ||
| 59 | + <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | ||
| 60 | + <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" class="s1_gk_a1"> | ||
| 61 | + <view class='one1'> | ||
| 79 | 62 | ||
| 80 | - </view> | ||
| 81 | - <view class='sp_jg'>￥{{aitem.price}}</view> | ||
| 82 | - <view class='sp_jgx'>￥{{aitem.market_price}}</view> | ||
| 83 | - <block wx:if="{{aitem.start_time>newTime}}"> | ||
| 84 | - <view class="wo" style="background-color: #adadad">正在预热</view> | ||
| 85 | - </block> | ||
| 86 | - <block wx:if="{{aitem.start_time<newTime}}"> | ||
| 87 | - <view class="wo">我要抢</view> | ||
| 88 | - </block> | 63 | + <view class="o1_img"> |
| 64 | + <image src="{{imghost+aitem.original_img}}" data-errorimg="goods_array[{{index}}][{{aind}}].original_img" binderror="bind_bnerr3"></image> | ||
| 65 | + </view> | ||
| 89 | 66 | ||
| 67 | + <view class="o1_right"> | ||
| 68 | + <view class="sp_wzi">{{aitem.goods_name}}</view> | ||
| 69 | + <view class="o1_sj_kill"> | ||
| 70 | + <text>{{aitem.djs.day}}</text> 天 | ||
| 71 | + <text>{{aitem.djs.hou}}</text> : | ||
| 72 | + <text>{{aitem.djs.min}}</text> : | ||
| 73 | + <text>{{aitem.djs.sec}}</text> | ||
| 90 | 74 | ||
| 91 | - </view> | 75 | + </view> |
| 76 | + <view class="money"> | ||
| 77 | + <view class='sp_jg'>￥{{aitem.price}}</view> | ||
| 78 | + <view class='sp_jgx'>￥{{aitem.market_price}}</view> | ||
| 79 | + </view> | ||
| 80 | + <block wx:if="{{aitem.start_time>newTime}}"> | ||
| 81 | + <view class="wo" style="background-color: #adadad">正在预热</view> | ||
| 82 | + </block> | ||
| 83 | + <block wx:if="{{aitem.start_time<newTime}}"> | ||
| 84 | + <view class="rob"> | ||
| 85 | + <view class="wo">我要抢</view> | ||
| 92 | </view> | 86 | </view> |
| 93 | - </navigator> | ||
| 94 | - </block> | 87 | + </block> |
| 88 | + | ||
| 89 | + | ||
| 90 | + </view> | ||
| 91 | + </view> | ||
| 92 | + </navigator> | ||
| 93 | + </block> | ||
| 95 | </block> | 94 | </block> |
| 96 | 95 | ||
| 97 | - </view> | ||
| 98 | - <view class='clear'></view> | 96 | + </view> |
| 97 | + <view class='clear'></view> | ||
| 99 | 98 | ||
| 100 | </block> | 99 | </block> |
| 101 | \ No newline at end of file | 100 | \ No newline at end of file |
components/diy_seckill/diy_seckill.wxss
| 1 | - | ||
| 2 | -.top{ | ||
| 3 | - width: 100%; | 1 | +.flex{ |
| 2 | + display: flex; | ||
| 3 | + align-items: center; | ||
| 4 | +} | ||
| 5 | +.top { | ||
| 4 | background-color: white; | 6 | background-color: white; |
| 5 | height: 70rpx; | 7 | height: 70rpx; |
| 6 | line-height: 70rpx; | 8 | line-height: 70rpx; |
| 7 | - color: #000; | ||
| 8 | - text-align: left; | ||
| 9 | - border-bottom: 2rpx solid #eee; | ||
| 10 | - display: flex; | 9 | + color: #000; |
| 10 | + border-bottom: 2rpx solid #eee; | ||
| 11 | + padding:0rpx 20rpx; | ||
| 12 | + display: flex; | ||
| 13 | + justify-content: space-between; | ||
| 11 | } | 14 | } |
| 12 | 15 | ||
| 13 | - | ||
| 14 | -.s_it{ | 16 | +.s_it { |
| 15 | width: 100%; | 17 | width: 100%; |
| 16 | display: flex; | 18 | display: flex; |
| 17 | background-color: white; | 19 | background-color: white; |
| 18 | } | 20 | } |
| 19 | 21 | ||
| 20 | -.s_prom{ | 22 | +.s_prom { |
| 21 | width: 100%; | 23 | width: 100%; |
| 22 | background-color: white; | 24 | background-color: white; |
| 23 | min-height: 200rpx; | 25 | min-height: 200rpx; |
| 24 | } | 26 | } |
| 25 | 27 | ||
| 26 | swiper { | 28 | swiper { |
| 27 | - display:block; | ||
| 28 | - height:400rpx; | ||
| 29 | - | 29 | + display: block; |
| 30 | + height: 400rpx; | ||
| 30 | } | 31 | } |
| 31 | 32 | ||
| 32 | -.right_k{ | 33 | +.right_k { |
| 33 | width: 30rpx; | 34 | width: 30rpx; |
| 34 | - height: 100%; | ||
| 35 | - margin-left: 580rpx; | ||
| 36 | } | 35 | } |
| 37 | -.right_k image{ width: 30rpx; height: 30rpx} | ||
| 38 | - | ||
| 39 | - | ||
| 40 | -.top .t_left{ | ||
| 41 | - width: 10rpx; | ||
| 42 | - height: 38rpx; | ||
| 43 | - background: #C4182E; | ||
| 44 | - margin-top:18rpx; | ||
| 45 | -margin-right:12rpx; | ||
| 46 | -margin-left:20rpx; | 36 | +.right_k image{ |
| 37 | + width: 30rpx; | ||
| 38 | + height: 30rpx; | ||
| 39 | +} | ||
| 40 | + .t_left { | ||
| 41 | + width: 10rpx; | ||
| 42 | + height: 38rpx; | ||
| 43 | + background: #c4182e; | ||
| 44 | + margin-right: 10rpx; | ||
| 47 | } | 45 | } |
| 48 | 46 | ||
| 49 | 47 | ||
| 50 | -.sp{ | 48 | +.sp { |
| 51 | min-height: 300rpx; | 49 | min-height: 300rpx; |
| 52 | width: 100%; | 50 | width: 100%; |
| 53 | background-color: white; | 51 | background-color: white; |
| 54 | - padding:18rpx; | ||
| 55 | -display: flex; | 52 | + padding: 18rpx; |
| 53 | + display: flex; | ||
| 56 | } | 54 | } |
| 57 | 55 | ||
| 58 | -.sp .sp_top{ | 56 | +.sp .sp_top { |
| 59 | height: 220rpx; | 57 | height: 220rpx; |
| 60 | min-width: 30%; | 58 | min-width: 30%; |
| 61 | - | ||
| 62 | - | ||
| 63 | } | 59 | } |
| 64 | 60 | ||
| 65 | -.sp .sp_top .s_img{ | 61 | +.sp .sp_top .s_img { |
| 66 | width: 210rpx; | 62 | width: 210rpx; |
| 67 | height: 100%; | 63 | height: 100%; |
| 68 | } | 64 | } |
| 69 | 65 | ||
| 70 | -.sp .sp_top .s_img image{ | 66 | +.sp .sp_top .s_img image { |
| 71 | width: 210rpx; | 67 | width: 210rpx; |
| 72 | height: 100%; | 68 | height: 100%; |
| 73 | - | ||
| 74 | position: relative; | 69 | position: relative; |
| 75 | top: -74rpx; | 70 | top: -74rpx; |
| 76 | - left:0rpx; | ||
| 77 | - | 71 | + left: 0rpx; |
| 78 | } | 72 | } |
| 79 | 73 | ||
| 80 | -.sp .sp_top .s_top_kill | ||
| 81 | - | ||
| 82 | -{ | ||
| 83 | - | ||
| 84 | -background-color:#C4182E; | ||
| 85 | -font-size:24rpx; | ||
| 86 | -height:38rpx; | ||
| 87 | -line-height:38rpx; | ||
| 88 | -left:6rpx; | ||
| 89 | - | ||
| 90 | -padding:4rpx 10rpx; | ||
| 91 | - | ||
| 92 | -border-radius:10rpx; | ||
| 93 | - | ||
| 94 | - | ||
| 95 | -z-index: 999; | 74 | +.sp .sp_top .s_top_kill { |
| 75 | + background-color: #c4182e; | ||
| 76 | + font-size: 24rpx; | ||
| 77 | + height: 38rpx; | ||
| 78 | + line-height: 38rpx; | ||
| 79 | + left: 6rpx; | ||
| 80 | + padding: 4rpx 10rpx; | ||
| 81 | + border-radius: 10rpx; | ||
| 82 | + z-index: 999; | ||
| 96 | position: relative; | 83 | position: relative; |
| 97 | - top:-6rpx; | ||
| 98 | - width: 210rpx; | ||
| 99 | - | ||
| 100 | - | ||
| 101 | - color: #fff; | ||
| 102 | - text-align: center; | ||
| 103 | - | ||
| 104 | - | 84 | + top: -6rpx; |
| 85 | + width: 210rpx; | ||
| 86 | + color: #fff; | ||
| 87 | + text-align: center; | ||
| 105 | } | 88 | } |
| 106 | 89 | ||
| 107 | -.po{ | 90 | +.po { |
| 108 | position: absolute; | 91 | position: absolute; |
| 109 | } | 92 | } |
| 110 | 93 | ||
| 111 | -.sp .sp_top .s_foot_kill{ | 94 | +.sp .sp_top .s_foot_kill { |
| 112 | font-size: 20rpx; | 95 | font-size: 20rpx; |
| 113 | position: relative; | 96 | position: relative; |
| 114 | - top:-90rpx; | ||
| 115 | - width: 210rpx; | ||
| 116 | - height: 38rpx; | ||
| 117 | - line-height: 38rpx; | ||
| 118 | - color: #fff; | ||
| 119 | - text-align: center; | ||
| 120 | - background-color: rgba(0, 0, 0, 0.5); | 97 | + top: -90rpx; |
| 98 | + width: 210rpx; | ||
| 99 | + height: 38rpx; | ||
| 100 | + line-height: 38rpx; | ||
| 101 | + color: #fff; | ||
| 102 | + text-align: center; | ||
| 103 | + background-color: rgba(0, 0, 0, 0.5); | ||
| 121 | } | 104 | } |
| 122 | 105 | ||
| 123 | - | ||
| 124 | - | ||
| 125 | -.sp_wz{ | ||
| 126 | -width: 210rpx; | ||
| 127 | - min-height:100rpx; | ||
| 128 | - | 106 | +.sp_wz { |
| 107 | + width: 210rpx; | ||
| 108 | + min-height: 100rpx; | ||
| 129 | } | 109 | } |
| 130 | 110 | ||
| 131 | -.sp_wz .sp_wzi{ | ||
| 132 | - font-size: 30rpx; | ||
| 133 | - border-bottom: 2rpx solid #dcdcdc; | ||
| 134 | - width: 100%; | ||
| 135 | - text-align: left; | ||
| 136 | - padding: 4rpx 0; | ||
| 137 | - overflow: hidden; | ||
| 138 | - height: 48rpx; | ||
| 139 | - text-overflow: ellipsis; | ||
| 140 | - white-space: nowrap; | ||
| 141 | - line-height: 48rpx; | 111 | +.sp_wz .sp_wzi { |
| 112 | + font-size: 30rpx; | ||
| 113 | + border-bottom: 2rpx solid #dcdcdc; | ||
| 114 | + width: 100%; | ||
| 115 | + text-align: left; | ||
| 116 | + padding: 4rpx 0; | ||
| 117 | + overflow: hidden; | ||
| 118 | + height: 48rpx; | ||
| 119 | + text-overflow: ellipsis; | ||
| 120 | + white-space: nowrap; | ||
| 121 | + line-height: 48rpx; | ||
| 142 | } | 122 | } |
| 143 | 123 | ||
| 144 | -.sp_wz .sp_jg{ | ||
| 145 | - color: #C4182E; | ||
| 146 | - font-size: 30rpx; | ||
| 147 | - overflow: hidden; | ||
| 148 | - display: inline-block; | ||
| 149 | - text-overflow: ellipsis; | ||
| 150 | - white-space: nowrap; | ||
| 151 | - margin-right: 10rpx; | 124 | +.sp_wz .sp_jg { |
| 125 | + color: #c4182e; | ||
| 126 | + font-size: 30rpx; | ||
| 127 | + overflow: hidden; | ||
| 128 | + display: inline-block; | ||
| 129 | + text-overflow: ellipsis; | ||
| 130 | + white-space: nowrap; | ||
| 131 | + margin-right: 10rpx; | ||
| 152 | } | 132 | } |
| 153 | 133 | ||
| 154 | -.sp_wz .sp_jgx{ | 134 | +.sp_wz .sp_jgx { |
| 155 | color: #adadad; | 135 | color: #adadad; |
| 156 | - text-decoration: line-through; | ||
| 157 | - font-size: 24rpx; | ||
| 158 | - | ||
| 159 | - overflow: hidden; | ||
| 160 | - display: inline-block; | ||
| 161 | - text-overflow: ellipsis; | ||
| 162 | - white-space: nowrap; | ||
| 163 | - | 136 | + text-decoration: line-through; |
| 137 | + font-size: 24rpx; | ||
| 138 | + overflow: hidden; | ||
| 139 | + display: inline-block; | ||
| 140 | + text-overflow: ellipsis; | ||
| 141 | + white-space: nowrap; | ||
| 164 | } | 142 | } |
| 165 | 143 | ||
| 166 | -.one{ | 144 | +.one { |
| 167 | margin-left: 14rpx; | 145 | margin-left: 14rpx; |
| 168 | - | ||
| 169 | } | 146 | } |
| 170 | 147 | ||
| 171 | - | ||
| 172 | -.sp .sp_top .s_top1_kill{ | 148 | +.sp .sp_top .s_top1_kill { |
| 173 | position: absolute; | 149 | position: absolute; |
| 174 | -background-color:#C4182E; | ||
| 175 | -font-size:24rpx; | ||
| 176 | -height:38rpx; | ||
| 177 | -line-height:38rpx; | ||
| 178 | -left:265rpx; | ||
| 179 | -top:100rpx; | ||
| 180 | -padding:0 10rpx; | ||
| 181 | -color:white; | ||
| 182 | -border-radius:10rpx; | ||
| 183 | - | 150 | + background-color: #c4182e; |
| 151 | + font-size: 24rpx; | ||
| 152 | + height: 38rpx; | ||
| 153 | + line-height: 38rpx; | ||
| 154 | + left: 265rpx; | ||
| 155 | + top: 100rpx; | ||
| 156 | + padding: 0 10rpx; | ||
| 157 | + color: white; | ||
| 158 | + border-radius: 10rpx; | ||
| 184 | } | 159 | } |
| 185 | 160 | ||
| 186 | -.sp .sp_top .s_top2_kill{ | 161 | +.sp .sp_top .s_top2_kill { |
| 187 | position: absolute; | 162 | position: absolute; |
| 188 | -background-color:#C4182E; | ||
| 189 | -font-size:24rpx; | ||
| 190 | -height:38rpx; | ||
| 191 | -line-height:38rpx; | ||
| 192 | -right:146rpx; | ||
| 193 | -top:100rpx; | ||
| 194 | -padding:0 10rpx; | ||
| 195 | -color:white; | ||
| 196 | -border-radius:10rpx; | ||
| 197 | - | 163 | + background-color: #c4182e; |
| 164 | + font-size: 24rpx; | ||
| 165 | + height: 38rpx; | ||
| 166 | + line-height: 38rpx; | ||
| 167 | + right: 146rpx; | ||
| 168 | + top: 100rpx; | ||
| 169 | + padding: 0 10rpx; | ||
| 170 | + color: white; | ||
| 171 | + border-radius: 10rpx; | ||
| 198 | } | 172 | } |
| 199 | 173 | ||
| 200 | - | ||
| 201 | - | ||
| 202 | -.sp .sp_top .s_foot1_kill{ | 174 | +.sp .sp_top .s_foot1_kill { |
| 203 | font-size: 20rpx; | 175 | font-size: 20rpx; |
| 204 | position: absolute; | 176 | position: absolute; |
| 205 | - top:270rpx; | ||
| 206 | - width: 210rpx; | ||
| 207 | - height: 38rpx; | ||
| 208 | - line-height: 38rpx; | ||
| 209 | - color: #fff; | ||
| 210 | - text-align: center; | ||
| 211 | - background-color: rgba(0, 0, 0, 0.5); | 177 | + top: 270rpx; |
| 178 | + width: 210rpx; | ||
| 179 | + height: 38rpx; | ||
| 180 | + line-height: 38rpx; | ||
| 181 | + color: #fff; | ||
| 182 | + text-align: center; | ||
| 183 | + background-color: rgba(0, 0, 0, 0.5); | ||
| 212 | } | 184 | } |
| 213 | 185 | ||
| 214 | -.po1{ | 186 | +.po1 { |
| 215 | position: absolute; | 187 | position: absolute; |
| 216 | } | 188 | } |
| 217 | 189 | ||
| 218 | - | ||
| 219 | -.sp .sp_top .s_foot2_kill{ | 190 | +.sp .sp_top .s_foot2_kill { |
| 220 | font-size: 20rpx; | 191 | font-size: 20rpx; |
| 221 | position: absolute; | 192 | position: absolute; |
| 222 | - top:270rpx; | ||
| 223 | - width: 210rpx; | ||
| 224 | - height: 38rpx; | ||
| 225 | - line-height: 38rpx; | ||
| 226 | - color: #fff; | ||
| 227 | - text-align: center; | ||
| 228 | - background-color: rgba(0, 0, 0, 0.5); | 193 | + top: 270rpx; |
| 194 | + width: 210rpx; | ||
| 195 | + height: 38rpx; | ||
| 196 | + line-height: 38rpx; | ||
| 197 | + color: #fff; | ||
| 198 | + text-align: center; | ||
| 199 | + background-color: rgba(0, 0, 0, 0.5); | ||
| 229 | } | 200 | } |
| 230 | 201 | ||
| 231 | - | ||
| 232 | - | ||
| 233 | - | ||
| 234 | - | ||
| 235 | - | ||
| 236 | - | ||
| 237 | -.sp2{ | 202 | +.sp2 { |
| 238 | width: 100%; | 203 | width: 100%; |
| 239 | min-height: 240rpx; | 204 | min-height: 240rpx; |
| 240 | - | ||
| 241 | } | 205 | } |
| 242 | 206 | ||
| 243 | -.sp2 .one1{ | ||
| 244 | - width: 100%; | 207 | +.sp2 .one1 { |
| 245 | background-color: white; | 208 | background-color: white; |
| 246 | - height: 252rpx; | 209 | + height: 285rpx; |
| 247 | display: flex; | 210 | display: flex; |
| 248 | - padding: 20rpx; | ||
| 249 | - border-bottom:6rpx#eee solid; | ||
| 250 | - | 211 | + padding:0rpx 20rpx; |
| 212 | + border-bottom: 6rpx#eee solid; | ||
| 213 | + align-items: center; | ||
| 251 | } | 214 | } |
| 252 | 215 | ||
| 253 | -.sp2 .one1 .o1_img{ | ||
| 254 | - width: 200rpx; | ||
| 255 | - height: 240rpx; | ||
| 256 | - | ||
| 257 | - margin-right: 24rpx; | 216 | +.sp2 .one1 .o1_img { |
| 217 | + width: 220rpx; | ||
| 218 | + height: 220rpx; | ||
| 219 | + margin-right: 25rpx; | ||
| 258 | } | 220 | } |
| 259 | 221 | ||
| 260 | -.o1_right .sp_wzi{ | 222 | +.o1_right .sp_wzi { |
| 261 | font-size: 36rpx; | 223 | font-size: 36rpx; |
| 262 | - margin-bottom:6rpx; | ||
| 263 | - | ||
| 264 | - width: 100%; | 224 | + margin-bottom: 6rpx; |
| 265 | text-align: left; | 225 | text-align: left; |
| 266 | padding: 4rpx 0; | 226 | padding: 4rpx 0; |
| 267 | - overflow: hidden; | ||
| 268 | height: 48rpx; | 227 | height: 48rpx; |
| 228 | + overflow: hidden; | ||
| 229 | + white-space: nowrap; | ||
| 269 | text-overflow: ellipsis; | 230 | text-overflow: ellipsis; |
| 270 | - white-space: nowrap | ||
| 271 | } | 231 | } |
| 272 | 232 | ||
| 273 | -.o1_right .o1_sj_kill{ | 233 | +.o1_right .o1_sj_kill { |
| 274 | height: 60rpx; | 234 | height: 60rpx; |
| 275 | - | ||
| 276 | margin-bottom: 10rpx; | 235 | margin-bottom: 10rpx; |
| 277 | } | 236 | } |
| 278 | 237 | ||
| 279 | -.o1_right .o1_sj_kill text{ | 238 | +.o1_right .o1_sj_kill text { |
| 280 | background-color: #fdcb08; | 239 | background-color: #fdcb08; |
| 281 | text-align: center; | 240 | text-align: center; |
| 282 | border-radius: 10rpx; | 241 | border-radius: 10rpx; |
| 283 | - padding:4rpx; | ||
| 284 | -margin-left:6rpx; | ||
| 285 | - | 242 | + padding: 4rpx; |
| 243 | + margin-left: 6rpx; | ||
| 286 | } | 244 | } |
| 287 | 245 | ||
| 288 | - | ||
| 289 | - | ||
| 290 | -.o1_right .sp_jg{ | ||
| 291 | - color: #C4182E; | 246 | +.o1_right .sp_jg { |
| 247 | + color: #c4182e; | ||
| 292 | font-size: 36rpx; | 248 | font-size: 36rpx; |
| 293 | - | ||
| 294 | overflow: hidden; | 249 | overflow: hidden; |
| 295 | display: inline-block; | 250 | display: inline-block; |
| 296 | margin-right: 10rpx; | 251 | margin-right: 10rpx; |
| 297 | } | 252 | } |
| 298 | 253 | ||
| 299 | -.o1_right .sp_jgx{ | 254 | +.o1_right .sp_jgx { |
| 300 | color: #dcdcdc; | 255 | color: #dcdcdc; |
| 301 | text-decoration: line-through; | 256 | text-decoration: line-through; |
| 302 | font-size: 26rpx; | 257 | font-size: 26rpx; |
| 303 | - | ||
| 304 | overflow: hidden; | 258 | overflow: hidden; |
| 305 | display: inline-block; | 259 | display: inline-block; |
| 306 | } | 260 | } |
| 307 | 261 | ||
| 308 | - | ||
| 309 | -.o1_img image{ | ||
| 310 | - width: 100%; | ||
| 311 | - height: 100%; | ||
| 312 | - | ||
| 313 | - position:relative; | ||
| 314 | -top:-23rpx; | ||
| 315 | -left:0rpx; | ||
| 316 | - | 262 | +.o1_img image { |
| 263 | + width: 220rpx; | ||
| 264 | + height: 220rpx; | ||
| 317 | } | 265 | } |
| 318 | - | ||
| 319 | -.o1_right .wo{ | ||
| 320 | - background-color: #C4182E; | 266 | +.o1_right{ |
| 267 | + width: 465rpx; | ||
| 268 | +} | ||
| 269 | +.o1_right .wo { | ||
| 270 | + background-color: #c4182e; | ||
| 321 | width: 160rpx; | 271 | width: 160rpx; |
| 322 | height: 60rpx; | 272 | height: 60rpx; |
| 323 | line-height: 60rpx; | 273 | line-height: 60rpx; |
| 324 | color: white; | 274 | color: white; |
| 325 | text-align: center; | 275 | text-align: center; |
| 326 | - font-size: 38rpx; | ||
| 327 | - margin-left:298rpx; | ||
| 328 | -border-radius:14rpx; | ||
| 329 | -padding-left: 10rpx; | ||
| 330 | -padding-right: 10rpx; | 276 | + font-size: 32rpx; |
| 277 | + border-radius: 14rpx; | ||
| 331 | } | 278 | } |
| 332 | - | ||
| 333 | - | ||
| 334 | - | 279 | +.rob{ |
| 280 | + display: flex; | ||
| 281 | + justify-content: flex-end; | ||
| 282 | +} | ||
| 283 | +.money{ | ||
| 284 | + display: flex; | ||
| 285 | + align-items: center; | ||
| 286 | +} | ||
| 335 | \ No newline at end of file | 287 | \ No newline at end of file |