Преглед изворни кода

fix(mobile): simplify home header and inset greetings

彭峰 пре 1 недеља
родитељ
комит
4c22dcc45a

+ 1 - 2
projects/xiaoshu-mobile/src/app/core/home-learning-modules.integration.spec.ts

@@ -939,8 +939,7 @@ describe('home learning modules', () => {
 
     await harness.navigateByUrl('/pages/home/index');
     expect(harness.fixture.nativeElement.querySelector('.tabbar')).not.toBeNull();
-    expect(harness.routeNativeElement?.querySelectorAll('.home-header .header-action').length).toBe(1);
-    expect(harness.routeNativeElement?.querySelector('.home-header .header-action')?.getAttribute('href')).toBe('/pages/home/search');
+    expect(harness.routeNativeElement?.querySelector('.home-header [aria-label="搜索"]')).toBeNull();
     expect(harness.routeNativeElement?.querySelector('.home-header [aria-label="用户中心"]')).toBeNull();
     expect(harness.routeNativeElement?.querySelector('.memory-hero')).not.toBeNull();
     expect(harness.routeNativeElement?.querySelectorAll('.memory-dot').length).toBe(21);

+ 0 - 3
projects/xiaoshu-mobile/src/app/features/home/home-page.component.html

@@ -1,9 +1,6 @@
 <header class="home-header" [class.coach-home-header]="isCoach()">
   <div class="brand"><img src="/static/images/logo-wordmark.png" alt="小树陪练" /><span>线上与线下,一对一陪练</span></div>
   <p class="greeting" [title]="'你好,' + (session.user()?.honeyName || session.user()?.userName || '同学')">你好,{{ session.user()?.honeyName || session.user()?.userName || '同学' }}</p>
-  @if (!isCoach()) {
-    <a class="header-action" routerLink="/pages/home/search" aria-label="搜索" title="搜索"><lucide-icon [img]="icons.Search" [size]="23" /></a>
-  }
 </header>
 
 <main class="home-main">

+ 4 - 8
projects/xiaoshu-mobile/src/app/features/home/home-page.component.scss

@@ -1,12 +1,10 @@
 :host { display: block; min-height: 100%; background: var(--surface); }
-.home-header { display: grid; min-height: calc(78px + env(safe-area-inset-top)); grid-template-columns: auto minmax(0, 1fr) auto 44px; align-items: end; align-content: center; padding: calc(12px + env(safe-area-inset-top)) 20px 12px; background: var(--surface); border-bottom: 1px solid var(--line-soft); column-gap: 11px; row-gap: 4px; }
-.home-header.coach-home-header { grid-template-columns: auto minmax(0, 1fr) auto; }
+.home-header { display: grid; min-height: calc(78px + env(safe-area-inset-top)); grid-template-columns: auto minmax(0, 1fr) auto; align-items: end; align-content: center; padding: calc(12px + env(safe-area-inset-top)) 20px 12px; background: var(--surface); border-bottom: 1px solid var(--line-soft); column-gap: 11px; row-gap: 4px; }
 .brand { display: contents; }
 .brand img { grid-column: 1; grid-row: 1; width: 154px; height: 43px; object-fit: contain; object-position: left center; }
 .brand span { grid-column: 2; grid-row: 1; min-width: 0; color: var(--brand-deep); font-size: 13px; font-weight: 650; line-height: 1.25; }
-.header-action { grid-column: 4; grid-row: 1; display: grid; width: 44px; height: 44px; color: var(--ink); place-items: center; }
 .home-main { padding: 12px 16px 34px; }
-.greeting { grid-column: 3; grid-row: 1; min-width: 0; max-width: 240px; margin: 0; overflow: hidden; font-size: 15px; line-height: 1.25; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
+.greeting { grid-column: 3; grid-row: 1; min-width: 0; max-width: 240px; margin: 0 12px 0 0; color: var(--brand-deep); overflow: hidden; font-size: 15px; line-height: 1.25; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
 
 .memory-hero, .coach-hero { overflow: hidden; position: relative; color: white; background: linear-gradient(135deg, var(--brand-deep), var(--brand-strong)); border-radius: var(--radius-lg); box-shadow: var(--shadow-brand); }
 .memory-title-row { display: flex; align-items: center; padding: 20px 22px 0; gap: 8px; }
@@ -128,13 +126,11 @@
 
 @keyframes spin { to { transform: rotate(360deg); } }
 .spin { animation: spin .8s linear infinite; }
-@media (hover: hover) { .header-action:hover, .quick-grid a:hover { background: var(--surface-hover); } .continue-button:hover { background: var(--accent-strong); } .coach-memory-list article > button:hover { filter: brightness(.97); } }
+@media (hover: hover) { .quick-grid a:hover { background: var(--surface-hover); } .continue-button:hover { background: var(--accent-strong); } .coach-memory-list article > button:hover { filter: brightness(.97); } }
 @media (max-width: 619px) {
-  .home-header { grid-template-columns: auto minmax(0, 1fr) 44px; column-gap: 8px; }
-  .home-header.coach-home-header { grid-template-columns: auto minmax(0, 1fr); }
+  .home-header { grid-template-columns: auto minmax(0, 1fr); column-gap: 8px; }
   .brand span { grid-column: 1 / -1; grid-row: 2; font-size: 12px; }
   .greeting { grid-column: 2; max-width: 100%; font-size: 13px; }
-  .header-action { grid-column: 3; }
 }
 @media (max-width: 430px) {
   .brand img { width: 132px; height: 37px; }

+ 2 - 2
projects/xiaoshu-mobile/src/app/features/home/home-page.component.ts

@@ -2,7 +2,7 @@ import { ReviewPage, reviewOverview } from '../../core/review-page';
 import { CommonModule } from '@angular/common';
 import { ChangeDetectionStrategy, Component, computed, inject, NgZone, OnDestroy, OnInit, signal } from '@angular/core';
 import { Router, RouterLink } from '@angular/router';
-import { AlertCircle, BarChart3, BookMarked, BookOpen, CalendarDays, Check, ChevronRight, Clock3, Eye, EyeOff, GraduationCap, Info, LucideAngularModule, RefreshCw, Search, UserRound, Zap } from 'lucide-angular';
+import { AlertCircle, BarChart3, BookMarked, BookOpen, CalendarDays, Check, ChevronRight, Clock3, Eye, EyeOff, GraduationCap, Info, LucideAngularModule, RefreshCw, UserRound, Zap } from 'lucide-angular';
 import { finalize, map, Subscription } from 'rxjs';
 import { beijingToday, TeacherTodayReviewService } from '../../core/teacher-today-review.service';
 import { antiForgetCompleted, antiForgetDate, buildAntiForgetView, findAntiForgetList } from '../../core/anti-forget';
@@ -59,7 +59,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
     return stateOrder(left) === 1 ? dateDifference : -dateDifference;
   }));
   readonly coachReviewSummary=computed(()=>this.reviewData()?.summary||{today:0,due:0,completed:0,todayTotal:0,todayCompleted:0,todayPending:0,overduePending:0});
-  readonly icons = { AlertCircle, BarChart3, BookMarked, BookOpen, CalendarDays, Check, ChevronRight, Clock3, Eye, EyeOff, GraduationCap, Info, RefreshCw, Search, UserRound, Zap };
+  readonly icons = { AlertCircle, BarChart3, BookMarked, BookOpen, CalendarDays, Check, ChevronRight, Clock3, Eye, EyeOff, GraduationCap, Info, RefreshCw, UserRound, Zap };
 
   private readonly api = inject(ApiService);
   private readonly router = inject(Router);