feat(user): 修改帮助中心联系客服入口为直连微信客服

- 替换原跳转页面逻辑,使用微信 Button 组件直接调起微信客服
- 设置 Button 关键属性 openType、sessionFrom、showMessageCard、sendMessageTitle 和 onContact 回调
- 重置 Button 样式保持原视觉,调整高度、内边距和圆角
- 从 @tarojs/components 中引入 Button 组件
- 提醒微信客服 Button 在开发者工具无效,需真机预览测试
This commit is contained in:
2026-07-15 14:27:15 +08:00
parent 6dbe128ddd
commit ca6ba52993
2 changed files with 25 additions and 6 deletions

View File

@@ -129,3 +129,11 @@
- 编译验证:后端 Maven compile 成功;前端 vue-tsc 无 shopGoodsBrowse 相关错误
- 待操作:后端需重新部署(新增了 admin 删除接口);管理后台需配置菜单
## 帮助中心联系客服入口改为直连微信客服
- 文件:`src/pages/user/help-center/index.tsx`
- 改动:点击「联系在线客服」不再跳转 `/pages/user/customer-service/index`,而是直接用 `<Button openType="contact">` 调起微信客服
- 关键属性:`openType="contact"` + `sessionFrom="help_center"` + `showMessageCard` + `sendMessageTitle="欢迎咨询"` + `onContact` 回调
- Button 样式重置height:auto / lineHeight:normal / padding:16px / border:none / borderRadius:8px保持原视觉白底圆角卡片
- 引入:从 `@tarojs/components` 新增导入 `Button`
- 注意:微信客服 Button 在开发者工具中无效,需真机预览测试

View File

@@ -1,5 +1,5 @@
import React, { useState } from 'react'
import { View, Text, ScrollView } from '@tarojs/components'
import { View, Text, ScrollView, Button } from '@tarojs/components'
import Taro from '@tarojs/taro'
import EmptyState from '@/components/common/EmptyState'
@@ -127,14 +127,25 @@ const HelpCenterPage: React.FC = () => {
</View>
))}
{/* 联系客服入口 */}
<View
className='bg-white rounded-lg p-4 flex items-center justify-center gap-2 mt-3'
onClick={() => Taro.navigateTo({ url: '/pages/user/customer-service/index' })}
{/* 联系客服入口 - 直接进入微信客服 */}
<Button
openType="contact"
sessionFrom="help_center"
showMessageCard
sendMessageTitle="欢迎咨询"
onContact={(e: any) => console.log('客服会话回调:', e.detail)}
className='bg-white rounded-lg w-full mt-3 flex items-center justify-center gap-2'
style={{
height: 'auto',
lineHeight: 'normal',
padding: '16px',
border: 'none',
borderRadius: '8px',
}}
>
<Text className='text-xl'>📞</Text>
<Text className='text-sm text-blue-500'>线</Text>
</View>
</Button>
<View className='h-4'></View>
</View>