feat 客服弹窗

pages/goods/details/components/buy-bar/index.wxml

@@ -17,7 +17,7 @@
 				<text wx:if="{{shopCartNum > 0 && item.showCartNum}}" class="tag-cart-num">
 					{{shopCartNum > 99 ? '99+' : shopCartNum}}
 				</text>
-				<t-icon prefix="wr" name="{{item.iconName}}" size="40rpx" />
+				<t-icon name="{{item.iconName}}" size="40rpx" />
 				<view class="operate-text">{{item.title}}</view>
 			</view>
 		</view>

pages/goods/details/index.js

@@ -18,6 +18,9 @@ import {
   getGoodsDetailsCommentList,
   getGoodsDetailsCommentsCount,
 } from '~/services/good/fetchGoodsDetailsComments';
+import {
+  getCustomerServiceList
+} from '~/services/usercenter/getCustomerServiceList';
 
 import {
   cdnBase
@@ -63,11 +66,10 @@ Page({
     ],
     storeLogo: `${imgPrefix}common/store-logo.png`,
     storeName: '云mall标准版旗舰店',
-    jumpArray: [
+    jumpArray: [{
-      {
         title: '客服',
         url: '',
-        iconName: 'user_list',
+        iconName: 'user-list',
       },
       {
         title: '收藏',
@@ -112,6 +114,8 @@ Page({
     duration: 500,
     interval: 5000,
     soldNum: 0, // 已售数量
+    showCustomerService: false, //客服
+    CustomerService: {}, //客服数据
   },
 
   handlePopupHide() {
@@ -136,15 +140,40 @@ Page({
     this.showSkuSelectPopup(2);
   },
 
+  // 获取客服列表
+  onGetCustomerServiceList() {
+    getCustomerServiceList().then((res) => {
+      if (res.code == 200) {
+        this.setData({
+          CustomerService: res.data[0]
+        })
+      }
+    })
+  },
+
+  closeCustomerService() {
+    this.setData({
+      showCustomerService: false
+    });
+  },
+
   toNav(e) {
     const {
       url,
       title
     } = e.detail;
 
+    if (title == "客服") {
+      this.setData({
+        showCustomerService: true,
+      });
+    }
+
     if (title == "收藏") {
-      if(this.data.details.isCollect){
+      if (this.data.details.isCollect) {
-        CancelGoodsCollection({goodsGuid: this.data.details.spuId}).then(() => {
+        CancelGoodsCollection({
+          goodsGuid: this.data.details.spuId
+        }).then(() => {
           Toast({
             context: this,
             selector: '#t-toast',
@@ -153,9 +182,10 @@ Page({
             duration: 1000,
           });
         })
-      }
+      } else {
-      else{
+        addOrUpdateGoodsCollection({
-        addOrUpdateGoodsCollection({goodsGuid: this.data.details.spuId}).then(() => {
+          goodsGuid: this.data.details.spuId
+        }).then(() => {
           Toast({
             context: this,
             selector: '#t-toast',
@@ -477,12 +507,11 @@ Page({
       // details.desc = details.desc.replace(/<img[^>]*style\s*=\s*(['"])[^'"]*\1[^>]*>/gi, '<img style="max-width:100%;height:auto;" ');
       // details.desc = details.desc.replace(/<img[^>]*>/gi, '<img style="max-3999999996width:100%;height:auto;" >');
       if (details.isCollect === true) {
-        this.data.jumpArray[1].iconName = 'star_filled';
+        this.data.jumpArray[1].iconName = 'star-filled';
         this.setData({
           jumpArray: this.data.jumpArray
         })
-      }
+      } else {
-      else{
         this.data.jumpArray[1].iconName = 'star';
         this.setData({
           jumpArray: this.data.jumpArray
@@ -617,5 +646,6 @@ Page({
     this.getDetail(spuId);
     this.getCommentsList(spuId);
     this.getCommentsStatistics(spuId);
+    this.onGetCustomerServiceList()
   },
 });

pages/goods/details/index.wxml

@@ -27,13 +27,7 @@
     <view class="goods-info">
       <view class="goods-number">
         <view class="goods-price">
-          <price
+          <price wr-class="class-goods-price" symbol-class="class-goods-symbol" price="{{minSalePrice}}" priceUnit="yuan" type="lighter" />
-            wr-class="class-goods-price"
-            symbol-class="class-goods-symbol"
-            price="{{minSalePrice}}"
-            priceUnit="yuan"
-            type="lighter"
-          />
           <view class="goods-price-up">起</view>
           <price wr-class="class-goods-del" price="{{maxLinePrice}}" type="delthrough" priceUnit="yuan" />
         </view>
@@ -90,13 +84,7 @@
           <t-image src="{{commentItem.userHeadUrl}}" t-class="comment-item-avatar" />
           <view class="comment-head-right">
             <view class="comment-username">{{commentItem.userName}}</view>
-            <t-rate
+            <t-rate value="{{ commentItem.commentScore }}" count="{{5}}" size="12" gap="2" color="{{['#ffc51c', '#ddd']}}" />
-              value="{{ commentItem.commentScore }}"
-              count="{{5}}"
-              size="12"
-              gap="2"
-              color="{{['#ffc51c', '#ddd']}}"
-            />
           </view>
         </view>
         <view class="comment-item-content"> {{commentItem.commentContent}} </view>
@@ -137,62 +125,25 @@
     </view>
   </view>
   <view class="goods-bottom-operation">
-    <buy-bar
+    <buy-bar jumpArray="{{jumpArray}}" soldout="{{soldout}}" isStock="{{isStock}}" isCollect="{{details.isCollect}}" shopCartNum="{{cartNum}}" buttonType="{{buttonType}}" bind:toAddCart="toAddCart" bind:toNav="toNav" bind:toBuyNow="buyItNow" class="goods-details-card" />
-      jumpArray="{{jumpArray}}"
-      soldout="{{soldout}}"
-      isStock="{{isStock}}"
-      isCollect="{{details.isCollect}}"
-      shopCartNum="{{cartNum}}"
-      buttonType="{{buttonType}}"
-      bind:toAddCart="toAddCart"
-      bind:toNav="toNav"
-      bind:toBuyNow="buyItNow"
-      class="goods-details-card"
-    />
   </view>
-  <goods-specs-popup
+  <goods-specs-popup id="goodsSpecsPopup" show="{{isSpuSelectPopupShow}}" title="{{details.title || ''}}" src="{{specImg ? specImg : primaryImage}}" specList="{{details.specList || []}}" skuList="{{skuArray}}" limitBuyInfo="{{details.limitInfo[0].text || ''}}" limitMaxCount="{{ selectSkuQuantity || details.spuStockQuantity }}" quantity="{{ details.spuStockQuantity }}" bind:closeSpecsPopup="handlePopupHide" bind:change="chooseSpecItem" bind:changeNum="changeNum" bind:addCart="addCart" bind:buyNow="gotoBuy" bind:specsConfirm="specsConfirm" isStock="{{isStock}}" outOperateStatus="{{outOperateStatus}}">
-    id="goodsSpecsPopup"
-    show="{{isSpuSelectPopupShow}}"
-    title="{{details.title || ''}}"
-    src="{{specImg ? specImg : primaryImage}}"
-    specList="{{details.specList || []}}"
-    skuList="{{skuArray}}"
-    limitBuyInfo="{{details.limitInfo[0].text || ''}}"
-    limitMaxCount="{{ selectSkuQuantity || details.spuStockQuantity }}"
-    quantity="{{ details.spuStockQuantity }}"
-    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
+        <price wx:if="{{!isAllSelectedSku || (!promotionSubCode && isAllSelectedSku)}}" price="{{selectSkuSellsPrice ? selectSkuSellsPrice : minSalePrice }}" priceUnit="yuan" wr-class="popup-sku__price-num" symbol-class="popup-sku__price-symbol" />
-          wx:if="{{!isAllSelectedSku || (!promotionSubCode && isAllSelectedSku)}}"
+        <price wx:if="{{selectSkuLinePrice !== 0}}" price="{{selectSkuLinePrice ? selectSkuLinePrice : maxLinePrice }}" priceUnit="yuan" wr-class="popup-sku__price-del" type="delthrough" />
-          price="{{selectSkuSellsPrice ? selectSkuSellsPrice : minSalePrice }}"
-          priceUnit="yuan"
-          wr-class="popup-sku__price-num"
-          symbol-class="popup-sku__price-symbol"
-        />
-        <price
-          wx:if="{{selectSkuLinePrice !== 0}}"
-          price="{{selectSkuLinePrice ? selectSkuLinePrice : maxLinePrice }}"
-          priceUnit="yuan"
-          wr-class="popup-sku__price-del"
-          type="delthrough"
-        />
       </view>
     </view>
   </goods-specs-popup>
-  <promotion-popup
+  <promotion-popup list="{{list}}" bind:closePromotionPopup="closePromotionPopup" show="{{isShowPromotionPop}}" bind:promotionChange="promotionChange" />
-    list="{{list}}"
-    bind:closePromotionPopup="closePromotionPopup"
-    show="{{isShowPromotionPop}}"
-    bind:promotionChange="promotionChange"
-  />
 </view>
 <t-toast id="t-toast" />
+
+<t-popup visible="{{showCustomerService}}" placement="bottom" bind:visible-change="closeCustomerService" data-index="2">
+  <view class="popup-content">
+    <view class="customer-service-img" wx:if="{{CustomerService.customerServiceImg}}">
+      <image src="{{CustomerService.customerServiceImg}}" mode="widthFix" />
+    </view>
+    <view class="popup-close" bind:tap="closeCustomerService">取消</view>
+  </view>
+</t-popup>

pages/goods/details/index.wxss

@@ -429,3 +429,39 @@ page {
   color: white;
   font-size: 25rpx;
 }
+
+/* 客服弹窗 */
+.popup-content {
+  background: #f5f5f5;
+  margin-bottom: env(safe-area-inset-bottom);
+  border-radius: 16rpx 16rpx 0 0;
+}
+
+.popup-content .popup-title {
+  background: #fff;
+  text-align: center;
+  font-size: 24rpx;
+  color: #999;
+  height: 112rpx;
+  text-align: center;
+  line-height: 112rpx;
+  border-radius: 16rpx 16rpx 0 0;
+}
+
+.popup-content .popup-close {
+  background: #fff;
+  height: 100rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  font-size: 30rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #333;
+}
+
+.customer-service-img,
+.customer-service-img>image {
+  width: 100%;
+}