feat: 个人中心 客服功能

pages/usercenter/index.js

@@ -1,14 +1,16 @@
 import {
   fetchUserCenter
 } from '~/services/usercenter/fetchUsercenter';
+import {
+  getCustomerServiceList
+} from '~/services/usercenter/getCustomerServiceList';
 import {
   getOpenId
 } from '~/services/login/getOpenId';
 import Toast from 'tdesign-miniprogram/toast/index';
 
 const menuData = [
-  [
-    {
+  [{
       title: '申请开店',
       tit: '',
       url: '',
@@ -48,7 +50,7 @@ const menuData = [
     //   type: 'help-center',
     // },
     {
-      title: '客服热线',
+      title: '联系客服',
       tit: '',
       url: '',
       type: 'service',
@@ -115,14 +117,14 @@ const getDefaultData = () => ({
   customerServiceInfo: {},
   currAuthStep: 1,
   showKefu: true,
-  versionNo: '',
+  CustomerService: {},
 });
 
 Page({
   data: getDefaultData(),
 
   onLoad() {
-    this.getVersionInfo();
+    this.onGetCustomerServiceList();
   },
 
   onShow() {
@@ -327,14 +329,15 @@ Page({
     }
   },
 
-  getVersionInfo() {
-    const versionInfo = wx.getAccountInfoSync();
-    const {
-      version,
-      envVersion = __wxConfig
-    } = versionInfo.miniProgram;
+  // 获取客服列表
+  onGetCustomerServiceList() {
+    getCustomerServiceList().then((res) => {
+      console.log(res);
+      if (res.code == 200) {
         this.setData({
-      versionNo: envVersion === 'release' ? version : envVersion,
-    });
+          CustomerService: res.data[0]
+        })
+      }
+    })
   },
 });

pages/usercenter/index.wxml

@@ -1,12 +1,4 @@
-<t-user-center-card
-  userInfo="{{userInfo}}"
-  isPhoneHide="{{true}}"
-  name-class="custom-name-class"
-  phone-class="custom-phone-class"
-  avatar-class="customer-avatar-class"
-  currAuthStep="{{currAuthStep}}"
-  bind:gotoUserEditPage="gotoUserEditPage"
-/>
+<t-user-center-card userInfo="{{userInfo}}" isPhoneHide="{{true}}" name-class="custom-name-class" phone-class="custom-phone-class" avatar-class="customer-avatar-class" currAuthStep="{{currAuthStep}}" bind:gotoUserEditPage="gotoUserEditPage" />
 
 
 <view class="content-wrapper">
@@ -28,34 +20,26 @@
   </view>
   <view wx:for="{{menuData}}" wx:key="item" class="cell-box">
     <t-cell-group>
-      <t-cell
-        wx:for="{{item}}"
-        wx:for-item="xitem"
-        wx:for-index="xindex"
-        wx:key="xindex"
-        title="{{xitem.title}}"
-        arrow="{{!xitem.icon}}"
-        note="{{xitem.tit}}"
-        data-type="{{xitem.type}}"
-        bordered="{{false}}"
-        bind:click="onClickCell"
-        t-class="t-cell-padding"
-        t-class-note="order-group-note"
-        t-class-left="order-group__left"
-      >
+      <t-cell wx:for="{{item}}" wx:for-item="xitem" wx:for-index="xindex" wx:key="xindex" title="{{xitem.title}}" arrow="{{!xitem.icon}}" note="{{xitem.tit}}" data-type="{{xitem.type}}" bordered="{{false}}" bind:click="onClickCell" t-class="t-cell-padding" t-class-note="order-group-note" t-class-left="order-group__left">
         <t-icon name="{{xitem.icon}}" size="48rpx" slot="note" />
       </t-cell>
     </t-cell-group>
   </view>
 </view>
-<view class="footer__version" wx:if="{{versionNo !== ''}}">当前版本 {{versionNo}}</view>
+<view wx:if="{{CustomerService}}">
+  <view class="footer__version" style="margin-top: 50rpx;">客服电话 {{CustomerService.customerServicePhone}}</view>
+  <view class="footer__version">工作时间 {{CustomerService.workingHoursBeginTime}}-{{CustomerService.workingHoursEndTime}}</view>
+</view>
 <t-popup visible="{{showMakePhone}}" placement="bottom" bind:visible-change="closeMakePhone" data-index="2">
   <view class="popup-content">
-    <view class="popup-title border-bottom-1px" wx:if="{{customerServiceInfo.serviceTimeDuration}}">
+    <view class="customer-service-img" wx:if="{{CustomerService.customerServiceImg}}">
+      <image src="{{CustomerService.customerServiceImg}}" mode="widthFix" />
+    </view>
+    <!-- <view class="popup-title border-bottom-1px" wx:if="{{customerServiceInfo.serviceTimeDuration}}">
       服务时间: {{customerServiceInfo.serviceTimeDuration}}
     </view>
     <view class="popup-phone {{showKefu ? 'border-bottom-1px' : ''}}" bind:tap="call">电话客服</view>
-    <button class="popup-phone border-bottom-1px online" open-type="contact" wx:if="{{showKefu}}">在线客服</button>
+    <button class="popup-phone border-bottom-1px online" open-type="contact" wx:if="{{showKefu}}">在线客服</button> -->
     <view class="popup-close" bind:tap="closeMakePhone">取消</view>
   </view>
 </t-popup>

pages/usercenter/index.wxss

@@ -25,9 +25,11 @@ page {
   overflow: hidden;
   margin-bottom: 20rpx;
 }
+
 .icon-color {
   color: #aaa;
 }
+
 .cell-class {
   height: 100rpx;
   display: flex;
@@ -60,6 +62,7 @@ page {
   -ms-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
 }
+
 .order-content-t {
   margin-top: 10rpx;
   font-size: 24rpx;
@@ -73,6 +76,7 @@ page {
   margin-bottom: env(safe-area-inset-bottom);
   border-radius: 16rpx 16rpx 0 0;
 }
+
 .popup-content .popup-title {
   background: #fff;
   text-align: center;
@@ -101,6 +105,7 @@ page {
   transform-origin: left top;
   border-bottom: 2rpx solid #e5e5e5;
 }
+
 .popup-content .popup-phone,
 .popup-content .popup-close {
   background: #fff;
@@ -114,16 +119,24 @@ page {
   font-weight: 400;
   color: #333;
 }
+
 .popup-content .popup-phone.online {
   margin-bottom: 20rpx;
 }
+
 .popup-content .popup-phone.online::after {
   content: none;
 }
+
 .popup-content .popup-close {
   color: #333;
   border: 0;
-  margin-top: 16rpx;
+  /* margin-top: 16rpx; */
+}
+
+.customer-service-img,
+.customer-service-img>image {
+  width: 100%;
 }
 
 .my-order {
@@ -132,35 +145,40 @@ page {
 
 .footer__version {
   text-align: center;
-  margin-top: 50rpx;
   color: #999;
   margin-bottom: 4rpx;
   font-size: 24rpx;
   line-height: 32rpx;
 }
+
 .cell-box .order-group__left {
   margin-right: 0;
 }
+
 .cell-box .t-cell-padding {
   padding: 24rpx 18rpx 24rpx 32rpx;
 }
+
 .order-history-box {
   width: 90%;
   display: flex;
   justify-content: space-around;
   margin: 30rpx auto;
 }
+
 .order-history-content-box {
   display: flex;
   flex-direction: column;
   align-items: center;
   cursor: pointer;
 }
+
 .order-history-content-num {
   font-size: 35rpx;
   font-weight: bold;
   margin-bottom: 10rpx;
 }
+
 .order-history-content-line {
   /* width: 1rpx; */
   height: 80rpx;

services/usercenter/getCustomerServiceList.js

@@ -0,0 +1,19 @@
+import {
+  request
+} from '../_utils/request';
+
+/** 获取客服列表 */
+export function getCustomerServiceList() {
+  return new Promise((resolve, reject) => {
+    request({
+      url: `CustomerServiceApi/getCustomerServiceList`,
+      method: 'GET',
+      success: function (res) {
+        resolve(res);
+      },
+      fail: function (error) {
+        reject(error);
+      }
+    });
+  });
+}