|
|
@@ -1,131 +1,133 @@
|
|
|
<template>
|
|
|
<view class="product-detail">
|
|
|
<tui-skeleton v-if="isRequest" :loadingType="3" :isLoading="true"></tui-skeleton>
|
|
|
-
|
|
|
- <!-- 顶部导航 -->
|
|
|
- <goods-top-tabs @change="onTabChange" :current="currentTab" v-show="scrollTop > 100"></goods-top-tabs>
|
|
|
-
|
|
|
- <simple-safe-view>
|
|
|
- <!-- 锚点0 -->
|
|
|
- <view id="anchor-0" class="anchor"></view>
|
|
|
-
|
|
|
- <!-- 轮播 -->
|
|
|
- <goods-image-swiper
|
|
|
- :list="imageList"
|
|
|
- @click="onSwiperClick"
|
|
|
- @change="onSwiperChange"
|
|
|
- :current="current"
|
|
|
- :autoplay="autoplay"
|
|
|
- ></goods-image-swiper>
|
|
|
- <!-- 价格 -->
|
|
|
- <goods-price :productData="productInfo"></goods-price>
|
|
|
-
|
|
|
- <!-- 活动优惠券 -->
|
|
|
- <goods-coupon-list
|
|
|
- @click="couponVisiable = true"
|
|
|
- :couponList="couponList"
|
|
|
- v-if="couponList.length > 0"
|
|
|
- ></goods-coupon-list>
|
|
|
-
|
|
|
- <!-- 商品基本信息：商品名称 && 分享 && 标签 && 备注 && 服务-->
|
|
|
- <goods-info @share="onShare" :productData="productInfo"></goods-info>
|
|
|
-
|
|
|
- <view class="section" v-if="productInfo.skus.length > 0">
|
|
|
- <goods-unit-section :skuList="productInfo.skus" @click="onUnitClick"></goods-unit-section>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 参数 -->
|
|
|
- <view class="section" v-if="productInfo.parametersList.length > 0">
|
|
|
- <goods-params-section :paramList="productInfo.parametersList"></goods-params-section>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 优惠券 -->
|
|
|
- <view class="section" v-if="couponList.length > 0">
|
|
|
- <goods-coupon-section @click="couponVisiable = true" :couponList="couponList"></goods-coupon-section>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 特殊商品退货须知 -->
|
|
|
- <view class="section" v-if="returnGoodsStutas">
|
|
|
- <goods-return-instructions :content="helpContent"></goods-return-instructions>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 锚点1 -->
|
|
|
- <view id="anchor-1" class="anchor"></view>
|
|
|
-
|
|
|
- <!-- 商品详情 -->
|
|
|
- <view class="section detail">
|
|
|
- <view class="title">商品详情</view>
|
|
|
- <template v-if="productDetail && productDetail.detailInfo">
|
|
|
- <uParse :content="productDetail.detailInfo" />
|
|
|
- </template>
|
|
|
- <!-- 空 -->
|
|
|
- <view class="section-empty" v-else>暂无商品详情</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 锚点2 -->
|
|
|
- <view id="anchor-2" class="anchor"></view>
|
|
|
-
|
|
|
- <!-- 服务项目 -->
|
|
|
- <view class="section service-items">
|
|
|
- <view class="title">服务项目</view>
|
|
|
- <view v-if="productDetail && productDetail.serviceInfo" v-html="productDetail.serviceInfo"></view>
|
|
|
- <!-- 空 -->
|
|
|
- <view class="section-empty">暂无服务项目</view>
|
|
|
- </view>
|
|
|
- </simple-safe-view>
|
|
|
-
|
|
|
- <!-- 商品操作导航 -->
|
|
|
- <goods-navbar class="navbar" :class="navbarType" @rightClick="navbarRightClick" @leftClick="navbarLeftClick">
|
|
|
- <template v-slot:left>
|
|
|
- <view class="left-btn text1" v-text="leftButton[0]"></view>
|
|
|
- <view class="left-btn" v-if="leftButton[1]">
|
|
|
- <text class="prefix">券后</text>
|
|
|
- <text class="text2" v-text="leftButton[1]"></text>
|
|
|
+ <template v-else>
|
|
|
+ <!-- 顶部导航 -->
|
|
|
+ <goods-top-tabs @change="onTabChange" :current="currentTab" v-show="scrollTop > 100"></goods-top-tabs>
|
|
|
+
|
|
|
+ <simple-safe-view>
|
|
|
+ <!-- 锚点0 -->
|
|
|
+ <view id="anchor-0" class="anchor"></view>
|
|
|
+
|
|
|
+ <!-- 轮播 -->
|
|
|
+ <goods-image-swiper
|
|
|
+ :list="imageList"
|
|
|
+ @click="onSwiperClick"
|
|
|
+ @change="onSwiperChange"
|
|
|
+ :current="current"
|
|
|
+ :autoplay="autoplay"
|
|
|
+ ></goods-image-swiper>
|
|
|
+ <!-- 价格 -->
|
|
|
+ <goods-price :productData="productInfo"></goods-price>
|
|
|
+
|
|
|
+ <!-- 活动优惠券 -->
|
|
|
+ <goods-coupon-list
|
|
|
+ @click="couponVisiable = true"
|
|
|
+ :couponList="couponList"
|
|
|
+ v-if="couponList.length > 0"
|
|
|
+ ></goods-coupon-list>
|
|
|
+
|
|
|
+ <!-- 商品基本信息：商品名称 && 分享 && 标签 && 备注 && 服务-->
|
|
|
+ <goods-info @share="onShare" :productData="productInfo"></goods-info>
|
|
|
+
|
|
|
+ <view class="section" v-if="productInfo.skus.length > 0">
|
|
|
+ <goods-unit-section :skuList="productInfo.skus" @click="onUnitClick"></goods-unit-section>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 参数 -->
|
|
|
+ <view class="section" v-if="productInfo.parametersList.length > 0">
|
|
|
+ <goods-params-section :paramList="productInfo.parametersList"></goods-params-section>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 优惠券 -->
|
|
|
+ <view class="section" v-if="couponList.length > 0">
|
|
|
+ <goods-coupon-section @click="couponVisiable = true" :couponList="couponList"></goods-coupon-section>
|
|
|
</view>
|
|
|
- </template>
|
|
|
- <template v-slot:right>
|
|
|
- <view class="right-btn text1" v-text="rightButton[0]"></view>
|
|
|
- <view class="right-btn" v-if="rightButton[1]">
|
|
|
- <text class="prefix">券后</text>
|
|
|
- <text class="text2" v-text="rightButton[1]"></text>
|
|
|
+
|
|
|
+ <!-- 特殊商品退货须知 -->
|
|
|
+ <view class="section" v-if="returnGoodsStutas">
|
|
|
+ <goods-return-instructions :content="helpContent"></goods-return-instructions>
|
|
|
</view>
|
|
|
- </template>
|
|
|
- </goods-navbar>
|
|
|
-
|
|
|
- <!-- 活动价 -->
|
|
|
- <cm-goods-activity-popup
|
|
|
- ref="activitypPopup"
|
|
|
- :ladderList="ladderPriceList"
|
|
|
- @open="$refs.receiveBuyPopup.close()"
|
|
|
- @close="$refs.receiveBuyPopup.open()"
|
|
|
- ></cm-goods-activity-popup>
|
|
|
-
|
|
|
- <!-- 分享弹窗 -->
|
|
|
- <cm-share-popup ref="sharePopup" :data="posterData" type="product"></cm-share-popup>
|
|
|
-
|
|
|
- <!-- 优惠券弹窗 -->
|
|
|
- <cm-coupon-popup
|
|
|
- :list="couponList"
|
|
|
- :visiable="couponVisiable"
|
|
|
- :hasSafeArea="true"
|
|
|
- @close="couponVisiable = false"
|
|
|
- @couponClick="onCouponClick"
|
|
|
- ></cm-coupon-popup>
|
|
|
-
|
|
|
- <!-- 返回顶部 -->
|
|
|
- <tui-scroll-top :scrollTop="scrollTop" :bottom="80"></tui-scroll-top>
|
|
|
-
|
|
|
- <!-- 购买弹窗 -->
|
|
|
- <cm-goods-buy-popup
|
|
|
- v-model="goodsBuyPopup"
|
|
|
- :product="productInfo"
|
|
|
- :couponList="couponList"
|
|
|
- :useType="useType"
|
|
|
- :buttonType="buttonType"
|
|
|
- @activityClick="handleShowActivity"
|
|
|
- @confirm="onSubmit"
|
|
|
- v-if="productInfo"
|
|
|
- ></cm-goods-buy-popup>
|
|
|
+
|
|
|
+ <!-- 锚点1 -->
|
|
|
+ <view id="anchor-1" class="anchor"></view>
|
|
|
+
|
|
|
+ <!-- 商品详情 -->
|
|
|
+ <view class="section detail">
|
|
|
+ <view class="title">商品详情</view>
|
|
|
+ <template v-if="productDetail && productDetail.detailInfo">
|
|
|
+ <uParse :content="productDetail.detailInfo" />
|
|
|
+ </template>
|
|
|
+ <!-- 空 -->
|
|
|
+ <view class="section-empty" v-else>暂无商品详情</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 锚点2 -->
|
|
|
+ <view id="anchor-2" class="anchor"></view>
|
|
|
+
|
|
|
+ <!-- 服务项目 -->
|
|
|
+ <view class="section service-items">
|
|
|
+ <view class="title">服务项目</view>
|
|
|
+ <view v-if="productDetail && productDetail.serviceInfo" v-html="productDetail.serviceInfo"></view>
|
|
|
+ <!-- 空 -->
|
|
|
+ <view class="section-empty">暂无服务项目</view>
|
|
|
+ </view>
|
|
|
+ </simple-safe-view>
|
|
|
+
|
|
|
+ <!-- 商品操作导航 -->
|
|
|
+ <goods-navbar class="navbar" :class="navbarType" @rightClick="navbarRightClick" @leftClick="navbarLeftClick">
|
|
|
+ <template v-slot:left>
|
|
|
+ <view class="left-btn text1" v-text="leftButton[0]"></view>
|
|
|
+ <view class="left-btn" v-if="leftButton[1]">
|
|
|
+ <text class="prefix">券后</text>
|
|
|
+ <text class="text2" v-text="leftButton[1]"></text>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ <template v-slot:right>
|
|
|
+ <view class="right-btn text1" v-text="rightButton[0]"></view>
|
|
|
+ <view class="right-btn" v-if="rightButton[1]">
|
|
|
+ <text class="prefix">券后</text>
|
|
|
+ <text class="text2" v-text="rightButton[1]"></text>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </goods-navbar>
|
|
|
+
|
|
|
+ <!-- 活动价 -->
|
|
|
+ <cm-goods-activity-popup
|
|
|
+ ref="activitypPopup"
|
|
|
+ :ladderList="ladderPriceList"
|
|
|
+ @open="$refs.receiveBuyPopup.close()"
|
|
|
+ @close="$refs.receiveBuyPopup.open()"
|
|
|
+ ></cm-goods-activity-popup>
|
|
|
+
|
|
|
+ <!-- 分享弹窗 -->
|
|
|
+ <cm-share-popup ref="sharePopup" :data="posterData" type="product"></cm-share-popup>
|
|
|
+
|
|
|
+ <!-- 优惠券弹窗 -->
|
|
|
+ <cm-coupon-popup
|
|
|
+ :list="couponList"
|
|
|
+ :visiable="couponVisiable"
|
|
|
+ :hasSafeArea="true"
|
|
|
+ @close="couponVisiable = false"
|
|
|
+ @couponClick="onCouponClick"
|
|
|
+ ></cm-coupon-popup>
|
|
|
+
|
|
|
+ <!-- 返回顶部 -->
|
|
|
+ <tui-scroll-top :scrollTop="scrollTop" :bottom="80"></tui-scroll-top>
|
|
|
+
|
|
|
+ <!-- 购买弹窗 -->
|
|
|
+ <cm-goods-buy-popup
|
|
|
+ v-model="goodsBuyPopup"
|
|
|
+ :product="productInfo"
|
|
|
+ :couponList="couponList"
|
|
|
+ :useType="useType"
|
|
|
+ :buttonType="buttonType"
|
|
|
+ @activityClick="handleShowActivity"
|
|
|
+ @confirm="onSubmit"
|
|
|
+ v-if="productInfo"
|
|
|
+ ></cm-goods-buy-popup>
|
|
|
+
|
|
|
+ </template>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
yuwenjun1997