feat: 新增 TransactionItem 组件用于展示交易详情及滑动操作，并定义相关类型。

src/components/transaction/TransactionItem/TransactionItem.tsx

@@ -88,10 +88,13 @@ const TransactionItem = React.memo<TransactionItemProps>(({
     }
   };
 
+  // 获取有效的分类信息：优先使用传入的 category prop，否则使用 transaction.category
+  const effectiveCategory = category || transaction.category;
+
   // 获取分类图标
   const getCategoryIcon = () => {
-    if (category?.icon) {
-      return category.icon;
+    if (effectiveCategory?.icon) {
+      return effectiveCategory.icon;
     }
     return getTypeIcon();
   };
@@ -139,7 +142,7 @@ const TransactionItem = React.memo<TransactionItemProps>(({
           </div>
           <div className="transaction-item-main">
             <div className="transaction-item-title">
-              <span className="transaction-item-category">{category?.name || '未分类'}</span>
+              <span className="transaction-item-category">{effectiveCategory?.name || '未分类'}</span>
               {transaction.note && !compact && <span className="transaction-item-note">{transaction.note}</span>}
             </div>
             {showDate && (
@@ -217,7 +220,7 @@ const TransactionItem = React.memo<TransactionItemProps>(({
         <div className="transaction-item-main">
           <div className="transaction-item-title">
             <span className="transaction-item-category">
-              {category?.name || '未分类'}
+              {effectiveCategory?.name || '未分类'}
             </span>
             {transaction.note && !compact && (
               <span className="transaction-item-note">{transaction.note}</span>

src/types/index.ts

@@ -109,7 +109,9 @@ export interface Transaction {
   amount: number;
   type: TransactionType;
   categoryId: number;
+  category?: Category; // Populated by backend via Preload
   accountId: number;
+  account?: Account; // Populated by backend via Preload
   currency: CurrencyCode;
   transactionDate: string;
   note?: string;