1、商品列表组件会员价功能展示

static/nativeComponents/GoodsList/GoodsItem/index.wxml

@@ -49,13 +49,13 @@
 				</view>
 				<!-- 商品主图 -->
 				<image
-				 mode="aspectFit"
+				 mode="{{datas.componentData.style==='rowList'?'aspectFit':'widthFix'}}"
 				 class="productImgUrl"
 				 wx:if="{{datas.componentData.goodsImgType == 1}}"
 				 src="{{items.productImgUrl}}"
 				/>
 				<image
-				 mode="aspectFit"
+				 mode="{{datas.componentData.style==='rowList'?'aspectFit':'widthFix'}}"
 				 class="productImgUrl"
 				 wx:else
 				 src="{{items.coverImage}}"
@@ -118,19 +118,23 @@
 							￥{{items['minGoodsSuggestedRetailPrice']}}
 						</text>
 					</view>
-					<view class="vipPrice2 flex">
-						<view class="left" wx:if="{{showVipPrice(index)==true}}">
+					<view class="vipPrice2 flex" wx:if="{{datas.componentData.vipPrice}}">
+						<view class="left" wx:if="{{items.showVipPrice==true}}">
 							￥{{items['minPriceAfterRecommendedCardPriceTable']}}
 						</view>
-						<view class="vipIcon line-clamp1" wx:if="{{showVipTag(index)==true}}">
+						<view class="vipIcon line-clamp1" wx:if="{{items.showVipTag==true}}">
 							{{items["recommendedCardMinPricePriceTableName"]}}
 						</view>
 					</view>
 				</view>
 				<!-- 收益样式一 -->
-				<block class="" wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}">
-					<view class="showCommission" wx:if="{{datas.componentData.commissionStyle==0}}">
-						<view class="commission-box">
+				<block wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}">
+					<view
+					 class="showCommission"
+					 style="color:{{datas.componentData.commissionColor}};border-color:{{datas.componentData.commissionColor}};"
+					 wx:if="{{datas.componentData.commissionStyle==0}}"
+					>
+						<view class="commission-box" style="background-color:{{datas.componentData.commissionBgColor}}">
 							<text>收益</text>
 							<text>￥{{items['minProductGoodsCommission']}}</text>
 						</view>
@@ -169,14 +173,15 @@
 			</block>
 			<!-- 收益样式二 -->
 			<block wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}">
-				<view class="showCommissionTwo flex" wx:if="{{datas.componentData.commissionStyle==1}}">
-					<view class="commission-box">
-						<text class="iconfont-common common-iconfenxiang">
-								赚￥
-								<text style="font-size:32rpx;">
-									{{items['minProductGoodsCommission']}}
-								</text>
-						</text>
+				<view
+				 class="showCommissionTwo flex"
+				 wx:if="{{datas.componentData.commissionStyle==1}}"
+				 style="color:{{datas.componentData.commissionColor}};border-color:{{datas.componentData.commissionColor}};"
+				>
+					<view class="commission-box" style="background-color:{{datas.componentData.commissionBgColor}}">
+						<text class="iconfont-common common-iconfenxiang"></text>
+						<text style="padding:0 8rpx;">赚￥</text>
+						<text style="font-size:32rpx;">{{items['minProductGoodsCommission']}}</text>
 					</view>
 				</view>
 			</block>

static/nativeComponents/GoodsList/GoodsItem/index.wxss

@@ -18,11 +18,11 @@ image{
   overflow: hidden;
   background: #ffffff;
 }
-.goodsItem .goods-item-child{
+.goodsRowList .goods-item-child{
 display: flex;
 align-items: flex-start;
 }
-.goodsItem .goods-item-child .imgBox{
+.goodsRowList .goods-item-child .imgBox{
   width: auto;
   width: 180rpx;
   height: 180rpx;
@@ -34,7 +34,7 @@ align-items: flex-start;
   -ms-border-radius: 12rpx;
   -o-border-radius: 12rpx;
 }
-.goodsItem .goods-item-child .info{
+.goodsRowList .goods-item-child .info{
   flex: 1;
   display: flex;
   flex-direction: column;
@@ -271,6 +271,28 @@ align-items: flex-start;
   bottom: 0;
   font-size: 36rpx;
 }
+.showCommission {
+  width: auto;
+  display: inline-block;
+  margin-top: 8rpx;
+  border: 1px solid transparent;
+  border-radius: 12rpx;
+  font-size: 10px;
+  overflow: hidden;
+  -webkit-border-radius: 12rpx;
+  -moz-border-radius: 12rpx;
+  -ms-border-radius: 12rpx;
+  -o-border-radius: 12rpx;
+}
+.showCommission .commission-box {
+  box-sizing: border-box;
+  padding: 0 10rpx;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
 .showCommissionTwo {
   align-items: center;
   justify-content: center;

static/nativeComponents/GoodsList/index.js

@@ -118,7 +118,7 @@ const componentOptions = {
             .marketingTag
             ? 1
             : 0, //是否展示营销标签  1是  0否
-          whetherFindMultiShopFlag: 1, //是否查询多商户   //商城使用
+          whetherFindMultiShopFlag: 1 //是否查询多商户   //商城使用
         };
         goodsApi.queryProductInfo(query).then(res => {
           if (res.data.code == 200) {
@@ -149,9 +149,8 @@ const componentOptions = {
       await goodsApi.queryBriefProductInfo(query).then(res => {
         if (res.data.code == 200) {
           let data = res.data.data.list;
-          let ids = data.map(element => {let goodsList = this.render
-              ? res.data.list
-              : res.data.data.list;
+          let ids = data.map(element => {
+            let goodsList = this.render ? res.data.list : res.data.data.list;
             return element.terminalProductId;
           });
           this.moreProduct(ids);
@@ -163,7 +162,7 @@ const componentOptions = {
         vipPrice,
         marketingTag,
         whetherFindDistributionCommission,
-        goodsList,
+        goodsList
       } = this.data.datas.componentData;
       let moreQuery = {
         terminalProductIds,
@@ -173,7 +172,7 @@ const componentOptions = {
         whetherFindDistributionCommission: whetherFindDistributionCommission, //是否查询商品佣金（0：不查询，1：展示，为空不查佣金）
         whetherFindRecommendedCardFlag: vipPrice ? 1 : 0, //是否查询会员价  1是  0否
         whetherShowGoodsDefaultTagFlag: marketingTag ? 1 : 0, //是否展示营销标签  1是  0否
-        whetherFindMultiShopFlag: 1, //是否查询多商户   //商城使用
+        whetherFindMultiShopFlag: 1 //是否查询多商户   //商城使用
       };
       goodsApi.queryMoreProductInfo(moreQuery).then(res => {
         if (res.data.code == 200) {
@@ -183,9 +182,13 @@ const componentOptions = {
       });
     },
     goodsListVal(goodsList) {
-      goodsList.forEach(item => {
+      console.log(goodsList,"------------goodsListVal")
+      goodsList.forEach((item,index) => {
         item.marketingTag = item.defaultTags
-        ? this.filtermark(item.defaultTags, this.data.datas.componentData.marketingTagList)
+          ? this.filtermark(
+              item.defaultTags,
+              this.data.datas.componentData.marketingTagList
+            )
           : [];
         item.shopLogoUrl = DFSImg(item.shopLogoUrl);
         item.coverImage = DFSImg(item.coverImage);
@@ -194,14 +197,17 @@ const componentOptions = {
         item.qty = Number(item.qty);
         item.saleQty = Number(item.saleQty);
         item.totalCollectionCount = Number(item.totalCollectionCount) || 0;
-        item.totalCollectionCount = Number(item.totalCollectionCount) || 0;
-        item.minPriceAfterRecommendedCardPriceTable =
-          Number(item.minPriceAfterRecommendedCardPriceTable).toFixed(2) || 0;
-        item.minProductGoodsCommission =
-          Number(item.minProductGoodsCommission).toFixed(2) || 0;
-        item.minGoodsSuggestedRetailPrice = Number(
-          item.minGoodsSuggestedRetailPrice
-        ).toFixed(2);
+        item.minPriceAfterRecommendedCardPriceTable = item.minPriceAfterRecommendedCardPriceTable?
+          Number(item.minPriceAfterRecommendedCardPriceTable):"";
+        item.minProductGoodsCommission = item.minProductGoodsCommission?
+          Number(item.minProductGoodsCommission).toFixed(2) : 0;
+        item.minGoodsSuggestedRetailPrice = item
+          .minGoodsSuggestedRetailPrice?Number(
+            item.minGoodsSuggestedRetailPrice
+          )
+            .toFixed(2) : "";
+        item.showVipPrice = this.showVipPrice(item, index);
+        item.showVipTag = this.showVipTag(item, index);
         if (item.saleTime) {
           item.getSaleTime = 0;
           item.getSaleTime = this.getSaleTime(item.saleTime);
@@ -259,8 +265,31 @@ const componentOptions = {
         });
       }
       return list;
+    },
+    showVipPrice(item, index) {
+      // 索引 0 显示价格 1显示名称
+      let showFlag = false;
+      let vipPrice = item["minPriceAfterRecommendedCardPriceTable"];
+      if (vipPrice && Number(vipPrice) < Number(item["minPrice"])) {
+        showFlag = true;
+      }
+      return showFlag;
+    },
+    showVipTag(item,index) {
+      // 索引 0 显示价格 1显示名称
+      let showFlag = false;
+      let vipPrice = item["minPriceAfterRecommendedCardPriceTable"];
+      let showTag = item["recommendedCardMinPricePriceTableName"];
+      if (
+        vipPrice &&
+        showTag &&
+        Number(vipPrice) <= Number(item["minPrice"])
+      ) {
+        showFlag = true;
+      }
+      return showFlag;
     }
-  }
+  },
 };
 
 Component(componentOptions);

static/nativeComponents/GoodsList/index.wxss

@@ -53,7 +53,7 @@ image{
 .goodsItem-list{
   flex-wrap: wrap;
 }
-.goodsItem-list .item{
+.goodsItem-list .goods-item{
   box-sizing: border-box;
 }
 .goods-across{
@@ -80,7 +80,7 @@ image{
 .goods-across .next-btn{
   right: 10px;
 }
-.goods-across .item{
+.goods-across .goods-item{
   flex-shrink: 0;
   display: inline-block;
   box-sizing: border-box;