From 3f3e13bdddceea600742940c4f7caf6ca704c5ef Mon Sep 17 00:00:00 2001
From: zdl <3489966805@qq.com>
Date: Tue, 16 Dec 2025 15:20:06 +0800
Subject: [PATCH] =?UTF-8?q?feat(KLineModule):=20=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E6=97=A5K=E6=97=B6=E9=97=B4=E8=8C=83=E5=9B=B4=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E5=99=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../panels/TradeDataPanel/KLineModule.tsx     | 37 ++++++++++++++++++-
 .../panels/TradeDataPanel/index.tsx           |  6 +++
 .../components/MarketDataView/types.ts        |  4 ++
 3 files changed, 45 insertions(+), 2 deletions(-)

diff --git a/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/KLineModule.tsx b/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/KLineModule.tsx
index b899048b..38582a10 100644
--- a/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/KLineModule.tsx
+++ b/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/KLineModule.tsx
@@ -13,12 +13,13 @@ import {
   Center,
   Spinner,
   Icon,
+  Select,
 } from '@chakra-ui/react';
 import { RepeatIcon, InfoIcon } from '@chakra-ui/icons';
-import { BarChart2, Clock, TrendingUp } from 'lucide-react';
+import { BarChart2, Clock, TrendingUp, Calendar } from 'lucide-react';
 import ReactECharts from 'echarts-for-react';
 
-import { darkGoldTheme } from '../../../constants';
+import { darkGoldTheme, PERIOD_OPTIONS } from '../../../constants';
 import { getKLineOption, getMinuteKLineOption } from '../../../utils/chartOptions';
 import type { KLineModuleProps } from '../../../types';
 
@@ -48,6 +49,8 @@ const KLineModule: React.FC<KLineModuleProps> = ({
   analysisMap,
   onLoadMinuteData,
   onChartClick,
+  selectedPeriod,
+  onPeriodChange,
 }) => {
   const [mode, setMode] = useState<ChartMode>('daily');
   const hasMinuteData = minuteData && minuteData.data && minuteData.data.length > 0;
@@ -128,6 +131,36 @@ const KLineModule: React.FC<KLineModuleProps> = ({
           </HStack>
 
           <HStack spacing={3}>
+            {/* 日K模式下显示时间范围选择器 */}
+            {mode === 'daily' && onPeriodChange && (
+              <HStack spacing={2}>
+                <Icon as={Calendar} boxSize={4} color={darkGoldTheme.textMuted} />
+                <Select
+                  size="sm"
+                  value={selectedPeriod}
+                  onChange={(e) => onPeriodChange(Number(e.target.value))}
+                  bg="transparent"
+                  borderColor={darkGoldTheme.border}
+                  color={darkGoldTheme.textPrimary}
+                  maxW="100px"
+                  _hover={{ borderColor: darkGoldTheme.gold }}
+                  _focus={{ borderColor: darkGoldTheme.gold, boxShadow: 'none' }}
+                  sx={{
+                    option: {
+                      background: '#1a1a2e',
+                      color: darkGoldTheme.textPrimary,
+                    },
+                  }}
+                >
+                  {PERIOD_OPTIONS.map((option) => (
+                    <option key={option.value} value={option.value}>
+                      {option.label}
+                    </option>
+                  ))}
+                </Select>
+              </HStack>
+            )}
+
             {/* 分钟模式下的刷新按钮 */}
             {mode === 'minute' && (
               <Button
diff --git a/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/index.tsx b/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/index.tsx
index 0e088f68..745e0a25 100644
--- a/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/index.tsx
+++ b/src/views/Company/components/MarketDataView/components/panels/TradeDataPanel/index.tsx
@@ -14,6 +14,8 @@ export interface TradeDataPanelProps {
   analysisMap: Record<number, RiseAnalysis>;
   onLoadMinuteData: () => void;
   onChartClick: (params: { seriesName?: string; data?: [number, number] }) => void;
+  selectedPeriod?: number;
+  onPeriodChange?: (period: number) => void;
 }
 
 const TradeDataPanel: React.FC<TradeDataPanelProps> = ({
@@ -24,6 +26,8 @@ const TradeDataPanel: React.FC<TradeDataPanelProps> = ({
   analysisMap,
   onLoadMinuteData,
   onChartClick,
+  selectedPeriod,
+  onPeriodChange,
 }) => {
   return (
     <KLineModule
@@ -34,6 +38,8 @@ const TradeDataPanel: React.FC<TradeDataPanelProps> = ({
       analysisMap={analysisMap}
       onLoadMinuteData={onLoadMinuteData}
       onChartClick={onChartClick}
+      selectedPeriod={selectedPeriod}
+      onPeriodChange={onPeriodChange}
     />
   );
 };
diff --git a/src/views/Company/components/MarketDataView/types.ts b/src/views/Company/components/MarketDataView/types.ts
index acc90026..9087c156 100644
--- a/src/views/Company/components/MarketDataView/types.ts
+++ b/src/views/Company/components/MarketDataView/types.ts
@@ -297,6 +297,8 @@ export interface KLineModuleProps {
   analysisMap: Record<number, RiseAnalysis>;
   onLoadMinuteData: () => void;
   onChartClick: (params: { seriesName?: string; data?: [number, number] }) => void;
+  selectedPeriod?: number;
+  onPeriodChange?: (period: number) => void;
 }
 
 /**
@@ -354,6 +356,7 @@ export interface AnalysisModalContentProps {
  */
 export interface UseMarketDataReturn {
   loading: boolean;
+  tradeLoading: boolean;
   summary: MarketSummary | null;
   tradeData: TradeDayData[];
   fundingData: FundingDayData[];
@@ -365,4 +368,5 @@ export interface UseMarketDataReturn {
   analysisMap: Record<number, RiseAnalysis>;
   refetch: () => Promise<void>;
   loadMinuteData: () => Promise<void>;
+  refreshTradeData: () => Promise<void>;
 }