feat: Sprint 2 — Stepper/InlineAlert组件 + 首页TaskCenter任务中心 + /workspace/next-actions API + Money.tsx BatchDetail集成工作流步骤条和质量门禁

frontend/src/pages/Dashboard.tsx

@@ -13,6 +13,7 @@ import Pagination from '../components/ui/Pagination'
 import type { DashboardData } from '../types'
 import TurnoverStats from './dashboard/TurnoverStats'
 import PerformanceStats from './dashboard/PerformanceStats'
+import { TaskCenter } from './dashboard/TaskCenter'
 
 function fmt(n: number) {
   return `¥${(n || 0).toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`
@@ -268,6 +269,9 @@ export default function Dashboard() {
       {/* 概览 Tab */}
       {activeTab === 'overview' && (
         <div className="space-y-3">
+          {/* 任务中心 */}
+          <TaskCenter />
+
           {/* 合规健康度评分 + AI 建议卡片流 */}
           {complianceScore && (
             <div className="space-y-3">

frontend/src/pages/Money.tsx

@@ -4,6 +4,8 @@ import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
 import { useConfirm } from '../hooks/useConfirm'
 import * as XLSX from 'xlsx'
 import { Calculator, AlertCircle, Info, Check, Upload, Layers, Settings as SettingsIcon, Archive, Plus, Trash2, AlertTriangle, Download, FileText, X, ChevronLeft, Wallet, LayoutTemplate, Clock, Receipt, Users, TrendingDown, TrendingUp, BadgeCheck } from 'lucide-react'
+import { Stepper, type Step } from '../components/ui/Stepper'
+import { InlineAlert } from '../components/ui/InlineAlert'
 import api from '../lib/api'
 import { useAuthStore } from '../store/authStore'
 import Card from '../components/ui/Card'
@@ -934,6 +936,39 @@ function BatchDetail({ batchId, onBack }: { batchId: string; onBack: () => void
         )}
       </div>
 
+      {/* 发薪工作流步骤条 */}
+      <Card className="p-4">
+        <Stepper
+          steps={[
+            { key: 'edit', title: '编辑薪资', description: '填写/导入工资数据', status: isArchived ? 'complete' : 'current' },
+            { key: 'review', title: '核对汇总', description: '检查应发/个税/实发', status: isArchived ? 'complete' : 'pending' },
+            { key: 'archive', title: '归档锁定', description: '归档后不可编辑', status: isArchived ? 'complete' : 'pending' },
+            { key: 'publish', title: '发布工资条', description: '员工端可见', status: batch.payslipPublished ? 'complete' : 'pending' },
+          ] as Step[]}
+        />
+      </Card>
+
+      {/* 质量门禁 — 草稿状态下检查异常 */}
+      {!isArchived && batch.entries.length > 0 && (
+        <>
+          {batch.entries.some((e: any) => e.totalPay > 0 && e.netPay <= 0) && (
+            <InlineAlert type="error" title="存在实发为负的员工">
+              请检查社保/公积金基数是否过大，导致实发工资 ≤ 0 的记录需修正后再归档。
+            </InlineAlert>
+          )}
+          {batch.entries.some((e: any) => e.baseSalary === 0 && e.bonus === 0 && e.totalPay === 0) && (
+            <InlineAlert type="warning" title="存在全零记录">
+              部分员工所有金额为 0，请确认是否需要填写或移除这些人员。
+            </InlineAlert>
+          )}
+          {batch.entries.some((e: any) => e.riskWarnings && e.riskWarnings.length > 0) && (
+            <InlineAlert type="warning" title="存在风险预警">
+              部分员工有薪资风险提示（如社保基数偏低/偏高），请在「风险」列查看详情。
+            </InlineAlert>
+          )}
+        </>
+      )}
+
       {/* 批次汇总 */}
       <div className="grid grid-cols-2 md:grid-cols-4 gap-3">
         <Card className="flex items-center gap-3">

frontend/src/pages/dashboard/TaskCenter.tsx

@@ -0,0 +1,139 @@
+/**
+ * TaskCenter 任务中心组件 — 展示待办队列、人员动态和下一步行动
+ * 从 /dashboard/workspace/next-actions 获取数据，按优先级分组展示
+ */
+import { useQuery } from '@tanstack/react-query'
+import { Link } from 'react-router-dom'
+import { AlertCircle, Layers, FileText, Heart, ArrowRight, ListTodo } from 'lucide-react'
+import api from '../../lib/api'
+import { InlineAlert } from '../../components/ui/InlineAlert'
+
+interface NextAction {
+  id: string
+  title: string
+  subtitle?: string
+  type?: string
+  level?: string
+  dueDate?: string
+  link: string
+}
+
+interface ActionGroup {
+  category: string
+  priority: 'high' | 'medium' | 'low'
+  items: NextAction[]
+}
+
+const categoryIcons: Record<string, typeof AlertCircle> = {
+  '待办事项': AlertCircle,
+  '发薪批次': Layers,
+  '合同到期': FileText,
+  '特殊状态': Heart,
+}
+
+const priorityColors: Record<string, string> = {
+  high: 'text-danger',
+  medium: 'text-warning',
+  low: 'text-info',
+}
+
+/**
+ * 任务中心 — 首页核心组件，聚合展示需要关注的行动项
+ */
+export function TaskCenter() {
+  const { data, isLoading } = useQuery<{ actions: ActionGroup[]; totalCount: number }>({
+    queryKey: ['next-actions'],
+    queryFn: async () => {
+      const res = await api.get('/dashboard/workspace/next-actions') as any
+      return res.data
+    },
+    staleTime: 60_000,
+  })
+
+  if (isLoading) {
+    return (
+      <div className="card p-4">
+        <div className="flex items-center gap-2 mb-3">
+          <ListTodo className="w-4 h-4 text-brand-600" />
+          <h3 className="text-sm font-medium text-ink-700">任务中心</h3>
+        </div>
+        <div className="space-y-2">
+          {[1, 2, 3].map(i => (
+            <div key={i} className="h-12 rounded-md bg-surface-muted animate-pulse" />
+          ))}
+        </div>
+      </div>
+    )
+  }
+
+  if (!data || data.totalCount === 0) {
+    return (
+      <div className="card p-4">
+        <div className="flex items-center gap-2 mb-3">
+          <ListTodo className="w-4 h-4 text-brand-600" />
+          <h3 className="text-sm font-medium text-ink-700">任务中心</h3>
+        </div>
+        <InlineAlert type="success" title="暂无待办">
+          当前没有需要处理的事项，一切正常。
+        </InlineAlert>
+      </div>
+    )
+  }
+
+  return (
+    <div className="card p-4">
+      <div className="flex items-center justify-between mb-3">
+        <div className="flex items-center gap-2">
+          <ListTodo className="w-4 h-4 text-brand-600" />
+          <h3 className="text-sm font-medium text-ink-700">任务中心</h3>
+          <span className="text-xs text-ink-400">{data.totalCount} 项待处理</span>
+        </div>
+      </div>
+
+      <div className="space-y-3">
+        {data.actions.map((group) => {
+          const Icon = categoryIcons[group.category] || AlertCircle
+          return (
+            <div key={group.category}>
+              {/* 分类标题 */}
+              <div className="flex items-center gap-1.5 mb-1.5">
+                <Icon className={`w-3.5 h-3.5 ${priorityColors[group.priority]}`} />
+                <span className="text-xs font-medium text-ink-600">{group.category}</span>
+                <span className="text-xs text-ink-400">({group.items.length})</span>
+              </div>
+              {/* 行动项列表 */}
+              <div className="space-y-1 ml-5">
+                {group.items.slice(0, 5).map((item) => (
+                  <Link
+                    key={item.id}
+                    to={item.link}
+                    className="flex items-center justify-between gap-2 px-2 py-1.5 rounded-md hover:bg-surface-muted transition-colors group"
+                  >
+                    <div className="flex-1 min-w-0">
+                      <div className="text-sm text-ink-900 truncate">{item.title}</div>
+                      {item.subtitle && (
+                        <div className="text-xs text-ink-400 truncate">{item.subtitle}</div>
+                      )}
+                    </div>
+                    {item.dueDate && (
+                      <span className="text-xs text-ink-400 shrink-0">{item.dueDate}</span>
+                    )}
+                    <ArrowRight className="w-3.5 h-3.5 text-ink-300 group-hover:text-brand-600 shrink-0 transition-colors" />
+                  </Link>
+                ))}
+                {group.items.length > 5 && (
+                  <Link
+                    to={group.category === '发薪批次' ? '/money' : group.category === '合同到期' ? '/roster' : '/'}
+                    className="block text-xs text-brand-600 hover:underline px-2 py-1"
+                  >
+                    查看全部 {group.items.length} 项 →
+                  </Link>
+                )}
+              </div>
+            </div>
+          )
+        })}
+      </div>
+    </div>
+  )
+}