From 06993b2db1e1596467b738257fdf56b65a5bc8cd Mon Sep 17 00:00:00 2001
From: Cxpller <zhituaner@outlook.com>
Date: Thu, 26 Oct 2023 23:34:19 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=E5=AE=A2=E6=9C=8D=E5=BC=B9=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../details/components/buy-bar/index.wxml     |  2 +-
 pages/goods/details/index.js                  | 52 +++++++---
 pages/goods/details/index.wxml                | 99 +++++--------------
 pages/goods/details/index.wxss                | 36 +++++++
 4 files changed, 103 insertions(+), 86 deletions(-)

diff --git a/pages/goods/details/components/buy-bar/index.wxml b/pages/goods/details/components/buy-bar/index.wxml
index 37538c6..0f022d4 100644
--- a/pages/goods/details/components/buy-bar/index.wxml
+++ b/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>
diff --git a/pages/goods/details/index.js b/pages/goods/details/index.js
index 7a57523..52a9555 100644
--- a/pages/goods/details/index.js
+++ b/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){
-        CancelGoodsCollection({goodsGuid: this.data.details.spuId}).then(() => {
+      if (this.data.details.isCollect) {
+        CancelGoodsCollection({
+          goodsGuid: this.data.details.spuId
+        }).then(() => {
           Toast({
             context: this,
             selector: '#t-toast',
@@ -153,9 +182,10 @@ Page({
             duration: 1000,
           });
         })
-      }
-      else{
-        addOrUpdateGoodsCollection({goodsGuid: this.data.details.spuId}).then(() => {
+      } else {
+        addOrUpdateGoodsCollection({
+          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()
   },
 });
\ No newline at end of file
diff --git a/pages/goods/details/index.wxml b/pages/goods/details/index.wxml
index e751166..35ee1a3 100644
--- a/pages/goods/details/index.wxml
+++ b/pages/goods/details/index.wxml
@@ -13,27 +13,21 @@
     ></t-swiper> -->
     <view>
       <swiper class="swiper-container" circular indicator-dots indicator-active-color="#fff">
-          <!-- 第一个元素是视频 -->
-          <swiper-item wx:if="{{details.video}}">
-            <video src="{{details.video}}" autoplay poster="{{details.primaryImage}}" controls style="width: 100%; height: 100%;"></video>
-          </swiper-item>
+        <!-- 第一个元素是视频 -->
+        <swiper-item wx:if="{{details.video}}">
+          <video src="{{details.video}}" autoplay poster="{{details.primaryImage}}" controls style="width: 100%; height: 100%;"></video>
+        </swiper-item>
 
-          <!-- 后续元素是图片 -->
-          <swiper-item wx:for="{{details.images}}" wx:key="item">
-            <image src="{{item}}" mode="aspectFill" style="width: 100%; height: 100%;"></image>
-          </swiper-item>
+        <!-- 后续元素是图片 -->
+        <swiper-item wx:for="{{details.images}}" wx:key="item">
+          <image src="{{item}}" mode="aspectFill" style="width: 100%; height: 100%;"></image>
+        </swiper-item>
       </swiper>
     </view>
     <view class="goods-info">
       <view class="goods-number">
         <view class="goods-price">
-          <price
-            wr-class="class-goods-price"
-            symbol-class="class-goods-symbol"
-            price="{{minSalePrice}}"
-            priceUnit="yuan"
-            type="lighter"
-          />
+          <price 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>
@@ -51,7 +45,7 @@
           <t-icon name="chevron-right" size="42rpx" />
         </view>
       </view> -->
-   
+
       <view class="goods-title">
         <view class="goods-name">{{details.title}}</view>
         <view class="goods-tag">
@@ -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
-              value="{{ commentItem.commentScore }}"
-              count="{{5}}"
-              size="12"
-              gap="2"
-              color="{{['#ffc51c', '#ddd']}}"
-            />
+            <t-rate 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
-      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"
-    />
+    <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" />
   </view>
-  <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}}"
-  >
+  <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}}">
     <view slot="goods-price">
       <view class="popup-sku__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"
-        />
-        <price
-          wx:if="{{selectSkuLinePrice !== 0}}"
-          price="{{selectSkuLinePrice ? selectSkuLinePrice : maxLinePrice }}"
-          priceUnit="yuan"
-          wr-class="popup-sku__price-del"
-          type="delthrough"
-        />
+        <price wx:if="{{!isAllSelectedSku || (!promotionSubCode && isAllSelectedSku)}}" 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
-    list="{{list}}"
-    bind:closePromotionPopup="closePromotionPopup"
-    show="{{isShowPromotionPop}}"
-    bind:promotionChange="promotionChange"
-  />
+  <promotion-popup 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>
\ No newline at end of file
diff --git a/pages/goods/details/index.wxss b/pages/goods/details/index.wxss
index 78a8ff7..4b47e78 100644
--- a/pages/goods/details/index.wxss
+++ b/pages/goods/details/index.wxss
@@ -428,4 +428,40 @@ page {
   border-radius: 50rpx;
   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%;
 }
\ No newline at end of file