index.wxml

<!-- 商品列表item -->
<view
 class="goodsItem {{datas.componentData.style==='rowList'?'goodsRowList':''}} {{datas.componentData.style==='heap'?'goodsRowList goodsHeapItem':''}}"
 style="--proGap2:{{datas.componentData.proGap*2}}rpx;"
 bindtap="onclickProduct"
>
	<view class="goods-item-child {{datas.componentData['borderColorShow']?'goods-item-child-bd':''}}" style="border-radius:{{datas.componentData.borderRadius}}em;--border_color:{{datas.componentData['borderColor']}};box-shadow:{{datas.componentData['cardShadow']?'0rpx 0rpx 10rpx '+datas.componentData['cardShadowSize']*2+'rpx #ccc':''}};">
		<!-- 商品图片 -->
		<view class="imgBox" style="background-color:{{datas.componentData['backgroundColorShow']?datas.componentData['backgroundColor']:''}}">
			<view
			 class="goodsPicture"
			 wx:if="{{items!=null}}"
			 style="padding:{{datas.componentData.imgSize}}"
			>
				<!-- 显示拼团数 -->
				<view class="have-group" wx:if="{{datas.componentData['haveGroupShow']&& (items && items['groupBuyFlag'] == '1')}}">{{items.haveGroupNum?items.haveGroupNum:0}}人已团</view>
				<!-- 商品角标 -->
				<view
				 class="angleSign"
				 style="width:{{datas.componentData.angleSignSize}}%;height:{{datas.componentData.angleSignSize}}%;"
				 wx:if="{{datas.componentData['angleSign'] && datas.componentData['angleSignImg']}}"
				>
					<image mode="widthFix" src="{{datas.componentData['angleSignImg']}}" />
				</view>
				<!-- 商品主图 -->
				<image
				 lazy-load
				 mode="{{datas.componentData.style==='rowList' || datas.componentData.style==='heap'?'aspectFit':'widthFix'}}"
				 class="productImgUrl"
				 wx:if="{{datas.componentData.goodsImgType == 1}}"
				 src="{{items.productImgUrl}}"
				/>
				<image
				 lazy-load
				 mode="{{datas.componentData.style==='rowList' || datas.componentData.style==='heap'?'aspectFit':'widthFix'}}"
				 class="productImgUrl"
				 wx:else
				 src="{{items.coverImage}}"
				/>
				<!-- 售罄遮罩 -->
				<view class="whiteBg" wx:if="{{items&&items.oversoldFlag==0&&items.totalQty-0<=0}}">
					<view class="cover">
						<image mode="aspectFit" src="http://mayi-newshop.oss-cn-shanghai.aliyuncs.com/public/png/f254fe62-6dda-46f6-a2f4-a7b2aa0474df.png" />
					</view>
				</view>
			</view>
		</view>
		<!-- 商品详情 -->
		<view class="info" style="text-align:{{datas.componentData['initcharAlign']}};">
			<view class="info-top flex">
				<view
				 class="name"
				 wx:if="{{datas.componentData['nameShow']}}"
				 style="color:{{datas.componentData['nameColor']}};font-weight:{{datas.componentData['nameFontWeight']}};font-size:{{datas.componentData['nameFontSize']}}em;height:2.8em;"
				>
					{{items!=null?items['productName']:'名称'}}
				</view>
				<view
				 class="follower-wrap"
				 wx:if="{{datas.componentData['followerShow']}}"
				 style="padding-left:{{datas.componentData.columnNum == 3 ? '0' : '20rpx'}}"
				>
					<view class="follower-num" style="color:{{datas.componentData['followerColor']?datas.componentData['followerColor']:'#ff9933'}};">
						{{items!=null? items['totalCollectionCount']:0}}
					</view>
					<view class="follower-text">关注人数</view>
				</view>
			</view>
			<!-- 已售 -->
			<view class="Sold">
				<text wx:if="{{datas.componentData['alSaleShow']}}">已售{{items!=null ? items['totalSalesCount'] :0}}件</text>
				<text wx:if="{{datas.componentData['alSaleShow'] && datas.componentData['collectShow']}}">/</text>
				<text wx:if="{{datas.componentData['collectShow']}}">剩余{{items!=null && items['qty']!=undefined ? (items['qty'] > 0 ? items['qty']: items.oversoldFlag==1?'数量充足':'数量不足') : ''}}<text wx:if="{{items!=null && (items['qty'] ? items['qty'] >= 0 : items['saleQty'] >= 0) && items.oversoldFlag!=1}}">件</text>
				</text>
			</view>
			<!-- 标签 -->
			<view class="marketing flex" wx:if="{{datas.componentData['marketingTag']&&datas.componentData['marketingStyle']==0&&items.marketingTag}}">
				<view
				 class="item"
				 wx:for="{{items.marketingTag}}"
				 wx:key="index"
				>
					{{item.label}}
				</view>
			</view>
			<!-- 底部 -->
			<view class="bottom" wx:if="{{datas.componentData['goodsType'] !=1}}">
				<!-- 价格 -->
				<view class="priceItem flex">
					<view
					 class="price flex"
					 style="color:{{datas.componentData['priceColor']}};font-size:{{datas.componentData['priceFontSize']}}em;"
					 wx:if="{{datas.componentData['priceShow']}}"
					>
						<text wx:if="{{items!=null && (items['groupBuyFlag'] == '0' ||items['groupBuyFlag'] == '1')}}">
							￥{{items!=null ? items['goodsMinPrice']:0}}
						</text>
						<text style="font-size:24rpx;color:#999;text-decoration:line-through;" wx:if="{{items!=null&&datas.componentData['priceMarking']&&items['minGoodsSuggestedRetailPrice']&&(items['goodsMinPrice']-0<items['minGoodsSuggestedRetailPrice']-0)&&datas.componentData['columnNum']<3}}">
							￥{{items['minGoodsSuggestedRetailPrice']}}
						</text>
					</view>
					<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="{{items.showVipTag==true}}">
							{{items["recommendedCardMinPricePriceTableName"]}}
						</view>
					</view>
				</view>
				<!-- 收益样式一 -->
				<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>
					</view>
				</block>
				<view wx:if="{{(items&&items.totalQty-0>0||items&&items.oversoldFlag==1)&& datas.componentData['paynow']}}" catchtap="onclickBuynow">
					<text wx:if="{{datas.componentData.btnType<6}}" style="color:{{datas.componentData.btnColor}}" class="buy-now-icon iconfont-common {{datas.componentData.btnIcon}}"></text>
					<view
					 wx:else
					 class="buy-now"
					 style="background-color:{{datas.componentData.btnColor}};font-size:24rpx;"
					>
						{{datas.componentData.btnTest}}
					</view>
				</view>
			</view>
			<!-- 底部展示标签列表 -->
			<block wx:if="{{items!=null}}">
				<view class="marketing flex" wx:if="{{datas.componentData.marketingTag&&datas.componentData.marketingStyle==1&&items.marketingTag}}">
					<view
					 class="item"
					 wx:for="{{items.marketingTag}}"
					 wx:key="index"
					>
						{{item.label}}
					</view>
				</view>
			</block>
			<!-- 收益样式二 -->
			<block wx:if="{{items!=null&&items['minProductGoodsCommission']&&items['minProductGoodsCommission']-0>0.01}}">
				<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>
		</view>
	</view>
</view>