fix(frontend): 修复移动端菜单栏和使用记录页面 UI 问题

- 修复移动端无法打开菜单栏的问题
  - 在 app.ts 中添加 mobileOpen 状态管理
  - 修复 AppHeader.vue 中移动端菜单按钮调用错误的方法
  - 修复 AppSidebar.vue 使用本地 ref 而非全局状态的问题

- 添加移动端菜单自动关闭功能
  - 点击菜单项后自动关闭侧边栏
  - 添加 150ms 延迟以显示关闭动画

- 修复使用记录页面总消费卡片溢出问题
  - 调整总消费卡片布局，将删除线价格移至说明行
  - 添加 min-w-0 flex-1 防止内容溢出
  - 保持与其他卡片高度一致

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

frontend/src/components/layout/AppHeader.vue

@@ -207,7 +207,7 @@ const pageDescription = computed(() => {
 });
 
 function toggleMobileSidebar() {
-  appStore.toggleSidebar();
+  appStore.toggleMobileSidebar();
 }
 
 function toggleDropdown() {

frontend/src/components/layout/AppSidebar.vue

@@ -36,6 +36,7 @@
             class="sidebar-link mb-1"
             :class="{ 'sidebar-link-active': isActive(item.path) }"
             :title="sidebarCollapsed ? item.label : undefined"
+            @click="handleMenuItemClick"
           >
             <component :is="item.icon" class="w-5 h-5 flex-shrink-0" />
             <transition name="fade">
@@ -58,6 +59,7 @@
             class="sidebar-link mb-1"
             :class="{ 'sidebar-link-active': isActive(item.path) }"
             :title="sidebarCollapsed ? item.label : undefined"
+            @click="handleMenuItemClick"
           >
             <component :is="item.icon" class="w-5 h-5 flex-shrink-0" />
             <transition name="fade">
@@ -77,6 +79,7 @@
             class="sidebar-link mb-1"
             :class="{ 'sidebar-link-active': isActive(item.path) }"
             :title="sidebarCollapsed ? item.label : undefined"
+            @click="handleMenuItemClick"
           >
             <component :is="item.icon" class="w-5 h-5 flex-shrink-0" />
             <transition name="fade">
@@ -142,9 +145,9 @@ const appStore = useAppStore();
 const authStore = useAuthStore();
 
 const sidebarCollapsed = computed(() => appStore.sidebarCollapsed);
+const mobileOpen = computed(() => appStore.mobileOpen);
 const isAdmin = computed(() => authStore.isAdmin);
 const isDark = ref(document.documentElement.classList.contains('dark'));
-const mobileOpen = ref(false);
 
 // Site settings
 const siteName = ref('Sub2API');
@@ -303,7 +306,15 @@ function toggleTheme() {
 }
 
 function closeMobile() {
-  mobileOpen.value = false;
+  appStore.setMobileOpen(false);
+}
+
+function handleMenuItemClick() {
+  if (mobileOpen.value) {
+    setTimeout(() => {
+      appStore.setMobileOpen(false);
+    }, 150);
+  }
 }
 
 function isActive(path: string): boolean {