Authored by 李奇

商品列表筛选组件修改

1 <view class="product-list-filter"> 1 <view class="product-list-filter">
2 <ul class="filter-items" bindtap="sortChange"> 2 <ul class="filter-items" bindtap="sortChange">
3 - <li class="item {{curSortType == 'def' ? 'active' : ''}}" data-sort="def">默认</li> 3 + <li class="item {{curSortType == 'def' ? 'active' : ''}} default" data-sort="def">
  4 + 默认
  5 + <image class="item-icon" wx:if="{{curSortType == 'def'}}"
  6 + src="../../static/icons/triangle_active@2x.png"></image>
  7 + <image class="item-icon" wx:if="{{curSortType != 'def'}}"
  8 + src="../../static/icons/triangle_normal@2x.png"></image>
  9 + </li>
4 <li class="item {{curSortType == 'time' ? 'active' : ''}}" data-sort="time">新品</li> 10 <li class="item {{curSortType == 'time' ? 'active' : ''}}" data-sort="time">新品</li>
5 <li class="item {{curSortType == 'popular' ? 'active' : ''}}" data-sort="popular">人气</li> 11 <li class="item {{curSortType == 'popular' ? 'active' : ''}}" data-sort="popular">人气</li>
6 - <li class="item {{curSortType == 'price' ? 'active' : ''}}" data-sort="price">价格</li>  
7 - <li class="item {{curGender ? 'active' : ''}}" catchtap="subFilterGenderTap">{{subFilterText}}</li> 12 + <li class="item {{curSortType == 'price' ? 'active' : ''}}" data-sort="price">
  13 + 价格
  14 + <image class="item-icon" wx:if="{{curSortField != 's_p_asc' && curSortField != 's_p_desc'}}"
  15 + src="../../static/icons/db_arrow_normal@2x.png"></image>
  16 + <image class="item-icon" wx:if="{{curSortField == 's_p_desc'}}"
  17 + src="../../static/icons/db_down_active@2x.png"></image>
  18 + <image class="item-icon" wx:if="{{curSortField == 's_p_asc'}}"
  19 + src="../../static/icons/db_up_active@2x.png"></image>
  20 + </li>
  21 + <li class="item {{curGender ? 'active' : ''}}" catchtap="subFilterGenderTap">
  22 + {{subFilterText}}
  23 + <image class="item-icon" wx:if="{{curGender == ''}}"
  24 + src="../../static/icons/sg_down_normal@2x.png"></image>
  25 + <image class="item-icon" wx:if="{{curGender != ''}}"
  26 + src="../../static/icons/sg_down_active@2x.png"></image>
  27 + </li>
8 </ul> 28 </ul>
9 <view wx:if="{{showSubGender}}" class="sub-gender" bindtap="selectGenderTap"> 29 <view wx:if="{{showSubGender}}" class="sub-gender" bindtap="selectGenderTap">
10 <view class="gender-item {{curGender == '1,3' ? 'active' : ''}}" data-gender="1,3">男生/BOYS</view> 30 <view class="gender-item {{curGender == '1,3' ? 'active' : ''}}" data-gender="1,3">男生/BOYS</view>
@@ -19,6 +19,26 @@ @@ -19,6 +19,26 @@
19 letter-spacing: 0.33px; 19 letter-spacing: 0.33px;
20 } 20 }
21 21
  22 +.product-list-filter .item .item-icon {
  23 + position: absolute;
  24 + height: 28rpx;
  25 + width: 20rpx;
  26 + top: 50%;
  27 + left: 50%;
  28 + margin-top: -14rpx;
  29 + margin-left: 34rpx;
  30 +}
  31 +
  32 +.product-list-filter .item.default .item-icon{
  33 + position: absolute;
  34 + height: 10rpx;
  35 + width: 18rpx;
  36 + top: 50%;
  37 + left: 50%;
  38 + margin-top: -5rpx;
  39 + margin-left: 34rpx;
  40 +}
  41 +
22 .product-list-filter .item:after { 42 .product-list-filter .item:after {
23 display: inline-block; 43 display: inline-block;
24 content: ''; 44 content: '';
@@ -14,7 +14,8 @@ Component({ @@ -14,7 +14,8 @@ Component({
14 indicatorDots: false, 14 indicatorDots: false,
15 interval: 5000, 15 interval: 5000,
16 autoplay: true, 16 autoplay: true,
17 - duration: 1000, 17 + duration: 500,
  18 + circular: true,
18 swiperCurrent: 0 19 swiperCurrent: 0
19 }, 20 },
20 methods: { 21 methods: {
1 <wxs src="../../../wxs/helper.wxs" module="helper" /> 1 <wxs src="../../../wxs/helper.wxs" module="helper" />
2 <view class="resource-focus"> 2 <view class="resource-focus">
3 <swiper class="swiper-wrapper" indicator-dots="{{indicatorDots}}" 3 <swiper class="swiper-wrapper" indicator-dots="{{indicatorDots}}"
4 - autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" bindchange="swiperChange"> 4 + autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"
  5 + circular="{{circular}}" bindchange="swiperChange">
5 <block wx:for="{{swiperList}}" wx:key="{{index}}"> 6 <block wx:for="{{swiperList}}" wx:key="{{index}}">
6 <swiper-item> 7 <swiper-item>
7 <anchor url="{{item.url}}"> 8 <anchor url="{{item.url}}">