refactor(TradingSimulation): 迁移 ApexCharts 图表到 ECharts

图表组件迁移：
  - AssetTrendChart: 资产走势折线图 → ECharts 面积图
  - AssetAllocationChart: 资产配置环形图 → ECharts 饼图
  - PositionDistributionChart: 持仓分布饼图 → ECharts 饼图
  - ProfitAnalysisChart: 盈亏分析柱状图 → ECharts 柱状图

  删除的 ApexCharts 组件：
  - src/components/Charts/LineChart.js
  - src/components/Charts/BarChart.js
  - src/components/Charts/PieChart.js
  - src/components/Charts/DonutChart.js

  技术改进：
  - 统一使用 ECharts 作为通用图表库
  - 新组件使用 TypeScript，类型安全
  - 为后续移除 apexcharts 依赖做准备

src/views/TradingSimulation/components/AccountOverview.js

@@ -24,8 +24,8 @@ import {
 } from '@chakra-ui/react';
 import { FiTrendingUp, FiTrendingDown, FiDollarSign, FiPieChart, FiTarget, FiActivity } from 'react-icons/fi';
 
-// 导入现有的图表组件
-import DonutChart from '../../../components/Charts/DonutChart';
+// 导入图表组件
+import { AssetAllocationChart } from './AssetAllocationChart';
 import IconBox from '../../../components/Icons/IconBox';
 
 export default function AccountOverview({ account, tradingEvents }) {
@@ -65,68 +65,6 @@ export default function AccountOverview({ account, tradingEvents }) {
     return `${(percent || 0) >= 0 ? '+' : ''}${(percent || 0).toFixed(2)}%`;
   };
 
-  // 安全地准备资产配置饼图数据
-  const assetAllocationData = account?.totalAssets > 0 ? [
-    (account.availableCash / account.totalAssets) * 100,
-    (account.marketValue / account.totalAssets) * 100
-  ] : [100, 0];
-  
-  const assetAllocationOptions = {
-    labels: ['现金资产', '股票资产'],
-    colors: ['#4299E1', '#48BB78'],
-    chart: {
-      width: "100%",
-      height: "280px"
-    },
-    states: {
-      hover: {
-        filter: {
-          type: "none",
-        },
-      },
-    },
-    legend: {
-      show: true,
-      position: 'bottom',
-      fontSize: '12px',
-      labels: {
-        colors: textColor
-      }
-    },
-    dataLabels: {
-      enabled: true,
-      style: {
-        fontSize: '12px',
-        fontWeight: 'bold',
-        colors: ['#fff']
-      },
-      formatter: function (val) {
-        return (val || 0).toFixed(1) + "%"
-      }
-    },
-    plotOptions: {
-      pie: {
-        expandOnClick: false,
-        donut: {
-          labels: {
-            show: false,
-          },
-        },
-      },
-    },
-    fill: {
-      colors: ['#4299E1', '#48BB78'],
-    },
-    tooltip: {
-      enabled: true,
-      theme: "dark",
-      y: {
-        formatter: function(val) {
-          return formatCurrency(val / 100 * (account?.totalAssets || 0))
-        }
-      }
-    },
-  };
 
   return (
     <SimpleGrid columns={{ base: 1, lg: 2 }} spacing={6}>
@@ -330,12 +268,11 @@ export default function AccountOverview({ account, tradingEvents }) {
           </HStack>
         </CardHeader>
         <CardBody>
-          <Box h="280px">
-            <DonutChart
-              chartData={assetAllocationData}
-              chartOptions={assetAllocationOptions}
-            />
-          </Box>
+          <AssetAllocationChart
+            cashAmount={account?.availableCash || 0}
+            stockAmount={account?.marketValue || 0}
+            height={280}
+          />
           
           {/* 详细配置信息 */}
           <VStack spacing={3} mt={4}>