feat(home): 将首页菜单改为硬编码

- 首页4个功能按钮改为硬编码,删除后端接口请求
- 菜单项包括:我要推荐、客户列表、邀请好友、个人中心
- 菜单图标使用OSS直链,减少接口延迟
- Grid组件中map数据源由接口返回改为本地硬编码数据
- ContactSection中在线咨询功能改用button标签并简化逻辑
- 增加ContactSection按钮样式覆盖,去除默认边框和样式
This commit is contained in:
2026-04-09 13:52:06 +08:00
parent 61025522aa
commit f14e190a79
6 changed files with 334 additions and 61 deletions

View File

@@ -24,6 +24,18 @@
padding: 16px 18px;
border-radius: 14px;
transition: opacity 0.2s;
border: none;
outline: none;
background: none;
font-size: inherit;
line-height: inherit;
text-align: left;
width: 100%;
box-sizing: border-box;
&::after {
display: none;
}
&:active {
opacity: 0.8;

View File

@@ -31,39 +31,6 @@ const ContactSection: React.FC = () => {
})
}
const handleOnlineChat = () => {
Taro.getStorage({
key: 'userInfo',
success: (_) => {
Taro.navigateTo({
url: '/pages/user/chat/conversation/index',
fail: (err) => {
console.error('跳转失败:', err)
Taro.showToast({title: '跳转失败,请稍后重试', icon: 'none'})
}
})
},
fail: () => {
Taro.showModal({
title: '登录提示',
content: '需要登录后才能在线咨询,是否立即登录?',
confirmText: '去登录',
cancelText: '稍后再说',
success: (loginRes) => {
if (loginRes.confirm) {
Taro.navigateTo({
url: '/pages/passport/login',
fail: (err) => {
console.error('跳转到登录页失败:', err)
Taro.showToast({title: '跳转失败', icon: 'none'})
}
})
}
}
})
}
})
}
return (
<View className={'px-2'}>
@@ -86,13 +53,13 @@ const ContactSection: React.FC = () => {
</View>
</View>
<View className="contact-section__action contact-section__action--secondary" onClick={handleOnlineChat}>
<button className="contact-section__action contact-section__action--secondary" open-type="contact">
<Message size={22} color="#3b82f6"/>
<View className="contact-section__action-text">
<Text className="text-17 font-semibold text-white">线</Text>
<Text className="text-sm text-white"></Text>
</View>
</View>
</button>
</View>
{/* 底部信息 */}

View File

@@ -1,32 +1,44 @@
import {useEffect, useState} from 'react'
import {Grid} from '@nutui/nutui-react-taro'
import {Avatar} from '@nutui/nutui-react-taro'
import {View, Text} from '@tarojs/components'
import {listCmsNavigation} from "@/api/cms/cmsNavigation";
import {CmsNavigation} from "@/api/cms/cmsNavigation/model";
import navTo from "@/utils/common";
interface MenuItem {
id: number;
title: string;
icon: string;
path: string;
}
// 硬编码首页菜单数据
const menuList: MenuItem[] = [
{
id: 1,
title: '我要推荐',
icon: 'https://oss.wsdns.cn/20260330/5f54527123864193b0a2078f812b117f.png?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90',
path: '/dealer/qrcode/index'
},
{
id: 2,
title: '客户列表',
icon: 'https://oss.wsdns.cn/20260330/24485bb4684d4ae2a64cc7dd49ec4d3d.png?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90',
path: '/dealer/customer/index'
},
{
id: 3,
title: '邀请好友',
icon: 'https://oss.wsdns.cn/20260330/64cac0d5cbe645af8a574a257cd00302.png?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90',
path: '/dealer/qrcode/index'
},
{
id: 4,
title: '个人中心',
icon: 'https://oss.wsdns.cn/20260330/6b198116f2d94b1e942c55ebe2f73728.png?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90',
path: '/user/wallet/wallet'
}
];
const MyGrid = () => {
const [list, setList] = useState<CmsNavigation[]>([])
const reload = async () => {
// 读取首页菜单
const home = await listCmsNavigation({model: 'index'});
const homeId = home[0].navigationId;
if(homeId){
const menu = await listCmsNavigation({home: 0, parentId: homeId, hide: 0})
setList(menu)
}
}
useEffect(() => {
reload().then()
}, [])
if (list.length == 0) {
return <></>
}
// @ts-ignore
return (
<>
<View className={'p-0'}>
@@ -36,8 +48,8 @@ const MyGrid = () => {
'--nutui-grid-border-color': 'transparent',
}}>
{
list.map((item) => (
<Grid.Item key={item.navigationId} onClick={() => navTo(`${item.path}`,true)}>
menuList.map((item) => (
<Grid.Item key={item.id} onClick={() => navTo(`${item.path}`,true)}>
<Avatar src={item.icon} className={'mb-1'} shape="square" style={{
backgroundColor: 'transparent',
}}/>