统一PC前端布局密度（05-28-pc-frontend-layout-unification）

client/src/pages/SystemSettingsPage.tsx

@@ -2,14 +2,14 @@ import { Link } from "react-router-dom";
 import { ListWorkspace, WorkspaceHeader } from "../components/patterns/ListWorkspace";
 
 const ITEMS = [
-  { to: "/system/workspace", title: "工作区设置", description: "调整小团队模式的导航与模块显隐。" },
-  { to: "/people", title: "人员管理", description: "处理入职、转正、调岗、离职与档案。" },
-  { to: "/system/approval-rules", title: "审批规则", description: "维护仍在使用的简单审批链与规则。" },
-  { to: "/system/expense-standards", title: "费用标准", description: "维护报销费用类型上限与 warn/block 管控模式。" },
-  { to: "/system/reimbursement-templates", title: "报销模板", description: "维护差旅费、招待费、办公用品等常见报销模板。" },
-  { to: "/system/master-data", title: "主数据", description: "维护费用、法体、成本中心等主数据。" },
-  { to: "/system/notification-channels", title: "通知渠道", description: "继续保留 IM/邮件等补充通知渠道。" },
-  { to: "/system/integrations/erp", title: "外部系统桥接", description: "查看财务与外部系统桥接能力及出入口。" },
+  { to: "/system/workspace", icon: "dashboard_customize", title: "工作区设置", description: "导航与模块显隐。" },
+  { to: "/people", icon: "badge", title: "人员管理", description: "入转调离与档案。" },
+  { to: "/system/approval-rules", icon: "account_tree", title: "审批规则", description: "审批链与规则。" },
+  { to: "/system/expense-standards", icon: "rule_settings", title: "费用标准", description: "费用上限与管控。" },
+  { to: "/system/reimbursement-templates", icon: "receipt_long", title: "报销模板", description: "常见报销模板。" },
+  { to: "/system/master-data", icon: "database", title: "主数据", description: "法体、成本中心、供应商。" },
+  { to: "/system/notification-channels", icon: "notifications", title: "通知渠道", description: "IM / 邮件补充通知。" },
+  { to: "/system/integrations/erp", icon: "hub", title: "外部系统桥接", description: "财务出入口与桥接。" },
 ];
 
 export function SystemSettingsPage() {
@@ -26,8 +26,15 @@ export function SystemSettingsPage() {
       <div className="admin-tile-grid">
         {ITEMS.map((item) => (
           <Link key={item.to} to={item.to} className="admin-tile-card">
-            <div className="text-base font-semibold text-zinc-900">{item.title}</div>
-            <div className="mt-2 text-sm text-zinc-600">{item.description}</div>
+            <div className="flex items-start gap-3">
+              <span className="admin-tile-card__icon">
+                <span className="material-symbols-outlined text-[20px]">{item.icon}</span>
+              </span>
+              <span className="min-w-0">
+                <span className="block text-base font-semibold text-zinc-900">{item.title}</span>
+                <span className="mt-1 block text-sm leading-5 text-zinc-600">{item.description}</span>
+              </span>
+            </div>
           </Link>
         ))}
       </div>