From bb1c2718df2822ef407c615a339809da3014d5ae Mon Sep 17 00:00:00 2001
From: "jif2.zhang" <jif2.zhang>
Date: Wed, 16 Sep 2026 10:21:07 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=89=88=E6=9C=AC=E6=97=B6=E9=97=B4?=
 =?UTF-8?q?=E6=88=B3=E7=BB=9F=E4=B8=80=20UTC+8;=20=E9=80=82=E9=85=8D?=
 =?UTF-8?q?=E5=85=A8=E9=9D=A2=E5=B1=8F=E5=AE=89=E5=85=A8=E5=8C=BA;=20?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=88=87=E6=8D=A2=E5=8A=A0=E8=BF=87=E6=B8=A1?=
 =?UTF-8?q?=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- vite buildId 统一按 Asia/Shanghai 生成, CI(UTC) 与本地时区不再漂移
- index.html 加 viewport-fit=cover (env(safe-area-inset-*) 才生效)
- app-shell 顶部 +20px+safe inset, bottom-nav 底部 +20px+safe inset 防状态栏/手势条遮内容
- 页面跳转加淡入上滑动画 (Layout 内嵌页面按 pathname 重挂载, Landing/Login 同款)
---
 index.html                |  2 +-
 src/App.tsx               |  4 ++--
 src/components/Layout.tsx | 13 +++++++++++--
 src/styles/global.css     | 15 ++++++++++++++-
 vite.config.ts            |  7 ++++---
 5 files changed, 32 insertions(+), 9 deletions(-)

diff --git a/index.html b/index.html
index f3e837a..80121e9 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,7 @@
 <html lang="zh-CN">
   <head>
     <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
     <title>Wardrobe</title>
   </head>
   <body>
diff --git a/src/App.tsx b/src/App.tsx
index 4a47f2f..f9b4133 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -39,7 +39,7 @@ function RootGate() {
     const effective = user ?? getStoredUser();
     return <Navigate to={effective ? "/home" : "/login"} replace />;
   }
-  return <Landing />;
+  return <div className="page-enter"><Landing /></div>;
 }
 
 function RouterGate() {
@@ -65,7 +65,7 @@ function RouterGate() {
   return (
     <Routes>
       <Route path="/" element={<RootGate />} />
-      <Route path="/login" element={<Login />} />
+      <Route path="/login" element={<div className="page-enter"><Login /></div>} />
       <Route element={<ProtectedRoute><Layout /></ProtectedRoute>}>
         <Route path="/home" element={<Home />} />
         <Route path="/closet" element={<Closet />} />
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 816e0b0..b8e5123 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -1,3 +1,4 @@
+import { useEffect, useRef } from "react";
 import { Outlet, useNavigate, useLocation } from "react-router-dom";
 import { useAppStore } from "../stores/app";
 
@@ -12,6 +13,12 @@ export default function Layout() {
   const navigate = useNavigate();
   const location = useLocation();
   const user = useAppStore((s) => s.user);
+  const contentRef = useRef<HTMLDivElement>(null);
+
+  // 切换页面时回到顶部 + 触发过渡动画 (key 随路径重挂载)
+  useEffect(() => {
+    contentRef.current?.scrollTo({ top: 0 });
+  }, [location.pathname]);
 
   const isActive = (path: string) =>
     path === "/home" ? location.pathname === "/home" || location.pathname === "/" : location.pathname.startsWith(path);
@@ -23,8 +30,10 @@ export default function Layout() {
 
   return (
     <div className="app-shell">
-      <div className="app-content">
-        <Outlet />
+      <div className="app-content" ref={contentRef}>
+        <div key={location.pathname} className="page-enter">
+          <Outlet />
+        </div>
       </div>
       <nav className="bottom-nav">
         <button className={"nav-item" + (isActive("/home") ? " active" : "")} onClick={() => navigate("/home")}>
diff --git a/src/styles/global.css b/src/styles/global.css
index dfdf330..2fb9d1e 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -61,6 +61,8 @@ textarea {
   height: 100%;
   max-width: 500px;
   margin: 0 auto;
+  /* 顶部避开状态栏/刘海, 再多让出一个行高 (edge-to-edge 时 env() 才生效) */
+  padding-top: calc(env(safe-area-inset-top) + 20px);
 }
 
 .app-content {
@@ -92,7 +94,8 @@ textarea {
   background: var(--bg-card);
   border-top: 1px solid var(--border);
   padding: 6px 8px;
-  padding-bottom: calc(6px + env(safe-area-inset-bottom));
+  /* 底部避开手势条, 再多让出一个行高, 避免文字被遮挡 */
+  padding-bottom: calc(20px + env(safe-area-inset-bottom));
 }
 
 .nav-item {
@@ -270,4 +273,14 @@ textarea {
 @keyframes toast-in {
   from { opacity: 0; transform: translateX(-50%) translateY(-8px); }
   to { opacity: 1; transform: translateX(-50%) translateY(0); }
+}
+
+/* 页面切换动画 (Layout 内嵌页面与 Landing/Login 共用) */
+.page-enter {
+  animation: page-in 0.26s ease forwards;
+}
+
+@keyframes page-in {
+  from { opacity: 0; transform: translateY(12px); }
+  to { opacity: 1; transform: translateY(0); }
 }
\ No newline at end of file
diff --git a/vite.config.ts b/vite.config.ts
index ef9e0e6..a8493f3 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -7,12 +7,13 @@ const host = process.env.TAURI_DEV_HOST;
 
 function buildId() {
   // YYYYMMDD.HHmmss: 每次构建生成新的 BUILD_ID, 用于 OTA/web 升级比对
-  const d = new Date();
+  // 统一按 UTC+8 (Asia/Shanghai) 取时, 避免 CI (UTC) 与本地时区漂移导致误判升级
   const pad = (n: number) => String(n).padStart(2, "0");
+  const cn = new Date(Date.now() + 8 * 3600 * 1000);
   return (
-    [d.getFullYear(), pad(d.getMonth() + 1), pad(d.getDate())].join("") +
+    [cn.getUTCFullYear(), pad(cn.getUTCMonth() + 1), pad(cn.getUTCDate())].join("") +
     "." +
-    [pad(d.getHours()), pad(d.getMinutes()), pad(d.getSeconds())].join("")
+    [pad(cn.getUTCHours()), pad(cn.getUTCMinutes()), pad(cn.getUTCSeconds())].join("")
   );
 }