自定义组件商品分组优化

前端开发-罗建龙
1 parent 8987935b
Showing 2 changed files with 14 additions and 13 deletions
components/diy_goodsGroup/diy_goodsGroup.wxml
components/diy_goodsGroup/diy_goodsGroup.wxss
@@ -11,17 +11,17 @@
     <view  class="{{'tabBox ' + (object.menu_style==2 ? 'tab2' :'')}}">
       <!--样式一-->
       <block wx:if="{{object.menu_style==1}}">
-        <view wx:if="{{object.show_all==1}}" style="padding: 0 35rpx;" class="{{'tab ' + (title_index == 10 ? 'clor ' :'')}}" >全部<span class="tab1" wx:if="{{10==title_index}}"></span></view>
-        <view wx:for="{{object.nav_list}}" style="padding: 0 35rpx;" data-index="{{index}}" bindtap="gr_set_nav" data-idlist="{{item.idlist}}" data-wgroup="{{item.wgroup}}" data-classstyle="{{item.classstyle}}" class="{{'tab ' + (index==title_index ? 'clor ' :'')}}">{{item.title}}<span class="tab1" wx:if="{{index==title_index}}"></span></view>
+        <view wx:if="{{object.show_all==1}}" style="padding: 0 35rpx;font-size: {{object.title_font_size*2}}rpx;color: {{object.title_color}};" class="{{'tab ' + (title_index == 10 ? 'clor ' :'')}}" >全部<span class="tab1" wx:if="{{10==title_index}}"></span></view>
+        <view wx:for="{{object.nav_list}}" style="padding: 0 35rpx;font-size: {{object.title_font_size*2}}rpx;color: {{object.title_color}};" data-index="{{index}}" bindtap="gr_set_nav" data-idlist="{{item.idlist}}" data-wgroup="{{item.wgroup}}" data-classstyle="{{item.classstyle}}" class="{{'tab ' + (index==title_index ? 'clor ' :'')}}">{{item.title}}<span class="tab1" wx:if="{{index==title_index}}"></span></view>
       </block>
       <!--样式二-->
       <block wx:if="{{object.menu_style==2}}">       
-        <view wx:for="{{object.nav_list}}" data-index="{{index}}" bindtap="gr_set_nav" data-idlist="{{item.idlist}}" data-wgroup="{{item.wgroup}}" data-classstyle="{{item.classstyle}}"  class="{{'tab ' + (index==title_index ? 'tab_action' : '')}}"> {{item.title}}</view>
+        <view wx:for="{{object.nav_list}}" style="font-size: {{object.title_font_size*2}}rpx;color: {{object.title_color}};" data-index="{{index}}" bindtap="gr_set_nav" data-idlist="{{item.idlist}}" data-wgroup="{{item.wgroup}}" data-classstyle="{{item.classstyle}}"  class="{{'tab ' + (index==title_index ? 'tab_action' : '')}}"> {{item.title}}</view>
       </block>
       <!--样式三-->
       <block wx:if="{{object.menu_style==3}}">
         <view wx:for="{{object.nav_list}}"  class="tab ">
-          <view class="{{'tab3 ' + (index==title_index ? 'tab_action' : '')}}" data-index="{{index}}" bindtap="gr_set_nav" data-idlist="{{item.idlist}}" data-wgroup="{{item.wgroup}}" data-classstyle="{{item.classstyle}}">
+          <view class="{{'tab3 ' + (index==title_index ? 'tab_action' : '')}}" style="font-size: {{object.title_font_size*2}}rpx;color: {{object.title_color}};" data-index="{{index}}" bindtap="gr_set_nav" data-idlist="{{item.idlist}}" data-wgroup="{{item.wgroup}}" data-classstyle="{{item.classstyle}}">
             {{item.title}}
           </view>
         </view>
@@ -50,7 +50,7 @@
     <block wx:if="{{goods_array.length > 0  }}">
       <!-- 大图模式 -->
       <block wx:if="{{object.style==1}}">
-        <view style="{{'padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'}}" class="{{'new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
+        <view style="{{'padding-top:'+object.product_spacing+'px;padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'+(object.product_style==2 ? ('background-color:'+object.bg_color) :'' )}}" class="{{'new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
           <!-- <block wx:for="{{goods_array}}"> -->
           <view wx:for="{{goods_array}}" wx:for-item="aitem" wx:for-index="aind" class="{{'new_item1 ' + (object.product_style==2 ? ' boxsha ':'') + (object.product_style==3 ? ' aborder ':'')   + ((object.product_style==1 || object.product_style==3 )? ' bgf ':'') + (object.chamfer_of_main_drawing==2 ? ' but_radius5 ':'') }}" style="{{'margin-bottom:'+object.product_spacing+'px;'}}">
             <navigator url="{{g_filter.get_url_by_type(aitem)}}" class="s1_gk_a1">
@@ -91,7 +91,7 @@
       </block>
       <!-- 一行两个 -->
       <block wx:if="{{object.style==2}}">
-        <view style="{{'padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')  }}">
+        <view style="{{'padding-top:'+object.product_spacing+'px;padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'+(object.product_style==2 ? ('background-color:'+object.bg_color) :'' )}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')  }}">
           <!-- <block wx:for="{{goods_array}}"> -->
             <view wx:for="{{goods_array}}" wx:for-item="aitem" wx:for-index="aind" class="{{'boxpad new_item1 ' + (object.product_style==2 ? ' boxsha ':'') + (object.product_style==3 ? ' aborder ':'')   + ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')+ (object.chamfer_of_main_drawing==2 ? ' but_radius5 ':'')}}" style="{{'margin-bottom:'+object.product_spacing+'px; '+('width:calc(100%/2 - ' + object.product_spacing/2+'px)')}}">
               <navigator url="{{g_filter.get_url_by_type(aitem)}}" class="s1_gk_a1">
@@ -139,7 +139,7 @@
       </block>
       <!-- 一行三个 -->
       <block wx:if="{{object.style==3}}">
-        <view style="{{'padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
+        <view style="{{'padding-top:'+object.product_spacing+'px;padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'+(object.product_style==2 ? ('background-color:'+object.bg_color) :'' )}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
           <!-- <block wx:for="{{goods_array}}"> -->
             <view wx:for="{{goods_array}}" wx:for-item="aitem" wx:for-index="aind" class="{{'boxpad new_item1 ' + (object.product_style==2 ? ' boxsha ':'') + (object.product_style==3 ? ' aborder ':'')   + ((object.product_style==1 || object.product_style==3 )? ' bgf ':'') + (object.chamfer_of_main_drawing==2 ? ' but_radius5 ':'') }}" style="{{'margin-bottom:'+object.product_spacing+'px; '+('width:calc(100%/3 - ' + (object.product_spacing*2)/3+'px)')}}">
               <navigator url="{{g_filter.get_url_by_type(aitem)}}" class="s1_gk_a1">
@@ -187,7 +187,7 @@
       </block>
       <!-- 详细列表 -->
       <block wx:if="{{object.style==4}}">
-        <view style="{{'padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')  }}">
+        <view style="{{'padding-top:'+object.product_spacing+'px;padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'+(object.product_style==2 ? ('background-color:'+object.bg_color) :'' )}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')  }}">
           <!-- <block wx:for="{{goods_array}}"> -->
             <view wx:for="{{goods_array}}" wx:for-item="aitem" wx:for-index="aind" class="{{'boxpad new_item1 ' + (object.product_style==2 ? ' boxsha ':'') + (object.product_style==3 ? ' aborder ':'')  + ((object.product_style==1 || object.product_style==3 )? ' bgf ':'') + (object.chamfer_of_main_drawing==2 ? ' but_radius5 ':'') }}" style="{{'margin-bottom:'+object.product_spacing+'px;'}}">
               <navigator style="display: flex;" url="{{g_filter.get_url_by_type(aitem)}}" class="s1_gk_a1">
@@ -235,7 +235,7 @@
       </block>
       <!-- 一大一小 -->
       <block wx:if="{{object.style==5}}">
-        <view style="{{'padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
+        <view style="{{'padding-top:'+object.product_spacing+'px;padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'+(object.product_style==2 ? ('background-color:'+object.bg_color) :'' )}}" class="{{'flex2 new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
           <block wx:for="{{goods_array}}">
             <block wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind">
               <view wx:if="{{aind==0}}" class="{{'new_item1 ' + (object.product_style==2 ? ' boxsha ':'') + (object.product_style==3 ? ' aborder ':'')  + (object.chamfer_of_main_drawing==2 ? ' but_radius5 ':'')  + ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}" style="{{'margin-bottom:'+object.product_spacing+'px;'}}">
@@ -413,7 +413,7 @@
  
       </block>
       <!-- 横向滑动 3个-->
-      <block wx:if="{{object.style==6}}">
+      <view wx:if="{{object.style==6}}" style="padding-top:{{object.product_spacing}}px;{{(object.product_style==2 ? ('background-color:'+object.bg_color) :'' )}}">
         <!-- <swiper indicator-dots circular> -->
         <swiper indicator-dots style="{{'padding-left:'+object.page_margins+'px;padding-right:'+object.page_margins+'px;'+(swiperHeight ? ('height:'+swiperHeight+';'):'' )}}" class="{{' new_item1_box '+ ((object.product_style==1 || object.product_style==3 )? ' bgf ':'')}}">
           <swiper-item wx:for="{{goods_array}}"  class="flex2" style="padding: 5rpx;">
@@ -459,7 +459,7 @@
         </swiper>
         <!-- </swiper> -->
  
-      </block>
+      </view>
  
       <block wx:if="{{object.style!=6}}">
         <block wx:if="{{classstyle_id=='1' }}">
@@ -1025,6 +1025,7 @@ top: 10rpx;
 .boxsha{
   /* box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25); */
   /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
+  background-color: #fff;
   box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
 }
 .but_radius85{
@@ -1151,7 +1152,7 @@ top: 10rpx;
 		font-size: 28rpx;
 		font-weight: bold;
     overflow-x: auto;
-    margin-bottom: 20rpx;
+    /* margin-bottom: 20rpx; */
 		/* min-width: 25%; */
   }
  
@@ -1188,7 +1189,7 @@ top: 10rpx;
 	}
 	.tab_action{
 		background-color: #f23030;
-    color: #fff;
+    color: #fff !important;
     border: none !important;
     opacity: .8;
 		/* border-color: #f23030 !important; */