freedakgmail
b239465e78
- 后端: 新增3个组织级列表接口 (training/performance/disciplinary /list) - 前端: 新增3个列表页面，支持搜索、分页、新增/编辑/删除弹窗 - 侧边栏: 团队分组新增培训记录、绩效考核、违纪记录入口 - 路由+面包屑注册 - 社公商保改名为社保公积金
64 lines
2.6 KiB
TypeScript
64 lines
2.6 KiB
TypeScript
/**
|
|
* 面包屑导航组件
|
|
* 根据当前路由自动生成分组 > 页面 的层级面包屑
|
|
*/
|
|
|
|
import { Link, useLocation } from 'react-router-dom'
|
|
import { ChevronRight, Home } from 'lucide-react'
|
|
|
|
interface BreadcrumbItem {
|
|
group: string
|
|
label: string
|
|
}
|
|
|
|
const ROUTE_MAP: Record<string, BreadcrumbItem> = {
|
|
'/': { group: '工作台', label: '总览' },
|
|
'/calendar': { group: '工作台', label: '工作日历' },
|
|
'/roster': { group: '员工管理', label: '花名册' },
|
|
'/work-process': { group: '员工管理', label: '用工办理' },
|
|
'/attendance': { group: '员工管理', label: '考勤确认' },
|
|
'/leave-approval': { group: '员工管理', label: '休假审批' },
|
|
'/termination': { group: '员工管理', label: '解聘补偿' },
|
|
'/special-status': { group: '员工管理', label: '特殊状态' },
|
|
'/training-records': { group: '员工管理', label: '培训记录' },
|
|
'/performance-records': { group: '员工管理', label: '绩效考核' },
|
|
'/disciplinary-records': { group: '员工管理', label: '违纪记录' },
|
|
'/money': { group: '薪税社保', label: '薪税管理' },
|
|
'/social': { group: '薪税社保', label: '社保公积金' },
|
|
'/evidence': { group: '合规风控', label: '证据链' },
|
|
'/policies': { group: '合规风控', label: '规章制度' },
|
|
'/tools/health-check': { group: '合规风控', label: '用工体检' },
|
|
'/tools/medical-period': { group: '合规风控', label: '医疗期计算' },
|
|
'/tools/annual-value': { group: '合规风控', label: '年度价值' },
|
|
'/ai-assistant': { group: 'AI 辅助', label: 'AI 顾问' },
|
|
'/templates': { group: 'AI 辅助', label: '文本模板' },
|
|
'/notifications': { group: '系统', label: '通知管理' },
|
|
'/audit': { group: '系统', label: '操作日志' },
|
|
'/settings': { group: '系统', label: '设置' },
|
|
}
|
|
|
|
export default function Breadcrumb() {
|
|
const location = useLocation()
|
|
const path = location.pathname
|
|
const item = ROUTE_MAP[path]
|
|
|
|
if (!item) return null
|
|
|
|
return (
|
|
<nav className="flex items-center gap-1 text-xs text-gray-400" aria-label="面包屑导航">
|
|
<Link to="/" className="flex items-center gap-1 hover:text-gray-600 transition-colors">
|
|
<Home className="w-3 h-3" />
|
|
<span>首页</span>
|
|
</Link>
|
|
{item.group !== '工作台' && (
|
|
<>
|
|
<ChevronRight className="w-3 h-3 text-gray-300" />
|
|
<span className="text-gray-400">{item.group}</span>
|
|
</>
|
|
)}
|
|
<ChevronRight className="w-3 h-3 text-gray-300" />
|
|
<span className="text-gray-700 font-medium">{item.label}</span>
|
|
</nav>
|
|
)
|
|
}
|