|
@@ -100,6 +100,19 @@
|
|
|
<text class="section-title">商品详情</text>
|
|
<text class="section-title">商品详情</text>
|
|
|
<mp-html :content="product.description" :domain="apiBaseUrl" />
|
|
<mp-html :content="product.description" :domain="apiBaseUrl" />
|
|
|
</view>
|
|
</view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 套餐包含(bundle商品展示子商品组成) -->
|
|
|
|
|
+ <view v-if="isBundleProduct && bundleItems.length > 0" class="bundle-section">
|
|
|
|
|
+ <text class="section-title">套餐包含</text>
|
|
|
|
|
+ <view class="bundle-item" v-for="(bi, idx) in bundleItems" :key="getBundleKey(bi, idx)">
|
|
|
|
|
+ <image v-if="bi.coverImage" class="bundle-item-img" :src="getImageUrl(bi.coverImage)" mode="aspectFill" />
|
|
|
|
|
+ <view class="bundle-item-info">
|
|
|
|
|
+ <text class="bundle-item-name">{{ bi.childProductName }}</text>
|
|
|
|
|
+ <text v-if="bi.specs" class="bundle-item-spec">{{ bi.specs }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <text class="bundle-item-qty">×{{ bi.quantity }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
</scroll-view>
|
|
</scroll-view>
|
|
|
<view v-else class="empty-wrap">
|
|
<view v-else class="empty-wrap">
|
|
|
<text class="empty-text">商品不存在或已下架</text>
|
|
<text class="empty-text">商品不存在或已下架</text>
|
|
@@ -150,7 +163,8 @@ export default {
|
|
|
cfEarnedValue: 0,
|
|
cfEarnedValue: 0,
|
|
|
// 会员身份(实时调 getMyMembership,FREE=非会员)
|
|
// 会员身份(实时调 getMyMembership,FREE=非会员)
|
|
|
isMember: false,
|
|
isMember: false,
|
|
|
- memberLevel: 'FREE'
|
|
|
|
|
|
|
+ memberLevel: 'FREE',
|
|
|
|
|
+ bundleItems: []
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
computed: {
|
|
computed: {
|
|
@@ -177,6 +191,9 @@ export default {
|
|
|
}
|
|
}
|
|
|
return map[this.product.domain] || this.product.domain
|
|
return map[this.product.domain] || this.product.domain
|
|
|
},
|
|
},
|
|
|
|
|
+ isBundleProduct: function() {
|
|
|
|
|
+ return this.product && this.product.productType === 'bundle'
|
|
|
|
|
+ },
|
|
|
priceText() {
|
|
priceText() {
|
|
|
if (!this.product || !this.product.price) return ''
|
|
if (!this.product || !this.product.price) return ''
|
|
|
// 海报场景: 有会员价且当前是会员,展示会员价; 否则展示原价
|
|
// 海报场景: 有会员价且当前是会员,展示会员价; 否则展示原价
|
|
@@ -316,6 +333,7 @@ export default {
|
|
|
that.loading = false
|
|
that.loading = false
|
|
|
if (res.code === 200 && res.data) {
|
|
if (res.code === 200 && res.data) {
|
|
|
that.product = res.data
|
|
that.product = res.data
|
|
|
|
|
+ that.bundleItems = (res.data && res.data.bundleItems) || []
|
|
|
that.setShareInfo(
|
|
that.setShareInfo(
|
|
|
that.product.name,
|
|
that.product.name,
|
|
|
'/pages/discover-detail/product-detail/product-detail?id=' + that.product.id
|
|
'/pages/discover-detail/product-detail/product-detail?id=' + that.product.id
|
|
@@ -361,6 +379,9 @@ export default {
|
|
|
getCouponKey: function(item, index) {
|
|
getCouponKey: function(item, index) {
|
|
|
return item.id + '-' + index
|
|
return item.id + '-' + index
|
|
|
},
|
|
},
|
|
|
|
|
+ getBundleKey: function(item, idx) {
|
|
|
|
|
+ return item ? (item.childProductId || idx) : idx
|
|
|
|
|
+ },
|
|
|
|
|
|
|
|
getCouponDesc: function(item) {
|
|
getCouponDesc: function(item) {
|
|
|
if (item.type === 'DISCOUNT') {
|
|
if (item.type === 'DISCOUNT') {
|
|
@@ -742,6 +763,15 @@ export default {
|
|
|
line-height: 1.6;
|
|
line-height: 1.6;
|
|
|
display: block;
|
|
display: block;
|
|
|
}
|
|
}
|
|
|
|
|
+/* 套餐包含 */
|
|
|
|
|
+.bundle-section { background: #fff; margin: 20rpx; border-radius: 16rpx; padding: 24rpx; }
|
|
|
|
|
+.bundle-item { display: flex; align-items: center; padding: 12rpx 0; border-bottom: 1rpx solid #f5f5f5; }
|
|
|
|
|
+.bundle-item:last-child { border-bottom: none; }
|
|
|
|
|
+.bundle-item-img { width: 80rpx; height: 80rpx; border-radius: 12rpx; margin-right: 16rpx; flex-shrink: 0; background: #f7f7f7; }
|
|
|
|
|
+.bundle-item-info { flex: 1; display: flex; flex-direction: column; min-width: 0; }
|
|
|
|
|
+.bundle-item-name { font-size: 28rpx; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
|
|
|
+.bundle-item-spec { font-size: 24rpx; color: #999; margin-top: 4rpx; }
|
|
|
|
|
+.bundle-item-qty { font-size: 30rpx; font-weight: bold; color: #F97316; margin-left: 16rpx; flex-shrink: 0; }
|
|
|
/* SKU 选择器 */
|
|
/* SKU 选择器 */
|
|
|
.sku-section {
|
|
.sku-section {
|
|
|
background: #fff;
|
|
background: #fff;
|