大量的代码格式化

Repository/TransactionRecordRepository.cs

@@ -58,7 +58,7 @@ public interface ITransactionRecordRepository : IBaseRepository<TransactionRecor
     /// <param name="year">年份</param>
     /// <param name="month">月份</param>
     /// <returns>每天的消费笔数和金额详情</returns>
-    Task<Dictionary<string, (int count, decimal expense, decimal income)>> GetDailyStatisticsAsync(int year, int month);
+    Task<Dictionary<string, (int count, decimal expense, decimal income, decimal saving)>> GetDailyStatisticsAsync(int year, int month, string? savingClassify = null);
 
     /// <summary>
     /// 获取指定日期范围内的每日统计
@@ -66,7 +66,7 @@ public interface ITransactionRecordRepository : IBaseRepository<TransactionRecor
     /// <param name="startDate">开始日期</param>
     /// <param name="endDate">结束日期</param>
     /// <returns>每天的消费笔数和金额详情</returns>
-    Task<Dictionary<string, (int count, decimal expense, decimal income)>> GetDailyStatisticsByRangeAsync(DateTime startDate, DateTime endDate);
+    Task<Dictionary<string, (int count, decimal expense, decimal income, decimal saving)>> GetDailyStatisticsByRangeAsync(DateTime startDate, DateTime endDate, string? savingClassify = null);
 
     /// <summary>
     /// 获取指定日期范围内的交易记录
@@ -345,15 +345,15 @@ public class TransactionRecordRepository(IFreeSql freeSql) : BaseRepository<Tran
             .ToListAsync(t => t.Classify);
     }
 
-    public async Task<Dictionary<string, (int count, decimal expense, decimal income)>> GetDailyStatisticsAsync(int year, int month)
+    public async Task<Dictionary<string, (int count, decimal expense, decimal income, decimal saving)>> GetDailyStatisticsAsync(int year, int month, string? savingClassify = null)
     {
         var startDate = new DateTime(year, month, 1);
         var endDate = startDate.AddMonths(1);
 
-        return await GetDailyStatisticsByRangeAsync(startDate, endDate);
+        return await GetDailyStatisticsByRangeAsync(startDate, endDate, savingClassify);
     }
 
-    public async Task<Dictionary<string, (int count, decimal expense, decimal income)>> GetDailyStatisticsByRangeAsync(DateTime startDate, DateTime endDate)
+    public async Task<Dictionary<string, (int count, decimal expense, decimal income, decimal saving)>> GetDailyStatisticsByRangeAsync(DateTime startDate, DateTime endDate, string? savingClassify = null)
     {
         var records = await FreeSql.Select<TransactionRecord>()
             .Where(t => t.OccurredAt >= startDate && t.OccurredAt < endDate)
@@ -368,7 +368,14 @@ public class TransactionRecordRepository(IFreeSql freeSql) : BaseRepository<Tran
                     // 分别统计收入和支出
                     var income = g.Where(t => t.Type == TransactionType.Income).Sum(t => Math.Abs(t.Amount));
                     var expense = g.Where(t => t.Type == TransactionType.Expense).Sum(t => Math.Abs(t.Amount));
-                    return (count: g.Count(), expense: expense, income: income);
+
+                    var saving = 0m;
+                    if(!string.IsNullOrEmpty(savingClassify))
+                    {
+                        saving = g.Where(t => savingClassify.Split(',').Contains(t.Classify)).Sum(t => Math.Abs(t.Amount));
+                    }
+
+                    return (count: g.Count(), expense, income, saving);
                 }
             );
 

Web/.prettierrc.json

@@ -2,5 +2,6 @@
   "$schema": "https://json.schemastore.org/prettierrc",
   "semi": false,
   "singleQuote": true,
-  "printWidth": 100
+  "printWidth": 100,
+  "trailingComma": "none"
 }

Web/eslint.config.js

@@ -1,52 +1,82 @@
-import js from '@eslint/js'
+import js from '@eslint/js'
 import globals from 'globals'
 import pluginVue from 'eslint-plugin-vue'
-import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
 
 export default [
   {
-    ignores: ['**/dist/**', '**/dist-ssr/**', '**/coverage/**', '**/node_modules/**', '.nuxt/**'],
+    ignores: ['**/dist/**', '**/dist-ssr/**', '**/coverage/**', '**/node_modules/**', '.nuxt/**']
   },
+  // Load Vue recommended rules first (sets up parser etc.)
+  ...pluginVue.configs['flat/recommended'],
+
+  // General Configuration for all JS/Vue files
   {
-    files: ['**/*.{js,mjs,jsx}'],
+    files: ['**/*.{js,mjs,jsx,vue}'],
     languageOptions: {
       globals: {
-        ...globals.browser,
+        ...globals.browser
       },
-      parserOptions: {
       ecmaVersion: 'latest',
-        sourceType: 'module',
+      sourceType: 'module'
-      },
     },
     rules: {
+      // Import standard JS recommended rules
       ...js.configs.recommended.rules,
-      'indent': ['error', 2],
+
+      // --- Logic & Best Practices ---
+      'no-unused-vars': ['warn', {
+        argsIgnorePattern: '^_',
+        varsIgnorePattern: '^_',
+        caughtErrorsIgnorePattern: '^_'
+      }],
+      'no-undef': 'error',
+      'no-console': ['warn', { allow: ['warn', 'error', 'info'] }],
+      'no-debugger': 'warn',
+      'eqeqeq': ['error', 'always', { null: 'ignore' }],
+      'curly': ['error', 'all'],
+      'prefer-const': 'warn',
+      'no-var': 'error',
+
+      // --- Formatting & Style (User requested warnings) ---
+      'indent': ['error', 2, { SwitchCase: 1 }],
       'quotes': ['error', 'single', { avoidEscape: true }],
       'semi': ['error', 'never'],
-      'no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
       'comma-dangle': ['error', 'never'],
       'no-trailing-spaces': 'error',
       'no-multiple-empty-lines': ['error', { max: 1 }],
       'space-before-function-paren': ['error', 'always'],
+      'object-curly-spacing': ['error', 'always'],
+      'array-bracket-spacing': ['error', 'never']
+    }
   },
-  },
+
-  ...pluginVue.configs['flat/recommended'],
+  // Vue Specific Overrides
   {
     files: ['**/*.vue'],
     rules: {
       'vue/multi-word-component-names': 'off',
       'vue/no-v-html': 'warn',
+
+      // Turn off standard indent for Vue files to avoid conflicts with vue/html-indent
+      // or script indentation issues. Vue plugin handles this better.
       'indent': 'off',
+      // Ensure Vue's own indentation rules are active (they are in 'recommended' but let's be explicit if needed)
+      'vue/html-indent': ['error', 2],
+      'vue/script-indent': ['error', 2, {
+        baseIndent: 0,
+        switchCase: 1,
+        ignores: []
+      }]
+    }
   },
-  },
+
-  skipFormatting,
+  // Service Worker specific globals
   {
     files: ['**/service-worker.js', '**/src/registerServiceWorker.js'],
     languageOptions: {
       globals: {
-        ...globals.serviceworker,
+        ...globals.serviceworker
-        ...globals.browser,
+      }
-      },
+    }
-    },
+  }
-  },
 ]

Web/package.json

@@ -1,4 +1,4 @@
-{
+{
   "name": "email-bill",
   "version": "1.0.0",
   "private": true,
@@ -11,7 +11,7 @@
     "build": "vite build",
     "preview": "vite preview",
     "lint": "eslint . --fix --cache",
-    "format": "prettier --write --experimental-cli src/"
+    "format": "prettier --write src/"
   },
   "dependencies": {
     "axios": "^1.13.2",

Web/public/service-worker.js

@@ -1,56 +1,56 @@
-const VERSION = '1.0.0'; // Build Time: 2026-01-07 15:59:36
+const VERSION = '1.0.0' // Build Time: 2026-01-07 15:59:36
-const CACHE_NAME = `emailbill-${VERSION}`;
+const CACHE_NAME = `emailbill-${VERSION}`
 const urlsToCache = [
   '/',
   '/index.html',
   '/favicon.ico',
   '/manifest.json'
-];
+]
 
 // 安装 Service Worker
 self.addEventListener('install', (event) => {
-  console.log('[Service Worker] 安装中...');
+  console.log('[Service Worker] 安装中...')
   event.waitUntil(
     caches.open(CACHE_NAME)
       .then((cache) => {
-        console.log('[Service Worker] 缓存文件');
+        console.log('[Service Worker] 缓存文件')
-        return cache.addAll(urlsToCache);
+        return cache.addAll(urlsToCache)
+      })
+  )
 })
-  );
-});
 
 // 监听跳过等待消息
 self.addEventListener('message', (event) => {
   if (event.data && event.data.type === 'SKIP_WAITING') {
-    self.skipWaiting();
+    self.skipWaiting()
   }
-});
+})
 
 // 激活 Service Worker
 self.addEventListener('activate', (event) => {
-  console.log('[Service Worker] 激活中...');
+  console.log('[Service Worker] 激活中...')
   event.waitUntil(
     caches.keys().then((cacheNames) => {
       return Promise.all(
         cacheNames.map((cacheName) => {
           if (cacheName !== CACHE_NAME) {
-            console.log('[Service Worker] 删除旧缓存:', cacheName);
+            console.log('[Service Worker] 删除旧缓存:', cacheName)
-            return caches.delete(cacheName);
+            return caches.delete(cacheName)
           }
         })
-      );
+      )
     }).then(() => self.clients.claim())
-  );
+  )
-});
+})
 
 // 拦截请求
 self.addEventListener('fetch', (event) => {
-  const { request } = event;
+  const { request } = event
-  const url = new URL(request.url);
+  const url = new URL(request.url)
 
   // 跳过跨域请求
   if (url.origin !== location.origin) {
-    return;
+    return
   }
 
   // API请求使用网络优先策略
@@ -60,19 +60,19 @@ self.addEventListener('fetch', (event) => {
         .then((response) => {
           // 只针对成功的GET请求进行缓存
           if (request.method === 'GET' && response.status === 200) {
-            const responseClone = response.clone();
+            const responseClone = response.clone()
             caches.open(CACHE_NAME).then((cache) => {
-              cache.put(request, responseClone);
+              cache.put(request, responseClone)
-            });
+            })
           }
-          return response;
+          return response
         })
         .catch(() => {
           // 网络失败时尝试从缓存获取
-          return caches.match(request);
+          return caches.match(request)
         })
-    );
+    )
-    return;
+    return
   }
 
   // 页面请求使用网络优先策略，确保能获取到最新的 index.html
@@ -80,17 +80,17 @@ self.addEventListener('fetch', (event) => {
     event.respondWith(
       fetch(request)
         .then((response) => {
-          const responseClone = response.clone();
+          const responseClone = response.clone()
           caches.open(CACHE_NAME).then((cache) => {
-            cache.put(request, responseClone);
+            cache.put(request, responseClone)
-          });
+          })
-          return response;
+          return response
         })
         .catch(() => {
-          return caches.match('/index.html') || caches.match(request);
+          return caches.match('/index.html') || caches.match(request)
         })
-    );
+    )
-    return;
+    return
   }
 
   // 其他静态资源使用缓存优先策略
@@ -98,50 +98,50 @@ self.addEventListener('fetch', (event) => {
     caches.match(request)
       .then((response) => {
         if (response) {
-          return response;
+          return response
         }
         return fetch(request).then((response) => {
           // 检查是否是有效响应
           if (!response || response.status !== 200 || response.type !== 'basic') {
-            return response;
+            return response
           }
 
-          const responseClone = response.clone();
+          const responseClone = response.clone()
           caches.open(CACHE_NAME).then((cache) => {
-            cache.put(request, responseClone);
+            cache.put(request, responseClone)
-          });
+          })
 
-          return response;
+          return response
-        });
+        })
       })
       .catch(() => {
         // 返回离线页面或默认内容
         if (request.destination === 'document') {
-          return caches.match('/index.html');
+          return caches.match('/index.html')
         }
       })
-  );
+  )
-});
+})
 
 // 后台同步
 self.addEventListener('sync', (event) => {
-  console.log('[Service Worker] 后台同步:', event.tag);
+  console.log('[Service Worker] 后台同步:', event.tag)
   if (event.tag === 'sync-data') {
-    event.waitUntil(syncData());
+    event.waitUntil(syncData())
   }
-});
+})
 
 // 推送通知
 self.addEventListener('push', (event) => {
-  console.log('[Service Worker] 收到推送消息');
+  console.log('[Service Worker] 收到推送消息')
-  let data = { title: '账单管理', body: '您有新的消息', url: '/', icon: '/icons/icon-192x192.png' };
+  let data = { title: '账单管理', body: '您有新的消息', url: '/', icon: '/icons/icon-192x192.png' }
 
   if (event.data) {
     try {
-      const json = event.data.json();
+      const json = event.data.json()
-      data = { ...data, ...json };
+      data = { ...data, ...json }
     } catch {
-      data.body = event.data.text();
+      data.body = event.data.text()
     }
   }
 
@@ -153,41 +153,41 @@ self.addEventListener('push', (event) => {
     tag: 'emailbill-notification',
     requireInteraction: false,
     data: { url: data.url }
-  };
+  }
 
   event.waitUntil(
     self.registration.showNotification(data.title, options)
-  );
+  )
-});
+})
 
 // 通知点击
 self.addEventListener('notificationclick', (event) => {
-  console.log('[Service Worker] 通知被点击');
+  console.log('[Service Worker] 通知被点击')
-  event.notification.close();
+  event.notification.close()
-  const urlToOpen = event.notification.data?.url || '/';
+  const urlToOpen = event.notification.data?.url || '/'
   event.waitUntil(
     clients.matchAll({ type: 'window', includeUncontrolled: true }).then((windowClients) => {
       // 如果已经打开了该 URL，则聚焦
       for (let i = 0; i < windowClients.length; i++) {
-        const client = windowClients[i];
+        const client = windowClients[i]
         if (client.url === urlToOpen && 'focus' in client) {
-          return client.focus();
+          return client.focus()
         }
       }
       // 否则打开新窗口
       if (clients.openWindow) {
-        return clients.openWindow(urlToOpen);
+        return clients.openWindow(urlToOpen)
       }
     })
-  );
+  )
-});
+})
 
 // 数据同步函数
 async function syncData () {
   try {
     // 这里添加需要同步的逻辑
-    console.log('[Service Worker] 执行数据同步');
+    console.log('[Service Worker] 执行数据同步')
   } catch (error) {
-    console.error('[Service Worker] 同步失败:', error);
+    console.error('[Service Worker] 同步失败:', error)
   }
 }

Web/src/App.vue

@@ -3,10 +3,13 @@
     <div class="app-root">
       <RouterView />
       <van-tabbar v-show="showTabbar" v-model="active">
-        <van-tabbar-item name="ccalendar" icon="notes" to="/calendar">
+        <van-tabbar-item name="ccalendar" icon="notes" to="/calendar"> 日历 </van-tabbar-item>
-          日历
+        <van-tabbar-item
-        </van-tabbar-item>
+          name="statistics"
-        <van-tabbar-item name="statistics" icon="chart-trending-o" to="/" @click="handleTabClick('/statistics')">
+          icon="chart-trending-o"
+          to="/"
+          @click="handleTabClick('/statistics')"
+        >
           统计
         </van-tabbar-item>
         <van-tabbar-item
@@ -18,12 +21,15 @@
         >
           账单
         </van-tabbar-item>
-        <van-tabbar-item name="budget" icon="bill-o" to="/budget" @click="handleTabClick('/budget')">
+        <van-tabbar-item
+          name="budget"
+          icon="bill-o"
+          to="/budget"
+          @click="handleTabClick('/budget')"
+        >
           预算
         </van-tabbar-item>
-        <van-tabbar-item name="setting" icon="setting" to="/setting">
+        <van-tabbar-item name="setting" icon="setting" to="/setting"> 设置 </van-tabbar-item>
-          设置
-        </van-tabbar-item>
       </van-tabbar>
       <GlobalAddBill v-if="isShowAddBill" @success="handleAddTransactionSuccess" />
 
@@ -85,12 +91,14 @@ onUnmounted(() => {
 const route = useRoute()
 // 根据路由判断是否显示Tabbar
 const showTabbar = computed(() => {
-  return route.path === '/' ||
+  return (
+    route.path === '/' ||
     route.path === '/calendar' ||
     route.path === '/message' ||
     route.path === '/setting' ||
     route.path === '/balance' ||
     route.path === '/budget'
+  )
 })
 
 const active = ref('')
@@ -116,11 +124,14 @@ setInterval(() => {
 }, 60 * 1000) // 每60秒更新一次未读消息数
 
 // 监听路由变化调整
-watch(() => route.path, (newPath) => {
+watch(
+  () => route.path,
+  (newPath) => {
     setActive(newPath)
 
     messageStore.updateUnreadCount()
-})
+  }
+)
 
 const setActive = (path) => {
   active.value = (() => {
@@ -142,9 +153,7 @@ const setActive = (path) => {
 }
 
 const isShowAddBill = computed(() => {
-  return route.path === '/' 
+  return route.path === '/' || route.path === '/balance' || route.path === '/message'
-  || route.path === '/balance'
-  || route.path === '/message'
 })
 
 onUnmounted(() => {
@@ -165,7 +174,6 @@ const handleAddTransactionSuccess = () => {
   const event = new Event('transactions-changed')
   window.dispatchEvent(event)
 }
-
 </script>
 
 <style scoped>

Web/src/api/billImport.js

@@ -26,7 +26,8 @@ export const uploadBillFile = (file, type) => {
       Authorization: `Bearer ${useAuthStore().token || ''}`
     },
     timeout: 60000 // 文件上传增加超时时间
-  }).then(response => {
+  })
+    .then((response) => {
       const { data } = response
 
       if (data.success === false) {
@@ -35,7 +36,8 @@ export const uploadBillFile = (file, type) => {
       }
 
       return data
-  }).catch(error => {
+    })
+    .catch((error) => {
       console.error('上传错误:', error)
 
       if (error.response) {

Web/src/api/emailRecord.js

@@ -37,7 +37,7 @@ export const getEmailDetail = (id) => {
  */
 export const deleteEmail = (id) => {
   return request({
-    url: `/EmailMessage/DeleteById`,
+    url: '/EmailMessage/DeleteById',
     method: 'post',
     params: { id }
   })
@@ -50,7 +50,7 @@ export const deleteEmail = (id) => {
  */
 export const refreshTransactionRecords = (id) => {
   return request({
-    url: `/EmailMessage/RefreshTransactionRecords`,
+    url: '/EmailMessage/RefreshTransactionRecords',
     method: 'post',
     params: { id }
   })
@@ -62,7 +62,7 @@ export const refreshTransactionRecords = (id) => {
  */
 export const syncEmails = () => {
   return request({
-    url: `/EmailMessage/SyncEmails`,
+    url: '/EmailMessage/SyncEmails',
     method: 'post'
   })
 }

Web/src/api/request.js

@@ -14,7 +14,7 @@ const request = axios.create({
 
 // 请求拦截器
 request.interceptors.request.use(
-  config => {
+  (config) => {
     // 添加 token 认证信息
     const authStore = useAuthStore()
     if (authStore.token) {
@@ -22,7 +22,7 @@ request.interceptors.request.use(
     }
     return config
   },
-  error => {
+  (error) => {
     console.error('请求错误:', error)
     return Promise.reject(error)
   }
@@ -30,7 +30,7 @@ request.interceptors.request.use(
 
 // 响应拦截器
 request.interceptors.response.use(
-  response => {
+  (response) => {
     const { data } = response
 
     // 统一处理业务错误
@@ -41,7 +41,7 @@ request.interceptors.response.use(
 
     return data
   },
-  error => {
+  (error) => {
     console.error('响应错误:', error)
 
     // 统一处理 HTTP 错误
@@ -58,7 +58,10 @@ request.interceptors.response.use(
           // 清除登录状态并跳转到登录页
           const authStore = useAuthStore()
           authStore.logout()
-          router.push({ name: 'login', query: { redirect: router.currentRoute.value.fullPath } })
+          router.push({
+            name: 'login',
+            query: { redirect: router.currentRoute.value.fullPath }
+          })
           break
         }
         case 403:

Web/src/api/transactionPeriodic.js

@@ -79,7 +79,7 @@ export const updatePeriodic = (data) => {
  */
 export const deletePeriodic = (id) => {
   return request({
-    url: `/TransactionPeriodic/DeleteById`,
+    url: '/TransactionPeriodic/DeleteById',
     method: 'post',
     params: { id }
   })

Web/src/api/transactionRecord.js

@@ -99,7 +99,7 @@ export const updateTransaction = (data) => {
  */
 export const deleteTransaction = (id) => {
   return request({
-    url: `/TransactionRecord/DeleteById`,
+    url: '/TransactionRecord/DeleteById',
     method: 'post',
     params: { id }
   })
@@ -118,7 +118,6 @@ export const getTransactionsByDate = (date) => {
   })
 }
 
-
 // 注意：分类相关的API已迁移到 transactionCategory.js
 // 请使用 getCategoryList 等新接口
 
@@ -160,7 +159,7 @@ export const smartClassify = (transactionIds = []) => {
     method: 'POST',
     headers: {
       'Content-Type': 'application/json',
-      'Authorization': `Bearer ${token}`
+      Authorization: `Bearer ${token}`
     },
     body: JSON.stringify({ transactionIds })
   })

Web/src/assets/main.css

@@ -1,7 +1,8 @@
 @import './base.css';
 
 /* 禁用页面弹性缩放和橡皮筋效果 */
-html, body {
+html,
+body {
   overscroll-behavior: none;
   overscroll-behavior-y: none;
   -webkit-overflow-scrolling: touch;
@@ -57,7 +58,9 @@ a,
   }
 }
 
-html, body, #app {
+html,
+body,
+#app {
   margin: 0;
   padding: 0;
   height: 100%;

Web/src/components/AddClassifyDialog.vue

@@ -5,7 +5,10 @@
     show-cancel-button
     @confirm="handleConfirm"
   >
-    <van-field v-model="classifyName" placeholder="请输入新的交易分类" />
+    <van-field
+      v-model="classifyName"
+      placeholder="请输入新的交易分类"
+    />
   </van-dialog>
 </template>
 

Web/src/components/Bill/BillForm.vue

@@ -6,8 +6,12 @@
         <van-field label="时间">
           <template #input>
             <div style="display: flex; gap: 16px">
-              <div @click="showDatePicker = true">{{ form.date }}</div>
+              <div @click="showDatePicker = true">
-              <div @click="showTimePicker = true">{{ form.time }}</div>
+                {{ form.date }}
+              </div>
+              <div @click="showTimePicker = true">
+                {{ form.time }}
+              </div>
             </div>
           </template>
         </van-field>
@@ -47,23 +51,20 @@
         <!-- 分类 -->
         <van-field name="category" label="分类">
           <template #input>
-            <span v-if="!categoryName" style="color: var(--van-text-color-3);">请选择分类</span>
+            <span v-if="!categoryName" style="color: var(--van-text-color-3)">请选择分类</span>
             <span v-else>{{ categoryName }}</span>
           </template>
         </van-field>
 
         <!-- 分类选择组件 -->
-        <ClassifySelector
+        <ClassifySelector v-model="categoryName" :type="form.type" />
-          v-model="categoryName"
-          :type="form.type"
-        />
       </van-cell-group>
 
       <div class="actions">
         <van-button round block type="primary" native-type="submit" :loading="loading">
           {{ submitText }}
         </van-button>
-        <slot name="actions"></slot>
+        <slot name="actions" />
       </div>
     </van-form>
 
@@ -146,9 +147,15 @@ const initForm = async () => {
       currentTime.value = form.value.time.split(':')
     }
 
-    if (amount !== undefined) form.value.amount = amount
+    if (amount !== undefined) {
-    if (reason !== undefined) form.value.note = reason
+      form.value.amount = amount
-    if (type !== undefined) form.value.type = type
+    }
+    if (reason !== undefined) {
+      form.value.note = reason
+    }
+    if (type !== undefined) {
+      form.value.type = type
+    }
 
     // 如果有传入分类名称，尝试设置
     if (classify) {
@@ -166,9 +173,13 @@ onMounted(() => {
 })
 
 // 监听 initialData 变化 (例如重新解析后)
-watch(() => props.initialData, () => {
+watch(
+  () => props.initialData,
+  () => {
     initForm()
-}, { deep: true })
+  },
+  { deep: true }
+)
 
 const handleTypeChange = (newType) => {
   if (!isSyncing.value) {

Web/src/components/Bill/ManualBillAdd.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="manual-bill-add">
-    <BillForm 
+    <BillForm ref="billFormRef" :loading="saving" @submit="handleSave" />
-      ref="billFormRef"
-      :loading="saving"
-      @submit="handleSave"
-    />
   </div>
 </template>
 

Web/src/components/Bill/OneLineBillAdd.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div v-if="!parseResult" class="input-section" style="margin: 12px 12px 0 16px;">
+    <div v-if="!parseResult" class="input-section" style="margin: 12px 12px 0 16px">
       <van-field
         v-model="text"
         type="textarea"
@@ -31,13 +31,7 @@
         @submit="handleSave"
       >
         <template #actions>
-          <van-button 
+          <van-button plain round block class="mt-2" @click="parseResult = null">
-            plain 
-            round 
-            block 
-            class="mt-2" 
-            @click="parseResult = null"
-          >
             重新输入
           </van-button>
         </template>
@@ -60,7 +54,9 @@ const saving = ref(false)
 const parseResult = ref(null)
 
 const handleParse = async () => {
-  if (!text.value.trim()) return
+  if (!text.value.trim()) {
+    return
+  }
 
   parsing.value = true
   parseResult.value = null

Web/src/components/Budget/BudgetCard.vue

@@ -16,7 +16,9 @@
                 {{ budget.type === BudgetPeriodType.Year ? '年度' : '月度' }}
               </van-tag>
             </slot>
-            <h3 class="card-title">{{ budget.name }}</h3>
+            <h3 class="card-title">
+              {{ budget.name }}
+            </h3>
             <span v-if="budget.selectedCategories?.length" class="card-subtitle">
               ({{ budget.selectedCategories.join('、') }})
             </span>
@@ -29,9 +31,11 @@
             <span class="compact-label">实际/目标</span>
             <span class="compact-value">
               <slot name="collapsed-amount">
-                {{ budget.current !== undefined && budget.limit !== undefined 
+                {{
+                  budget.current !== undefined && budget.limit !== undefined
                     ? `¥${budget.current?.toFixed(0) || 0} / ¥${budget.limit?.toFixed(0) || 0}`
-                  : '--' }}
+                    : '--'
+                }}
               </slot>
             </span>
           </div>
@@ -45,7 +49,7 @@
 
       <!-- 展开状态 -->
       <div v-else class="budget-inner-card">
-        <div class="card-header" style="margin-bottom: 0;">
+        <div class="card-header" style="margin-bottom: 0">
           <div class="budget-info">
             <slot name="tag">
               <van-tag
@@ -56,7 +60,9 @@
                 {{ budget.type === BudgetPeriodType.Year ? '年度' : '月度' }}
               </van-tag>
             </slot>
-            <h3 class="card-title" style="max-width: 120px;">{{ budget.name }}</h3>
+            <h3 class="card-title" style="max-width: 120px">
+              {{ budget.name }}
+            </h3>
           </div>
           <div class="header-actions">
             <slot name="actions">
@@ -76,12 +82,7 @@
                 @click.stop="handleQueryBills"
               />
               <template v-if="budget.category !== 2">
-                <van-button 
+                <van-button icon="edit" size="small" plain @click.stop="$emit('click', budget)" />
-                  icon="edit" 
-                  size="small" 
-                  plain 
-                  @click.stop="$emit('click', budget)" 
-                />
               </template>
             </slot>
           </div>
@@ -101,12 +102,14 @@
             </van-tag>
           </div>
           <div class="amount-info">
-            <slot name="amount-info"></slot>
+            <slot name="amount-info" />
           </div>
 
           <div class="progress-section">
             <slot name="progress-info">
-              <span class="period-type">{{ periodLabel }}{{ budget.category === 0 ? '使用' : '达成' }}</span>
+              <span class="period-type"
+                >{{ periodLabel }}{{ budget.category === 0 ? '使用' : '达成' }}</span
+              >
               <van-progress
                 :percentage="Math.min(percentage, 100)"
                 stroke-width="8"
@@ -129,23 +132,19 @@
 
           <van-collapse-transition>
             <div v-if="budget.description && showDescription" class="budget-description">
-              <div class="description-content rich-html-content" v-html="budget.description"></div>
+              <div class="description-content rich-html-content" v-html="budget.description" />
             </div>
           </van-collapse-transition>
         </div>
 
         <div class="card-footer">
-            <slot name="footer"></slot>
+          <slot name="footer" />
         </div>
       </div>
     </div>
 
     <!-- 关联账单列表弹窗 -->
-    <PopupContainer 
+    <PopupContainer v-model="showBillListModal" title="关联账单列表" height="75%">
-      v-model="showBillListModal"
-      title="关联账单列表"
-      height="75%"
-    >
       <TransactionList
         :transactions="billList"
         :loading="billLoading"
@@ -166,15 +165,13 @@
         <div class="collapsed-header">
           <div class="budget-info">
             <slot name="tag">
-              <van-tag 
+              <van-tag type="success" plain class="status-tag">
-                type="success"
-                plain
-                class="status-tag"
-              >
                 {{ budget.type === BudgetPeriodType.Year ? '年度' : '月度' }}
               </van-tag>
             </slot>
-            <h3 class="card-title">{{ budget.name }}</h3>
+            <h3 class="card-title">
+              {{ budget.name }}
+            </h3>
             <span v-if="budget.selectedCategories?.length" class="card-subtitle">
               ({{ budget.selectedCategories.join('、') }})
             </span>
@@ -187,9 +184,7 @@
             <span class="compact-label">实际</span>
             <span class="compact-value">
               <slot name="collapsed-amount">
-                {{ budget.current !== undefined 
+                {{ budget.current !== undefined ? `¥${budget.current?.toFixed(0) || 0}` : '--' }}
-                  ? `¥${budget.current?.toFixed(0) || 0}` 
-                  : '--' }}
               </slot>
             </span>
           </div>
@@ -198,18 +193,16 @@
 
       <!-- 展开状态 -->
       <div v-else class="budget-inner-card">
-        <div class="card-header" style="margin-bottom: 0;">
+        <div class="card-header" style="margin-bottom: 0">
           <div class="budget-info">
             <slot name="tag">
-              <van-tag 
+              <van-tag type="success" plain class="status-tag">
-                type="success"
-                plain
-                class="status-tag"
-              >
                 {{ budget.type === BudgetPeriodType.Year ? '年度' : '月度' }}
               </van-tag>
             </slot>
-            <h3 class="card-title" style="max-width: 120px;">{{ budget.name }}</h3>
+            <h3 class="card-title" style="max-width: 120px">
+              {{ budget.name }}
+            </h3>
           </div>
           <div class="header-actions">
             <slot name="actions">
@@ -229,12 +222,7 @@
                 @click.stop="handleQueryBills"
               />
               <template v-if="budget.category !== 2">
-                <van-button 
+                <van-button icon="edit" size="small" plain @click.stop="$emit('click', budget)" />
-                  icon="edit" 
-                  size="small" 
-                  plain 
-                  @click.stop="$emit('click', budget)" 
-                />
               </template>
             </slot>
           </div>
@@ -258,21 +246,23 @@
             <div class="amount-item">
               <span>
                 <span class="label">实际</span>
-              <span class="value" style="margin-left: 12px;">¥{{ budget.current?.toFixed(0) || 0 }}</span>
+                <span class="value" style="margin-left: 12px"
+                  >¥{{ budget.current?.toFixed(0) || 0 }}</span
+                >
               </span>
             </div>
           </div>
 
           <div class="no-limit-notice">
             <span>
-              <van-icon name="info-o" style="margin-right: 4px;" />
+              <van-icon name="info-o" style="margin-right: 4px" />
               不记额预算 - 直接计入存款明细
             </span>
           </div>
 
           <van-collapse-transition>
             <div v-if="budget.description && showDescription" class="budget-description">
-              <div class="description-content rich-html-content" v-html="budget.description"></div>
+              <div class="description-content rich-html-content" v-html="budget.description" />
             </div>
           </van-collapse-transition>
         </div>
@@ -280,11 +270,7 @@
     </div>
 
     <!-- 关联账单列表弹窗 -->
-    <PopupContainer 
+    <PopupContainer v-model="showBillListModal" title="关联账单列表" height="75%">
-      v-model="showBillListModal"
-      title="关联账单列表"
-      height="75%"
-    >
       <TransactionList
         :transactions="billList"
         :loading="billLoading"
@@ -367,7 +353,6 @@ const handleQueryBills = async () => {
     } else {
       billList.value = []
     }
-
   } catch (error) {
     console.error('查询账单列表失败:', error)
     billList.value = []
@@ -377,18 +362,26 @@ const handleQueryBills = async () => {
 }
 
 const percentage = computed(() => {
-  if (!props.budget.limit) return 0
+  if (!props.budget.limit) {
+    return 0
+  }
   return Math.round((props.budget.current / props.budget.limit) * 100)
 })
 
 const timePercentage = computed(() => {
-  if (!props.budget.periodStart || !props.budget.periodEnd) return 0
+  if (!props.budget.periodStart || !props.budget.periodEnd) {
+    return 0
+  }
   const start = new Date(props.budget.periodStart).getTime()
   const end = new Date(props.budget.periodEnd).getTime()
   const now = new Date().getTime()
 
-  if (now <= start) return 0
+  if (now <= start) {
-  if (now >= end) return 100
+    return 0
+  }
+  if (now >= end) {
+    return 100
+  }
 
   return Math.round(((now - start) / (end - start)) * 100)
 })

Web/src/components/Budget/BudgetEditPopup.vue

@@ -1,7 +1,11 @@
 <template>
   <PopupContainer
     v-model="visible"
-    :title="isEdit ? `编辑${getCategoryName(form.category)}预算` : `新增${getCategoryName(form.category)}预算`" 
+    :title="
+      isEdit
+        ? `编辑${getCategoryName(form.category)}预算`
+        : `新增${getCategoryName(form.category)}预算`
+    "
     height="75%"
   >
     <div class="add-budget-form">
@@ -17,7 +21,9 @@
           <!-- 新增：不记额预算复选框 -->
           <van-field label="不记额预算">
             <template #input>
-              <van-checkbox v-model="form.noLimit" @update:model-value="onNoLimitChange">不记额预算（仅限年度）</van-checkbox>
+              <van-checkbox v-model="form.noLimit" @update:model-value="onNoLimitChange">
+                不记额预算（仅限年度）
+              </van-checkbox>
             </template>
           </van-field>
           <van-field name="type" label="统计周期">
@@ -48,7 +54,12 @@
           </van-field>
           <van-field label="相关分类">
             <template #input>
-              <div v-if="form.selectedCategories.length === 0" style="color: var(--van-text-color-3);">可多选分类</div>
+              <div
+                v-if="form.selectedCategories.length === 0"
+                style="color: var(--van-text-color-3)"
+              >
+                可多选分类
+              </div>
               <div v-else class="selected-categories">
                 <span class="ellipsis-text">
                   {{ form.selectedCategories.join('、') }}
@@ -95,11 +106,7 @@ const form = reactive({
   noLimit: false // 新增字段
 })
 
-const open = ({
+const open = ({ data, isEditFlag, category }) => {
-  data, 
-  isEditFlag,
-  category
-}) => {
   if (category === undefined) {
     showToast('缺少必要参数：category')
     return
@@ -135,7 +142,11 @@ defineExpose({
 })
 
 const budgetType = computed(() => {
-  return form.category === BudgetCategory.Expense ? 0 : (form.category === BudgetCategory.Income ? 1 : 2)
+  return form.category === BudgetCategory.Expense
+    ? 0
+    : form.category === BudgetCategory.Income
+      ? 1
+      : 2
 })
 
 const onSubmit = async () => {

Web/src/components/Budget/BudgetSummary.vue

@@ -1,7 +1,11 @@
 <template>
   <div class="summary-container">
     <transition :name="transitionName" mode="out-in">
-      <div v-if="stats && (stats.month || stats.year)" :key="dateKey" class="summary-card common-card">
+      <div
+        v-if="stats && (stats.month || stats.year)"
+        :key="dateKey"
+        class="summary-card common-card"
+      >
         <!-- 左切换按钮 -->
         <div class="nav-arrow left" @click.stop="changeMonth(-1)">
           <van-icon name="arrow-left" />
@@ -20,7 +24,7 @@
                 <span class="amount">¥{{ formatMoney(stats[key]?.limit || 0) }}</span>
               </div>
             </div>
-            <div v-if="config.showDivider" class="divider"></div>
+            <div v-if="config.showDivider" class="divider" />
           </template>
         </div>
 
@@ -71,8 +75,7 @@ const dateKey = computed(() => props.date.getFullYear() + '-' + props.date.getMo
 
 const isCurrentMonth = computed(() => {
   const now = new Date()
-  return props.date.getFullYear() === now.getFullYear() && 
+  return props.date.getFullYear() === now.getFullYear() && props.date.getMonth() === now.getMonth()
-         props.date.getMonth() === now.getMonth()
 })
 
 const periodConfigs = computed(() => ({
@@ -94,7 +97,10 @@ const changeMonth = (delta) => {
 }
 
 const formatMoney = (val) => {
-  return parseFloat(val || 0).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: 0 })
+  return parseFloat(val || 0).toLocaleString(undefined, {
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  })
 }
 </script>
 

Web/src/components/Budget/SavingsConfigPopup.vue

@@ -1,9 +1,5 @@
 <template>
-  <PopupContainer 
+  <PopupContainer v-model="visible" title="设置存款分类" height="60%">
-    v-model="visible" 
-    title="设置存款分类" 
-    height="60%"
-  >
     <div class="savings-config-content">
       <div class="config-header">
         <p class="subtitle">这些分类的统计值将计入“存款”中</p>
@@ -52,7 +48,7 @@ const fetchConfig = async () => {
   try {
     const res = await getConfig('SavingsCategories')
     if (res.success && res.data) {
-      selectedCategories.value = res.data.split(',').filter(x => x)
+      selectedCategories.value = res.data.split(',').filter((x) => x)
     } else {
       selectedCategories.value = []
     }

Web/src/components/ClassifySelector.vue

@@ -98,17 +98,21 @@ const innerOptions = ref([])
 const addClassifyDialogRef = ref()
 
 const displayOptions = computed(() => {
-  if (props.options) return props.options
+  if (props.options) {
+    return props.options
+  }
   return innerOptions.value
 })
 
 const fetchOptions = async () => {
-  if (props.options) return
+  if (props.options) {
+    return
+  }
 
   try {
     const response = await getCategoryList(props.type)
     if (response.success) {
-      innerOptions.value = (response.data || []).map(item => ({
+      innerOptions.value = (response.data || []).map((item) => ({
         text: item.name,
         value: item.name,
         id: item.id
@@ -152,9 +156,12 @@ const handleAddConfirm = async (categoryName) => {
   }
 }
 
-watch(() => props.type, () => {
+watch(
+  () => props.type,
+  () => {
     fetchOptions()
-})
+  }
+)
 
 onMounted(() => {
   fetchOptions()
@@ -175,8 +182,10 @@ const isSelected = (item) => {
 
 // 是否全部选中
 const isAllSelected = computed(() => {
-  if (!props.multiple || displayOptions.value.length === 0) return false
+  if (!props.multiple || displayOptions.value.length === 0) {
-  return displayOptions.value.every(item => props.modelValue.includes(item.text))
+    return false
+  }
+  return displayOptions.value.every((item) => props.modelValue.includes(item.text))
 })
 
 // 是否有任何选中
@@ -208,13 +217,15 @@ const toggleItem = (item) => {
 
 // 切换全选
 const toggleAll = () => {
-  if (!props.multiple) return
+  if (!props.multiple) {
+    return
+  }
 
   if (isAllSelected.value) {
     emit('update:modelValue', [])
     emit('change', [])
   } else {
-    const allValues = displayOptions.value.map(item => item.text)
+    const allValues = displayOptions.value.map((item) => item.text)
     emit('update:modelValue', allValues)
     emit('change', allValues)
   }

Web/src/components/ContributionHeatmap.vue

@@ -42,16 +42,14 @@
     </div>
 
     <div class="heatmap-footer">
-      <div v-if="totalCount > 0" class="summary-text">
+      <div v-if="totalCount > 0" class="summary-text">过去一年共 {{ totalCount }} 笔交易</div>
-        过去一年共 {{ totalCount }} 笔交易
-      </div>
       <div class="legend">
         <span>少</span>
-        <div class="legend-item level-0"></div>
+        <div class="legend-item level-0" />
-        <div class="legend-item level-1"></div>
+        <div class="legend-item level-1" />
-        <div class="legend-item level-2"></div>
+        <div class="legend-item level-2" />
-        <div class="legend-item level-3"></div>
+        <div class="legend-item level-3" />
-        <div class="legend-item level-4"></div>
+        <div class="legend-item level-4" />
         <span>多</span>
       </div>
     </div>
@@ -59,84 +57,84 @@
 </template>
 
 <script setup>
-import { ref, onMounted, nextTick } from 'vue';
+import { ref, onMounted, nextTick } from 'vue'
-import { getDailyStatisticsRange } from '@/api/statistics';
+import { getDailyStatisticsRange } from '@/api/statistics'
 
-const stats = ref({});
+const stats = ref({})
-const weeks = ref([]);
+const weeks = ref([])
-const monthLabels = ref([]);
+const monthLabels = ref([])
-const totalCount = ref(0);
+const totalCount = ref(0)
-const scrollContainer = ref(null);
+const scrollContainer = ref(null)
-const thresholds = ref([2, 4, 7]); // Default thresholds
+const thresholds = ref([2, 4, 7]) // Default thresholds
 
-const CELL_SIZE = 15;
+const CELL_SIZE = 15
-const CELL_GAP = 3;
+const CELL_GAP = 3
-const WEEK_WIDTH = CELL_SIZE + CELL_GAP;
+const WEEK_WIDTH = CELL_SIZE + CELL_GAP
 
 const formatDate = (d) => {
-  const year = d.getFullYear();
+  const year = d.getFullYear()
-  const month = String(d.getMonth() + 1).padStart(2, '0');
+  const month = String(d.getMonth() + 1).padStart(2, '0')
-  const day = String(d.getDate()).padStart(2, '0');
+  const day = String(d.getDate()).padStart(2, '0')
-  return `${year}-${month}-${day}`;
+  return `${year}-${month}-${day}`
-};
+}
 
 const fetchData = async () => {
-  const endDate = new Date();
+  const endDate = new Date()
-  const startDate = new Date();
+  const startDate = new Date()
-  startDate.setFullYear(endDate.getFullYear() - 1);
+  startDate.setFullYear(endDate.getFullYear() - 1)
 
   try {
     const res = await getDailyStatisticsRange({
       startDate: formatDate(startDate),
       endDate: formatDate(endDate)
-    });
+    })
 
     if (res.success) {
-      const map = {};
+      const map = {}
-      let count = 0;
+      let count = 0
-      res.data.forEach(item => {
+      res.data.forEach((item) => {
-        map[item.date] = item;
+        map[item.date] = item
-        count += item.count;
+        count += item.count
-      });
+      })
-      stats.value = map;
+      stats.value = map
-      totalCount.value = count;
+      totalCount.value = count
 
       // Calculate thresholds based on last 15 days average
-      const today = new Date();
+      const today = new Date()
-      let last15DaysSum = 0;
+      let last15DaysSum = 0
       for (let i = 0; i < 15; i++) {
-        const d = new Date(today);
+        const d = new Date(today)
-        d.setDate(d.getDate() - i);
+        d.setDate(d.getDate() - i)
-        const dateStr = formatDate(d);
+        const dateStr = formatDate(d)
-        last15DaysSum += (map[dateStr]?.count || 0);
+        last15DaysSum += map[dateStr]?.count || 0
       }
 
-      const avg = last15DaysSum / 15;
+      const avg = last15DaysSum / 15
-      console.log("avg", avg)
+      console.log('avg', avg)
       // Step size calculation: ensure at least 1, roughly avg/2 to create spread
       // Level 1: 1 ~ step
       // Level 2: step+1 ~ step*2
       // Level 3: step*2+1 ~ step*3
       // Level 4: > step*3
-      const step = Math.max(Math.ceil(avg / 2), 1);
+      const step = Math.max(Math.ceil(avg / 2), 1)
-      thresholds.value = [step, step * 2, step * 3];
+      thresholds.value = [step, step * 2, step * 3]
 
-      generateHeatmapData(startDate, endDate);
+      generateHeatmapData(startDate, endDate)
     }
   } catch (e) {
-    console.error("Failed to fetch heatmap data", e);
+    console.error('Failed to fetch heatmap data', e)
+  }
 }
-};
 
 const generateHeatmapData = (startDate, endDate) => {
-  const data = [];
+  const data = []
-  const current = new Date(startDate);
+  const current = new Date(startDate)
 
-  const allDays = [];
+  const allDays = []
 
   // Adjust start date to be Monday to align weeks
   // 0 = Sunday, 1 = Monday
-  const startDay = current.getDay();
+  const startDay = current.getDay()
   // If startDay is 0 (Sunday), we need to go back 6 days to Monday
   // If startDay is 1 (Monday), we are good
   // If startDay is 2 (Tuesday), we need to go back 1 day
@@ -145,113 +143,123 @@ const generateHeatmapData = (startDate, endDate) => {
   // Sunday (0) -> 6 days back
   // Tuesday (2) -> 1 day back
 
-  const daysToSubtract = (startDay + 6) % 7;
+  const daysToSubtract = (startDay + 6) % 7
   // We don't necessarily need to subtract from startDate for data fetching,
   // but for grid alignment we want the first column to start on Monday.
 
-  const alignStart = new Date(startDate);
+  const alignStart = new Date(startDate)
   // alignStart.setDate(alignStart.getDate() - daysToSubtract);
 
-  const tempDate = new Date(alignStart);
+  const tempDate = new Date(alignStart)
   while (tempDate <= endDate) {
-    const dateStr = formatDate(tempDate);
+    const dateStr = formatDate(tempDate)
     allDays.push({
       date: dateStr,
       count: stats.value[dateStr]?.count || 0,
       obj: new Date(tempDate)
-    });
+    })
-    tempDate.setDate(tempDate.getDate() + 1);
+    tempDate.setDate(tempDate.getDate() + 1)
   }
 
   // Now group into weeks
-  const resultWeeks = [];
+  const resultWeeks = []
-  let currentWeek = [];
+  let currentWeek = []
 
   // Pad first week if start date is not Monday
   // allDays[0] is startDate
-  const firstDayObj = new Date(allDays[0].date);
+  const firstDayObj = new Date(allDays[0].date)
-  const firstDay = firstDayObj.getDay(); // 0-6 (Sun-Sat)
+  const firstDay = firstDayObj.getDay() // 0-6 (Sun-Sat)
 
   // We want Monday (1) to be index 0
   // Mon(1)->0, Tue(2)->1, ..., Sun(0)->6
-  const padCount = (firstDay + 6) % 7;
+  const padCount = (firstDay + 6) % 7
 
   for (let i = 0; i < padCount; i++) {
-    currentWeek.push(null); 
+    currentWeek.push(null)
   }
 
-  allDays.forEach(day => {
+  allDays.forEach((day) => {
-    currentWeek.push(day);
+    currentWeek.push(day)
     if (currentWeek.length === 7) {
-      resultWeeks.push(currentWeek);
+      resultWeeks.push(currentWeek)
-      currentWeek = [];
+      currentWeek = []
     }
-  });
+  })
 
   // Push last partial week
   if (currentWeek.length > 0) {
     while (currentWeek.length < 7) {
-      currentWeek.push(null);
+      currentWeek.push(null)
     }
-    resultWeeks.push(currentWeek);
+    resultWeeks.push(currentWeek)
   }
 
-  weeks.value = resultWeeks;
+  weeks.value = resultWeeks
 
   // Generate Month Labels
-  const labels = [];
+  const labels = []
-  let lastMonth = -1;
+  let lastMonth = -1
 
   resultWeeks.forEach((week, index) => {
     // Check the first valid day in the week
-    const day = week.find(d => d !== null);
+    const day = week.find((d) => d !== null)
     if (day) {
-      const d = new Date(day.date);
+      const d = new Date(day.date)
-      const month = d.getMonth();
+      const month = d.getMonth()
       if (month !== lastMonth) {
         labels.push({
           text: d.toLocaleString('zh-CN', { month: 'short' }),
           left: index * WEEK_WIDTH
-        });
+        })
-        lastMonth = month;
+        lastMonth = month
       }
     }
-  });
+  })
 
-  monthLabels.value = labels;
+  monthLabels.value = labels
 
   // Scroll to end
   nextTick(() => {
     if (scrollContainer.value) {
-      scrollContainer.value.scrollLeft = scrollContainer.value.scrollWidth;
+      scrollContainer.value.scrollLeft = scrollContainer.value.scrollWidth
+    }
+  })
 }
-  });
-};
 
 const getLevelClass = (day) => {
-  if (!day) return 'invisible';
+  if (!day) {
-  const count = day.count;
+    return 'invisible'
-  if (count === 0) return 'level-0';
+  }
-  if (count <= thresholds.value[0]) return 'level-1';
+  const count = day.count
-  if (count <= thresholds.value[1]) return 'level-2';
+  if (count === 0) {
-  if (count <= thresholds.value[2]) return 'level-3';
+    return 'level-0'
-  return 'level-4';
+  }
-};
+  if (count <= thresholds.value[0]) {
+    return 'level-1'
+  }
+  if (count <= thresholds.value[1]) {
+    return 'level-2'
+  }
+  if (count <= thresholds.value[2]) {
+    return 'level-3'
+  }
+  return 'level-4'
+}
 
 const onCellClick = (day) => {
   if (day) {
     // Emit event or show toast
     // console.log(day);
   }
-};
+}
 
 defineExpose({
   refresh: fetchData
-});
+})
 
 onMounted(() => {
-  fetchData();
+  fetchData()
-});
+})
 </script>
 
 <style scoped>
@@ -260,7 +268,7 @@ onMounted(() => {
   border-radius: 8px;
   padding: 12px;
   color: var(--van-text-color);
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
   margin: 0 10px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   border: 1px solid var(--van-border-color);
@@ -357,7 +365,9 @@ onMounted(() => {
   */
   margin-top: 21px;
 }
-.weekday-label:first-child { margin-top: 18px; }
+.weekday-label:first-child {
+  margin-top: 18px;
+}
 
 .heatmap-grid {
   display: flex;
@@ -382,12 +392,22 @@ onMounted(() => {
   background-color: transparent;
 }
 
-.level-0 { background-color: var(--van-gray-2); }
+.level-0 {
+  background-color: var(--van-gray-2);
+}
 /* Default (Light Mode) - Light to Deep Green */
-.level-1 { background-color: #9be9a8; }
+.level-1 {
-.level-2 { background-color: #40c463; }
+  background-color: #9be9a8;
-.level-3 { background-color: #30a14e; }
+}
-.level-4 { background-color: #216e39; }
+.level-2 {
+  background-color: #40c463;
+}
+.level-3 {
+  background-color: #30a14e;
+}
+.level-4 {
+  background-color: #216e39;
+}
 
 /* Dark Mode - Dark to Light/Bright Green (GitHub Dark Mode Style) */
 /* The user requested "From Light to Deep" (浅至深) which usually means standard heatmap logic (darker = more).
@@ -417,10 +437,18 @@ onMounted(() => {
    This goes from Dark Green -> Bright Green.
 */
 @media (prefers-color-scheme: dark) {
-  .level-1 { background-color: #9be9a8; }
+  .level-1 {
-  .level-2 { background-color: #40c463; }
+    background-color: #9be9a8;
-  .level-3 { background-color: #30a14e; }
+  }
-  .level-4 { background-color: #216e39; }
+  .level-2 {
+    background-color: #40c463;
+  }
+  .level-3 {
+    background-color: #30a14e;
+  }
+  .level-4 {
+    background-color: #216e39;
+  }
 }
 
 .heatmap-footer {

Web/src/components/Global/GlobalAddBill.vue

@@ -6,11 +6,7 @@
     </div>
 
     <!-- Add Bill Modal -->
-    <PopupContainer
+    <PopupContainer v-model="showAddBill" title="记一笔" height="75%">
-      v-model="showAddBill"
-      title="记一笔"
-      height="75%"
-    >
       <van-tabs v-model:active="activeTab" shrink>
         <van-tab title="一句话录账" name="one">
           <OneLineBillAdd :key="componentKey" @success="handleSuccess" />

Web/src/components/PopupContainer.vue

@@ -13,10 +13,12 @@
       <div class="popup-header-fixed">
         <!-- 标题行 (无子标题且有操作时使用 Grid 布局) -->
         <div class="header-title-row" :class="{ 'has-actions': !subtitle && hasActions }">
-          <h3 class="popup-title">{{ title }}</h3>
+          <h3 class="popup-title">
+            {{ title }}
+          </h3>
           <!-- 无子标题时，操作按钮与标题同行 -->
           <div v-if="!subtitle && hasActions" class="header-actions-inline">
-            <slot name="header-actions"></slot>
+            <slot name="header-actions" />
           </div>
         </div>
 
@@ -24,18 +26,18 @@
         <div v-if="subtitle" class="header-stats">
           <span class="stats-text" v-html="subtitle" />
           <!-- 额外操作插槽 -->
-          <slot v-if="hasActions" name="header-actions"></slot>
+          <slot v-if="hasActions" name="header-actions" />
         </div>
       </div>
 
       <!-- 内容区域（可滚动） -->
       <div class="popup-scroll-content">
-        <slot></slot>
+        <slot />
       </div>
 
       <!-- 底部页脚，固定不可滚动 -->
       <div v-if="slots.footer" class="popup-footer-fixed">
-        <slot name="footer"></slot>
+        <slot name="footer" />
       </div>
     </div>
   </van-popup>
@@ -47,24 +49,24 @@ import { computed, useSlots } from 'vue'
 const props = defineProps({
   modelValue: {
     type: Boolean,
-    required: true,
+    required: true
   },
   title: {
     type: String,
-    default: '',
+    default: ''
   },
   subtitle: {
     type: String,
-    default: '',
+    default: ''
   },
   height: {
     type: String,
-    default: '80%',
+    default: '80%'
   },
   closeable: {
     type: Boolean,
-    default: true,
+    default: true
-  },
+  }
 })
 
 const emit = defineEmits(['update:modelValue'])
@@ -74,7 +76,7 @@ const slots = useSlots()
 // 双向绑定
 const visible = computed({
   get: () => props.modelValue,
-  set: (value) => emit('update:modelValue', value),
+  set: (value) => emit('update:modelValue', value)
 })
 
 // 判断是否有操作按钮

Web/src/components/ReasonGroupList.vue

@@ -1,8 +1,14 @@
 <template>
   <div class="reason-group-list-v2">
-    <van-empty v-if="groups.length === 0 && !loading" description="暂无数据" />
+    <van-empty
+      v-if="groups.length === 0 && !loading"
+      description="暂无数据"
+    />
 
-    <van-cell-group v-else inset>
+    <van-cell-group
+      v-else
+      inset
+    >
       <van-cell
         v-for="group in groups"
         :key="group.reason"
@@ -27,7 +33,7 @@
             <van-tag
               :type="getTypeColor(group.sampleType)"
               size="medium"
-              style="margin-right: 8px;"
+              style="margin-right: 8px"
             >
               {{ getTypeName(group.sampleType) }}
             </van-tag>
@@ -35,12 +41,15 @@
               v-if="group.sampleClassify"
               type="primary"
               size="medium"
-              style="margin-right: 8px;"
+              style="margin-right: 8px"
             >
               {{ group.sampleClassify }}
             </van-tag>
             <span class="count-text">{{ group.count }} 条</span>
-            <span v-if="group.totalAmount" class="amount-text">
+            <span
+              v-if="group.totalAmount"
+              class="amount-text"
+            >
               ¥{{ Math.abs(group.totalAmount).toFixed(2) }}
             </span>
           </div>
@@ -92,7 +101,10 @@
       title="批量设置分类"
       height="60%"
     >
-      <van-form ref="batchFormRef" class="setting-form">
+      <van-form
+        ref="batchFormRef"
+        class="setting-form"
+      >
         <van-cell-group inset>
           <!-- 显示选中的摘要 -->
           <van-field
@@ -111,20 +123,38 @@
           />
 
           <!-- 交易类型 -->
-          <van-field name="type" label="交易类型">
+          <van-field
+            name="type"
+            label="交易类型"
+          >
             <template #input>
-              <van-radio-group v-model="batchForm.type" direction="horizontal">
+              <van-radio-group
-                <van-radio :name="0">支出</van-radio>
+                v-model="batchForm.type"
-                <van-radio :name="1">收入</van-radio>
+                direction="horizontal"
-                <van-radio :name="2">不计</van-radio>
+              >
+                <van-radio :name="0">
+                  支出
+                </van-radio>
+                <van-radio :name="1">
+                  收入
+                </van-radio>
+                <van-radio :name="2">
+                  不计
+                </van-radio>
               </van-radio-group>
             </template>
           </van-field>
 
           <!-- 分类选择 -->
-          <van-field name="classify" label="分类">
+          <van-field
+            name="classify"
+            label="分类"
+          >
             <template #input>
-              <span v-if="!batchForm.classify" style="opacity: 0.4;">请选择分类</span>
+              <span
+                v-if="!batchForm.classify"
+                style="opacity: 0.4"
+              >请选择分类</span>
               <span v-else>{{ batchForm.classify }}</span>
             </template>
           </van-field>
@@ -152,13 +182,7 @@
 
 <script setup>
 import { ref, computed, watch, onBeforeUnmount } from 'vue'
-import { 
+import { showToast, showSuccessToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
-  showToast, 
-  showSuccessToast, 
-  showLoadingToast, 
-  closeToast,
-  showConfirmDialog
-} from 'vant'
 import { getReasonGroups, batchUpdateByReason, getTransactionList } from '@/api/transactionRecord'
 import ClassifySelector from './ClassifySelector.vue'
 import TransactionList from './TransactionList.vue'
@@ -212,9 +236,12 @@ const batchForm = ref({
 })
 
 // 监听交易类型变化，重新加载分类
-watch(() => batchForm.value.type, (newVal) => {
+watch(
+  () => batchForm.value.type,
+  (newVal) => {
     batchForm.value.classify = ''
-})
+  }
+)
 
 // 获取类型名称
 const getTypeName = (type) => {
@@ -256,7 +283,9 @@ const handleGroupClick = async (group) => {
 
 // 加载分组的交易记录
 const loadGroupTransactions = async () => {
-  if (transactionFinished.value || !selectedGroup.value) return
+  if (transactionFinished.value || !selectedGroup.value) {
+    return
+  }
 
   transactionLoading.value = true
   try {
@@ -354,9 +383,7 @@ const handleConfirmBatchUpdate = async () => {
       emit('data-changed')
       try {
         window.dispatchEvent(
-          new CustomEvent(
+          new CustomEvent('transactions-changed', {
-            'transactions-changed', 
-            { 
             detail: {
               reason: batchGroup.value.reason
             }
@@ -398,7 +425,7 @@ const handleTransactionClick = (transaction) => {
 
 // 处理分组中的删除事件
 const handleGroupTransactionDelete = async (transactionId) => {
-  groupTransactions.value = groupTransactions.value.filter(t => t.id !== transactionId)
+  groupTransactions.value = groupTransactions.value.filter((t) => t.id !== transactionId)
   groupTransactionsTotal.value = Math.max(0, (groupTransactionsTotal.value || 0) - 1)
 
   if (groupTransactions.value.length === 0 && !transactionFinished.value) {
@@ -409,7 +436,7 @@ const handleGroupTransactionDelete = async (transactionId) => {
   if (groupTransactions.value.length === 0) {
     // 如果删除后当前分组没有交易了，关闭弹窗
     showTransactionList.value = false
-    groups.value = groups.value.filter(g => g.reason !== selectedGroup.value.reason)
+    groups.value = groups.value.filter((g) => g.reason !== selectedGroup.value.reason)
     selectedGroup.value = null
     total.value--
   }
@@ -433,10 +460,12 @@ const onGlobalTransactionDeleted = () => {
   }
 }
 
-window.addEventListener && window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
+window.addEventListener &&
+  window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
+  window.removeEventListener &&
+    window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
 })
 
 // 当有交易新增/修改/批量更新时的刷新监听
@@ -451,10 +480,12 @@ const onGlobalTransactionsChanged = () => {
   }
 }
 
-window.addEventListener && window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
+window.addEventListener &&
+  window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
+  window.removeEventListener &&
+    window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
 })
 
 // 处理账单保存后的回调
@@ -471,7 +502,9 @@ const handleTransactionSaved = async () => {
  * 加载数据（支持分页）
  */
 const loadData = async () => {
-  if (finished.value) return
+  if (finished.value) {
+    return
+  }
 
   loading.value = true
   try {
@@ -522,7 +555,7 @@ const refresh = async () => {
  */
 const getList = (onlySelected = false) => {
   if (onlySelected && props.selectable) {
-    return groups.value.filter(g => selectedReasons.value.has(g.reason))
+    return groups.value.filter((g) => selectedReasons.value.has(g.reason))
   }
   return [...groups.value]
 }
@@ -564,7 +597,7 @@ const clearSelection = () => {
  * 全选
  */
 const selectAll = () => {
-  selectedReasons.value = new Set(groups.value.map(g => g.reason))
+  selectedReasons.value = new Set(groups.value.map((g) => g.reason))
 }
 
 // 暴露方法给父组件

Web/src/components/SmartClassifyButton.vue

@@ -11,7 +11,7 @@
   >
     <template v-if="!loading && !saving">
       <van-icon :name="buttonIcon" />
-      <span style="margin-left: 4px;">{{ buttonText }}</span>
+      <span style="margin-left: 4px">{{ buttonText }}</span>
     </template>
   </van-button>
 </template>
@@ -52,28 +52,42 @@ const hasClassifiedResults = computed(() => {
 
 // 按钮类型
 const buttonType = computed(() => {
-  if (saving.value) return 'warning'
+  if (saving.value) {
-  if (loading.value) return 'primary'
+    return 'warning'
-  if (hasClassifiedResults.value) return 'success'
+  }
+  if (loading.value) {
+    return 'primary'
+  }
+  if (hasClassifiedResults.value) {
+    return 'success'
+  }
   return 'primary'
 })
 
 // 按钮图标
 const buttonIcon = computed(() => {
-  if (hasClassifiedResults.value) return 'success'
+  if (hasClassifiedResults.value) {
+    return 'success'
+  }
   return 'fire'
 })
 
 // 按钮文字（非加载状态）
 const buttonText = computed(() => {
-  if (hasClassifiedResults.value) return '保存分类'
+  if (hasClassifiedResults.value) {
+    return '保存分类'
+  }
   return '智能分类'
 })
 
 // 加载中文字
 const loadingText = computed(() => {
-  if (saving.value) return '保存中...'
+  if (saving.value) {
-  if (loading.value) return '分类中...'
+    return '保存中...'
+  }
+  if (loading.value) {
+    return '分类中...'
+  }
   return ''
 })
 
@@ -92,7 +106,9 @@ const handleClick = () => {
  * 保存分类结果
  */
 const handleSaveClassify = async () => {
-  if (saving.value || loading.value) return
+  if (saving.value || loading.value) {
+    return
+  }
 
   try {
     saving.value = true
@@ -104,7 +120,7 @@ const handleSaveClassify = async () => {
     })
 
     // 准备批量更新数据
-    const items = classifiedResults.value.map(item => ({
+    const items = classifiedResults.value.map((item) => ({
       id: item.id,
       classify: item.classify,
       type: item.type
@@ -200,7 +216,7 @@ const handleSmartClassify = async () => {
     // 分批处理
     for (let i = 0; i < allTransactions.length; i += batchSize) {
       const batch = allTransactions.slice(i, i + batchSize)
-      const transactionIds = batch.map(t => t.id)
+      const transactionIds = batch.map((t) => t.id)
       const currentBatch = Math.floor(i / batchSize) + 1
       const totalBatches = Math.ceil(allTransactions.length / batchSize)
 
@@ -229,7 +245,9 @@ const handleSmartClassify = async () => {
       while (true) {
         const { done, value } = await reader.read()
 
-        if (done) break
+        if (done) {
+          break
+        }
 
         buffer += decoder.decode(value, { stream: true })
 
@@ -238,7 +256,9 @@ const handleSmartClassify = async () => {
         buffer = events.pop() || '' // 保留最后一个不完整的部分
 
         for (const eventBlock of events) {
-          if (!eventBlock.trim()) continue
+          if (!eventBlock.trim()) {
+            continue
+          }
 
           try {
             const lines = eventBlock.split('\n')
@@ -276,7 +296,7 @@ const handleSmartClassify = async () => {
               })
 
               // 实时更新交易记录的分类信息
-              const index = props.transactions.findIndex(t => t.id === data.id)
+              const index = props.transactions.findIndex((t) => t.id === data.id)
               if (index !== -1) {
                 const transaction = props.transactions[index]
                 transaction.upsetedClassify = data.Classify
@@ -344,7 +364,7 @@ const handleSmartClassify = async () => {
 
 const removeClassifiedTransaction = (transactionId) => {
   // 从已分类结果中移除指定ID的项
-  classifiedResults.value = classifiedResults.value.filter(item => item.id !== transactionId)
+  classifiedResults.value = classifiedResults.value.filter((item) => item.id !== transactionId)
 }
 
 /**
@@ -365,8 +385,7 @@ const reset = () => {
 defineExpose({
   reset,
   removeClassifiedTransaction
-});
+})
-
 </script>
 
 <style scoped>

Web/src/components/TransactionDetail.vue

@@ -1,15 +1,10 @@
 <template>
-  <PopupContainer
+  <PopupContainer v-model="visible" title="交易详情" height="75%" :closeable="false">
-    v-model="visible"
-    title="交易详情"
-    height="75%"
-    :closeable="false"
-  >
     <template #header-actions>
       <van-button size="small" type="primary" plain @click="handleOffsetClick"> 抵账 </van-button>
     </template>
 
-    <van-form style="margin-top: 12px;">
+    <van-form style="margin-top: 12px">
       <van-cell-group inset>
         <van-cell title="记录时间" :value="formatDate(transaction.createTime)" />
       </van-cell-group>
@@ -55,7 +50,11 @@
 
         <van-field name="type" label="交易类型">
           <template #input>
-              <van-radio-group v-model="editForm.type" direction="horizontal" @change="handleTypeChange">
+            <van-radio-group
+              v-model="editForm.type"
+              direction="horizontal"
+              @change="handleTypeChange"
+            >
               <van-radio :name="0"> 支出 </van-radio>
               <van-radio :name="1"> 收入 </van-radio>
               <van-radio :name="2"> 不计 </van-radio>
@@ -65,22 +64,34 @@
 
         <van-field name="classify" label="交易分类">
           <template #input>
-              <div style="flex: 1;">
+            <div style="flex: 1">
               <div
-                  v-if="transaction && transaction.unconfirmedClassify && transaction.unconfirmedClassify !== editForm.classify" 
+                v-if="
+                  transaction &&
+                  transaction.unconfirmedClassify &&
+                  transaction.unconfirmedClassify !== editForm.classify
+                "
                 class="suggestion-tip"
                 @click="applySuggestion"
               >
                 <van-icon name="bulb-o" class="suggestion-icon" />
                 <span class="suggestion-text">
                   建议: {{ transaction.unconfirmedClassify }}
-                    <span v-if="transaction.unconfirmedType !== null && transaction.unconfirmedType !== undefined && transaction.unconfirmedType !== editForm.type">
+                  <span
+                    v-if="
+                      transaction.unconfirmedType !== null &&
+                      transaction.unconfirmedType !== undefined &&
+                      transaction.unconfirmedType !== editForm.type
+                    "
+                  >
                     ({{ getTypeName(transaction.unconfirmedType) }})
                   </span>
                 </span>
                 <div class="suggestion-apply">应用</div>
               </div>
-                <span v-else-if="!editForm.classify" style="color: var(--van-gray-5);">请选择交易分类</span>
+              <span v-else-if="!editForm.classify" style="color: var(--van-gray-5)"
+                >请选择交易分类</span
+              >
               <span v-else>{{ editForm.classify }}</span>
             </div>
           </template>
@@ -95,24 +106,14 @@
     </van-form>
 
     <template #footer>
-      <van-button 
+      <van-button round block type="primary" :loading="submitting" @click="onSubmit">
-        round 
-        block 
-        type="primary" 
-        :loading="submitting"
-        @click="onSubmit"
-      >
         保存修改
       </van-button>
     </template>
   </PopupContainer>
 
   <!-- 抵账候选列表弹窗 -->
-  <PopupContainer
+  <PopupContainer v-model="showOffsetPopup" title="选择抵账交易" height="75%">
-    v-model="showOffsetPopup"
-    title="选择抵账交易"
-    height="75%"
-  >
     <van-list>
       <van-cell
         v-for="item in offsetCandidates"
@@ -154,7 +155,11 @@ import { showToast, showConfirmDialog } from 'vant'
 import dayjs from 'dayjs'
 import PopupContainer from '@/components/PopupContainer.vue'
 import ClassifySelector from '@/components/ClassifySelector.vue'
-import { updateTransaction, getCandidatesForOffset, offsetTransactions } from '@/api/transactionRecord'
+import {
+  updateTransaction,
+  getCandidatesForOffset,
+  offsetTransactions
+} from '@/api/transactionRecord'
 
 const props = defineProps({
   show: {
@@ -196,11 +201,16 @@ const occurredAtLabel = computed(() => {
 })
 
 // 监听props变化
-watch(() => props.show, (newVal) => {
+watch(
+  () => props.show,
+  (newVal) => {
     visible.value = newVal
-})
+  }
+)
 
-watch(() => props.transaction, (newVal) => {
+watch(
+  () => props.transaction,
+  (newVal) => {
     if (newVal) {
       isSyncing.value = true
       // 填充编辑表单
@@ -224,7 +234,8 @@ watch(() => props.transaction, (newVal) => {
         isSyncing.value = false
       })
     }
-})
+  }
+)
 
 watch(visible, (newVal) => {
   emit('update:show', newVal)
@@ -258,7 +269,10 @@ const onConfirmTime = ({ selectedValues }) => {
 const applySuggestion = () => {
   if (props.transaction.unconfirmedClassify) {
     editForm.classify = props.transaction.unconfirmedClassify
-    if (props.transaction.unconfirmedType !== null && props.transaction.unconfirmedType !== undefined) {
+    if (
+      props.transaction.unconfirmedType !== null &&
+      props.transaction.unconfirmedType !== undefined
+    ) {
       editForm.type = props.transaction.unconfirmedType
     }
   }
@@ -314,7 +328,9 @@ const handleClassifyChange = () => {
 
 // 清空分类
 const formatDate = (dateString) => {
-  if (!dateString) return ''
+  if (!dateString) {
+    return ''
+  }
   const date = new Date(dateString)
   return date.toLocaleString('zh-CN', {
     year: 'numeric',
@@ -347,7 +363,7 @@ const handleOffsetClick = async () => {
 const handleCandidateSelect = (candidate) => {
   showConfirmDialog({
     title: '确认抵账',
-    message: `确认将当前交易与 "${candidate.reason}" (${candidate.amount}) 互相抵消吗？\n抵消后两笔交易将被删除。`,
+    message: `确认将当前交易与 "${candidate.reason}" (${candidate.amount}) 互相抵消吗？\n抵消后两笔交易将被删除。`
   })
     .then(async () => {
       try {
@@ -367,7 +383,7 @@ const handleCandidateSelect = (candidate) => {
     })
     .catch(() => {
       // on cancel
-    });
+    })
 }
 </script>
 

Web/src/components/TransactionList.vue

@@ -1,11 +1,6 @@
 <template>
   <div class="transaction-list-container transaction-list">
-    <van-list
+    <van-list :loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
-      :loading="loading"
-      :finished="finished"
-      finished-text="没有更多了"
-      @load="onLoad"
-    >
       <van-cell-group v-if="transactions && transactions.length" inset style="margin-top: 10px">
         <van-swipe-cell
           v-for="transaction in transactions"
@@ -19,10 +14,7 @@
               class="checkbox-col"
               @update:model-value="toggleSelection(transaction)"
             />
-            <div
+            <div class="transaction-card" @click="handleClick(transaction)">
-              class="transaction-card"
-              @click="handleClick(transaction)"
-            >
               <div class="card-left">
                 <div class="transaction-title">
                   <span class="reason">{{ transaction.reason || '(无摘要)' }}</span>
@@ -30,34 +22,32 @@
                 <div class="transaction-info">
                   <div>交易时间: {{ formatDate(transaction.occurredAt) }}</div>
                   <div>
-                    <span v-if="transaction.classify">
+                    <span v-if="transaction.classify"> 分类: {{ transaction.classify }} </span>
-                      分类: {{ transaction.classify }}
+                    <span
-                    </span>
+                      v-if="
-                    <span v-if="transaction.upsetedClassify && transaction.upsetedClassify !== transaction.classify" style="color: var(--van-warning-color)">
+                        transaction.upsetedClassify &&
+                        transaction.upsetedClassify !== transaction.classify
+                      "
+                      style="color: var(--van-warning-color)"
+                    >
                       → {{ transaction.upsetedClassify }}
                     </span>
-                    
-                  </div>
-                  <div v-if="transaction.importFrom">
-                    来源: {{ transaction.importFrom }}
                   </div>
+                  <div v-if="transaction.importFrom">来源: {{ transaction.importFrom }}</div>
                 </div>
               </div>
               <div class="card-middle">
-                <van-tag 
+                <van-tag :type="getTypeTagType(transaction.type)" size="medium">
-                  :type="getTypeTagType(transaction.type)" 
-                  size="medium"
-                >
                   {{ getTypeName(transaction.type) }}
                 </van-tag>
                 <template
-                  v-if="Number.isFinite(transaction.upsetedType) && transaction.upsetedType !== transaction.type" 
+                  v-if="
+                    Number.isFinite(transaction.upsetedType) &&
+                    transaction.upsetedType !== transaction.type
+                  "
                 >
                   →
-                  <van-tag
+                  <van-tag :type="getTypeTagType(transaction.upsetedType)" size="medium">
-                    :type="getTypeTagType(transaction.upsetedType)" 
-                    size="medium"
-                  >
                     {{ getTypeName(transaction.upsetedType) }}
                   </van-tag>
                 </template>
@@ -70,7 +60,10 @@
                   <div v-if="transaction.balance && transaction.balance > 0" class="balance">
                     余额: {{ formatMoney(transaction.balance) }}
                   </div>
-                  <div v-if="transaction.refundAmount && transaction.refundAmount > 0" class="balance">
+                  <div
+                    v-if="transaction.refundAmount && transaction.refundAmount > 0"
+                    class="balance"
+                  >
                     退款: {{ formatMoney(transaction.refundAmount) }}
                   </div>
                 </div>
@@ -212,16 +205,24 @@ const getTypeTagType = (type) => {
 
 // 获取金额样式类
 const getAmountClass = (type) => {
-  if (type === 0) return 'expense'
+  if (type === 0) {
-  if (type === 1) return 'income'
+    return 'expense'
+  }
+  if (type === 1) {
+    return 'income'
+  }
   return 'neutral'
 }
 
 // 格式化金额（带符号）
 const formatAmount = (amount, type) => {
   const formatted = formatMoney(amount)
-  if (type === 0) return `- ${formatted}`
+  if (type === 0) {
-  if (type === 1) return `+ ${formatted}`
+    return `- ${formatted}`
+  }
+  if (type === 1) {
+    return `+ ${formatted}`
+  }
   return formatted
 }
 
@@ -232,7 +233,9 @@ const formatMoney = (amount) => {
 
 // 格式化日期
 const formatDate = (dateString) => {
-  if (!dateString) return ''
+  if (!dateString) {
+    return ''
+  }
   const date = new Date(dateString)
   return date.toLocaleString('zh-CN', {
     year: 'numeric',

Web/src/main.js

@@ -8,7 +8,7 @@ import { createPinia } from 'pinia'
 import App from './App.vue'
 import router from './router'
 import vant from 'vant'
-import { ConfigProvider } from 'vant';
+import { ConfigProvider } from 'vant'
 import 'vant/lib/index.css'
 
 // 注册 Service Worker
@@ -19,7 +19,7 @@ const app = createApp(App)
 app.use(createPinia())
 app.use(router)
 app.use(vant)
-app.use(ConfigProvider);
+app.use(ConfigProvider)
 
 app.mount('#app')
 

Web/src/registerServiceWorker.js

@@ -1,65 +1,68 @@
-import { ref } from 'vue';
+import { ref } from 'vue'
 
-export const needRefresh = ref(false);
+export const needRefresh = ref(false)
-let swRegistration = null;
+let swRegistration = null
 
 export async function updateServiceWorker() {
   if (swRegistration && swRegistration.waiting) {
-    await swRegistration.waiting.postMessage({ type: 'SKIP_WAITING' });
+    await swRegistration.waiting.postMessage({ type: 'SKIP_WAITING' })
   }
 }
 
 export function register() {
   if ('serviceWorker' in navigator) {
     window.addEventListener('load', () => {
-      const swUrl = `/service-worker.js`;
+      const swUrl = '/service-worker.js'
 
       navigator.serviceWorker
         .register(swUrl)
         .then((registration) => {
-          swRegistration = registration;
+          swRegistration = registration
-          console.log('[SW] Service Worker 注册成功:', registration.scope);
+          console.log('[SW] Service Worker 注册成功:', registration.scope)
 
           // 如果已经有等待中的更新
           if (registration.waiting) {
-            console.log('[SW] 发现未处理的新版本');
+            console.log('[SW] 发现未处理的新版本')
-            needRefresh.value = true;
+            needRefresh.value = true
           }
 
           // 检查更新
           registration.addEventListener('updatefound', () => {
-            const newWorker = registration.installing;
+            const newWorker = registration.installing
-            console.log('[SW] 发现新版本');
+            console.log('[SW] 发现新版本')
 
             newWorker.addEventListener('statechange', () => {
               if (newWorker.state === 'installed') {
                 if (navigator.serviceWorker.controller) {
                   // 新的 Service Worker 已安装，提示用户刷新
-                  console.log('[SW] 新版本可用，请刷新页面');
+                  console.log('[SW] 新版本可用，请刷新页面')
-                  needRefresh.value = true;
+                  needRefresh.value = true
                 } else {
                   // 首次安装
-                  console.log('[SW] 内容已缓存，可离线使用');
+                  console.log('[SW] 内容已缓存，可离线使用')
                 }
               }
-            });
+            })
-          });
+          })
 
           // 定期检查更新
-          setInterval(() => {
+          setInterval(
-            registration.update();
+            () => {
-          }, 60 * 60 * 1000); // 每小时检查一次
+              registration.update()
+            },
+            60 * 60 * 1000
+          ) // 每小时检查一次
         })
         .catch((error) => {
-          console.error('[SW] Service Worker 注册失败:', error);
+          console.error('[SW] Service Worker 注册失败:', error)
-        });
+        })
 
       // 监听 Service Worker 控制器变化
       navigator.serviceWorker.addEventListener('controllerchange', () => {
-        console.log('[SW] 控制器已更改，页面将刷新');
+        console.log('[SW] 控制器已更改，页面将刷新')
-        window.location.reload();
+        window.location.reload()
-      });
+      })
-    });
+    })
   }
 }
 
@@ -67,35 +70,37 @@ export function unregister() {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.ready
       .then((registration) => {
-        registration.unregister();
+        registration.unregister()
       })
       .catch((error) => {
-        console.error(error.message);
+        console.error(error.message)
-      });
+      })
   }
 }
 
-
 // 请求通知权限
 export function requestNotificationPermission() {
   if ('Notification' in window && 'serviceWorker' in navigator) {
     Notification.requestPermission().then((permission) => {
       if (permission === 'granted') {
-        console.log('[SW] 通知权限已授予');
+        console.log('[SW] 通知权限已授予')
       }
-    });
+    })
   }
 }
 
 // 后台同步
 export function registerBackgroundSync(tag = 'sync-data') {
   if ('serviceWorker' in navigator && 'SyncManager' in window) {
-    navigator.serviceWorker.ready.then((registration) => {
+    navigator.serviceWorker.ready
-      return registration.sync.register(tag);
+      .then((registration) => {
-    }).then(() => {
+        return registration.sync.register(tag)
-      console.log('[SW] 后台同步已注册:', tag);
+      })
-    }).catch((err) => {
+      .then(() => {
-      console.error('[SW] 后台同步注册失败:', err);
+        console.log('[SW] 后台同步已注册:', tag)
-    });
+      })
+      .catch((err) => {
+        console.error('[SW] 后台同步注册失败:', err)
+      })
   }
 }

Web/src/router/index.js

@@ -8,106 +8,106 @@ const router = createRouter({
       path: '/login',
       name: 'login',
       component: () => import('../views/LoginView.vue'),
-      meta: { requiresAuth: false },
+      meta: { requiresAuth: false }
     },
     {
       path: '/balance',
       name: 'balance',
       component: () => import('../views/BalanceView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/email',
       name: 'email',
       component: () => import('../views/EmailRecord.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/setting',
       name: 'setting',
       component: () => import('../views/SettingView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/calendar',
       name: 'calendar',
       component: () => import('../views/CalendarView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/smart-classification',
       name: 'smart-classification',
       component: () => import('../views/ClassificationSmart.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/classification-edit',
       name: 'classification-edit',
       component: () => import('../views/ClassificationEdit.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/classification-batch',
       name: 'classification-batch',
       component: () => import('../views/ClassificationBatch.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/classification-nlp',
       name: 'classification-nlp',
       component: () => import('../views/ClassificationNLP.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/',
       name: 'statistics',
       component: () => import('../views/StatisticsView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/bill-analysis',
       name: 'bill-analysis',
       component: () => import('../views/BillAnalysisView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/message',
       name: 'message',
       redirect: { path: '/balance', query: { tab: 'message' } },
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/periodic-record',
       name: 'periodic-record',
       component: () => import('../views/PeriodicRecord.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/log',
       name: 'log',
       component: () => import('../views/LogView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/budget',
       name: 'budget',
       component: () => import('../views/BudgetView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       path: '/scheduled-tasks',
       name: 'scheduled-tasks',
       component: () => import('../views/ScheduledTasksView.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     },
     {
       // 待确认的分类项
       path: '/unconfirmed-classification',
       name: 'unconfirmed-classification',
       component: () => import('../views/UnconfirmedClassification.vue'),
-      meta: { requiresAuth: true },
+      meta: { requiresAuth: true }
     }
-  ],
+  ]
 })
 
 // 路由守卫
@@ -127,4 +127,3 @@ router.beforeEach((to, from, next) => {
 })
 
 export default router
-

Web/src/stores/auth.js

@@ -7,7 +7,9 @@ export const useAuthStore = defineStore('auth', () => {
   const expiresAt = ref(localStorage.getItem('expiresAt') || '')
 
   const isAuthenticated = computed(() => {
-    if (!token.value || !expiresAt.value) return false
+    if (!token.value || !expiresAt.value) {
+      return false
+    }
     // 检查token是否过期
     return new Date(expiresAt.value) > new Date()
   })
@@ -44,6 +46,6 @@ export const useAuthStore = defineStore('auth', () => {
     expiresAt,
     isAuthenticated,
     login,
-    logout,
+    logout
   }
 })

Web/src/views/BalanceView.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="page-container-flex">
-  
     <!-- 顶部导航栏 -->
     <van-nav-bar title="账单" placeholder>
       <template #right>
@@ -21,7 +20,7 @@
         />
       </template>
     </van-nav-bar>
-    <van-tabs v-model:active="tabActive" type="card" style="margin: 12px 0 2px 0;">
+    <van-tabs v-model:active="tabActive" type="card" style="margin: 12px 0 2px 0">
       <van-tab title="账单" name="balance" />
       <van-tab title="邮件" name="email" />
       <van-tab title="消息" name="message" />
@@ -34,25 +33,28 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue';
+import { ref, watch } from 'vue'
-import { useRoute } from 'vue-router';
+import { useRoute } from 'vue-router'
-import TransactionsRecord from './TransactionsRecord.vue';
+import TransactionsRecord from './TransactionsRecord.vue'
-import EmailRecord from './EmailRecord.vue';
+import EmailRecord from './EmailRecord.vue'
-import MessageView from './MessageView.vue';
+import MessageView from './MessageView.vue'
 
-const route = useRoute();
+const route = useRoute()
-const tabActive = ref(route.query.tab || 'balance');
+const tabActive = ref(route.query.tab || 'balance')
 
 // 监听路由参数变化，用于从 tabbar 点击时切换 tab
-watch(() => route.query.tab, (newTab) => {
+watch(
+  () => route.query.tab,
+  (newTab) => {
     if (newTab) {
-    tabActive.value = newTab;
+      tabActive.value = newTab
     }
-});
+  }
+)
 
-const transactionsRecordRef = ref(null);
+const transactionsRecordRef = ref(null)
-const emailRecordRef = ref(null);
+const emailRecordRef = ref(null)
-const messageViewRef = ref(null);
+const messageViewRef = ref(null)
 </script>
 
 <style scoped>

Web/src/views/BillAnalysisView.vue

@@ -12,7 +12,7 @@
         <van-icon
           name="setting-o"
           size="20"
-          style="cursor: pointer; padding-right: 12px;"
+          style="cursor: pointer; padding-right: 12px"
           @click="onClickPrompt"
         />
       </template>
@@ -33,7 +33,9 @@
         />
 
         <div class="quick-questions">
-          <div class="quick-title">快捷问题</div>
+          <div class="quick-title">
+            快捷问题
+          </div>
           <van-tag
             v-for="(q, index) in quickQuestions"
             :key="index"
@@ -61,7 +63,10 @@
       </div>
 
       <!-- 结果区域 -->
-      <div v-if="showResult" class="result-section">
+      <div
+        v-if="showResult"
+        class="result-section"
+      >
         <div class="result-header">
           <h3>分析结果</h3>
           <van-icon
@@ -72,12 +77,18 @@
           />
         </div>
 
-        <div ref="resultContainer" class="result-content rich-html-content">
+        <div
-          <div v-html="resultHtml"></div>
+          ref="resultContainer"
-          <van-loading v-if="analyzing" class="result-loading">
+          class="result-content rich-html-content"
+        >
+          <div v-html="resultHtml" />
+          <van-loading
+            v-if="analyzing"
+            class="result-loading"
+          >
             AI正在分析中...
           </van-loading>
-          <div ref="scrollAnchor"></div>
+          <div ref="scrollAnchor" />
         </div>
       </div>
     </div>
@@ -210,7 +221,7 @@ const startAnalysis = async () => {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
-        'Authorization': `Bearer ${token}`
+        Authorization: `Bearer ${token}`
       },
       body: JSON.stringify({
         userInput: userInput.value
@@ -227,7 +238,9 @@ const startAnalysis = async () => {
     while (true) {
       const { done, value } = await reader.read()
 
-      if (done) break
+      if (done) {
+        break
+      }
 
       const chunk = decoder.decode(value, { stream: true })
       const lines = chunk.split('\n')
@@ -254,7 +267,6 @@ const startAnalysis = async () => {
         }
       }
     }
-
   } catch (error) {
     console.error('分析失败:', error)
     showToast('分析失败，请重试')

Web/src/views/BudgetView.vue

@@ -1,12 +1,15 @@
 <!-- eslint-disable vue/no-v-html -->
 <template>
   <div class="page-container-flex">
-    <van-nav-bar title="预算管理" placeholder>
+    <van-nav-bar
+      title="预算管理"
+      placeholder
+    >
       <template #right>
         <van-icon
-          v-if="activeTab !== BudgetCategory.Savings 
+          v-if="
-            && uncoveredCategories.length > 0
+            activeTab !== BudgetCategory.Savings && uncoveredCategories.length > 0 && !isArchive
-            && !isArchive"
+          "
           name="warning-o"
           size="20"
           color="var(--van-danger-color)"
@@ -39,8 +42,16 @@
       </template>
     </van-nav-bar>
 
-    <van-tabs v-model:active="activeTab" type="card" class="budget-tabs" style="margin: 12px 4px;">
+    <van-tabs
-      <van-tab title="支出" :name="BudgetCategory.Expense">
+      v-model:active="activeTab"
+      type="card"
+      class="budget-tabs"
+      style="margin: 12px 4px"
+    >
+      <van-tab
+        title="支出"
+        :name="BudgetCategory.Expense"
+      >
         <BudgetSummary
           v-if="activeTab !== BudgetCategory.Savings"
           v-model:date="selectedDate"
@@ -48,50 +59,86 @@
           :title="activeTabTitle"
           :get-value-class="getValueClass"
         />
-        <van-pull-refresh v-model="isRefreshing" class="scroll-content" @refresh="onRefresh">
+        <van-pull-refresh
+          v-model="isRefreshing"
+          class="scroll-content"
+          @refresh="onRefresh"
+        >
           <div class="budget-list">
             <template v-if="expenseBudgets?.length > 0">
-              <van-swipe-cell v-for="budget in expenseBudgets" :key="budget.id">
+              <van-swipe-cell
+                v-for="budget in expenseBudgets"
+                :key="budget.id"
+              >
                 <BudgetCard
                   :budget="budget"
                   :progress-color="getProgressColor(budget)"
-                  :percent-class="{ 'warning': (budget.current / budget.limit) > 0.8 }"
+                  :percent-class="{
+                    warning: budget.current / budget.limit > 0.8
+                  }"
                   :period-label="getPeriodLabel(budget.type)"
-                  @click="budgetEditRef.open({
+                  @click="
+                    budgetEditRef.open({
                       data: budget,
                       isEditFlag: true,
                       category: budget.category
-                  })"
+                    })
+                  "
                 >
                   <template #amount-info>
                     <div class="info-item">
-                      <div class="label">已支出</div>
+                      <div class="label">
-                      <div class="value expense">¥{{ formatMoney(budget.current) }}</div>
+                        已支出
+                      </div>
+                      <div class="value expense">
+                        ¥{{ formatMoney(budget.current) }}
+                      </div>
                     </div>
                     <div class="info-item">
-                      <div class="label">预算</div>
+                      <div class="label">
-                      <div class="value">¥{{ formatMoney(budget.limit) }}</div>
+                        预算
+                      </div>
+                      <div class="value">
+                        ¥{{ formatMoney(budget.limit) }}
+                      </div>
                     </div>
                     <div class="info-item">
-                      <div class="label">余额</div>
+                      <div class="label">
-                      <div class="value" :class="budget.limit - budget.current >= 0 ? 'income' : 'expense'">
+                        余额
+                      </div>
+                      <div
+                        class="value"
+                        :class="budget.limit - budget.current >= 0 ? 'income' : 'expense'"
+                      >
                         ¥{{ formatMoney(budget.limit - budget.current) }}
                       </div>
                     </div>
                   </template>
                 </BudgetCard>
                 <template #right>
-                  <van-button square text="删除" type="danger" class="delete-button" @click="handleDelete(budget)" />
+                  <van-button
+                    square
+                    text="删除"
+                    type="danger"
+                    class="delete-button"
+                    @click="handleDelete(budget)"
+                  />
                 </template>
               </van-swipe-cell>
             </template>
-            <van-empty v-else description="暂无支出预算" />
+            <van-empty
+              v-else
+              description="暂无支出预算"
+            />
           </div>
-          <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+          <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
         </van-pull-refresh>
       </van-tab>
 
-      <van-tab title="收入" :name="BudgetCategory.Income">
+      <van-tab
+        title="收入"
+        :name="BudgetCategory.Income"
+      >
         <BudgetSummary
           v-if="activeTab !== BudgetCategory.Savings"
           v-model:date="selectedDate"
@@ -99,51 +146,92 @@
           :title="activeTabTitle"
           :get-value-class="getValueClass"
         />
-        <van-pull-refresh v-model="isRefreshing" class="scroll-content" @refresh="onRefresh">
+        <van-pull-refresh
+          v-model="isRefreshing"
+          class="scroll-content"
+          @refresh="onRefresh"
+        >
           <div class="budget-list">
             <template v-if="incomeBudgets?.length > 0">
-              <van-swipe-cell v-for="budget in incomeBudgets" :key="budget.id">
+              <van-swipe-cell
+                v-for="budget in incomeBudgets"
+                :key="budget.id"
+              >
                 <BudgetCard
                   :budget="budget"
                   :progress-color="getProgressColor(budget)"
-                  :percent-class="{ 'income': (budget.current / budget.limit) >= 1 }"
+                  :percent-class="{
+                    income: budget.current / budget.limit >= 1
+                  }"
                   :period-label="getPeriodLabel(budget.type)"
-                  @click="budgetEditRef.open({
+                  @click="
+                    budgetEditRef.open({
                       data: budget,
                       isEditFlag: true,
                       category: budget.category
-                  })"
+                    })
+                  "
                 >
                   <template #amount-info>
                     <div class="info-item">
-                      <div class="label">已收入</div>
+                      <div class="label">
-                      <div class="value income">¥{{ formatMoney(budget.current) }}</div>
+                        已收入
+                      </div>
+                      <div class="value income">
+                        ¥{{ formatMoney(budget.current) }}
+                      </div>
                     </div>
                     <div class="info-item">
-                      <div class="label">目标</div>
+                      <div class="label">
-                      <div class="value">¥{{ formatMoney(budget.limit) }}</div>
+                        目标
+                      </div>
+                      <div class="value">
+                        ¥{{ formatMoney(budget.limit) }}
+                      </div>
                     </div>
                     <div class="info-item">
-                      <div class="label">差额</div>
+                      <div class="label">
-                      <div class="value" :class="budget.current >= budget.limit ? 'income' : 'expense'">
+                        差额
+                      </div>
+                      <div
+                        class="value"
+                        :class="budget.current >= budget.limit ? 'income' : 'expense'"
+                      >
                         ¥{{ formatMoney(Math.abs(budget.limit - budget.current)) }}
                       </div>
                     </div>
                   </template>
                 </BudgetCard>
                 <template #right>
-                  <van-button square text="删除" type="danger" class="delete-button" @click="handleDelete(budget)" />
+                  <van-button
+                    square
+                    text="删除"
+                    type="danger"
+                    class="delete-button"
+                    @click="handleDelete(budget)"
+                  />
                 </template>
               </van-swipe-cell>
             </template>
-            <van-empty v-else description="暂无收入预算" />
+            <van-empty
+              v-else
+              description="暂无收入预算"
+            />
           </div>
-          <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+          <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
         </van-pull-refresh>
       </van-tab>
 
-      <van-tab title="存款" :name="BudgetCategory.Savings">
+      <van-tab
-        <van-pull-refresh v-model="isRefreshing" class="scroll-content" style="padding-top:4px" @refresh="onRefresh">
+        title="存款"
+        :name="BudgetCategory.Savings"
+      >
+        <van-pull-refresh
+          v-model="isRefreshing"
+          class="scroll-content"
+          style="padding-top: 4px"
+          @refresh="onRefresh"
+        >
           <div class="budget-list">
             <template v-if="savingsBudgets?.length > 0">
               <BudgetCard
@@ -151,21 +239,31 @@
                 :key="budget.id"
                 :budget="budget"
                 :progress-color="getProgressColor(budget)"
-                :percent-class="{ 'income': (budget.current / budget.limit) >= 1 }"
+                :percent-class="{ income: budget.current / budget.limit >= 1 }"
                 :period-label="getPeriodLabel(budget.type)"
-                style="margin: 0 12px 12px;"
+                style="margin: 0 12px 12px"
               >
                 <template #amount-info>
                   <div class="info-item">
-                    <div class="label">已存</div>
+                    <div class="label">
-                    <div class="value income">¥{{ formatMoney(budget.current) }}</div>
+                      已存
+                    </div>
+                    <div class="value income">
+                      ¥{{ formatMoney(budget.current) }}
+                    </div>
                   </div>
                   <div class="info-item">
-                    <div class="label">目标</div>
+                    <div class="label">
-                    <div class="value">¥{{ formatMoney(budget.limit) }}</div>
+                      目标
+                    </div>
+                    <div class="value">
+                      ¥{{ formatMoney(budget.limit) }}
+                    </div>
                   </div>
                   <div class="info-item">
-                    <div class="label">还差</div>
+                    <div class="label">
+                      还差
+                    </div>
                     <div class="value expense">
                       ¥{{ formatMoney(Math.max(0, budget.limit - budget.current)) }}
                     </div>
@@ -180,8 +278,7 @@
                       plain
                       type="primary"
                       @click.stop="handleSavingsNav(budget, -1)"
-                    >
+                    />
-                    </van-button>
                     <span class="current-date-label">
                       {{ getSavingsDateLabel(budget) }}
                     </span>
@@ -193,15 +290,17 @@
                       icon-position="right"
                       :disabled="disabledSavingsNextNav(budget)"
                       @click.stop="handleSavingsNav(budget, 1)"
-                    >
+                    />
-                    </van-button>
                   </div>
                 </template>
               </BudgetCard>
             </template>
-            <van-empty v-else description="暂无存款计划" />
+            <van-empty
+              v-else
+              description="暂无存款计划"
+            />
           </div>
-          <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+          <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
         </van-pull-refresh>
       </van-tab>
     </van-tabs>
@@ -222,13 +321,24 @@
       height="60%"
     >
       <div class="uncovered-list">
-        <div v-for="item in uncoveredCategories" :key="item.category" class="uncovered-item">
+        <div
+          v-for="item in uncoveredCategories"
+          :key="item.category"
+          class="uncovered-item"
+        >
           <div class="item-left">
-            <div class="category-name">{{ item.category }}</div>
+            <div class="category-name">
-            <div class="transaction-count">{{ item.transactionCount }} 笔记录</div>
+              {{ item.category }}
+            </div>
+            <div class="transaction-count">
+              {{ item.transactionCount }} 笔记录
+            </div>
           </div>
           <div class="item-right">
-            <div class="item-amount" :class="activeTab === BudgetCategory.Expense ? 'expense' : 'income'">
+            <div
+              class="item-amount"
+              :class="activeTab === BudgetCategory.Expense ? 'expense' : 'income'"
+            >
               ¥{{ formatMoney(item.totalAmount) }}
             </div>
           </div>
@@ -236,7 +346,12 @@
       </div>
 
       <template #footer>
-        <van-button block round type="primary" @click="showUncoveredDetails = false">
+        <van-button
+          block
+          round
+          type="primary"
+          @click="showUncoveredDetails = false"
+        >
           我知道了
         </van-button>
       </template>
@@ -248,10 +363,13 @@
       :subtitle="`${selectedDate.getFullYear()}年${selectedDate.getMonth() + 1}月`"
       height="70%"
     >
-      <div style="padding: 16px;">
+      <div style="padding: 16px">
         <div
           class="rich-html-content"
-          v-html="archiveSummary || '<p style=\'text-align:center;color:var(--van-text-color-3)\'>暂无总结</p>'" 
+          v-html="
+            archiveSummary ||
+              '<p style=\'text-align:center;color:var(--van-text-color-3)\'>暂无总结</p>'
+          "
         />
       </div>
     </PopupContainer>
@@ -261,7 +379,14 @@
 <script setup>
 import { ref, computed, onMounted, watch } from 'vue'
 import { showToast, showConfirmDialog } from 'vant'
-import { getBudgetList, deleteBudget, getCategoryStats, getUncoveredCategories, getArchiveSummary, updateArchiveSummary, getSavingsBudget } from '@/api/budget'
+import {
+  getBudgetList,
+  deleteBudget,
+  getCategoryStats,
+  getUncoveredCategories,
+  getArchiveSummary,
+  getSavingsBudget
+} from '@/api/budget'
 import { BudgetPeriodType, BudgetCategory } from '@/constants/enums'
 import BudgetCard from '@/components/Budget/BudgetCard.vue'
 import BudgetSummary from '@/components/Budget/BudgetSummary.vue'
@@ -279,7 +404,6 @@ const uncoveredCategories = ref([])
 
 const showSummaryPopup = ref(false)
 const archiveSummary = ref('')
-const isSavingSummary = ref(false)
 
 const expenseBudgets = ref([])
 const incomeBudgets = ref([])
@@ -290,14 +414,19 @@ const overallStats = ref({
 })
 
 const activeTabTitle = computed(() => {
-  if (activeTab.value === BudgetCategory.Expense) return '使用'
+  if (activeTab.value === BudgetCategory.Expense) {
+    return '使用'
+  }
   return '达成'
 })
 
 const isArchive = computed(() => {
   const now = new Date()
-  return selectedDate.value.getFullYear() < now.getFullYear() ||
+  return (
-    (selectedDate.value.getFullYear() === now.getFullYear() && selectedDate.value.getMonth() < now.getMonth())
+    selectedDate.value.getFullYear() < now.getFullYear() ||
+    (selectedDate.value.getFullYear() === now.getFullYear() &&
+      selectedDate.value.getMonth() < now.getMonth())
+  )
 })
 
 watch(activeTab, async () => {
@@ -305,23 +434,29 @@ watch(activeTab, async () => {
 })
 
 watch(selectedDate, async () => {
-  await Promise.all([
+  await Promise.all([fetchBudgetList(), fetchCategoryStats(), fetchUncoveredCategories()])
-    fetchBudgetList(),
-    fetchCategoryStats(),
-    fetchUncoveredCategories()
-  ])
 })
 
 const getValueClass = (rate) => {
   const numRate = parseFloat(rate)
-  if (numRate === 0) return ''
+  if (numRate === 0) {
+    return ''
+  }
   if (activeTab.value === BudgetCategory.Expense) {
-    if (numRate >= 100) return 'expense'
+    if (numRate >= 100) {
-    if (numRate >= 80) return 'warning'
+      return 'expense'
+    }
+    if (numRate >= 80) {
+      return 'warning'
+    }
     return 'income'
   } else {
-    if (numRate >= 100) return 'income'
+    if (numRate >= 100) {
-    if (numRate >= 80) return 'warning'
+      return 'income'
+    }
+    if (numRate >= 80) {
+      return 'warning'
+    }
     return 'expense'
   }
 }
@@ -331,9 +466,9 @@ const fetchBudgetList = async () => {
     const res = await getBudgetList(selectedDate.value.toISOString())
     if (res.success) {
       const data = res.data || []
-      expenseBudgets.value = data.filter(b => b.category === BudgetCategory.Expense)
+      expenseBudgets.value = data.filter((b) => b.category === BudgetCategory.Expense)
-      incomeBudgets.value = data.filter(b => b.category === BudgetCategory.Income)
+      incomeBudgets.value = data.filter((b) => b.category === BudgetCategory.Income)
-      savingsBudgets.value = data.filter(b => b.category === BudgetCategory.Savings)
+      savingsBudgets.value = data.filter((b) => b.category === BudgetCategory.Savings)
     }
   } catch (err) {
     console.error('加载预算列表失败', err)
@@ -393,18 +528,17 @@ const fetchUncoveredCategories = async () => {
 
 onMounted(async () => {
   try {
-    await Promise.all([
+    await Promise.all([fetchBudgetList(), fetchCategoryStats(), fetchUncoveredCategories()])
-      fetchBudgetList(),
-      fetchCategoryStats(),
-      fetchUncoveredCategories()
-    ])
   } catch (err) {
     console.error('获取初始化数据失败', err)
   }
 })
 
 const formatMoney = (val) => {
-  return parseFloat(val || 0).toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: 0 })
+  return parseFloat(val || 0).toLocaleString(undefined, {
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  })
 }
 
 const getPeriodLabel = (type) => {
@@ -427,7 +561,9 @@ const getPeriodLabel = (type) => {
 }
 
 const getProgressColor = (budget) => {
-  if (!budget.limit || budget.limit === 0) return 'var(--van-primary-color)'
+  if (!budget.limit || budget.limit === 0) {
+    return 'var(--van-primary-color)'
+  }
 
   const ratio = Math.min(Math.max(budget.current / budget.limit, 0), 1)
 
@@ -531,7 +667,9 @@ const handleDelete = async (budget) => {
 }
 
 const getSavingsDateLabel = (budget) => {
-  if (!budget.periodStart) return ''
+  if (!budget.periodStart) {
+    return ''
+  }
   const date = new Date(budget.periodStart)
   if (budget.type === BudgetPeriodType.Year) {
     return `${date.getFullYear()}年`
@@ -541,7 +679,9 @@ const getSavingsDateLabel = (budget) => {
 }
 
 const handleSavingsNav = async (budget, offset) => {
-  if (!budget.periodStart) return
+  if (!budget.periodStart) {
+    return
+  }
 
   const date = new Date(budget.periodStart)
   let year = date.getFullYear()
@@ -564,7 +704,7 @@ const handleSavingsNav = async (budget, offset) => {
     const res = await getSavingsBudget(year, month, budget.type)
     if (res.success && res.data) {
       // 找到并更新对应的 budget 对象
-      const index = savingsBudgets.value.findIndex(b => b.id === budget.id)
+      const index = savingsBudgets.value.findIndex((b) => b.id === budget.id)
       if (index !== -1) {
         savingsBudgets.value[index] = res.data
       }
@@ -578,7 +718,9 @@ const handleSavingsNav = async (budget, offset) => {
 }
 
 const disabledSavingsNextNav = (budget) => {
-  if (!budget.periodStart) return true
+  if (!budget.periodStart) {
+    return true
+  }
   const date = new Date(budget.periodStart)
   const now = new Date()
   if (budget.type === BudgetPeriodType.Year) {
@@ -693,7 +835,9 @@ const disabledSavingsNextNav = (budget) => {
 .item-amount {
   font-size: 18px;
   font-weight: 600;
-  font-family: DIN Alternate, system-ui;
+  font-family:
+    DIN Alternate,
+    system-ui;
 }
 
 /* 设置页面容器背景色 */

Web/src/views/CalendarView.vue

@@ -14,7 +14,7 @@
     <ContributionHeatmap ref="heatmapRef" />
 
     <!-- 底部安全距离 -->
-    <div style="height: calc(60px + env(safe-area-inset-bottom, 0px))"></div>
+    <div style="height: calc(60px + env(safe-area-inset-bottom, 0px))" />
 
     <!-- 日期交易列表弹出层 -->
     <PopupContainer
@@ -50,160 +50,164 @@
 </template>
 
 <script setup>
-import { ref, onMounted, nextTick, onBeforeUnmount } from "vue";
+import { ref, onMounted, nextTick, onBeforeUnmount } from 'vue'
-import { showToast } from "vant";
+import { showToast } from 'vant'
-import request from "@/api/request";
+import request from '@/api/request'
-import { getTransactionDetail, getTransactionsByDate } from "@/api/transactionRecord";
+import { getTransactionDetail, getTransactionsByDate } from '@/api/transactionRecord'
-import TransactionList from "@/components/TransactionList.vue";
+import TransactionList from '@/components/TransactionList.vue'
-import TransactionDetail from "@/components/TransactionDetail.vue";
+import TransactionDetail from '@/components/TransactionDetail.vue'
-import SmartClassifyButton from "@/components/SmartClassifyButton.vue";
+import SmartClassifyButton from '@/components/SmartClassifyButton.vue'
-import PopupContainer from "@/components/PopupContainer.vue";
+import PopupContainer from '@/components/PopupContainer.vue'
-import ContributionHeatmap from "@/components/ContributionHeatmap.vue";
+import ContributionHeatmap from '@/components/ContributionHeatmap.vue'
 
-const dailyStatistics = ref({});
+const dailyStatistics = ref({})
-const listVisible = ref(false);
+const listVisible = ref(false)
-const detailVisible = ref(false);
+const detailVisible = ref(false)
-const dateTransactions = ref([]);
+const dateTransactions = ref([])
-const currentTransaction = ref(null);
+const currentTransaction = ref(null)
-const listLoading = ref(false);
+const listLoading = ref(false)
-const selectedDate = ref(null);
+const selectedDate = ref(null)
-const selectedDateText = ref("");
+const selectedDateText = ref('')
-const heatmapRef = ref(null);
+const heatmapRef = ref(null)
 
 // 设置日历可选范围（例如：过去2年到未来1年）
-const minDate = new Date(new Date().getFullYear() - 2, 0, 1); // 2年前的1月1日
+const minDate = new Date(new Date().getFullYear() - 2, 0, 1) // 2年前的1月1日
-const maxDate = new Date(new Date().getFullYear() + 1, 11, 31); // 明年12月31日
+const maxDate = new Date(new Date().getFullYear() + 1, 11, 31) // 明年12月31日
 
 onMounted(async () => {
-  await nextTick();
+  await nextTick()
   setTimeout(() => {
     // 计算页面高度，滚动3/4高度以显示更多日期
-    const height = document.querySelector(".calendar-container").clientHeight * 0.43;
+    const height = document.querySelector('.calendar-container').clientHeight * 0.43
-    document.querySelector(".van-calendar__body").scrollBy({
+    document.querySelector('.van-calendar__body').scrollBy({
       top: -height,
-      behavior: "smooth",
+      behavior: 'smooth'
-    });
+    })
-  }, 300);
+  }, 300)
-});
+})
 
 // 获取日历统计数据
 const fetchDailyStatistics = async (year, month) => {
   try {
-    const response = await request.get("/TransactionRecord/GetDailyStatistics", {
+    const response = await request.get('/TransactionRecord/GetDailyStatistics', {
-      params: { year, month },
+      params: { year, month }
-    });
+    })
     if (response.success && response.data) {
       // 将数组转换为对象，key为日期
-      const statsMap = {};
+      const statsMap = {}
       response.data.forEach((item) => {
         statsMap[item.date] = {
           count: item.count,
-          amount: item.amount,
+          amount: item.amount
-        };
+        }
-      });
+      })
       dailyStatistics.value = {
         ...dailyStatistics.value,
-        ...statsMap,
+        ...statsMap
-      };
+      }
     }
   } catch (error) {
-    console.error("获取日历统计数据失败:", error);
+    console.error('获取日历统计数据失败:', error)
+  }
 }
-};
 
-const smartClassifyButtonRef = ref(null);
+const smartClassifyButtonRef = ref(null)
 // 获取指定日期的交易列表
 const fetchDateTransactions = async (date) => {
   try {
-    listLoading.value = true;
+    listLoading.value = true
     const dateStr = date
-      .toLocaleString("zh-CN", { year: "numeric", month: "2-digit", day: "2-digit" })
+      .toLocaleString('zh-CN', {
-      .replace(/\//g, "-");
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit'
+      })
+      .replace(/\//g, '-')
 
-    const response = await getTransactionsByDate(dateStr);
+    const response = await getTransactionsByDate(dateStr)
 
     if (response.success && response.data) {
       // 根据金额从大到小排序
-      dateTransactions.value = response
+      dateTransactions.value = response.data.sort((a, b) => b.amount - a.amount)
-        .data
-        .sort((a, b) => b.amount - a.amount);
       // 重置智能分类按钮
       smartClassifyButtonRef.value?.reset()
     } else {
-      dateTransactions.value = [];
+      dateTransactions.value = []
-      showToast(response.message || "获取交易列表失败");
+      showToast(response.message || '获取交易列表失败')
     }
   } catch (error) {
-    console.error("获取日期交易列表失败:", error);
+    console.error('获取日期交易列表失败:', error)
-    dateTransactions.value = [];
+    dateTransactions.value = []
-    showToast("获取交易列表失败");
+    showToast('获取交易列表失败')
   } finally {
-    listLoading.value = false;
+    listLoading.value = false
+  }
 }
-};
 
 const getBalance = (transactions) => {
-  let balance = 0;
+  let balance = 0
-  transactions.forEach(tx => {
+  transactions.forEach((tx) => {
     if (tx.type === 1) {
-      balance += tx.amount;
+      balance += tx.amount
     } else if (tx.type === 0) {
-      balance -= tx.amount;
+      balance -= tx.amount
     }
-  });
+  })
 
   if (balance >= 0) {
-    return `结余收入 ${balance.toFixed(1)} 元`;
+    return `结余收入 ${balance.toFixed(1)} 元`
   } else {
-    return `结余支出 ${(-balance).toFixed(1)} 元`;
+    return `结余支出 ${(-balance).toFixed(1)} 元`
+  }
 }
-};
 
 // 当月份显示时触发
 const onMonthShow = ({ date }) => {
-  const year = date.getFullYear();
+  const year = date.getFullYear()
-  const month = date.getMonth() + 1;
+  const month = date.getMonth() + 1
-  fetchDailyStatistics(year, month);
+  fetchDailyStatistics(year, month)
-};
+}
 
 // 日期选择事件
 const onDateSelect = (date) => {
-  selectedDate.value = date;
+  selectedDate.value = date
-  selectedDateText.value = formatSelectedDate(date);
+  selectedDateText.value = formatSelectedDate(date)
-  fetchDateTransactions(date);
+  fetchDateTransactions(date)
-  listVisible.value = true;
+  listVisible.value = true
-};
+}
 
 // 格式化选中的日期
 const formatSelectedDate = (date) => {
-  return date.toLocaleDateString("zh-CN", {
+  return date.toLocaleDateString('zh-CN', {
-    year: "numeric",
+    year: 'numeric',
-    month: "long",
+    month: 'long',
-    day: "numeric",
+    day: 'numeric',
-    weekday: "long",
+    weekday: 'long'
-  });
+  })
-};
+}
 
 // 查看详情
 const viewDetail = async (transaction) => {
   try {
-    const response = await getTransactionDetail(transaction.id);
+    const response = await getTransactionDetail(transaction.id)
     if (response.success) {
-      currentTransaction.value = response.data;
+      currentTransaction.value = response.data
-      detailVisible.value = true;
+      detailVisible.value = true
     } else {
-      showToast(response.message || "获取详情失败");
+      showToast(response.message || '获取详情失败')
     }
   } catch (error) {
-    console.error("获取详情出错:", error);
+    console.error('获取详情出错:', error)
-    showToast("获取详情失败");
+    showToast('获取详情失败')
+  }
 }
-};
 
 // 详情保存后的回调
 const onDetailSave = async (saveData) => {
-  var item = dateTransactions.value.find(tx => tx.id === saveData.id);
+  const item = dateTransactions.value.find((tx) => tx.id === saveData.id)
-  if(!item) return
+  if (!item) {
+    return
+  }
 
   // 如果分类发生了变化 移除智能分类的内容，防止被智能分类覆盖
   if (item.classify !== saveData.classify) {
@@ -213,58 +217,60 @@ const onDetailSave = async (saveData) => {
   }
 
   // 更新当前日期交易列表中的数据
-  Object.assign(item, saveData);
+  Object.assign(item, saveData)
-
-
 
   // 重新加载当前月份的统计数据
-  const now = selectedDate.value || new Date();
+  const now = selectedDate.value || new Date()
-  fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
+  fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1)
-};
+}
 
 // 处理删除事件：从当前日期交易列表中移除，并刷新当日和当月统计
 const handleDateTransactionDelete = async (transactionId) => {
-  dateTransactions.value = dateTransactions.value.filter(t => t.id !== transactionId)
+  dateTransactions.value = dateTransactions.value.filter((t) => t.id !== transactionId)
 
   // 刷新当前日期以及当月的统计数据
-  const now = selectedDate.value || new Date();
+  const now = selectedDate.value || new Date()
-  fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
+  fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1)
-};
+}
 
 // 智能分类保存回调
 const onSmartClassifySave = async () => {
   // 保存完成后重新加载数据
   if (selectedDate.value) {
-    await fetchDateTransactions(selectedDate.value);
+    await fetchDateTransactions(selectedDate.value)
   }
   // 重新加载统计数据
-  const now = selectedDate.value || new Date();
+  const now = selectedDate.value || new Date()
-  fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
+  fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1)
-};
+}
 
 const formatterCalendar = (day) => {
-  const dayCopy = { ...day };
+  const dayCopy = { ...day }
   if (dayCopy.date.toDateString() === new Date().toDateString()) {
-    dayCopy.text = "今天";
+    dayCopy.text = '今天'
   }
 
   // 格式化日期为 yyyy-MM-dd
   const dateKey = dayCopy.date
-    .toLocaleString("zh-CN", { year: "numeric", month: "2-digit", day: "2-digit" })
+    .toLocaleString('zh-CN', {
-    .replace(/\//g, "-");
+      year: 'numeric',
-  const stats = dailyStatistics.value[dateKey];
+      month: '2-digit',
+      day: '2-digit'
+    })
+    .replace(/\//g, '-')
+  const stats = dailyStatistics.value[dateKey]
 
   if (stats) {
-    dayCopy.topInfo = `${stats.count}笔`; // 展示消费笔数
+    dayCopy.topInfo = `${stats.count}笔` // 展示消费笔数
-    dayCopy.bottomInfo = `${stats.amount.toFixed(1)}元`; // 展示消费金额
+    dayCopy.bottomInfo = `${(stats.amount || 0).toFixed(1)}元` // 展示消费金额
   }
 
-  return dayCopy;
+  return dayCopy
-};
+}
 
 // 初始加载当前月份数据
-const now = new Date();
+const now = new Date()
-fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
+fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1)
 
 // 全局删除事件监听，确保日历页面数据一致
 const onGlobalTransactionDeleted = () => {
@@ -276,10 +282,12 @@ const onGlobalTransactionDeleted = () => {
   heatmapRef.value?.refresh()
 }
 
-window.addEventListener && window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
+window.addEventListener &&
+  window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
+  window.removeEventListener &&
+    window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
 })
 
 // 当有交易被新增/修改/批量更新时刷新
@@ -292,10 +300,12 @@ const onGlobalTransactionsChanged = () => {
   heatmapRef.value?.refresh()
 }
 
-window.addEventListener && window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
+window.addEventListener &&
+  window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
+  window.removeEventListener &&
+    window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
 })
 </script>
 
@@ -340,5 +350,4 @@ onBeforeUnmount(() => {
 :deep(.heatmap-card) {
   flex-shrink: 0; /* Prevent heatmap from shrinking */
 }
-
 </style>

Web/src/views/ClassificationEdit.vue

@@ -26,12 +26,7 @@
       <div v-else class="level-container">
         <!-- 面包屑导航 -->
         <div class="breadcrumb">
-        <van-tag 
+          <van-tag type="primary" closeable style="margin-left: 16px" @close="handleBackToRoot">
-          type="primary" 
-          closeable 
-          style="margin-left: 16px;"
-          @close="handleBackToRoot"
-        >
             {{ currentTypeName }}
           </van-tag>
         </div>
@@ -41,34 +36,20 @@
 
         <van-cell-group v-else inset>
           <van-swipe-cell v-for="category in categories" :key="category.id">
-          <van-cell 
+            <van-cell :title="category.name" is-link @click="handleEdit(category)" />
-            :title="category.name" 
-            is-link 
-            @click="handleEdit(category)"
-          />
             <template #right>
-            <van-button 
+              <van-button square type="danger" text="删除" @click="handleDelete(category)" />
-              square 
-              type="danger" 
-              text="删除"
-              @click="handleDelete(category)"
-            />
             </template>
           </van-swipe-cell>
         </van-cell-group>
       </div>
 
       <!-- 底部安全距离 -->
-    <div style="height: calc(55px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(55px + env(safe-area-inset-bottom, 0px))" />
 
       <div class="bottom-button">
         <!-- 新增分类按钮 -->
-      <van-button 
+        <van-button type="primary" size="large" icon="plus" @click="handleAddCategory">
-        type="primary" 
-        size="large" 
-        icon="plus"
-        @click="handleAddCategory"
-      >
           新增分类
         </van-button>
       </div>
@@ -123,12 +104,7 @@
 <script setup>
 import { ref, computed, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
-import { 
+import { showSuccessToast, showToast, showLoadingToast, closeToast } from 'vant'
-  showSuccessToast, 
-  showToast, 
-  showLoadingToast, 
-  closeToast 
-} from 'vant'
 import {
   getCategoryList,
   createCategory,
@@ -149,7 +125,7 @@ const typeOptions = [
 const currentLevel = ref(0) // 0=类型选择, 1=分类管理
 const currentType = ref(null) // 当前选中的交易类型
 const currentTypeName = computed(() => {
-  const type = typeOptions.find(t => t.value === currentType.value)
+  const type = typeOptions.find((t) => t.value === currentType.value)
   return type ? type.label : ''
 })
 
@@ -340,7 +316,9 @@ const handleDelete = async (category) => {
  * 确认删除
  */
 const handleConfirmDelete = async () => {
-  if (!deleteTarget.value) return
+  if (!deleteTarget.value) {
+    return
+  }
 
   try {
     showLoadingToast({
@@ -382,7 +360,6 @@ onMounted(() => {
 })
 </script>
 
-
 <style scoped>
 .level-container {
   min-height: calc(100vh - 50px);

Web/src/views/ClassificationNLP.vue

@@ -1,11 +1,6 @@
 <template>
   <div class="page-container-flex classification-nlp">
-    <van-nav-bar
+    <van-nav-bar title="自然语言分类" left-text="返回" left-arrow @click-left="onClickLeft" />
-      title="自然语言分类"
-      left-text="返回"
-      left-arrow
-      @click-left="onClickLeft"
-    />
 
     <div class="scroll-content">
       <!-- 输入区域 -->
@@ -23,13 +18,7 @@
         </van-cell-group>
 
         <div class="action-buttons">
-          <van-button 
+          <van-button type="primary" block round :loading="analyzing" @click="handleAnalyze">
-            type="primary" 
-            block 
-            round 
-            :loading="analyzing"
-            @click="handleAnalyze"
-          >
             分析查询
           </van-button>
         </div>
@@ -59,30 +48,12 @@
     />
 
     <!-- 记录列表弹窗 -->
-    <PopupContainer
+    <PopupContainer v-model="showRecordsList" title="交易记录列表" height="75%">
-      v-model="showRecordsList"
+      <div style="background: var(--van-background)">
-      title="交易记录列表"
-      height="75%"
-    >
-      <div style="background: var(--van-background);">
         <!-- 批量操作按钮 -->
         <div class="batch-actions">
-          <van-button 
+          <van-button plain type="primary" size="small" @click="selectAll"> 全选 </van-button>
-            plain 
+          <van-button plain type="default" size="small" @click="selectNone"> 全不选 </van-button>
-            type="primary" 
-            size="small"
-            @click="selectAll"
-          >
-            全选
-          </van-button>
-          <van-button 
-            plain 
-            type="default" 
-            size="small"
-            @click="selectNone"
-          >
-            全不选
-          </van-button>
           <van-button
             type="success"
             size="small"
@@ -138,9 +109,11 @@ const onClickLeft = () => {
 
 // 将带目标分类的记录转换为普通交易记录格式供列表显示
 const displayRecords = computed(() => {
-  if (!analysisResult.value) return []
+  if (!analysisResult.value) {
+    return []
+  }
 
-  return analysisResult.value.records.map(r => ({
+  return analysisResult.value.records.map((r) => ({
     id: r.id,
     reason: r.reason,
     amount: r.amount,
@@ -183,7 +156,7 @@ const handleAnalyze = async () => {
       analysisResult.value = response.data
 
       // 默认全选
-      const allIds = new Set(response.data.records.map(r => r.id))
+      const allIds = new Set(response.data.records.map((r) => r.id))
       selectedIds.value = allIds
 
       showToast(`找到 ${response.data.records.length} 条记录`)
@@ -200,8 +173,10 @@ const handleAnalyze = async () => {
 
 // 全选
 const selectAll = () => {
-  if (!analysisResult.value) return
+  if (!analysisResult.value) {
-  const allIds = new Set(analysisResult.value.records.map(r => r.id))
+    return
+  }
+  const allIds = new Set(analysisResult.value.records.map((r) => r.id))
   selectedIds.value = allIds
 }
 
@@ -218,7 +193,7 @@ const updateSelectedIds = (newSelectedIds) => {
 // 点击记录查看详情
 const handleRecordClick = (transaction) => {
   // 从原始记录中获取完整信息
-  const record = analysisResult.value?.records.find(r => r.id === transaction.id)
+  const record = analysisResult.value?.records.find((r) => r.id === transaction.id)
   if (record) {
     currentTransaction.value = {
       id: record.id,
@@ -266,8 +241,8 @@ const handleSubmit = async () => {
 
     // 构建批量更新数据（使用AI修改后的结果）
     const items = analysisResult.value.records
-      .filter(r => selectedIds.value.has(r.id))
+      .filter((r) => selectedIds.value.has(r.id))
-      .map(r => ({
+      .map((r) => ({
         id: r.id,
         classify: r.upsetedClassify,
         type: r.upsetedType

Web/src/views/ClassificationSmart.vue

@@ -1,13 +1,8 @@
 <template>
   <div class="page-container-flex smart-classification">
-    <van-nav-bar
+    <van-nav-bar title="智能分类" left-text="返回" left-arrow @click-left="onClickLeft" />
-      title="智能分类"
-      left-text="返回"
-      left-arrow
-      @click-left="onClickLeft"
-    />
 
-    <div class="scroll-content" style="padding-top: 5px;">
+    <div class="scroll-content" style="padding-top: 5px">
       <!-- 统计信息 -->
       <div class="stats-info">
         <span class="stats-label">未分类账单 </span>
@@ -23,7 +18,7 @@
       />
 
       <!-- 底部安全距离 -->
-      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
     </div>
 
     <!-- 底部操作按钮 -->
@@ -56,11 +51,7 @@
 import { ref, computed, onMounted, nextTick } from 'vue'
 import { useRouter } from 'vue-router'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
-import { 
+import { getUnclassifiedCount, smartClassify, batchUpdateClassify } from '@/api/transactionRecord'
-  getUnclassifiedCount, 
-  smartClassify,
-  batchUpdateClassify
-} from '@/api/transactionRecord'
 import ReasonGroupList from '@/components/ReasonGroupList.vue'
 
 const router = useRouter()
@@ -74,7 +65,9 @@ const suppressDataChanged = ref(false)
 
 // 计算已选中的数量
 const selectedCount = computed(() => {
-  if (!groupListRef.value) return 0
+  if (!groupListRef.value) {
+    return 0
+  }
   return groupListRef.value.getSelectedReasons().size
 })
 
@@ -114,10 +107,12 @@ const onClickLeft = () => {
   if (hasChanges.value) {
     showConfirmDialog({
       title: '提示',
-      message: '有未保存的分类结果，确定要离开吗？',
+      message: '有未保存的分类结果，确定要离开吗？'
-    }).then(() => {
+    })
+      .then(() => {
         router.back()
-    }).catch(() => {})
+      })
+      .catch(() => {})
   } else {
     router.back()
   }
@@ -125,7 +120,9 @@ const onClickLeft = () => {
 
 // 开始智能分类
 const startClassify = async () => {
-  if (!groupListRef.value) return
+  if (!groupListRef.value) {
+    return
+  }
 
   // 获取所有选中分组
   const selectedGroups = groupListRef.value.getList(true)
@@ -167,14 +164,18 @@ const startClassify = async () => {
     while (true) {
       const { done, value } = await reader.read()
 
-      if (done) break
+      if (done) {
+        break
+      }
 
       buffer += decoder.decode(value, { stream: true })
       const lines = buffer.split('\n\n')
       buffer = lines.pop() || ''
 
       for (const line of lines) {
-        if (!line.trim()) continue
+        if (!line.trim()) {
+          continue
+        }
 
         const eventMatch = line.match(/^event: (.+)$/m)
         const dataMatch = line.match(/^data: (.+)$/m)
@@ -215,8 +216,9 @@ const handleSSEEvent = (eventType, data, classifyResults) => {
         let braceCount = 0
         let closeBrace = -1
         for (let i = openBrace; i < classifyBuffer.value.length; i++) {
-          if (classifyBuffer.value[i] === '{') braceCount++
+          if (classifyBuffer.value[i] === '{') {
-          else if (classifyBuffer.value[i] === '}') {
+            braceCount++
+          } else if (classifyBuffer.value[i] === '}') {
             braceCount--
             if (braceCount === 0) {
               closeBrace = i
@@ -283,7 +285,9 @@ const handleSSEEvent = (eventType, data, classifyResults) => {
 
 // 保存分类
 const saveClassifications = async () => {
-  if (!groupListRef.value) return
+  if (!groupListRef.value) {
+    return
+  }
 
   // 收集所有已分类的账单
   const groups = groupListRef.value.getList()

Web/src/views/EmailRecord.vue

@@ -2,9 +2,16 @@
 <template>
   <div class="page-container-flex">
     <!-- 下拉刷新区域 -->
-    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
+    <van-pull-refresh
+      v-model="refreshing"
+      @refresh="onRefresh"
+    >
       <!-- 加载提示 -->
-      <van-loading v-if="loading && !(emailList && emailList.length)" vertical style="padding: 50px 0">
+      <van-loading
+        v-if="loading && !(emailList && emailList.length)"
+        vertical
+        style="padding: 50px 0"
+      >
         加载中...
       </van-loading>
       <!-- 邮件列表 -->
@@ -14,7 +21,11 @@
         finished-text="没有更多了"
         @load="onLoad"
       >
-        <van-cell-group v-if="emailList && emailList.length" inset style="margin-top: 10px">
+        <van-cell-group
+          v-if="emailList && emailList.length"
+          inset
+          style="margin-top: 10px"
+        >
           <van-swipe-cell
             v-for="email in emailList"
             :key="email.id"
@@ -27,11 +38,15 @@
             >
               <template #value>
                 <div class="email-info">
-                  <div class="email-date">{{ formatDate(email.receivedDate) }}</div>
+                  <div class="email-date">
-                  <div v-if="email.transactionCount > 0" class="bill-count">
+                    {{ formatDate(email.receivedDate) }}
-                    <span style="font-size: 12px;">已解析{{ email.transactionCount }}条账单</span>
+                  </div>
+                  <div
+                    v-if="email.transactionCount > 0"
+                    class="bill-count"
+                  >
+                    <span style="font-size: 12px">已解析{{ email.transactionCount }}条账单</span>
                   </div>
-                  
                 </div>
               </template>
             </van-cell>
@@ -54,13 +69,13 @@
       </van-list>
 
       <!-- 底部安全距离 -->
-      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
     </van-pull-refresh>
 
     <!-- 详情弹出层 -->
     <PopupContainer
       v-model="detailVisible"
-      :title="currentEmail ? (currentEmail.Subject || currentEmail.subject || '(无主题)') : ''"
+      :title="currentEmail ? currentEmail.Subject || currentEmail.subject || '(无主题)' : ''"
       height="75%"
     >
       <template #header-actions>
@@ -75,10 +90,22 @@
       </template>
 
       <div v-if="currentEmail">
-        <van-cell-group inset style="margin-top: 12px;">
+        <van-cell-group
-          <van-cell title="发件人" :value="currentEmail.From || currentEmail.from || '未知'" />
+          inset
-          <van-cell title="接收时间" :value="formatDate(currentEmail.ReceivedDate || currentEmail.receivedDate)" />
+          style="margin-top: 12px"
-          <van-cell title="记录时间" :value="formatDate(currentEmail.CreateTime || currentEmail.createTime)" />
+        >
+          <van-cell
+            title="发件人"
+            :value="currentEmail.From || currentEmail.from || '未知'"
+          />
+          <van-cell
+            title="接收时间"
+            :value="formatDate(currentEmail.ReceivedDate || currentEmail.receivedDate)"
+          />
+          <van-cell
+            title="记录时间"
+            :value="formatDate(currentEmail.CreateTime || currentEmail.createTime)"
+          />
           <van-cell
             v-if="(currentEmail.TransactionCount || currentEmail.transactionCount || 0) > 0"
             title="已解析账单数"
@@ -88,21 +115,26 @@
           />
         </van-cell-group>
         <div class="email-content">
-          <h4 style="margin-left: 10px;">邮件内容</h4>
+          <h4 style="margin-left: 10px">
+            邮件内容
+          </h4>
           <div
             v-if="currentEmail.htmlBody"
             class="content-body html-content"
             v-html="currentEmail.htmlBody"
-          ></div>
+          />
           <div
             v-else-if="currentEmail.body"
             class="content-body"
           >
             {{ currentEmail.body }}
           </div>
-          <div v-else class="content-body empty-content">
+          <div
+            v-else
+            class="content-body empty-content"
+          >
             暂无邮件内容
-            <div style="font-size: 12px; margin-top: 8px; color: var(--van-gray-6);">
+            <div style="font-size: 12px; margin-top: 8px; color: var(--van-gray-6)">
               Debug: {{ Object.keys(currentEmail).join(', ') }}
             </div>
           </div>
@@ -139,7 +171,14 @@
 <script setup>
 import { ref, onMounted, onBeforeUnmount } from 'vue'
 import { showToast, showConfirmDialog } from 'vant'
-import { getEmailList, getEmailDetail, deleteEmail, refreshTransactionRecords, syncEmails, getEmailTransactions } from '@/api/emailRecord'
+import {
+  getEmailList,
+  getEmailDetail,
+  deleteEmail,
+  refreshTransactionRecords,
+  syncEmails,
+  getEmailTransactions
+} from '@/api/emailRecord'
 import { getTransactionDetail } from '@/api/transactionRecord'
 import TransactionList from '@/components/TransactionList.vue'
 import TransactionDetail from '@/components/TransactionDetail.vue'
@@ -163,7 +202,9 @@ const currentTransaction = ref(null)
 
 // 加载数据
 const loadData = async (isRefresh = false) => {
-  if (loading.value) return // 防止重复加载
+  if (loading.value) {
+    return
+  } // 防止重复加载
 
   if (isRefresh) {
     pageIndex.value = 1
@@ -246,7 +287,7 @@ const handleDelete = async (email) => {
   try {
     await showConfirmDialog({
       title: '提示',
-      message: '确定要删除这封邮件吗？',
+      message: '确定要删除这封邮件吗？'
     })
 
     const response = await deleteEmail(email.id)
@@ -266,12 +307,14 @@ const handleDelete = async (email) => {
 
 // 重新分析
 const handleRefreshAnalysis = async () => {
-  if (!currentEmail.value) return
+  if (!currentEmail.value) {
+    return
+  }
 
   try {
     await showConfirmDialog({
       title: '提示',
-      message: '确定要重新分析该邮件并刷新交易记录吗？',
+      message: '确定要重新分析该邮件并刷新交易记录吗？'
     })
 
     refreshingAnalysis.value = true
@@ -316,7 +359,9 @@ const handleSync = async () => {
 
 // 查看关联的账单列表
 const viewTransactions = async () => {
-  if (!currentEmail.value) return
+  if (!currentEmail.value) {
+    return
+  }
 
   try {
     const emailId = currentEmail.value.id
@@ -340,18 +385,22 @@ const onGlobalTransactionDeleted = (e) => {
   // 如果交易列表弹窗打开，尝试重新加载邮箱的交易列表
   if (transactionListVisible.value && currentEmail.value) {
     const emailId = currentEmail.value.id || currentEmail.value.Id
-    getEmailTransactions(emailId).then(response => {
+    getEmailTransactions(emailId)
+      .then((response) => {
         if (response.success) {
           transactionList.value = response.data || []
         }
-    }).catch(() => {})
+      })
+      .catch(() => {})
   }
 }
 
-window.addEventListener && window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
+window.addEventListener &&
+  window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
+  window.removeEventListener &&
+    window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
 })
 
 // 监听新增/修改/批量更新事件，刷新弹窗内交易或邮件列表
@@ -359,21 +408,25 @@ const onGlobalTransactionsChanged = (e) => {
   console.log('收到全局交易变更事件:', e)
   if (transactionListVisible.value && currentEmail.value) {
     const emailId = currentEmail.value.id || currentEmail.value.Id
-    getEmailTransactions(emailId).then(response => {
+    getEmailTransactions(emailId)
+      .then((response) => {
         if (response.success) {
           transactionList.value = response.data || []
         }
-    }).catch(() => {})
+      })
+      .catch(() => {})
   } else {
     // 也刷新邮件列表以保持统计一致
     loadData(true)
   }
 }
 
-window.addEventListener && window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
+window.addEventListener &&
+  window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
+  window.removeEventListener &&
+    window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
 })
 
 // 处理点击账单
@@ -394,7 +447,7 @@ const handleTransactionClick = async (transaction) => {
 
 const handleTransactionDelete = (transactionId) => {
   // 从当前的交易列表中移除该交易
-  transactionList.value = transactionList.value.filter(t => t.id !== transactionId)
+  transactionList.value = transactionList.value.filter((t) => t.id !== transactionId)
 
   // 刷新邮件列表
   loadData(true)
@@ -402,15 +455,14 @@ const handleTransactionDelete = (transactionId) => {
   // 刷新当前邮件详情
   if (currentEmail.value) {
     const emailId = currentEmail.value.id
-    getEmailDetail(emailId).then(response => {
+    getEmailDetail(emailId).then((response) => {
       if (response.success) {
         currentEmail.value = response.data
       }
     })
   }
   try {
-    window.dispatchEvent(
+    window.dispatchEvent(new CustomEvent('transaction-deleted', { detail: transactionId }))
-      new CustomEvent('transaction-deleted', { detail: transactionId })) 
   } catch (e) {
     console.error(e)
   }
@@ -428,13 +480,12 @@ const handleTransactionSave = async () => {
   }
   try {
     window.dispatchEvent(
-      new CustomEvent(
+      new CustomEvent('transactions-changed', {
-        'transactions-changed', 
-        { 
         detail: {
           emailId: currentEmail.value?.id
         }
-        })) 
+      })
+    )
   } catch (e) {
     console.error(e)
   }
@@ -442,7 +493,9 @@ const handleTransactionSave = async () => {
 
 // 格式化日期
 const formatDate = (dateString) => {
-  if (!dateString) return ''
+  if (!dateString) {
+    return ''
+  }
   const date = new Date(dateString)
   return date.toLocaleString('zh-CN', {
     year: 'numeric',
@@ -454,8 +507,6 @@ const formatDate = (dateString) => {
   })
 }
 
-
-
 onMounted(() => {
   loadData(true)
 })
@@ -467,7 +518,6 @@ defineExpose({
 </script>
 
 <style scoped>
-
 :deep(.van-pull-refresh) {
   flex: 1;
   overflow-y: auto;

Web/src/views/LogView.vue

@@ -20,16 +20,31 @@
 
         <div class="filter-row">
           <van-dropdown-menu>
-            <van-dropdown-item v-model="selectedLevel" :options="levelOptions" @change="handleSearch" />
+            <van-dropdown-item
-            <van-dropdown-item v-model="selectedDate" :options="dateOptions" @change="handleSearch" />
+              v-model="selectedLevel"
+              :options="levelOptions"
+              @change="handleSearch"
+            />
+            <van-dropdown-item
+              v-model="selectedDate"
+              :options="dateOptions"
+              @change="handleSearch"
+            />
           </van-dropdown-menu>
         </div>
       </div>
 
       <!-- 下拉刷新区域 -->
-      <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
+      <van-pull-refresh
+        v-model="refreshing"
+        @refresh="onRefresh"
+      >
         <!-- 加载提示 -->
-        <van-loading v-if="loading && !logList.length" vertical style="padding: 50px 0">
+        <van-loading
+          v-if="loading && !logList.length"
+          vertical
+          style="padding: 50px 0"
+        >
           加载中...
         </van-loading>
 
@@ -51,7 +66,9 @@
               <span class="log-level">{{ log.level }}</span>
               <span class="log-time">{{ formatTime(log.timestamp) }}</span>
             </div>
-            <div class="log-message">{{ log.message }}</div>
+            <div class="log-message">
+              {{ log.message }}
+            </div>
           </div>
 
           <!-- 空状态 -->
@@ -63,7 +80,7 @@
         </van-list>
 
         <!-- 底部安全距离 -->
-        <div style="height: 20px"></div>
+        <div style="height: 20px" />
       </van-pull-refresh>
     </div>
   </div>
@@ -106,9 +123,7 @@ const levelOptions = ref([
 ])
 
 // 日期选项
-const dateOptions = ref([
+const dateOptions = ref([{ text: '全部日期', value: '' }])
-  { text: '全部日期', value: '' }
-])
 
 /**
  * 返回上一页
@@ -122,12 +137,12 @@ const handleBack = () => {
  */
 const getLevelClass = (level) => {
   const levelMap = {
-    'ERR': 'level-error',
+    ERR: 'level-error',
-    'FTL': 'level-fatal',
+    FTL: 'level-fatal',
-    'WRN': 'level-warning',
+    WRN: 'level-warning',
-    'INF': 'level-info',
+    INF: 'level-info',
-    'DBG': 'level-debug',
+    DBG: 'level-debug',
-    'VRB': 'level-verbose'
+    VRB: 'level-verbose'
   }
   return levelMap[level] || 'level-default'
 }
@@ -145,7 +160,9 @@ const formatTime = (timestamp) => {
  * 加载日志数据
  */
 const loadLogs = async (reset = false) => {
-  if (fetching.value) return
+  if (fetching.value) {
+    return
+  }
 
   fetching.value = true
 
@@ -223,7 +240,9 @@ const onRefresh = async () => {
  * 加载更多
  */
 const onLoad = async () => {
-  if (finished.value || fetching.value) return
+  if (finished.value || fetching.value) {
+    return
+  }
 
   // 如果是第一次加载
   if (pageIndex.value === 1 && logList.value.length === 0) {
@@ -257,14 +276,11 @@ const loadAvailableDates = async () => {
   try {
     const response = await getAvailableDates()
     if (response.success && response.data) {
-      const dates = response.data.map(date => ({
+      const dates = response.data.map((date) => ({
         text: formatDate(date),
         value: date
       }))
-      dateOptions.value = [
+      dateOptions.value = [{ text: '全部日期', value: '' }, ...dates]
-        { text: '全部日期', value: '' },
-        ...dates
-      ]
     }
   } catch (error) {
     console.error('加载日期列表失败:', error)

Web/src/views/MessageView.vue

@@ -1,18 +1,34 @@
 <!-- eslint-disable vue/no-v-html -->
 <template>
   <div class="page-container-flex">
-    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
+    <van-pull-refresh
+      v-model="refreshing"
+      @refresh="onRefresh"
+    >
       <van-list
         v-model:loading="loading"
         :finished="finished"
         finished-text="没有更多了"
         @load="onLoad"
       >
-        <van-cell-group v-if="list.length" inset style="margin-top: 10px">
+        <van-cell-group
-          <van-swipe-cell v-for="item in list" :key="item.id">
+          v-if="list.length"
-            <div class="message-card" @click="viewDetail(item)">
+          inset
+          style="margin-top: 10px"
+        >
+          <van-swipe-cell
+            v-for="item in list"
+            :key="item.id"
+          >
+            <div
+              class="message-card"
+              @click="viewDetail(item)"
+            >
               <div class="card-left">
-                <div class="message-title" :class="{ 'unread': !item.isRead }">
+                <div
+                  class="message-title"
+                  :class="{ unread: !item.isRead }"
+                >
                   {{ item.title }}
                 </div>
                 <div class="message-content">
@@ -23,16 +39,34 @@
                 </div>
               </div>
               <div class="card-right">
-                <van-tag v-if="!item.isRead" type="danger">未读</van-tag>
+                <van-tag
-                <van-icon name="arrow" size="16" class="arrow-icon" />
+                  v-if="!item.isRead"
+                  type="danger"
+                >
+                  未读
+                </van-tag>
+                <van-icon
+                  name="arrow"
+                  size="16"
+                  class="arrow-icon"
+                />
               </div>
             </div>
             <template #right>
-              <van-button square text="删除" type="danger" class="delete-button" @click="handleDelete(item)" />
+              <van-button
+                square
+                text="删除"
+                type="danger"
+                class="delete-button"
+                @click="handleDelete(item)"
+              />
             </template>
           </van-swipe-cell>
         </van-cell-group>
-        <van-empty v-else-if="!loading" description="暂无消息" />
+        <van-empty
+          v-else-if="!loading"
+          description="暂无消息"
+        />
       </van-list>
     </van-pull-refresh>
 
@@ -47,13 +81,23 @@
         v-if="currentMessage.messageType === 2"
         class="detail-content rich-html-content"
         v-html="currentMessage.content"
+      />
+      <div
+        v-else
+        class="detail-content"
       >
-      </div>
-      <div v-else class="detail-content">
         {{ currentMessage.content }}
       </div>
-      <template v-if="currentMessage.url && currentMessage.messageType === 1" #footer>
+      <template
-        <van-button type="primary" block round @click="handleUrlJump(currentMessage.url)">
+        v-if="currentMessage.url && currentMessage.messageType === 1"
+        #footer
+      >
+        <van-button
+          type="primary"
+          block
+          round
+          @click="handleUrlJump(currentMessage.url)"
+        >
           查看详情
         </van-button>
       </template>
@@ -62,164 +106,166 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref, onMounted } from 'vue'
-import { useRouter } from 'vue-router';
+import { useRouter } from 'vue-router'
-import { showToast, showDialog } from 'vant';
+import { showToast, showDialog } from 'vant'
-import { getMessageList, markAsRead, deleteMessage, markAllAsRead } from '@/api/message';
+import { getMessageList, markAsRead, deleteMessage, markAllAsRead } from '@/api/message'
-import { useMessageStore } from '@/stores/message';
+import { useMessageStore } from '@/stores/message'
-import PopupContainer from '@/components/PopupContainer.vue';
+import PopupContainer from '@/components/PopupContainer.vue'
 
-const messageStore = useMessageStore();
+const messageStore = useMessageStore()
-const router = useRouter();
+const router = useRouter()
-const list = ref([]);
+const list = ref([])
-const loading = ref(false);
+const loading = ref(false)
-const finished = ref(false);
+const finished = ref(false)
-const refreshing = ref(false);
+const refreshing = ref(false)
-const pageIndex = ref(1);
+const pageIndex = ref(1)
-const pageSize = ref(20);
+const pageSize = ref(20)
 
-const detailVisible = ref(false);
+const detailVisible = ref(false)
-const currentMessage = ref({});
+const currentMessage = ref({})
 
 const onLoad = async () => {
   if (refreshing.value) {
-    list.value = [];
+    list.value = []
-    pageIndex.value = 1;
+    pageIndex.value = 1
-    refreshing.value = false;
+    refreshing.value = false
   }
 
   try {
     const res = await getMessageList({
       pageIndex: pageIndex.value,
       pageSize: pageSize.value
-    });
+    })
 
     if (res.success) {
       // 格式化时间
-      const data = res.data.map(item => ({
+      const data = res.data.map((item) => ({
         ...item,
         createTime: new Date(item.createTime).toLocaleString()
-      }));
+      }))
 
       if (pageIndex.value === 1) {
-        list.value = data;
+        list.value = data
       } else {
-        list.value = [...list.value, ...data];
+        list.value = [...list.value, ...data]
       }
 
       // 判断是否加载完成
       if (list.value.length >= res.total || data.length < pageSize.value) {
-        finished.value = true;
+        finished.value = true
       } else {
-        pageIndex.value++;
+        pageIndex.value++
       }
     } else {
-      showToast(res.message || '加载失败');
+      showToast(res.message || '加载失败')
-      finished.value = true;
+      finished.value = true
     }
   } catch (error) {
-    console.error(error);
+    console.error(error)
-    showToast('加载失败');
+    showToast('加载失败')
-    finished.value = true;
+    finished.value = true
   } finally {
-    loading.value = false;
+    loading.value = false
+  }
 }
-};
 
 const onRefresh = () => {
-  finished.value = false;
+  finished.value = false
-  loading.value = true;
+  loading.value = true
-  onLoad();
+  onLoad()
-};
+}
 
 const viewDetail = async (item) => {
   if (!item.isRead) {
     try {
-      await markAsRead(item.id);
+      await markAsRead(item.id)
-      item.isRead = true;
+      item.isRead = true
-      messageStore.updateUnreadCount();
+      messageStore.updateUnreadCount()
     } catch (error) {
-      console.error('标记已读失败', error);
+      console.error('标记已读失败', error)
     }
   }
 
-  currentMessage.value = item;
+  currentMessage.value = item
-  detailVisible.value = true;
+  detailVisible.value = true
-};
+}
 
 const handleUrlJump = (targetUrl) => {
-  if (!targetUrl) return;
+  if (!targetUrl) {
+    return
+  }
 
   if (targetUrl.startsWith('http')) {
-    window.open(targetUrl, '_blank');
+    window.open(targetUrl, '_blank')
   } else if (targetUrl.startsWith('/')) {
-    router.push(targetUrl);
+    router.push(targetUrl)
-    detailVisible.value = false;
+    detailVisible.value = false
   } else {
-    showToast('无效的URL');
+    showToast('无效的URL')
+  }
 }
-};
 
 const handleDelete = (item) => {
   showDialog({
     title: '提示',
     message: '确定要删除这条消息吗？',
-    showCancelButton: true,
+    showCancelButton: true
   }).then(async (action) => {
     if (action === 'confirm') {
       try {
-        const res = await deleteMessage(item.id);
+        const res = await deleteMessage(item.id)
         if (res.success) {
-          showToast('删除成功');
+          showToast('删除成功')
-          const wasUnread = !item.isRead;
+          const wasUnread = !item.isRead
-          list.value = list.value.filter(i => i.id !== item.id);
+          list.value = list.value.filter((i) => i.id !== item.id)
           if (wasUnread) {
-            messageStore.updateUnreadCount();
+            messageStore.updateUnreadCount()
           }
         } else {
-          showToast(res.message || '删除失败');
+          showToast(res.message || '删除失败')
         }
       } catch (error) {
-        console.error('删除消息失败', error);
+        console.error('删除消息失败', error)
-        showToast('删除失败');
+        showToast('删除失败')
       }
     }
-  });
+  })
-};
+}
 
 const handleMarkAllRead = () => {
   showDialog({
     title: '提示',
     message: '确定要将所有消息标记为已读吗？',
-    showCancelButton: true,
+    showCancelButton: true
   }).then(async (action) => {
     if (action === 'confirm') {
       try {
-        const res = await markAllAsRead();
+        const res = await markAllAsRead()
         if (res.success) {
-          showToast('操作成功');
+          showToast('操作成功')
           // 刷新列表
-          onRefresh();
+          onRefresh()
           // 更新未读计数
-          messageStore.updateUnreadCount();
+          messageStore.updateUnreadCount()
         } else {
-          showToast(res.message || '操作失败');
+          showToast(res.message || '操作失败')
         }
       } catch (error) {
-        console.error('标记所有已读失败', error);
+        console.error('标记所有已读失败', error)
-        showToast('操作失败');
+        showToast('操作失败')
       }
     }
-  });
+  })
-};
+}
 
 onMounted(() => {
   // onLoad 会由 van-list 自动触发
-});
+})
 
 defineExpose({
   handleMarkAllRead
-});
+})
 </script>
 
 <style scoped>

Web/src/views/PeriodicRecord.vue

@@ -36,7 +36,10 @@
                 </template>
               </van-cell>
               <van-cell title="分类" :value="item.classify || '未分类'" />
-              <van-cell title="下次执行时间" :value="formatDateTime(item.nextExecuteTime) || '未设置'" />
+              <van-cell
+                title="下次执行时间"
+                :value="formatDateTime(item.nextExecuteTime) || '未设置'"
+              />
               <van-cell title="状态">
                 <template #value>
                   <van-switch
@@ -69,18 +72,12 @@
       </van-list>
 
       <!-- 底部安全距离 -->
-      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
     </van-pull-refresh>
 
     <!-- 底部新增按钮 -->
     <div class="bottom-button">
-      <van-button 
+      <van-button type="primary" size="large" round icon="plus" @click="openAddDialog">
-        type="primary" 
-        size="large" 
-        round 
-        icon="plus"
-        @click="openAddDialog"
-      >
         新增周期账单
       </van-button>
     </div>
@@ -173,11 +170,7 @@
             type="number"
             :rules="[{ required: true, message: '请输入金额' }]"
           />
-            <van-field
+          <van-field v-model="form.type" name="type" label="类型">
-              v-model="form.type"
-              name="type"
-              label="类型"
-            >
             <template #input>
               <van-radio-group v-model="form.type" direction="horizontal">
                 <van-radio :name="0"> 支出 </van-radio>
@@ -188,16 +181,13 @@
           </van-field>
           <van-field name="classify" label="分类">
             <template #input>
-                <span v-if="!form.classify" style="color: var(--van-gray-5);">请选择交易分类</span>
+              <span v-if="!form.classify" style="color: var(--van-gray-5)">请选择交易分类</span>
               <span v-else>{{ form.classify }}</span>
             </template>
           </van-field>
 
           <!-- 分类选择组件 -->
-            <ClassifySelector
+          <ClassifySelector v-model="form.classify" :type="form.type" />
-              v-model="form.classify"
-              :type="form.type"
-            />
         </van-cell-group>
       </van-form>
       <template #footer>
@@ -392,18 +382,20 @@ const getPeriodicTypeText = (item) => {
 
   if (item.periodicConfig) {
     switch (item.periodicType) {
-      case 1: // 每周
+      case 1: {
-        { 
+        // 每周
-          const weekdays = item.periodicConfig.split(',').map(
+        const weekdays = item.periodicConfig
-            d => {
+          .split(',')
+          .map((d) => {
             const dayMap = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
             return dayMap[parseInt(d)] || ''
-            }).join('、')
+          })
+          .join('、')
         text += ` (${weekdays})`
         break
       }
-      case 2: // 每月
+      case 2: {
-        { 
+        // 每月
         const days = item.periodicConfig.split(',').join('、')
         text += ` (${days}日)`
         break
@@ -436,20 +428,22 @@ const editPeriodic = (item) => {
   form.type = item.type
   form.classify = item.classify
   form.periodicType = item.periodicType
-  form.periodicTypeText = periodicTypeColumns.find(t => t.value === item.periodicType)?.text || ''
+  form.periodicTypeText = periodicTypeColumns.find((t) => t.value === item.periodicType)?.text || ''
 
   // 解析周期配置
   if (item.periodicConfig) {
     switch (item.periodicType) {
       case 1: // 每周
-        form.weekdays = item.periodicConfig.split(',').map(d => parseInt(d))
+        form.weekdays = item.periodicConfig.split(',').map((d) => parseInt(d))
-        form.weekdaysText = form.weekdays.map(d => {
+        form.weekdaysText = form.weekdays
-          return weekdaysColumns.find(w => w.value === d)?.text || ''
+          .map((d) => {
-        }).join('、')
+            return weekdaysColumns.find((w) => w.value === d)?.text || ''
+          })
+          .join('、')
         break
       case 2: // 每月
-        form.monthDays = item.periodicConfig.split(',').map(d => parseInt(d))
+        form.monthDays = item.periodicConfig.split(',').map((d) => parseInt(d))
-        form.monthDaysText = form.monthDays.map(d => `${d}日`).join('、')
+        form.monthDaysText = form.monthDays.map((d) => `${d}日`).join('、')
         break
       case 3: // 每季度
         form.quarterDay = item.periodicConfig
@@ -468,7 +462,7 @@ const deletePeriodic = async (item) => {
   try {
     await showConfirmDialog({
       title: '提示',
-      message: '确定要删除这条周期性账单吗？',
+      message: '确定要删除这条周期性账单吗？'
     })
 
     const response = await deletePeriodicApi(item.id)
@@ -493,7 +487,7 @@ const toggleEnabled = async (id, enabled) => {
     if (response.success) {
       showToast(enabled ? '已启用' : '已禁用')
       // 更新本地数据
-      const item = periodicList.value.find(p => p.id === id)
+      const item = periodicList.value.find((p) => p.id === id)
       if (item) {
         item.isEnabled = enabled
       }
@@ -510,7 +504,9 @@ const toggleEnabled = async (id, enabled) => {
 }
 
 const formatDateTime = (date) => {
-  if (!date) return ''
+  if (!date) {
+    return ''
+  }
 
   return dayjs(date).format('YYYY-MM-DD HH:mm:ss')
 }
@@ -557,7 +553,6 @@ const onMonthDaysConfirm = ({ selectedValues, selectedOptions }) => {
   form.monthDaysText = selectedOptions[0].text
   showMonthDaysPicker.value = false
 }
-
 </script>
 
 <style scoped>
@@ -599,5 +594,4 @@ const onMonthDaysConfirm = ({ selectedValues, selectedOptions }) => {
 :deep(.van-nav-bar) {
   background: transparent !important;
 }
-
 </style>

Web/src/views/ScheduledTasksView.vue

@@ -1,19 +1,40 @@
 <template>
   <div class="page-container-flex">
-    <van-nav-bar title="定时任务" left-arrow placeholder @click-left="onClickLeft" />
+    <van-nav-bar
+      title="定时任务"
+      left-arrow
+      placeholder
+      @click-left="onClickLeft"
+    />
     <div class="scroll-content">
-      <van-pull-refresh v-model="loading" @refresh="fetchTasks">
+      <van-pull-refresh
-        <div v-for="task in tasks" :key="task.name" class="task-card">
+        v-model="loading"
+        @refresh="fetchTasks"
+      >
+        <div
+          v-for="task in tasks"
+          :key="task.name"
+          class="task-card"
+        >
           <van-cell-group inset>
-            <van-cell :title="task.jobDescription" :label="task.triggerDescription || task.name">
+            <van-cell
+              :title="task.jobDescription"
+              :label="task.triggerDescription || task.name"
+            >
               <template #value>
                 <van-tag :type="task.status === 'Paused' ? 'warning' : 'success'">
                   {{ task.status === 'Paused' ? '已暂停' : '已启动' }}
                 </van-tag>
               </template>
             </van-cell>
-            <van-cell title="任务标识" :value="task.name" />
+            <van-cell
-            <van-cell title="下次执行" :value="task.nextRunTime || '无'" />
+              title="任务标识"
+              :value="task.name"
+            />
+            <van-cell
+              title="下次执行"
+              :value="task.nextRunTime || '无'"
+            />
             <div class="card-footer">
               <van-row gutter="10">
                 <van-col span="12">
@@ -55,10 +76,13 @@
         </div>
       </van-pull-refresh>
 
-      <van-empty v-if="tasks.length === 0 && !loading" description="无定时任务" />
+      <van-empty
+        v-if="tasks.length === 0 && !loading"
+        description="无定时任务"
+      />
 
       <!-- 底部安全距离 -->
-      <div style="height: calc(20px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(20px + env(safe-area-inset-bottom, 0px))" />
     </div>
   </div>
 </template>
@@ -102,7 +126,7 @@ const handleExecute = async (task) => {
   try {
     await showConfirmDialog({
       title: '确认执行',
-      message: `确定要立即执行"${task.jobDescription}"吗？`,
+      message: `确定要立即执行"${task.jobDescription}"吗？`
     })
 
     showLoadingToast({
@@ -132,7 +156,7 @@ const handlePause = async (task) => {
   try {
     await showConfirmDialog({
       title: '确认暂停',
-      message: `确定要暂停"${task.jobDescription}"吗？`,
+      message: `确定要暂停"${task.jobDescription}"吗？`
     })
 
     const { success, message } = await pauseJob(task.name)

Web/src/views/SettingView.vue

@@ -1,59 +1,137 @@
 <template>
   <div class="page-container-flex">
-    <van-nav-bar title="设置" placeholder/>
+    <van-nav-bar
+      title="设置"
+      placeholder
+    />
     <div class="scroll-content">
-      <div class="detail-header" style="padding-bottom: 5px;">
+      <div
+        class="detail-header"
+        style="padding-bottom: 5px"
+      >
         <p>账单</p>
       </div>
       <van-cell-group inset>
-        <van-cell title="从支付宝导入" is-link @click="handleImportClick('Alipay')" />
+        <van-cell
-        <van-cell title="从微信导入" is-link @click="handleImportClick('WeChat')" />
+          title="从支付宝导入"
-        <van-cell title="周期记录" is-link @click="handlePeriodicRecord" />
+          is-link
+          @click="handleImportClick('Alipay')"
+        />
+        <van-cell
+          title="从微信导入"
+          is-link
+          @click="handleImportClick('WeChat')"
+        />
+        <van-cell
+          title="周期记录"
+          is-link
+          @click="handlePeriodicRecord"
+        />
       </van-cell-group>
 
       <!-- 隐藏的文件选择器 -->
-      <input ref="fileInputRef" type="file" accept=".csv,.xlsx,.xls" style="display: none" @change="handleFileChange" />
+      <input
+        ref="fileInputRef"
+        type="file"
+        accept=".csv,.xlsx,.xls"
+        style="display: none"
+        @change="handleFileChange"
+      >
 
-      <div class="detail-header" style="padding-bottom: 5px;">
+      <div
+        class="detail-header"
+        style="padding-bottom: 5px"
+      >
         <p>分类</p>
       </div>
       <van-cell-group inset>
-        <van-cell title="待确认分类" is-link @click="handleUnconfirmedClassification" />
+        <van-cell
-        <van-cell title="编辑分类" is-link @click="handleEditClassification" />
+          title="待确认分类"
-        <van-cell title="批量分类" is-link @click="handleBatchClassification" />
+          is-link
-        <van-cell title="智能分类" is-link @click="handleSmartClassification" />
+          @click="handleUnconfirmedClassification"
+        />
+        <van-cell
+          title="编辑分类"
+          is-link
+          @click="handleEditClassification"
+        />
+        <van-cell
+          title="批量分类"
+          is-link
+          @click="handleBatchClassification"
+        />
+        <van-cell
+          title="智能分类"
+          is-link
+          @click="handleSmartClassification"
+        />
         <!-- <van-cell title="自然语言分类" is-link @click="handleNaturalLanguageClassification" /> -->
       </van-cell-group>
 
-      <div class="detail-header" style="padding-bottom: 5px;">
+      <div
+        class="detail-header"
+        style="padding-bottom: 5px"
+      >
         <p>通知</p>
       </div>
       <van-cell-group inset>
         <van-cell title="开启消息通知">
           <template #right-icon>
-            <van-switch v-model="notificationEnabled" size="24" :loading="notificationLoading" @change="handleNotificationToggle" />
+            <van-switch
+              v-model="notificationEnabled"
+              size="24"
+              :loading="notificationLoading"
+              @change="handleNotificationToggle"
+            />
           </template>
         </van-cell>
-        <van-cell v-if="notificationEnabled" title="测试通知" is-link @click="handleTestNotification" />
+        <van-cell
+          v-if="notificationEnabled"
+          title="测试通知"
+          is-link
+          @click="handleTestNotification"
+        />
       </van-cell-group>
 
-      <div class="detail-header" style="padding-bottom: 5px;">
+      <div
+        class="detail-header"
+        style="padding-bottom: 5px"
+      >
         <p>开发者</p>
       </div>
       <van-cell-group inset>
-        <van-cell title="查看日志" is-link @click="handleLogView" />
+        <van-cell
-        <van-cell title="清除缓存" is-link @click="handleReloadFromNetwork" />
+          title="查看日志"
-        <van-cell title="定时任务" is-link @click="handleScheduledTasks" />
+          is-link
+          @click="handleLogView"
+        />
+        <van-cell
+          title="清除缓存"
+          is-link
+          @click="handleReloadFromNetwork"
+        />
+        <van-cell
+          title="定时任务"
+          is-link
+          @click="handleScheduledTasks"
+        />
       </van-cell-group>
 
-      <div class="detail-header" style="padding-bottom: 5px;">
+      <div
+        class="detail-header"
+        style="padding-bottom: 5px"
+      >
         <p>账户</p>
       </div>
       <van-cell-group inset>
-        <van-cell title="退出登录" is-link @click="handleLogout" />
+        <van-cell
+          title="退出登录"
+          is-link
+          @click="handleLogout"
+        />
       </van-cell-group>
       <!-- 底部安全距离 -->
-      <div style="height: calc(80px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(80px + env(safe-area-inset-bottom, 0px))" />
     </div>
   </div>
 </template>
@@ -83,14 +161,14 @@ onMounted(async () => {
 })
 
 function urlBase64ToUint8Array (base64String) {
-  const padding = '='.repeat((4 - base64String.length % 4) % 4);
+  const padding = '='.repeat((4 - (base64String.length % 4)) % 4)
-  const base64 = (base64String + padding).replace(/-/g, '+').replace(/_/g, '/');
+  const base64 = (base64String + padding).replace(/-/g, '+').replace(/_/g, '/')
-  const rawData = window.atob(base64);
+  const rawData = window.atob(base64)
-  const outputArray = new Uint8Array(rawData.length);
+  const outputArray = new Uint8Array(rawData.length)
   for (let i = 0; i < rawData.length; ++i) {
-    outputArray[i] = rawData.charCodeAt(i);
+    outputArray[i] = rawData.charCodeAt(i)
   }
-  return outputArray;
+  return outputArray
 }
 
 const handleNotificationToggle = async (checked) => {
@@ -113,7 +191,7 @@ const handleNotificationToggle = async (checked) => {
         return
       }
 
-      let { success, data, message } = await getVapidPublicKey()
+      const { success, data, message } = await getVapidPublicKey()
 
       if (!success) {
         throw new Error(message || '获取 VAPID 公钥失败')
@@ -184,7 +262,11 @@ const handleFileChange = async (event) => {
   }
 
   // 验证文件类型
-  const validTypes = ['text/csv', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']
+  const validTypes = [
+    'text/csv',
+    'application/vnd.ms-excel',
+    'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+  ]
   if (!validTypes.includes(file.type)) {
     showToast('请选择 CSV 或 Excel 文件')
     return
@@ -218,8 +300,7 @@ const handleFileChange = async (event) => {
   } catch (error) {
     console.error('上传失败:', error)
     showToast('上传失败: ' + (error.message || '未知错误'))
-  }
+  } finally {
-  finally {
     closeToast()
     // 清空文件输入，允许重复选择同一文件
     event.target.value = ''
@@ -249,7 +330,7 @@ const handleLogout = async () => {
   try {
     await showConfirmDialog({
       title: '提示',
-      message: '确定要退出登录吗？',
+      message: '确定要退出登录吗？'
     })
 
     authStore.logout()
@@ -276,7 +357,7 @@ const handleReloadFromNetwork = async () => {
   try {
     await showConfirmDialog({
       title: '提示',
-      message: '确定要刷新网络吗？此操作不可撤销。',
+      message: '确定要刷新网络吗？此操作不可撤销。'
     })
 
     // PWA程序强制页面更新到最新版本
@@ -300,7 +381,6 @@ const handleReloadFromNetwork = async () => {
 const handleScheduledTasks = () => {
   router.push({ name: 'scheduled-tasks' })
 }
-
 </script>
 
 <style scoped>

Web/src/views/StatisticsView.vue

@@ -1,48 +1,101 @@
 <template>
   <div class="page-container-flex">
     <!-- 顶部导航栏 -->
-    <van-nav-bar title="账单统计" placeholder>
+    <van-nav-bar
+      title="账单统计"
+      placeholder
+    >
       <template #right>
-        <van-icon name="chat-o" size="20" @click="goToAnalysis" />
+        <van-icon
+          name="chat-o"
+          size="20"
+          @click="goToAnalysis"
+        />
       </template>
     </van-nav-bar>
 
     <!-- 下拉刷新 -->
-    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
+    <van-pull-refresh
+      v-model="refreshing"
+      @refresh="onRefresh"
+    >
       <!-- 初始加载中 -->
-      <van-loading v-if="loading && firstLoading" vertical style="padding: 100px 0">
+      <van-loading
+        v-if="loading && firstLoading"
+        vertical
+        style="padding: 100px 0"
+      >
         加载统计数据中...
       </van-loading>
 
       <!-- 固定概览部分（置顶不滚动） -->
-      <div v-if="!firstLoading" class="overview-fixed-wrapper">
+      <div
-        <transition :name="transitionName" mode="out-in">
+        v-if="!firstLoading"
+        class="overview-fixed-wrapper"
+      >
+        <transition
+          :name="transitionName"
+          mode="out-in"
+        >
           <div :key="dateKey">
             <!-- 月度概览卡片 -->
             <div class="overview-card">
               <!-- 左切换按钮 -->
-              <div class="nav-arrow left" @click.stop="changeMonth(-1)">
+              <div
+                class="nav-arrow left"
+                @click.stop="changeMonth(-1)"
+              >
                 <van-icon name="arrow-left" />
               </div>
 
-              <div class="overview-item clickable" @click="goToTypeOverviewBills(0)">
+              <div
-                <div class="label">总支出</div>
+                class="overview-item clickable"
-                <div class="value expense">¥{{ formatMoney(monthlyData.totalExpense) }}</div>
+                @click="goToTypeOverviewBills(0)"
-                <div class="sub-text">{{ monthlyData.expenseCount }}笔</div>
+              >
+                <div class="label">
+                  总支出
                 </div>
-              <div class="divider"></div>
+                <div class="value expense">
-              <div class="overview-item clickable" @click="goToTypeOverviewBills(1)">
+                  ¥{{ formatMoney(monthlyData.totalExpense) }}
-                <div class="label">总收入</div>
-                <div class="value income">¥{{ formatMoney(monthlyData.totalIncome) }}</div>
-                <div class="sub-text">{{ monthlyData.incomeCount }}笔</div>
                 </div>
-              <div class="divider"></div>
+                <div class="sub-text">
-              <div class="overview-item clickable" @click="goToTypeOverviewBills(null)">
+                  {{ monthlyData.expenseCount }}笔
-                <div class="label">结余</div>
+                </div>
-                <div class="value" :class="monthlyData.balance >= 0 ? 'income' : 'expense'">
+              </div>
-                  {{ monthlyData.balance >= 0 ? '' : '-' }}¥{{ formatMoney(Math.abs(monthlyData.balance)) }}
+              <div class="divider" />
+              <div
+                class="overview-item clickable"
+                @click="goToTypeOverviewBills(1)"
+              >
+                <div class="label">
+                  总收入
+                </div>
+                <div class="value income">
+                  ¥{{ formatMoney(monthlyData.totalIncome) }}
+                </div>
+                <div class="sub-text">
+                  {{ monthlyData.incomeCount }}笔
+                </div>
+              </div>
+              <div class="divider" />
+              <div
+                class="overview-item clickable"
+                @click="goToTypeOverviewBills(null)"
+              >
+                <div class="label">
+                  结余
+                </div>
+                <div
+                  class="value"
+                  :class="monthlyData.balance >= 0 ? 'income' : 'expense'"
+                >
+                  {{ monthlyData.balance >= 0 ? '' : '-' }}¥{{
+                    formatMoney(Math.abs(monthlyData.balance))
+                  }}
+                </div>
+                <div class="sub-text">
+                  {{ monthlyData.totalCount }}笔交易
                 </div>
-                <div class="sub-text">{{ monthlyData.totalCount }}笔交易</div>
               </div>
 
               <!-- 右切换按钮 -->
@@ -56,7 +109,10 @@
               </div>
 
               <!-- 月份日期标识 -->
-              <div class="date-tag" @click="showMonthPicker = true">
+              <div
+                class="date-tag"
+                @click="showMonthPicker = true"
+              >
                 {{ dateTagLabel }}
                 <van-icon name="arrow-down" />
               </div>
@@ -66,69 +122,121 @@
       </div>
 
       <!-- 统计内容（可滚动部分） -->
-      <div v-if="!firstLoading" class="statistics-content">
+      <div
-        <transition :name="transitionName" mode="out-in">
+        v-if="!firstLoading"
+        class="statistics-content"
+      >
+        <transition
+          :name="transitionName"
+          mode="out-in"
+        >
           <div :key="dateKey">
             <!-- 趋势统计 -->
-            <div class="common-card">
+            <div
+              class="common-card"
+              style="padding-bottom: 5px"
+            >
               <div class="card-header">
-                <h3 class="card-title">每日收支趋势</h3>
+                <h3 class="card-title">
+                  收支趋势
+                </h3>
               </div>
 
-              <div class="trend-chart" style="height: 240px; padding: 10px 0;">
+              <div
-                <div ref="chartRef" style="width: 100%; height: 100%;"></div>
+                class="trend-chart"
+                style="height: 240px; padding: 10px 0"
+              >
+                <div
+                  ref="chartRef"
+                  style="width: 100%; height: 100%"
+                />
               </div>
             </div>
-
             <!-- 分类统计 -->
             <div class="common-card">
               <div class="card-header">
-                <h3 class="card-title">支出分类统计</h3>
+                <h3 class="card-title">
-                <van-tag type="primary" size="medium">{{ expenseCategoriesView.length }}类</van-tag>
+                  支出分类
+                </h3>
+                <van-tag
+                  type="primary"
+                  size="medium"
+                >
+                  {{ expenseCategoriesView.length }}类
+                </van-tag>
               </div>
-          
               <!-- 环形图区域 -->
-          <div v-if="expenseCategoriesView.length > 0" class="chart-container">
-            <div class="ring-chart">
-              <div ref="pieChartRef" style="width: 100%; height: 100%;"></div>
-            </div>
-          </div>
-
-          <!-- 分类列表 -->
-          <div v-if="expenseCategoriesSimpView.length > 0" class="category-list">
               <div
-              v-for="(category) in expenseCategoriesSimpView" 
+                v-if="expenseCategoriesView.length > 0"
+                class="chart-container"
+              >
+                <div class="ring-chart">
+                  <div
+                    ref="pieChartRef"
+                    style="width: 100%; height: 100%"
+                  />
+                </div>
+              </div>
+              <!-- 分类列表 -->
+              <div
+                v-if="expenseCategoriesSimpView.length > 0"
+                class="category-list"
+              >
+                <div
+                  v-for="category in expenseCategoriesSimpView"
                   :key="category.isOther ? 'other' : category.classify"
                   class="category-item clickable"
-              @click="category.isOther ? (showAllExpense = true) : goToCategoryBills(category.classify, 0)"
+                  @click="
+                    category.isOther
+                      ? (showAllExpense = true)
+                      : goToCategoryBills(category.classify, 0)
+                  "
                 >
                   <div class="category-info">
-                <div class="category-color" :style="{ backgroundColor: category.color }"></div>
+                    <div
+                      class="category-color"
+                      :style="{ backgroundColor: category.color }"
+                    />
                     <div class="category-name-with-count">
                       <span class="category-name">{{ category.classify || '未分类' }}</span>
                       <span class="category-count">{{ category.count }}笔</span>
                     </div>
                   </div>
                   <div class="category-stats">
-                <div class="category-amount">¥{{ formatMoney(category.amount) }}</div>
+                    <div class="category-amount">
-                <div class="category-percent">{{ category.percent }}%</div>
+                      ¥{{ formatMoney(category.amount) }}
                     </div>
-              <van-icon :name="category.isOther ? 'arrow-down' : 'arrow'" class="category-arrow" />
+                    <div class="category-percent">
+                      {{ category.percent }}%
+                    </div>
+                  </div>
+                  <van-icon
+                    :name="category.isOther ? 'arrow-down' : 'arrow'"
+                    class="category-arrow"
+                  />
                 </div>
               </div>
-
               <van-empty
                 v-else
                 description="本月暂无支出记录"
                 image="search"
               />
             </div>
-
             <!-- 收入分类统计 -->
-            <div v-if="incomeCategoriesView.length > 0" class="common-card">
+            <div
+              v-if="incomeCategoriesView.length > 0"
+              class="common-card"
+            >
               <div class="card-header">
-                <h3 class="card-title">收入分类统计</h3>
+                <h3 class="card-title">
-                <van-tag type="success" size="medium">{{ incomeCategoriesView.length }}类</van-tag>
+                  收入分类统计
+                </h3>
+                <van-tag
+                  type="success"
+                  size="medium"
+                >
+                  {{ incomeCategoriesView.length }}类
+                </van-tag>
               </div>
 
               <div class="category-list">
@@ -136,29 +244,49 @@
                   v-for="category in incomeCategoriesView"
                   :key="category.isOther ? 'other' : category.classify"
                   class="category-item clickable"
-                  @click="category.isOther ? (showAllIncome = true) : goToCategoryBills(category.classify, 1)"
+                  @click="
+                    category.isOther
+                      ? (showAllIncome = true)
+                      : goToCategoryBills(category.classify, 1)
+                  "
                 >
                   <div class="category-info">
-                    <div class="category-color income-color"></div>
+                    <div class="category-color income-color" />
                     <div class="category-name-with-count">
                       <span class="category-name">{{ category.classify || '未分类' }}</span>
                       <span class="category-count">{{ category.count }}笔</span>
                     </div>
                   </div>
                   <div class="category-stats">
-                    <div class="category-amount income-text">¥{{ formatMoney(category.amount) }}</div>
+                    <div class="category-amount income-text">
-                    <div class="category-percent">{{ category.percent }}%</div>
+                      ¥{{ formatMoney(category.amount) }}
                     </div>
-                  <van-icon :name="category.isOther ? 'arrow-down' : 'arrow'" class="category-arrow" />
+                    <div class="category-percent">
+                      {{ category.percent }}%
+                    </div>
+                  </div>
+                  <van-icon
+                    :name="category.isOther ? 'arrow-down' : 'arrow'"
+                    class="category-arrow"
+                  />
                 </div>
               </div>
             </div>
-
             <!-- 不计收支分类统计 -->
-            <div v-if="noneCategoriesView.length > 0" class="common-card">
+            <div
+              v-if="noneCategoriesView.length > 0"
+              class="common-card"
+            >
               <div class="card-header">
-                <h3 class="card-title">不计收支分类统计</h3>
+                <h3 class="card-title">
-                <van-tag type="info" size="medium">{{ noneCategoriesView.length }}类</van-tag>
+                  不计收支分类统计
+                </h3>
+                <van-tag
+                  type="info"
+                  size="medium"
+                >
+                  {{ noneCategoriesView.length }}类
+                </van-tag>
               </div>
 
               <div class="category-list">
@@ -166,59 +294,91 @@
                   v-for="category in noneCategoriesView"
                   :key="category.isOther ? 'other' : category.classify"
                   class="category-item clickable"
-                  @click="category.isOther ? (showAllNone = true) : goToCategoryBills(category.classify, 2)"
+                  @click="
+                    category.isOther
+                      ? (showAllNone = true)
+                      : goToCategoryBills(category.classify, 2)
+                  "
                 >
                   <div class="category-info">
-                    <div class="category-color none-color"></div>
+                    <div class="category-color none-color" />
                     <div class="category-name-with-count">
                       <span class="category-name">{{ category.classify || '未分类' }}</span>
                       <span class="category-count">{{ category.count }}笔</span>
                     </div>
                   </div>
                   <div class="category-stats">
-                    <div class="category-amount none-text">¥{{ formatMoney(category.amount) }}</div>
+                    <div class="category-amount none-text">
-                    <div class="category-percent">{{ category.percent }}%</div>
+                      ¥{{ formatMoney(category.amount) }}
                     </div>
-                  <van-icon :name="category.isOther ? 'arrow-down' : 'arrow'" class="category-arrow" />
+                    <div class="category-percent">
+                      {{ category.percent }}%
+                    </div>
+                  </div>
+                  <van-icon
+                    :name="category.isOther ? 'arrow-down' : 'arrow'"
+                    class="category-arrow"
+                  />
                 </div>
               </div>
             </div>
-
             <!-- 其他统计 -->
             <div class="common-card">
               <div class="card-header">
-                <h3 class="card-title">其他统计</h3>
+                <h3 class="card-title">
+                  其他统计
+                </h3>
               </div>
 
               <div class="other-stats">
                 <div class="stat-item">
-                  <div class="stat-label">日均支出</div>
+                  <div class="stat-label">
-                  <div class="stat-value">¥{{ formatMoney(dailyAverage.expense) }}</div>
+                    日均支出
+                  </div>
+                  <div class="stat-value">
+                    ¥{{ formatMoney(dailyAverage.expense) }}
+                  </div>
                 </div>
                 <div class="stat-item">
-                  <div class="stat-label">日均收入</div>
+                  <div class="stat-label">
-                  <div class="stat-value income-text">¥{{ formatMoney(dailyAverage.income) }}</div>
+                    日均收入
+                  </div>
+                  <div class="stat-value income-text">
+                    ¥{{ formatMoney(dailyAverage.income) }}
+                  </div>
                 </div>
                 <div class="stat-item">
-                  <div class="stat-label">最大单笔支出</div>
+                  <div class="stat-label">
-                  <div class="stat-value">¥{{ formatMoney(monthlyData.maxExpense) }}</div>
+                    最大单笔支出
+                  </div>
+                  <div class="stat-value">
+                    ¥{{ formatMoney(monthlyData.maxExpense) }}
+                  </div>
                 </div>
                 <div class="stat-item">
-                  <div class="stat-label">最大单笔收入</div>
+                  <div class="stat-label">
-                  <div class="stat-value income-text">¥{{ formatMoney(monthlyData.maxIncome) }}</div>
+                    最大单笔收入
+                  </div>
+                  <div class="stat-value income-text">
+                    ¥{{ formatMoney(monthlyData.maxIncome) }}
+                  </div>
                 </div>
               </div>
             </div>
-
             <!-- 底部安全距离 -->
-            <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+            <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
           </div>
         </transition>
       </div>
     </van-pull-refresh>
 
     <!-- 月份选择器 -->
-    <van-popup v-model:show="showMonthPicker" position="bottom" round teleport="body">
+    <van-popup
+      v-model:show="showMonthPicker"
+      position="bottom"
+      round
+      teleport="body"
+    >
       <van-date-picker
         v-model="selectedDate"
         title="选择月份"
@@ -270,7 +430,7 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted, onActivated, nextTick } from 'vue'
+import { ref, computed, onMounted, onActivated, nextTick, watch } from 'vue'
 import { onBeforeUnmount } from 'vue'
 import { showToast } from 'vant'
 import { useRouter } from 'vue-router'
@@ -294,7 +454,10 @@ const showAllIncome = ref(false)
 const showAllNone = ref(false)
 const currentYear = ref(new Date().getFullYear())
 const currentMonth = ref(new Date().getMonth() + 1)
-const selectedDate = ref([new Date().getFullYear().toString(), (new Date().getMonth() + 1).toString().padStart(2, '0')])
+const selectedDate = ref([
+  new Date().getFullYear().toString(),
+  (new Date().getMonth() + 1).toString().padStart(2, '0')
+])
 
 const transitionName = ref('slide-right')
 const dateKey = computed(() => `${currentYear.value}-${currentMonth.value}`)
@@ -309,7 +472,7 @@ const selectedCategoryTitle = ref('')
 const selectedClassify = ref('')
 const selectedType = ref(null)
 const billPageIndex = ref(1)
-let billPageSize = 20
+const billPageSize = 20
 
 // 详情编辑相关
 const detailVisible = ref(false)
@@ -335,7 +498,9 @@ const noneCategories = ref([])
 const expenseCategoriesSimpView = computed(() => {
   const list = expenseCategoriesView.value
 
-  if (showAllExpense.value || list.length <= 7) return list
+  if (showAllExpense.value || list.length <= 7) {
+    return list
+  }
 
   const top = list.slice(0, 6)
   const rest = list.slice(6)
@@ -352,7 +517,7 @@ const expenseCategoriesSimpView = computed(() => {
 
 const expenseCategoriesView = computed(() => {
   const list = [...expenseCategories.value]
-  const unclassifiedIndex = list.findIndex(c => !c.classify)
+  const unclassifiedIndex = list.findIndex((c) => !c.classify)
   if (unclassifiedIndex !== -1) {
     const [unclassified] = list.splice(unclassifiedIndex, 1)
     list.unshift(unclassified)
@@ -363,13 +528,15 @@ const expenseCategoriesView = computed(() => {
 
 const incomeCategoriesView = computed(() => {
   const list = [...incomeCategories.value]
-  const unclassifiedIndex = list.findIndex(c => !c.classify)
+  const unclassifiedIndex = list.findIndex((c) => !c.classify)
   if (unclassifiedIndex !== -1) {
     const [unclassified] = list.splice(unclassifiedIndex, 1)
     list.unshift(unclassified)
   }
 
-  if (showAllIncome.value || list.length <= 7) return list
+  if (showAllIncome.value || list.length <= 7) {
+    return list
+  }
 
   const top = list.slice(0, 6)
   const rest = list.slice(6)
@@ -385,13 +552,15 @@ const incomeCategoriesView = computed(() => {
 
 const noneCategoriesView = computed(() => {
   const list = [...noneCategories.value]
-  const unclassifiedIndex = list.findIndex(c => !c.classify)
+  const unclassifiedIndex = list.findIndex((c) => !c.classify)
   if (unclassifiedIndex !== -1) {
     const [unclassified] = list.splice(unclassifiedIndex, 1)
     list.unshift(unclassified)
   }
 
-  if (showAllNone.value || list.length <= 7) return list
+  if (showAllNone.value || list.length <= 7) {
+    return list
+  }
 
   const top = list.slice(0, 6)
   const rest = list.slice(6)
@@ -406,7 +575,6 @@ const noneCategoriesView = computed(() => {
 })
 
 // 趋势数据
-const trendData = ref([])
 const dailyData = ref([])
 const chartRef = ref(null)
 const pieChartRef = ref(null)
@@ -419,28 +587,23 @@ const maxDate = new Date()
 
 // 颜色配置
 const colors = [
-  '#FF6B6B', '#4ECDC4', '#45B7D1', '#FFA07A', '#98D8C8',
+  '#FF6B6B',
-  '#F7DC6F', '#BB8FCE', '#85C1E2', '#F8B88B', '#AAB7B8',
+  '#4ECDC4',
-  '#FF8ED4', '#67E6DC', '#FFAB73', '#C9B1FF', '#7BDFF2'
+  '#45B7D1',
+  '#FFA07A',
+  '#98D8C8',
+  '#F7DC6F',
+  '#BB8FCE',
+  '#85C1E2',
+  '#F8B88B',
+  '#AAB7B8',
+  '#FF8ED4',
+  '#67E6DC',
+  '#FFAB73',
+  '#C9B1FF',
+  '#7BDFF2'
 ]
 
-// 计算环形图数据
-const circumference = computed(() => 2 * Math.PI * 70)
-const chartSegments = computed(() => {
-  let offset = 0
-  return expenseCategoriesView.value.map((category) => {
-    const percent = category.percent / 100
-    const length = circumference.value * percent
-    const segment = {
-      color: category.color,
-      length,
-      offset
-    }
-    offset += length
-    return segment
-  })
-})
-
 // 日均统计
 const dailyAverage = computed(() => {
   const daysInMonth = new Date(currentYear.value, currentMonth.value, 0).getDate()
@@ -475,7 +638,7 @@ const dateTagLabel = computed(() => {
   }
 
   if (currentYear.value === lastYear && currentMonth.value === lastMonth) {
-    return `上月`
+    return '上月'
   }
 
   return `${currentYear.value}年${currentMonth.value}月`
@@ -488,8 +651,12 @@ const isUnclassified = computed(() => {
 
 // 格式化金额
 const formatMoney = (value) => {
-  if (!value && value !== 0) return '0'
+  if (!value && value !== 0) {
-  return Number(value).toFixed(0).replace(/\B(?=(\d{3})+(?!\d))/g, ',')
+    return '0'
+  }
+  return Number(value)
+    .toFixed(0)
+    .replace(/\B(?=(\d{3})+(?!\d))/g, ',')
 }
 
 // 切换月份
@@ -530,7 +697,10 @@ const onMonthConfirm = ({ selectedValues }) => {
   const newMonth = parseInt(selectedValues[1])
 
   // 判断方向以应用动画
-  if (newYear > currentYear.value || (newYear === currentYear.value && newMonth > currentMonth.value)) {
+  if (
+    newYear > currentYear.value ||
+    (newYear === currentYear.value && newMonth > currentMonth.value)
+  ) {
     transitionName.value = 'slide-left'
   } else {
     transitionName.value = 'slide-right'
@@ -561,11 +731,7 @@ const fetchStatistics = async (showLoading = true) => {
   }
 
   try {
-    await Promise.all([
+    await Promise.all([fetchMonthlyData(), fetchCategoryData(), fetchDailyData()])
-      fetchMonthlyData(),
-      fetchCategoryData(),
-      fetchDailyData()
-    ])
   } catch (error) {
     console.error('获取统计数据失败:', error)
     showToast('获取统计数据失败')
@@ -625,7 +791,7 @@ const fetchCategoryData = async () => {
     })
 
     if (incomeResponse.success && incomeResponse.data) {
-      incomeCategories.value = incomeResponse.data.map(item => ({
+      incomeCategories.value = incomeResponse.data.map((item) => ({
         classify: item.classify,
         amount: item.amount,
         count: item.count,
@@ -641,7 +807,7 @@ const fetchCategoryData = async () => {
     })
 
     if (noneResponse.success && noneResponse.data) {
-      noneCategories.value = noneResponse.data.map(item => ({
+      noneCategories.value = noneResponse.data.map((item) => ({
         classify: item.classify,
         amount: item.amount,
         count: item.count,
@@ -678,7 +844,33 @@ const fetchDailyData = async () => {
 }
 
 const renderChart = (data) => {
-  if (!chartRef.value) return
+  if (!chartRef.value) {
+    return
+  }
+
+  // 尝试获取DOM上的现有实例
+  const existingInstance = echarts.getInstanceByDom(chartRef.value)
+
+  // 如果当前保存的实例与DOM不一致，或者DOM上已经有实例但我们没保存引用
+  if (chartInstance && chartInstance !== existingInstance) {
+    // 这种情况很少见，但为了保险，销毁旧的引用
+    if (!chartInstance.isDisposed()) {
+      chartInstance.dispose()
+    }
+    chartInstance = null
+  }
+
+  // 如果DOM变了（transition导致的），旧的chartInstance绑定的DOM已经不在了
+  // 这时 chartInstance.getDom() !== chartRef.value
+  if (chartInstance && chartInstance.getDom() !== chartRef.value) {
+    chartInstance.dispose()
+    chartInstance = null
+  }
+
+  // 如果DOM上已经有实例（可能由其他途径创建），复用它
+  if (!chartInstance && existingInstance) {
+    chartInstance = existingInstance
+  }
 
   if (!chartInstance) {
     chartInstance = echarts.init(chartRef.value)
@@ -700,7 +892,7 @@ const renderChart = (data) => {
 
   // 创建日期映射
   const dataMap = new Map()
-  data.forEach(item => {
+  data.forEach((item) => {
     const day = new Date(item.date).getDate()
     dataMap.set(day, item)
   })
@@ -720,7 +912,7 @@ const renderChart = (data) => {
     }
   }
 
-  const dates = fullData.map(item => {
+  const dates = fullData.map((item) => {
     const date = new Date(item.date)
     return `${date.getDate()}日`
   })
@@ -730,30 +922,42 @@ const renderChart = (data) => {
   let accumulatedIncome = 0
   let accumulatedBalance = 0
 
-  const expenses = fullData.map(item => {
+  const expenses = fullData.map((item) => {
     accumulatedExpense += item.expense
     return accumulatedExpense
   })
 
-  const incomes = fullData.map(item => {
+  const incomes = fullData.map((item) => {
     accumulatedIncome += item.income
     return accumulatedIncome
   })
 
-  const balances = fullData.map(item => {
+  const balances = fullData.map((item) => {
     accumulatedBalance += item.balance
     return accumulatedBalance
   })
 
+  // 计算最大绝对值，用于动态设置Y轴间隔
+  const allValues = [...expenses, ...incomes, ...balances]
+  const maxValue = Math.max(...allValues.map(Math.abs), 1000)
+
+  // 动态计算间隔：目标是大约5-8个刻度
+  // 比如最大值是 11k，间隔可以是 2k (11/2 = 5.5)
+  // 最大值是 3k，间隔可以是 0.5k 或 1k
+  let interval = 1000
+  if (maxValue > 8000) {
+    interval = Math.ceil(maxValue / 6 / 1000) * 1000
+  }
+
   const option = {
     tooltip: {
       trigger: 'axis',
       formatter: function (params) {
-        let result = params[0].name + '<br/>';
+        let result = params[0].name + '<br/>'
-        params.forEach(param => {
+        params.forEach((param) => {
-          result += param.marker + param.seriesName + ': ' + formatMoney(param.value) + '<br/>';
+          result += param.marker + param.seriesName + ': ' + formatMoney(param.value) + '<br/>'
-        });
+        })
-        return result;
+        return result
       }
     },
     legend: {
@@ -766,8 +970,8 @@ const renderChart = (data) => {
     grid: {
       left: '3%',
       right: '4%',
-      bottom: '10%',
+      bottom: '15%',
-      top: '10%',
+      top: '5%',
       containLabel: true
     },
     xAxis: {
@@ -780,11 +984,11 @@ const renderChart = (data) => {
     },
     yAxis: {
       type: 'value',
-      interval: 1000, // 固定间隔1k
+      splitNumber: 5,
       axisLabel: {
         color: '#999', // 适配深色模式
         formatter: (value) => {
-          return (value / 1000) + 'k'
+          return value / 1000 + 'k'
         }
       },
       splitLine: {
@@ -829,8 +1033,31 @@ const renderChart = (data) => {
 }
 
 const renderPieChart = () => {
-  if (!pieChartRef.value) return
+  if (!pieChartRef.value) {
-  if (expenseCategoriesView.value.length === 0) return
+    return
+  }
+  if (expenseCategoriesView.value.length === 0) {
+    return
+  }
+
+  // 尝试获取DOM上的现有实例
+  const existingInstance = echarts.getInstanceByDom(pieChartRef.value)
+
+  if (pieChartInstance && pieChartInstance !== existingInstance) {
+    if (!pieChartInstance.isDisposed()) {
+      pieChartInstance.dispose()
+    }
+    pieChartInstance = null
+  }
+
+  if (pieChartInstance && pieChartInstance.getDom() !== pieChartRef.value) {
+    pieChartInstance.dispose()
+    pieChartInstance = null
+  }
+
+  if (!pieChartInstance && existingInstance) {
+    pieChartInstance = existingInstance
+  }
 
   if (!pieChartInstance) {
     pieChartInstance = echarts.init(pieChartRef.value)
@@ -963,7 +1190,9 @@ const smartClassifyButtonRef = ref(null)
 const transactionListRef = ref(null)
 // 加载分类账单数据
 const loadCategoryBills = async (customIndex = null, customSize = null) => {
-  if (billListLoading.value || billListFinished.value) return
+  if (billListLoading.value || billListFinished.value) {
+    return
+  }
 
   billListLoading.value = true
   try {
@@ -1026,7 +1255,7 @@ const viewBillDetail = async (transaction) => {
 }
 
 const handleCategoryBillsDelete = (deletedId) => {
-  categoryBills.value = categoryBills.value.filter(t => t.id !== deletedId)
+  categoryBills.value = categoryBills.value.filter((t) => t.id !== deletedId)
   categoryBillsTotal.value--
 
   // 被删除后刷新统计数据和账单列表
@@ -1039,13 +1268,15 @@ const onBillSave = async (updatedTransaction) => {
   await fetchStatistics()
 
   // 只刷新列表中指定的账单项
-  const item = categoryBills.value.find(t => t.id === updatedTransaction.id)
+  const item = categoryBills.value.find((t) => t.id === updatedTransaction.id)
-  if(!item) return
+  if (!item) {
+    return
+  }
 
   // 如果分类发生了变化
   if (item.classify !== updatedTransaction.classify) {
     // 从列表中移除该项
-    categoryBills.value = categoryBills.value.filter(t => t.id !== updatedTransaction.id)
+    categoryBills.value = categoryBills.value.filter((t) => t.id !== updatedTransaction.id)
     categoryBillsTotal.value--
     // 通知智能分类按钮组件移除指定项
     smartClassifyButtonRef.value?.removeClassifiedTransaction(updatedTransaction.id)
@@ -1075,7 +1306,11 @@ const onSmartClassifySave = async () => {
   // 刷新统计数据
   await fetchStatistics()
   try {
-    window.dispatchEvent(new CustomEvent('transactions-changed', { detail: { reason: selectedClassify.value, type: selectedType.value } })) 
+    window.dispatchEvent(
+      new CustomEvent('transactions-changed', {
+        detail: { reason: selectedClassify.value, type: selectedType.value }
+      })
+    )
   } catch (e) {
     console.error('触发 transactions-changed 事件失败:', e)
   }
@@ -1086,13 +1321,13 @@ const onSmartClassifySave = async () => {
 const handleNotifiedTransactionId = async (transactionId) => {
   console.log('收到已处理交易ID通知:', transactionId)
   // 滚动到指定的交易项
-  const index = categoryBills.value.findIndex(item => String(item.id) === String(transactionId))
+  const index = categoryBills.value.findIndex((item) => String(item.id) === String(transactionId))
   if (index !== -1) {
     // 等待 DOM 更新
     await nextTick()
 
     // 允许一丁点延迟让浏览器响应渲染
-    await new Promise(resolve => setTimeout(resolve, 0))
+    await new Promise((resolve) => setTimeout(resolve, 0))
 
     const listElement = transactionListRef.value?.$el
     if (listElement) {
@@ -1116,6 +1351,28 @@ const handleResize = () => {
   pieChartInstance && pieChartInstance.resize()
 }
 
+// 监听DOM引用变化，确保在月份切换DOM重建后重新渲染图表
+watch(chartRef, (newVal) => {
+  // 无论有没有数据，只要DOM变了，就尝试渲染
+  // 如果没有数据，renderChart 内部也应该处理（或者我们可以传空数据）
+  if (newVal) {
+    setTimeout(() => {
+      // 传入当前 dailyData，即使是空的，renderChart 应该能处理
+      renderChart(dailyData.value || [])
+      chartInstance && chartInstance.resize()
+    }, 50)
+  }
+})
+
+watch(pieChartRef, (newVal) => {
+  if (newVal) {
+    setTimeout(() => {
+      renderPieChart()
+      pieChartInstance && pieChartInstance.resize()
+    }, 50)
+  }
+})
+
 // 页面激活时刷新数据（从其他页面返回时）
 onActivated(() => {
   fetchStatistics()
@@ -1127,10 +1384,12 @@ const onGlobalTransactionDeleted = () => {
   fetchStatistics()
 }
 
-window.addEventListener && window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
+window.addEventListener &&
+  window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
+  window.removeEventListener &&
+    window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
   window.removeEventListener('resize', handleResize)
   chartInstance && chartInstance.dispose()
   pieChartInstance && pieChartInstance.dispose()
@@ -1140,10 +1399,12 @@ const onGlobalTransactionsChanged = () => {
   fetchStatistics()
 }
 
-window.addEventListener && window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
+window.addEventListener &&
+  window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
+  window.removeEventListener &&
+    window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
 })
 </script>
 
@@ -1598,5 +1859,4 @@ onBeforeUnmount(() => {
 :deep(.van-nav-bar) {
   background: transparent !important;
 }
-
 </style>

Web/src/views/TransactionsRecord.vue

@@ -14,7 +14,11 @@
     <!-- 下拉刷新区域 -->
     <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
       <!-- 加载提示 -->
-      <van-loading v-if="loading && !(transactionList && transactionList.length)" vertical style="padding: 50px 0">
+      <van-loading
+        v-if="loading && !(transactionList && transactionList.length)"
+        vertical
+        style="padding: 50px 0"
+      >
         加载中...
       </van-loading>
 
@@ -26,14 +30,16 @@
         :show-delete="true"
         @load="onLoad"
         @click="viewDetail"
-        @delete="(id) => {
+        @delete="
+          (id) => {
             // 从当前的交易列表中移除该交易
-          transactionList.value = transactionList.value.filter(t => t.id !== id)
+            transactionList.value = transactionList.value.filter((t) => t.id !== id)
-        }"
+          }
+        "
       />
 
       <!-- 底部安全距离 -->
-      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+      <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))" />
     </van-pull-refresh>
 
     <!-- 详情/编辑弹出层 -->
@@ -48,10 +54,7 @@
 <script setup>
 import { ref, onMounted, onBeforeUnmount } from 'vue'
 import { showToast } from 'vant'
-import { 
+import { getTransactionList, getTransactionDetail } from '@/api/transactionRecord'
-  getTransactionList, 
-  getTransactionDetail
-} from '@/api/transactionRecord'
 import TransactionList from '@/components/TransactionList.vue'
 import TransactionDetail from '@/components/TransactionDetail.vue'
 
@@ -69,8 +72,6 @@ const currentTransaction = ref(null)
 const searchKeyword = ref('')
 let searchTimer = null
 
-
-
 // 加载数据
 const loadData = async (isRefresh = false) => {
   if (isRefresh) {
@@ -194,10 +195,12 @@ const onGlobalTransactionDeleted = () => {
   loadData(true)
 }
 
-window.addEventListener && window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
+window.addEventListener &&
+  window.addEventListener('transaction-deleted', onGlobalTransactionDeleted)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
+  window.removeEventListener &&
+    window.removeEventListener('transaction-deleted', onGlobalTransactionDeleted)
 })
 
 // 外部新增/修改/批量更新时的刷新监听
@@ -208,18 +211,16 @@ const onGlobalTransactionsChanged = () => {
   loadData(true)
 }
 
-window.addEventListener && window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
+window.addEventListener &&
+  window.addEventListener('transactions-changed', onGlobalTransactionsChanged)
 
 onBeforeUnmount(() => {
-  window.removeEventListener && window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
+  window.removeEventListener &&
+    window.removeEventListener('transactions-changed', onGlobalTransactionsChanged)
 })
-
-
-
 </script>
 
 <style scoped>
-
 :deep(.van-pull-refresh) {
   flex: 1;
   overflow-y: auto;
@@ -231,7 +232,6 @@ onBeforeUnmount(() => {
   padding: 4px 12px;
   z-index: 100;
   margin-top: 10px;
-
 }
 
 .top-search-bar :deep(.van-search) {
@@ -239,8 +239,6 @@ onBeforeUnmount(() => {
   background: transparent;
 }
 
-
-
 /* 设置页面容器背景色 */
 :deep(.van-nav-bar) {
   background: transparent !important;

Web/src/views/UnconfirmedClassification.vue

@@ -20,8 +20,13 @@
     </van-nav-bar>
 
     <div class="scroll-content">
-      <div v-if="loading && transactions.length === 0" class="loading-container">
+      <div
-        <van-loading vertical>加载中...</van-loading>
+        v-if="loading && transactions.length === 0"
+        class="loading-container"
+      >
+        <van-loading vertical>
+          加载中...
+        </van-loading>
       </div>
 
       <TransactionList
@@ -92,7 +97,7 @@ const handleConfirmSelected = async () => {
 
 // 转换数据格式以适配 TransactionList 组件
 const displayTransactions = computed(() => {
-  return transactions.value.map(t => ({
+  return transactions.value.map((t) => ({
     ...t,
     upsetedClassify: t.unconfirmedClassify,
     upsetedType: t.unconfirmedType
@@ -104,13 +109,12 @@ const loadData = async () => {
   try {
     const response = await getUnconfirmedTransactionList()
     if (response && response.success) {
-      transactions.value = (response.data || [])
+      transactions.value = (response.data || []).map((t) => ({
-        .map(t => ({
         ...t,
         upsetedClassify: t.unconfirmedClassify,
         upsetedType: t.unconfirmedType
       }))
-      selectedIds.value = new Set(response.data.map(t => t.id))
+      selectedIds.value = new Set(response.data.map((t) => t.id))
     }
   } catch (error) {
     console.error('获取待确认列表失败:', error)
@@ -125,7 +129,7 @@ const handleTransactionClick = (transaction) => {
 }
 
 const handleTransactionDeleted = (id) => {
-  transactions.value = transactions.value.filter(t => t.id !== id)
+  transactions.value = transactions.value.filter((t) => t.id !== id)
 }
 
 const updateSelectedIds = (ids) => {

Web/vite.config.js

@@ -29,7 +29,7 @@ export default defineConfig({
   resolve: {
     alias: {
       '@': fileURLToPath(new URL('./src', import.meta.url))
-    },
+    }
   },
   build: {
     // 确保 Service Worker 和 manifest 被正确复制

WebApi/Controllers/TransactionRecordController.cs

@@ -1,4 +1,4 @@
-namespace WebApi.Controllers;
+namespace WebApi.Controllers;
 
 using System.Text.Json;
 using System.Text.Json.Nodes;
@@ -9,7 +9,8 @@ using Repository;
 public class TransactionRecordController(
     ITransactionRecordRepository transactionRepository,
     ISmartHandleService smartHandleService,
-    ILogger<TransactionRecordController> logger
+    ILogger<TransactionRecordController> logger,
+    IConfigService configService
 ) : ControllerBase
 {
     /// <summary>
@@ -272,13 +273,16 @@ public class TransactionRecordController(
     {
         try
         {
-            var statistics = await transactionRepository.GetDailyStatisticsAsync(year, month);
+            // 获取存款分类
+            var savingClassify = await configService.GetConfigByKeyAsync<string>("SavingsCategories");
+
+            var statistics = await transactionRepository.GetDailyStatisticsAsync(year, month, savingClassify);
             var result = statistics.Select(s => new DailyStatisticsDto(
                 s.Key, 
                 s.Value.count, 
                 s.Value.expense, 
                 s.Value.income,
-                s.Value.income - s.Value.expense // Balance = Income - Expense
+                s.Value.saving
             )).ToList();
 
             return result.Ok();
@@ -305,7 +309,13 @@ public class TransactionRecordController(
             var effectiveEndDate = endDate.Date.AddDays(1);
             var effectiveStartDate = startDate.Date;
 
-            var statistics = await transactionRepository.GetDailyStatisticsByRangeAsync(effectiveStartDate, effectiveEndDate);
+            // 获取存款分类
+            var savingClassify = await configService.GetConfigByKeyAsync<string>("SavingsCategories");
+
+            var statistics = await transactionRepository.GetDailyStatisticsByRangeAsync(
+                effectiveStartDate, 
+                effectiveEndDate,
+                savingClassify);
             var result = statistics.Select(s => new DailyStatisticsDto(
                 s.Key, 
                 s.Value.count, 
@@ -725,17 +735,6 @@ public class TransactionRecordController(
         await Response.WriteAsync(message);
         await Response.Body.FlushAsync();
     }
-
-    private static string GetTypeName(TransactionType type)
-    {
-        return type switch
-        {
-            TransactionType.Expense => "支出",
-            TransactionType.Income => "收入",
-            TransactionType.None => "不计入收支",
-            _ => "未知"
-        };
-    }
 }
 
 /// <summary>