feat: 个人中心 客服功能

This commit is contained in:
Cxpller 2023-10-24 23:41:14 +08:00
parent bac5f7deec
commit 5751ee0f04
4 changed files with 78 additions and 54 deletions

View File

@ -1,14 +1,16 @@
import { import {
fetchUserCenter fetchUserCenter
} from '~/services/usercenter/fetchUsercenter'; } from '~/services/usercenter/fetchUsercenter';
import {
getCustomerServiceList
} from '~/services/usercenter/getCustomerServiceList';
import { import {
getOpenId getOpenId
} from '~/services/login/getOpenId'; } from '~/services/login/getOpenId';
import Toast from 'tdesign-miniprogram/toast/index'; import Toast from 'tdesign-miniprogram/toast/index';
const menuData = [ const menuData = [
[ [{
{
title: '申请开店', title: '申请开店',
tit: '', tit: '',
url: '', url: '',
@ -48,7 +50,7 @@ const menuData = [
// type: 'help-center', // type: 'help-center',
// }, // },
{ {
title: '客服热线', title: '联系客服',
tit: '', tit: '',
url: '', url: '',
type: 'service', type: 'service',
@ -115,14 +117,14 @@ const getDefaultData = () => ({
customerServiceInfo: {}, customerServiceInfo: {},
currAuthStep: 1, currAuthStep: 1,
showKefu: true, showKefu: true,
versionNo: '', CustomerService: {},
}); });
Page({ Page({
data: getDefaultData(), data: getDefaultData(),
onLoad() { onLoad() {
this.getVersionInfo(); this.onGetCustomerServiceList();
}, },
onShow() { onShow() {
@ -161,13 +163,13 @@ Page({
// ...v, // ...v,
// ...orderInfo[index], // ...orderInfo[index],
// })); // }));
console.log(collectData,'数据'); console.log(collectData, '数据');
this.data.orderTagInfos[0].orderNum = collectData.waitPayCount this.data.orderTagInfos[0].orderNum = collectData.waitPayCount
this.data.orderTagInfos[1].orderNum = collectData.deliverCount this.data.orderTagInfos[1].orderNum = collectData.deliverCount
this.data.orderTagInfos[2].orderNum = collectData.packageCount this.data.orderTagInfos[2].orderNum = collectData.packageCount
this.data.orderTagInfos[3].orderNum = collectData.commentCount this.data.orderTagInfos[3].orderNum = collectData.commentCount
this.data.orderTagInfos[4].orderNum = collectData.exchangCount this.data.orderTagInfos[4].orderNum = collectData.exchangCount
console.log(this.data.orderTagInfos,'asdasdasd'); console.log(this.data.orderTagInfos, 'asdasdasd');
this.setData({ this.setData({
userInfo, userInfo,
collectData, collectData,
@ -271,16 +273,16 @@ Page({
}, },
jumpCollect() { jumpCollect() {
wx.navigateTo({ wx.navigateTo({
url: '/pages/usercenter/goods-collect/index' url: '/pages/usercenter/goods-collect/index'
}); });
}, },
jumpHistory() { jumpHistory() {
wx.navigateTo({ wx.navigateTo({
url: '/pages/usercenter/goods-history/index' url: '/pages/usercenter/goods-history/index'
}); });
}, },
openMakePhone() { openMakePhone() {
this.setData({ this.setData({
@ -327,14 +329,15 @@ Page({
} }
}, },
getVersionInfo() { // 获取客服列表
const versionInfo = wx.getAccountInfoSync(); onGetCustomerServiceList() {
const { getCustomerServiceList().then((res) => {
version, console.log(res);
envVersion = __wxConfig if (res.code == 200) {
} = versionInfo.miniProgram; this.setData({
this.setData({ CustomerService: res.data[0]
versionNo: envVersion === 'release' ? version : envVersion, })
}); }
})
}, },
}); });

View File

@ -1,12 +1,4 @@
<t-user-center-card <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" />
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"> <view class="content-wrapper">
@ -28,34 +20,26 @@
</view> </view>
<view wx:for="{{menuData}}" wx:key="item" class="cell-box"> <view wx:for="{{menuData}}" wx:key="item" class="cell-box">
<t-cell-group> <t-cell-group>
<t-cell <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">
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-icon name="{{xitem.icon}}" size="48rpx" slot="note" />
</t-cell> </t-cell>
</t-cell-group> </t-cell-group>
</view> </view>
</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"> <t-popup visible="{{showMakePhone}}" placement="bottom" bind:visible-change="closeMakePhone" data-index="2">
<view class="popup-content"> <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}} 服务时间: {{customerServiceInfo.serviceTimeDuration}}
</view> </view>
<view class="popup-phone {{showKefu ? 'border-bottom-1px' : ''}}" bind:tap="call">电话客服</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 class="popup-close" bind:tap="closeMakePhone">取消</view>
</view> </view>
</t-popup> </t-popup>

View File

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

View File

@ -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);
}
});
});
}