auto-save 2026-04-13 18:59 (+1)

web/app/page.tsx

@@ -0,0 +1,51 @@
+import { Plus } from 'lucide-react'
+import Link from 'next/link'
+import { AppShell } from '@/components/app-shell'
+import { MeetingCard } from '@/components/meeting-card'
+import { mockMeetings, groupByDate, dateLabel } from '@/lib/mock-data'
+
+export default function HomePage() {
+  const groups = groupByDate(mockMeetings)
+  const days = Object.keys(groups).sort().reverse()
+
+  return (
+    <AppShell>
+      <div className="mx-auto max-w-4xl px-5 py-8 md:px-10 md:py-10">
+        <header className="mb-8 flex items-center justify-between">
+          <div>
+            <h1 className="text-[26px] font-semibold tracking-tight">会议记录</h1>
+            <p className="mt-1 text-[14px] text-muted-foreground">
+              共 {mockMeetings.length} 次会议 · 总时长{' '}
+              {Math.round(mockMeetings.reduce((s, m) => s + m.duration, 0) / 60)} 分钟
+            </p>
+          </div>
+          <Link
+            href="/upload"
+            className="inline-flex items-center gap-2 rounded-full bg-primary px-5 py-2.5 text-[14px] font-medium text-primary-foreground transition-colors hover:bg-primary-light"
+          >
+            <Plus className="h-4 w-4" />
+            新建会议
+          </Link>
+        </header>
+
+        <div className="space-y-8">
+          {days.map((day) => (
+            <section key={day}>
+              <div className="mb-3 flex items-center gap-3">
+                <h2 className="text-[13px] font-medium text-muted-foreground">
+                  {dateLabel(day)}
+                </h2>
+                <div className="h-px flex-1 bg-border" />
+              </div>
+              <div className="space-y-3">
+                {groups[day].map((m) => (
+                  <MeetingCard key={m.id} meeting={m} />
+                ))}
+              </div>
+            </section>
+          ))}
+        </div>
+      </div>
+    </AppShell>
+  )
+}