feat: 概念中心的事件追踪

src/views/Concept/components/ConceptStatsPanel.js

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { logger } from '../../../utils/logger';
+import { useConceptStatsEvents } from '../hooks/useConceptStatsEvents';
 import {
     Box,
     SimpleGrid,
@@ -54,6 +55,15 @@ const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
         ? '/concept-api'
         : 'http://111.198.58.126:16801';
 
+    // 🎯 PostHog 事件追踪
+    const {
+        trackTabChanged,
+        trackTimeRangeChanged,
+        trackCustomDateRangeSet,
+        trackRankItemClicked,
+        trackDataRefreshed,
+    } = useConceptStatsEvents();
+
     const [statsData, setStatsData] = useState({});
     const [loading, setLoading] = useState(true);
     const [activeTab, setActiveTab] = useState(0);
@@ -180,10 +190,18 @@ const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
 
             setCustomEndDate(today.toISOString().split('T')[0]);
             setCustomStartDate(weekAgo.toISOString().split('T')[0]);
+
+            // 🎯 追踪切换到自定义范围
+            trackTimeRangeChanged(0, true);
         } else {
             setUseCustomRange(false);
-            setTimeRange(parseInt(newRange));
-            fetchStatsData(parseInt(newRange));
+            const days = parseInt(newRange);
+            setTimeRange(days);
+
+            // 🎯 追踪时间范围变化
+            trackTimeRangeChanged(days, false);
+
+            fetchStatsData(days);
         }
     };
 
@@ -199,6 +217,10 @@ const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
                 });
                 return;
             }
+
+            // 🎯 追踪自定义日期范围设置
+            trackCustomDateRangeSet(customStartDate, customEndDate);
+
             fetchStatsData(null, customStartDate, customEndDate);
         }
     };
@@ -848,7 +870,17 @@ const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
 
             {/* 主内容卡片 */}
             <Box bg={bg} borderRadius="xl" border="1px" borderColor={borderColor} shadow="sm" overflow="hidden">
-                <Tabs index={activeTab} onChange={setActiveTab} variant="unstyled" size="sm">
+                <Tabs
+                    index={activeTab}
+                    onChange={(index) => {
+                        const tabNames = ['涨幅榜', '跌幅榜', '活跃榜', '波动榜', '连涨榜'];
+                        // 🎯 追踪Tab切换
+                        trackTabChanged(index, tabNames[index]);
+                        setActiveTab(index);
+                    }}
+                    variant="unstyled"
+                    size="sm"
+                >
                     <TabList
                         bg="gray.50"
                         borderBottom="1px"