utm

app/page.tsx

@@ -6,6 +6,7 @@ import { DateRangePicker } from '@/app/components/ui/DateRangePicker';
 import TimeSeriesChart from '@/app/components/charts/TimeSeriesChart';
 import GeoAnalytics from '@/app/components/analytics/GeoAnalytics';
 import DevicePieCharts from '@/app/components/charts/DevicePieCharts';
+import UtmAnalytics from '@/app/components/analytics/UtmAnalytics';
 import { EventsSummary, TimeSeriesData, GeoData, DeviceAnalytics as DeviceAnalyticsType } from '@/app/api/types';
 import { TeamSelector } from '@/app/components/ui/TeamSelector';
 import { ProjectSelector } from '@/app/components/ui/ProjectSelector';
@@ -762,41 +763,14 @@ export default function HomePage() {
 
         <div className="bg-white rounded-lg shadow p-6 mb-8">
           <h2 className="text-lg font-semibold text-gray-900 mb-4">Geographic Distribution</h2>
-          <GeoAnalytics 
-            data={geoData} 
-            onViewModeChange={(mode) => {
-              // 构建查询参数
-              const params = new URLSearchParams({
-                startTime: format(dateRange.from, "yyyy-MM-dd'T'HH:mm:ss'Z'"),
-                endTime: format(dateRange.to, "yyyy-MM-dd'T'HH:mm:ss'Z'"),
-                groupBy: mode
-              });
-              
-              // 添加其他筛选参数
-              if (selectedTeamIds.length > 0) {
-                selectedTeamIds.forEach(id => params.append('teamId', id));
-              }
-              
-              if (selectedProjectIds.length > 0) {
-                selectedProjectIds.forEach(id => params.append('projectId', id));
-              }
-              
-              if (selectedTagIds.length > 0) {
-                selectedTagIds.forEach(id => params.append('tagId', id));
-              }
-              
-              // 刷新地理位置数据
-              fetch(`/api/events/geo?${params}`)
-                .then(res => res.json())
-                .then(data => {
-                  if (data.success) {
-                    setGeoData(data.data);
-                  }
-                })
-                .catch(error => console.error('Failed to fetch geo data:', error));
-            }}
-          />
+          <GeoAnalytics data={geoData} />
         </div>
+
+        {/* 添加UTM分析组件 */}
+        <UtmAnalytics 
+          startTime={format(dateRange.from, "yyyy-MM-dd'T'HH:mm:ss'Z'")}
+          endTime={format(dateRange.to, "yyyy-MM-dd'T'HH:mm:ss'Z'")}
+        />
       </>
     </div>
   );