feat: 添加收入分配规则管理页面及账户、转账、交易、分配规则等相关组件的图标渲染

src/components/transaction/RecurringTransactionForm/RecurringTransactionForm.tsx

@@ -21,6 +21,7 @@ import {
   calculateNextOccurrence,
 } from '../../../services/recurringTransactionService';
 import { Icon } from '@iconify/react';
+import { getDisplayIcon } from '../../../utils/iconUtils';
 import './RecurringTransactionForm.css';
 
 interface RecurringTransactionFormProps {
@@ -417,7 +418,7 @@ export const RecurringTransactionForm: React.FC<RecurringTransactionFormProps> =
               <option value={0}>请选择账户</option>
               {accounts.map((account) => (
                 <option key={account.id} value={account.id}>
-                  {account.icon} {account.name} ({getCurrencySymbol(account.currency)}
+                  {getDisplayIcon(account.icon)} {account.name} ({getCurrencySymbol(account.currency)}
                   {account.balance.toFixed(2)})
                 </option>
               ))}

src/components/transaction/TransactionFilter/TransactionFilter.tsx

@@ -9,6 +9,7 @@ import { Icon } from '@iconify/react';
 import type { Category, Account, TransactionType } from '../../../types';
 import { getCategories } from '../../../services/categoryService';
 import { getAccounts } from '../../../services/accountService';
+import { getDisplayIcon } from '../../../utils/iconUtils';
 import './TransactionFilter.css';
 
 export interface FilterValues {
@@ -256,8 +257,8 @@ export const TransactionFilter: React.FC<TransactionFilterProps> = ({
                 <button
                   key={option.value || 'all'}
                   className={`transaction-filter__type-btn ${(values.type || '') === option.value
-                      ? 'transaction-filter__type-btn--active'
-                      : ''
+                    ? 'transaction-filter__type-btn--active'
+                    : ''
                     }`}
                   onClick={() => handleChange('type', option.value as TransactionType | undefined)}
                 >
@@ -301,7 +302,7 @@ export const TransactionFilter: React.FC<TransactionFilterProps> = ({
               <option value="">全部账户</option>
               {accounts.map((account) => (
                 <option key={account.id} value={account.id}>
-                  {account.icon} {account.name}
+                  {getDisplayIcon(account.icon)} {account.name}
                 </option>
               ))}
             </select>

src/components/transaction/TransactionItem/TransactionItem.tsx

@@ -7,6 +7,7 @@
 import React from 'react';
 import { Icon } from '@iconify/react';
 import type { Transaction, Category } from '../../../types';
+import { isIconifyIcon } from '../../../utils/iconUtils';
 import './TransactionItem.css';
 
 interface TransactionItemProps {
@@ -102,13 +103,17 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
   };
 
   return (
-    <div 
+    <div
       className={`transaction-item ${transaction.type} ${compact ? 'compact' : ''} ${onClick ? 'clickable' : ''} ${selected ? 'selected' : ''}`}
       onClick={handleClick}
     >
       {/* 图标 */}
       <div className={`transaction-item-icon ${transaction.type}`}>
-        <Icon icon={getCategoryIcon()} width={compact ? 18 : 22} />
+        {isIconifyIcon(getCategoryIcon()) ? (
+          <Icon icon={getCategoryIcon()} width={compact ? 18 : 22} />
+        ) : (
+          <span style={{ fontSize: compact ? 18 : 22 }}>{getCategoryIcon()}</span>
+        )}
       </div>
 
       {/* 主要信息 */}
@@ -121,7 +126,7 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
             <span className="transaction-item-note">{transaction.note}</span>
           )}
         </div>
-        
+
         {showDate && (
           <div className="transaction-item-meta">
             <span className="transaction-item-date">
@@ -142,7 +147,7 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
           {transaction.type === 'income' ? '+' : transaction.type === 'expense' ? '-' : ''}
           {formatAmount(transaction.amount)}
         </span>
-        
+
         {/* 状态标签 */}
         {(transaction.reimbursementStatus !== 'none' || transaction.refundStatus !== 'none') && (
           <div className="transaction-item-badges">