init
This commit is contained in:
181
miniprogram/pages/goods/details/index.wxml
Normal file
181
miniprogram/pages/goods/details/index.wxml
Normal file
@@ -0,0 +1,181 @@
|
||||
<view class="goods-detail-page">
|
||||
<view class="goods-head">
|
||||
<t-swiper
|
||||
wx:if="{{details.images.length > 0}}"
|
||||
height="750rpx"
|
||||
current="{{current}}"
|
||||
autoplay="{{autoplay}}"
|
||||
duration="{{duration}}"
|
||||
interval="{{interval}}"
|
||||
navigation="{{navigation}}"
|
||||
list="{{details.images}}"
|
||||
></t-swiper>
|
||||
<view class="goods-info">
|
||||
<view class="goods-title">
|
||||
<view class="goods-name">{{details.title}}</view>
|
||||
</view>
|
||||
<view class="goods-number">
|
||||
<view class="goods-price">
|
||||
<price
|
||||
wr-class="class-goods-price"
|
||||
symbol-class="class-goods-symbol"
|
||||
price="{{minSalePrice}}"
|
||||
type="lighter"
|
||||
/>
|
||||
<view class="goods-price-up">起</view>
|
||||
<price wr-class="class-goods-del" price="{{maxLinePrice}}" type="delthrough" />
|
||||
</view>
|
||||
<view class="sales-share-row">
|
||||
<view class="sold-num">已售{{soldNum}}</view>
|
||||
<button class="share-btn-small" open-type="share">
|
||||
<t-icon name="share" size="32rpx" color="#666" />
|
||||
<view class="share-text-small">分享</view>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<view wx:if="{{activityList.length > 0}}" class="goods-activity" bindtap="showPromotionPopup">
|
||||
<view class="tags-container">
|
||||
<view wx:for="{{activityList}}" data-promotionId="{{item.promotionId}}" wx:key="index" wx:if="{{index<4}}">
|
||||
<view class="goods-activity-tag">{{item.tag}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 评论入口 -->
|
||||
<view class="comments-entry" bindtap="navToCommentsListPage">
|
||||
<view class="comments-entry-content">
|
||||
<view class="comments-entry-left">
|
||||
<view class="comments-title">
|
||||
<text class="comments-title-label">商品评价</text>
|
||||
<text class="comments-title-count">({{ commentsStatistics.commentCount || 0 }})</text>
|
||||
</view>
|
||||
<view class="comments-summary" wx:if="{{ commentsStatistics.commentCount > 0 }}">
|
||||
<text class="good-rate">{{commentsStatistics.goodRate}}% 好评</text>
|
||||
<text class="view-all">查看全部评价</text>
|
||||
</view>
|
||||
<view class="comments-summary" wx:else>
|
||||
<text class="no-comments">暂无评价,点击查看详情</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="comments-entry-right">
|
||||
<t-icon name="chevron-right" size="40rpx" color="#BBBBBB" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品详细介绍区域 -->
|
||||
<view class="desc-content" wx:if="{{(details.desc && details.desc.length > 0) || details.descriptionText || details.details}}">
|
||||
<!-- 详情介绍标题 -->
|
||||
<view class="desc-content__title">
|
||||
<t-image t-class="img" src="{{recLeftImg}}" />
|
||||
<text class="desc-content__title--text">详情介绍</text>
|
||||
<t-image t-class="img" src="{{recRightImg}}" />
|
||||
</view>
|
||||
|
||||
<!-- 商品基本信息 -->
|
||||
<view class="desc-basic-info" wx:if="{{details.brand || details.category}}">
|
||||
<view class="desc-info-item" wx:if="{{details.brand}}">
|
||||
<text class="desc-info-label">品牌:</text>
|
||||
<text class="desc-info-value">{{details.brand}}</text>
|
||||
</view>
|
||||
<view class="desc-info-item" wx:if="{{details.category}}">
|
||||
<text class="desc-info-label">分类:</text>
|
||||
<text class="desc-info-value">{{details.category}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 文本描述 -->
|
||||
<view class="desc-content__text" wx:if="{{details.descriptionText}}">
|
||||
<view class="desc-text-title">商品描述</view>
|
||||
<text class="desc-text-content">{{details.descriptionText}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 详细信息 -->
|
||||
<view class="desc-details" wx:if="{{details.details}}">
|
||||
<view class="desc-text-title">详细信息</view>
|
||||
<text class="desc-text-content">{{details.details}}</text>
|
||||
</view>
|
||||
|
||||
<!-- 详情图片展示 -->
|
||||
<view class="desc-images" wx:if="{{details.desc && details.desc.length > 0}}">
|
||||
<view class="desc-text-title">图片详情</view>
|
||||
<view class="desc-image-container" wx:for="{{details.desc}}" wx:key="index">
|
||||
<t-image
|
||||
t-class="desc-content__img"
|
||||
src="{{item}}"
|
||||
mode="widthFix"
|
||||
bind:load="onDescImageLoad"
|
||||
bind:error="onDescImageError"
|
||||
bind:tap="previewDescImage"
|
||||
data-url="{{item}}"
|
||||
data-index="{{index}}"
|
||||
lazy-load="{{true}}"
|
||||
loading="{{true}}"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 当没有任何内容时的占位 -->
|
||||
<view class="desc-empty" wx:if="{{!details.desc || details.desc.length === 0 && !details.descriptionText && !details.details}}">
|
||||
<t-icon name="image" size="48" color="#cccccc" />
|
||||
<text class="desc-empty-text">暂无详细介绍</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-bottom-operation">
|
||||
<buy-bar
|
||||
jumpArray="{{jumpArray}}"
|
||||
soldout="{{soldout}}"
|
||||
isStock="{{isStock}}"
|
||||
shopCartNum="{{cartNum}}"
|
||||
buttonType="{{buttonType}}"
|
||||
isFavorite="{{isFavorite}}"
|
||||
bind:toAddCart="toAddCart"
|
||||
bind:toNav="toNav"
|
||||
bind:toBuyNow="buyItNow"
|
||||
bind:onToggleFavorite="onToggleFavorite"
|
||||
class="goods-details-card"
|
||||
/>
|
||||
</view>
|
||||
<goods-specs-popup
|
||||
id="goodsSpecsPopup"
|
||||
show="{{isSpuSelectPopupShow}}"
|
||||
title="{{details.title || ''}}"
|
||||
src="{{specImg ? specImg : primaryImage}}"
|
||||
specList="{{details.specList || []}}"
|
||||
skuList="{{skuArray}}"
|
||||
limitBuyInfo="{{details.limitInfo && details.limitInfo[0] && details.limitInfo[0].text || ''}}"
|
||||
bind:closeSpecsPopup="handlePopupHide"
|
||||
bind:change="chooseSpecItem"
|
||||
bind:changeNum="changeNum"
|
||||
bind:addCart="addCart"
|
||||
bind:buyNow="gotoBuy"
|
||||
bind:specsConfirm="specsConfirm"
|
||||
isStock="{{isStock}}"
|
||||
outOperateStatus="{{outOperateStatus}}"
|
||||
>
|
||||
<view slot="goods-price">
|
||||
<view class="popup-sku__price">
|
||||
<price
|
||||
wx:if="{{!isAllSelectedSku || (!promotionSubCode && isAllSelectedSku)}}"
|
||||
price="{{totalPrice || (selectSkuSellsPrice ? selectSkuSellsPrice : minSalePrice)}}"
|
||||
wr-class="popup-sku__price-num"
|
||||
symbol-class="popup-sku__price-symbol"
|
||||
/>
|
||||
<price
|
||||
wx:if="{{selectSkuSellsPrice === 0 && minSalePrice !== maxSalePrice && !isAllSelectedSku}}"
|
||||
price="{{maxSalePrice * (buyNum || 1)}}"
|
||||
wr-class="popup-sku__price-del"
|
||||
type="delthrough"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</goods-specs-popup>
|
||||
<promotion-popup
|
||||
list="{{list}}"
|
||||
bind:closePromotionPopup="closePromotionPopup"
|
||||
show="{{isShowPromotionPop}}"
|
||||
bind:promotionChange="promotionChange"
|
||||
/>
|
||||
</view>
|
||||
<t-toast id="t-toast" />
|
||||
Reference in New Issue
Block a user