refactor: 简化工作台上手入口和个人设置(portal-onboarding-profile-simplification)

这个提交包含在:
2026-05-29 18:28:40 +08:00
父节点 48260b57b7
当前提交 6b7dce4651
共修改 12 个文件,包含 443 行新增和 319 行删除
-130
查看文件
@@ -25,8 +25,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from "../components/ui/tabs"
import { employeePortalSchema, managerPortalSchema } from "../features/portal/schema";
import {
clearWelcomeDialogFlag,
dismissGettingStartedCard,
shouldShowGettingStartedCard,
shouldShowWelcomeDialog,
} from "../lib/onboardingGuide";
import { readRecentVisits } from "../lib/recentVisits";
@@ -77,14 +75,6 @@ type PortalFocusLink = {
to: string;
};
type GettingStartedChecklistItem = {
key: string;
title: string;
description: string;
href: string;
completed: boolean;
};
const LEAVE_PORTAL_PERMISSIONS = ["leave.view_own", "leave.view_all", "leave.create", "leave.submit"];
const EXPENSE_PORTAL_PERMISSIONS = ["expense.view_own", "expense.view_all", "expense.create", "expense.proxy_manage"];
const PROCUREMENT_PORTAL_PERMISSIONS = ["procurement.view_own", "procurement.view_all", "procurement.create", "procurement.submit"];
@@ -581,70 +571,6 @@ function PortalSectionFallback({
);
}
function GettingStartedCard({
items,
completedCount,
onDismiss,
}: {
items: GettingStartedChecklistItem[];
completedCount: number;
onDismiss: () => void;
}) {
const progressPercent = items.length ? Math.round((completedCount / items.length) * 100) : 0;
return (
<SectionPanel
title="快速上手"
description="基础设置"
actions={(
<button
type="button"
className="text-sm font-medium text-zinc-500 transition-colors hover:text-zinc-700"
data-testid="onboarding-getting-started-dismiss"
onClick={onDismiss}
>
关闭清单
</button>
)}
className="shadow-sm"
>
<div className="space-y-3" data-testid="onboarding-getting-started-card">
{items.map((item) => (
<Link
key={item.key}
to={item.href}
className="portal-list-card flex items-center gap-3"
>
<span className={item.completed ? "text-emerald-600" : "text-zinc-400"}>
<span className="material-symbols-outlined text-[20px]">
{item.completed ? "check_circle" : "radio_button_unchecked"}
</span>
</span>
<div className="min-w-0 flex-1">
<div className="font-medium text-zinc-900">{item.title}</div>
<div className="mt-1 text-sm leading-6 text-zinc-500">{item.description}</div>
</div>
<span className="material-symbols-outlined text-zinc-400">arrow_forward</span>
</Link>
))}
<div className="rounded-lg border border-slate-200 bg-slate-50 px-3.5 py-3">
<div className="flex items-center justify-between gap-3 text-sm">
<span className="font-medium text-zinc-900">完成进度</span>
<span className="text-zinc-500">{completedCount}/{items.length}</span>
</div>
<div className="mt-3 h-2 overflow-hidden rounded-full bg-slate-200">
<div
className="h-full rounded-full bg-primary transition-all"
style={{ width: `${progressPercent}%` }}
/>
</div>
</div>
</div>
</SectionPanel>
);
}
function QuickActionTile({
icon,
label,
@@ -882,7 +808,6 @@ function ActivityAnnouncementsPanel({
export function PortalHomePage() {
const { me, permissions } = useAuth();
const [showWelcome, setShowWelcome] = useState(false);
const [showGettingStarted, setShowGettingStarted] = useState(false);
const portalQuery = useQuery({ queryKey: ["portal-home"], queryFn: () => fetchPortalHome() });
const workflowSummaryQuery = useQuery({
enabled: hasAnyPermission(permissions, APPROVAL_PORTAL_PERMISSIONS),
@@ -898,41 +823,8 @@ export function PortalHomePage() {
useEffect(() => {
setShowWelcome(shouldShowWelcomeDialog());
setShowGettingStarted(shouldShowGettingStartedCard());
}, []);
const gettingStartedItems: GettingStartedChecklistItem[] = [
{
key: "profile",
title: "完善个人资料",
description: "补充紧急联系人和银行账户",
href: "/settings/profile",
completed: (me?.profileCompleteness?.score ?? 0) >= 50,
},
{
key: "notification-preferences",
title: "设置通知偏好",
description: "选择是否接收外部渠道推送",
href: "/settings/profile",
completed: true,
},
{
key: "leave-flow",
title: "了解请假流程",
description: "查看假期类型和余额",
href: "/leave-requests",
completed: false,
},
{
key: "notifications",
title: "查看通知中心",
description: "了解审批和业务消息",
href: "/notifications",
completed: false,
},
];
const gettingStartedCompletedCount = gettingStartedItems.filter((item) => item.completed).length;
if (portalQuery.isLoading) {
return <div className="card-std p-5 text-sm text-zinc-500">加载工作台中...</div>;
}
@@ -976,11 +868,6 @@ export function PortalHomePage() {
setShowWelcome(false);
}
function handleDismissGettingStarted() {
dismissGettingStartedCard();
setShowGettingStarted(false);
}
const employeeSummaryItems = ([
{
key: "expense",
@@ -1208,23 +1095,6 @@ export function PortalHomePage() {
hiddenFocusCount={Math.max(todoAggregateItems.length - 1, 0)}
/>
{showGettingStarted ? (
<ErrorBoundary
fallback={(
<PortalSectionFallback
title="快速上手"
description="基础设置"
/>
)}
>
<GettingStartedCard
items={gettingStartedItems}
completedCount={gettingStartedCompletedCount}
onDismiss={handleDismissGettingStarted}
/>
</ErrorBoundary>
) : null}
<SecondaryWorkspacePanel
title="团队与通知"
description="团队状态、动态和公告"