import React from 'react';
|
import './index.less';
|
import { caseQuery_2, home_6, home_7, home_8, home_9 } from '../../assets/img';
|
import NavBarPage from '../../components/NavBarPage';
|
import { useHistory } from 'react-router-dom';
|
|
// 底部导航项
|
const bottomNavItems = [
|
{ id: 'home', icon: home_6, text: '首页', path: '/gzdyh/home' },
|
{ id: 'message', icon: home_7, text: '消息', path: '/gzdyh/message' },
|
{ id: 'count', icon: home_8, text: '统计', path: '/gzdyh/workStatistics' },
|
{ id: 'personCenter', icon: home_9, text: '我的', path: '/gzdyh/personCenter' },
|
];
|
|
const Message = () => {
|
const history = useHistory();
|
|
// 渲染底部导航
|
const renderBottomNav = () => {
|
return (
|
<div className="home-bottom-nav">
|
{bottomNavItems.map((item) => {
|
const isActive = item.id === 'message';
|
return (
|
<div
|
key={item.id}
|
className={`home-bottom-nav-item${isActive ? ' home-bottom-nav-item-active' : ''}`}
|
onClick={() => history.push(item.path)}
|
>
|
<div className="home-bottom-nav-item-icon">
|
<img src={isActive && item.activeIcon ? item.activeIcon : item.icon} alt={item.text} />
|
</div>
|
<div className="home-bottom-nav-item-text">{item.text}</div>
|
</div>
|
);
|
})}
|
</div>
|
);
|
};
|
|
return (
|
<NavBarPage title="消息">
|
<div className="home-container">
|
<div className="message-empty-container">
|
<img className="message-empty-img" src={caseQuery_2} alt="暂无消息" />
|
<div className="message-empty-title">暂无消息</div>
|
<div className="message-empty-desc">你暂时还没有收到任何消息</div>
|
</div>
|
{/* 底部导航 */}
|
{/* {renderBottomNav()} */}
|
</div>
|
</NavBarPage>
|
);
|
};
|
|
export default Message;
|