freedakgmail
2968484d2d
- Money.tsx (2260行→54行): 拆分为 money/ 子目录4个组件, React.lazy二级分割 - AIAssistant.tsx (2038行→63行): 拆分为 ai-assistant/ 子目录6个组件, React.lazy二级分割 - xlsx改为动态导入, OvertimeTab从345KB降至12.7KB - api-services.ts: 请求参数 any→Record<string,unknown> - 移除前端3处console.log残留 - 后端console替换为pino logger - 前后端未使用import/变量清理 - Zod schema验证: termination/platform/special-status/work-process - 新增 leave.routes.ts, acceptance-test.routes.ts - UI组件: PageGuide, QueryError, Stepper
55 lines
2.4 KiB
TypeScript
55 lines
2.4 KiB
TypeScript
import { useState, lazy, Suspense } from 'react'
|
|
import { Layers, Wallet, LayoutTemplate, Clock, Receipt, Loader2 } from 'lucide-react'
|
|
|
|
const BatchManager = lazy(() => import('./money/BatchTab').then(m => ({ default: m.BatchManager })))
|
|
const TemplateManager = lazy(() => import('./money/TemplateTab').then(m => ({ default: m.TemplateManager })))
|
|
const OvertimeCalculator = lazy(() => import('./money/OvertimeTab').then(m => ({ default: m.OvertimeCalculator })))
|
|
const PayslipManager = lazy(() => import('./money/PayslipTab').then(m => ({ default: m.PayslipManager })))
|
|
|
|
type Tab = 'batch' | 'template' | 'overtime' | 'payslip'
|
|
|
|
export default function Money() {
|
|
const [tab, setTab] = useState<Tab>('batch')
|
|
|
|
const tabs: { key: Tab; label: string; icon: React.ReactNode }[] = [
|
|
{ key: 'batch', label: '发薪批次', icon: <Layers className="w-4 h-4" /> },
|
|
{ key: 'template', label: '薪酬模版', icon: <LayoutTemplate className="w-4 h-4" /> },
|
|
{ key: 'overtime', label: '加班费计算', icon: <Clock className="w-4 h-4" /> },
|
|
{ key: 'payslip', label: '工资条管理', icon: <Receipt className="w-4 h-4" /> },
|
|
]
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<div className="flex items-center gap-2">
|
|
<Wallet className="w-5 h-5 text-primary" />
|
|
<div>
|
|
<h1 className="text-base font-semibold">薪税管理</h1>
|
|
<p className="mt-1 text-sm text-gray-500">统一管理发薪批次、工资条及加班薪酬</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex gap-1 border-b overflow-x-auto">
|
|
{tabs.map((t) => (
|
|
<button
|
|
key={t.key}
|
|
onClick={() => setTab(t.key)}
|
|
className={`flex items-center gap-1.5 px-4 py-2 text-sm font-medium border-b-2 transition-colors whitespace-nowrap ${
|
|
tab === t.key ? 'border-primary text-primary' : 'border-transparent text-gray-500 hover:text-gray-700'
|
|
}`}
|
|
>
|
|
{t.icon}
|
|
{t.label}
|
|
</button>
|
|
))}
|
|
</div>
|
|
|
|
<Suspense fallback={<div className="flex items-center justify-center py-12"><Loader2 className="w-5 h-5 animate-spin text-gray-400" /></div>}>
|
|
{tab === 'batch' && <BatchManager />}
|
|
{tab === 'template' && <TemplateManager />}
|
|
{tab === 'overtime' && <OvertimeCalculator />}
|
|
{tab === 'payslip' && <PayslipManager />}
|
|
</Suspense>
|
|
</div>
|
|
)
|
|
}
|