V1-V6 收口移动视口与 PDF 发票上传

client/src/layouts/AppShellLayout.tsx

@@ -17,6 +17,28 @@ export function AppShellLayout() {
     ? resolveMobileEquivalentPath(location.pathname, location.search)
     : null;
 
+  useEffect(() => {
+    if (!isMobileRoute || typeof window === "undefined") {
+      return;
+    }
+
+    const updateViewportHeight = () => {
+      const height = window.visualViewport?.height ?? window.innerHeight;
+      document.documentElement.style.setProperty("--mobile-viewport-height", `${height}px`);
+    };
+
+    updateViewportHeight();
+    window.addEventListener("resize", updateViewportHeight);
+    window.addEventListener("orientationchange", updateViewportHeight);
+    window.visualViewport?.addEventListener("resize", updateViewportHeight);
+
+    return () => {
+      window.removeEventListener("resize", updateViewportHeight);
+      window.removeEventListener("orientationchange", updateViewportHeight);
+      window.visualViewport?.removeEventListener("resize", updateViewportHeight);
+    };
+  }, [isMobileRoute]);
+
   useEffect(() => {
     const pathname = location.pathname;
     if (!pathname || pathname === "/login" || pathname.startsWith("/mobile/")) {
@@ -33,10 +55,13 @@ export function AppShellLayout() {
     <div className="relative flex min-h-screen overflow-hidden bg-[var(--color-bg-canvas)]">
       {isMobileRoute ? null : <Sidebar />}
 
-      <main className={`flex min-w-0 flex-1 flex-col ${isMobileRoute ? "h-[100dvh] overflow-hidden" : "lg:ml-72"}`}>
+      <main
+        className={`flex min-w-0 flex-1 flex-col ${isMobileRoute ? "overflow-hidden" : "lg:ml-72"}`}
+        style={isMobileRoute ? { height: "var(--mobile-viewport-height, 100vh)", minHeight: "var(--mobile-viewport-height, 100vh)" } : undefined}
+      >
         {isMobileRoute ? null : <Topbar />}
 
-        <div className={`flex-1 px-4 py-5 ${isMobileRoute ? "min-h-0 overflow-y-auto pb-5 pt-4 sm:px-5 sm:py-5" : "sm:px-7 sm:py-7 lg:px-8"}`}>
+        <div className={`flex-1 px-4 py-5 ${isMobileRoute ? `min-h-0 overflow-y-auto pt-4 sm:px-5 sm:pt-5 ${showMobileBottomNav ? "pb-[calc(var(--mobile-bottom-nav-height,64px)+env(safe-area-inset-bottom,0px)+1rem)]" : "pb-5 sm:pb-6"}` : "sm:px-7 sm:py-7 lg:px-8"}`}>
           <div className="layout-container max-w-none">
             <ErrorBoundary>
               <Outlet />