refactor: 统一账单列表组件，封装 BillListComponent

- 创建 BillListComponent 组件（基于 v2 风格，紧凑布局）
  - 支持筛选（类型、分类、日期范围）和排序（金额、时间）
  - 支持分页加载、左滑删除、点击详情、多选模式
  - 支持 API 自动加载和 Custom 自定义数据两种模式
- 迁移 6 个页面/组件到新组件：
  - TransactionsRecord.vue
  - EmailRecord.vue
  - ClassificationNLP.vue
  - UnconfirmedClassification.vue
  - BudgetCard.vue
  - ReasonGroupList.vue
- 删除旧版 TransactionList 组件
- 保留 CalendarV2 的特殊版本（有专用功能）
- 添加完整的使用文档和 JSDoc 注释

Web/src/views/calendarV2/modules/TransactionList.vue

@@ -1,3 +1,14 @@
+<!--
+  CalendarV2 专用的交易列表组件
+
+  特殊功能：
+  - 自定义 header（Items 数量、Smart 按钮）
+  - 与日历视图紧密集成
+  - 特定的 UI 风格和交互
+
+  注意：此组件不是通用的 BillListComponent，专为 CalendarV2 视图设计。
+  如需通用账单列表功能，请使用 @/components/Bill/BillListComponent.vue
+-->
 <template>
   <!-- 交易列表 -->
   <div class="transactions">
@@ -128,13 +139,13 @@ const formatAmount = (amount, type) => {
 // 根据分类获取图标
 const getIconByClassify = (classify) => {
   const iconMap = {
-    '餐饮': 'food',
-    '购物': 'shopping',
-    '交通': 'transport',
-    '娱乐': 'play',
-    '医疗': 'medical',
-    '工资': 'money',
-    '红包': 'red-packet'
+    餐饮: 'food',
+    购物: 'shopping',
+    交通: 'transport',
+    娱乐: 'play',
+    医疗: 'medical',
+    工资: 'money',
+    红包: 'red-packet'
   }
   return iconMap[classify] || 'star'
 }
@@ -153,7 +164,7 @@ const fetchDayTransactions = async (date) => {
 
     if (response.success && response.data) {
       // 转换为界面需要的格式
-      transactions.value = response.data.map(txn => ({
+      transactions.value = response.data.map((txn) => ({
         id: txn.id,
         name: txn.reason || '未知交易',
         time: formatTime(txn.occurredAt),
@@ -173,11 +184,15 @@ const fetchDayTransactions = async (date) => {
 }
 
 // 监听 selectedDate 变化，重新加载数据
-watch(() => props.selectedDate, async (newDate) => {
-  if (newDate) {
-    await fetchDayTransactions(newDate)
-  }
-}, { immediate: true })
+watch(
+  () => props.selectedDate,
+  async (newDate) => {
+    if (newDate) {
+      await fetchDayTransactions(newDate)
+    }
+  },
+  { immediate: true }
+)
 
 // 交易数量
 const transactionCount = computed(() => transactions.value.length)
@@ -338,7 +353,7 @@ const onSmartClick = () => {
 
 .txn-classify-tag.tag-expense {
   background-color: rgba(59, 130, 246, 0.15);
-  color: #3B82F6;
+  color: #3b82f6;
 }
 
 .txn-amount {