MME6 优化移动我的页自适应视觉

client/src/pages/MobileMePage.tsx

@@ -38,10 +38,11 @@ function MobileActionLink({
   return (
     <Link
       to={to}
-      className="flex min-h-12 items-center gap-3 rounded-lg border border-zinc-200 bg-white px-3 py-2 text-left shadow-sm transition-colors hover:bg-zinc-50"
+      className="mobile-me-action-link"
+      data-testid="mobile-me-action-link"
     >
-      <MobileIcon name={icon} className="size-8 rounded-lg bg-zinc-100 p-1.5 text-zinc-700" />
-      <span className="min-w-0">
+      <MobileIcon name={icon} className="mobile-me-action-icon" />
+      <span className="mobile-me-action-copy">
         <span className="block text-sm font-semibold text-zinc-900">{label}</span>
         {description ? <span className="mt-0.5 block text-xs leading-5 text-zinc-500">{description}</span> : null}
       </span>
@@ -81,10 +82,14 @@ export function MobileMePage() {
       <PageHeader title="我的" />
 
       <SectionPanel title="个人信息">
-        <div className="flex items-center gap-3">
-          <EmployeeAvatar name={me?.name ?? "员工"} src={profile?.avatarUrl} size="md" />
-          <div className="min-w-0 space-y-1">
-            <div className="text-lg font-semibold text-zinc-900">{me?.name ?? "-"}</div>
+        <div className="mobile-me-profile-row" data-testid="mobile-me-profile-row">
+          <div className="mobile-me-avatar-slot" data-testid="mobile-me-avatar-slot">
+            <EmployeeAvatar name={me?.name ?? "员工"} src={profile?.avatarUrl} size="md" />
+          </div>
+          <div className="mobile-me-profile-copy" data-testid="mobile-me-profile-copy">
+            <div className="text-lg font-semibold leading-7 text-zinc-900" data-testid="mobile-me-profile-name">
+              {me?.name ?? "-"}
+            </div>
             <div className="text-sm text-zinc-500">{departmentName}</div>
             {me?.employeeNo ? <div className="text-xs text-zinc-400">员工号：{me.employeeNo}</div> : null}
           </div>
@@ -108,7 +113,7 @@ export function MobileMePage() {
       </SectionPanel>
 
       <SectionPanel title="更多入口">
-        <div className="mobile-adaptive-grid" data-testid="mobile-more-links">
+        <div className="mobile-me-entry-grid" data-testid="mobile-more-links">
           <MobileActionLink to="/mobile/notifications" label="通知中心" icon="notifications" />
           <MobileActionLink to="/mobile/leave" label="请假" icon="event_available" />
           <MobileActionLink to="/mobile/reimbursements" label="报销" icon="request_quote" />
@@ -120,7 +125,7 @@ export function MobileMePage() {
 
       {canAccessAdmin ? (
         <SectionPanel title="管理入口">
-          <div className="mobile-adaptive-grid">
+          <div className="mobile-me-entry-grid">
             <MobileActionLink to="/mobile/me" label="人员管理" icon="group" />
             <MobileActionLink to="/mobile/me" label="组织架构" icon="account_tree" />
             <MobileActionLink to="/mobile/me" label="系统设置" icon="settings" />