vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 修复debugger报错

Browse Source
This commit is contained in:
zdl
2025-11-25 15:27:54 +08:00
parent 12824d5d0f
commit 5a82e14ebf
9 changed files with 53 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/StockChart/KLineChartModal.tsx
View File

@@ -72,7 +72,7 @@ const KLineChartModal: React.FC<KLineChartModalProps> = ({
setError(null);
try {
logger.debug('KLineChartModal', 'loadData', '开始加载K线数据', {
logger.debug('KLineChartModal', '开始加载K线数据 (loadData)', {
stockCode: stock.stock_code,
eventTime,
});
@@ -91,7 +91,7 @@ const KLineChartModal: React.FC<KLineChartModalProps> = ({
console.log('[KLineChartModal] 数据条数:', response.data.length);
setData(response.data);
logger.info('KLineChartModal', 'loadData', 'K线数据加载成功', {
logger.info('KLineChartModal', 'K线数据加载成功 (loadData)', {
dataCount: response.data.length,
});
} catch (err) {

4
src/components/StockChart/StockChartKLineModal.tsx
View File

@@ -111,7 +111,7 @@ const StockChartKLineModal: React.FC<StockChartKLineModalProps> = ({
const newType = e.target.value as ChartType;
setChartType(newType);
logger.debug('StockChartKLineModal', 'handleChartTypeChange', '切换图表类型', {
logger.debug('StockChartKLineModal', '切换图表类型 (handleChartTypeChange)', {
newType,
});
}, []);
@@ -131,7 +131,7 @@ const StockChartKLineModal: React.FC<StockChartKLineModalProps> = ({
// 然后创建新的指标
createSubIndicators(chart, values);
logger.debug('StockChartKLineModal', 'handleIndicatorChange', '切换副图指标', {
logger.debug('StockChartKLineModal', '切换副图指标 (handleIndicatorChange)', {
indicators: values,
});
},

4
src/components/StockChart/TimelineChartModal.tsx
View File

@@ -76,7 +76,7 @@ const TimelineChartModal: React.FC<TimelineChartModalProps> = ({
setError(null);
try {
logger.debug('TimelineChartModal', 'loadData', '开始加载分时图数据', {
logger.debug('TimelineChartModal', '开始加载分时图数据 (loadData)', {
stockCode: stock.stock_code,
eventTime,
});
@@ -95,7 +95,7 @@ const TimelineChartModal: React.FC<TimelineChartModalProps> = ({
console.log('[TimelineChartModal] 数据条数:', response.data.length);
setData(response.data);
logger.info('TimelineChartModal', 'loadData', '分时图数据加载成功', {
logger.info('TimelineChartModal', '分时图数据加载成功 (loadData)', {
dataCount: response.data.length,
});
} catch (err) {

14
src/components/StockChart/hooks/useEventMarker.ts
View File

@@ -77,7 +77,7 @@ export const useEventMarker = (
const createMarker = useCallback(
(time: string, label: string, color?: string) => {
if (!chart || !data || data.length === 0) {
logger.warn('useEventMarker', 'createMarker', '图表或数据未准备好', {
logger.warn('useEventMarker', '图表或数据未准备好 (createMarker)', {
hasChart: !!chart,
dataLength: data?.length || 0,
});
@@ -93,7 +93,7 @@ export const useEventMarker = (
const overlay = createEventMarkerOverlay(eventMarker, data);
if (!overlay) {
logger.warn('useEventMarker', 'createMarker', 'Overlay 创建失败', {
logger.warn('useEventMarker', 'Overlay 创建失败 (createMarker)', {
eventMarker,
});
return;
@@ -103,7 +103,7 @@ export const useEventMarker = (
const id = chart.createOverlay(overlay);
if (!id || (Array.isArray(id) && id.length === 0)) {
logger.warn('useEventMarker', 'createMarker', '标记添加失败', {
logger.warn('useEventMarker', '标记添加失败 (createMarker)', {
overlay,
});
return;
@@ -119,12 +119,12 @@ export const useEventMarker = (
const actualHighlightId = Array.isArray(highlightResult) ? highlightResult[0] : highlightResult;
setHighlightId(actualHighlightId as string);
logger.info('useEventMarker', 'createMarker', '事件高亮背景创建成功', {
logger.info('useEventMarker', '事件高亮背景创建成功 (createMarker)', {
highlightId: actualHighlightId,
});
}
logger.info('useEventMarker', 'createMarker', '事件标记创建成功', {
logger.info('useEventMarker', '事件标记创建成功 (createMarker)', {
markerId: actualId,
label,
time,
@@ -160,7 +160,7 @@ export const useEventMarker = (
setMarkerId(null);
setHighlightId(null);
logger.debug('useEventMarker', 'removeMarker', '移除事件标记和高亮', {
logger.debug('useEventMarker', '移除事件标记和高亮 (removeMarker)', {
markerId,
highlightId,
chartId: chart.id,
@@ -187,7 +187,7 @@ export const useEventMarker = (
setMarkerId(null);
setHighlightId(null);
logger.debug('useEventMarker', 'removeAllMarkers', '移除所有事件标记和高亮', {
logger.debug('useEventMarker', '移除所有事件标记和高亮 (removeAllMarkers)', {
chartId: chart.id,
});
} catch (err) {

18
src/components/StockChart/hooks/useKLineChart.ts
View File

@@ -78,12 +78,12 @@ export const useKLineChart = (
// 图表初始化函数
const initChart = (): boolean => {
if (!chartRef.current) {
logger.warn('useKLineChart', 'init', '图表容器未挂载，将在 50ms 后重试', { containerId });
logger.warn('useKLineChart', '图表容器未挂载，将在 50ms 后重试 (init)', { containerId });
return false;
}
try {
logger.debug('useKLineChart', 'init', '开始初始化图表', {
logger.debug('useKLineChart', '开始初始化图表 (init)', {
containerId,
height,
colorMode,
@@ -116,17 +116,17 @@ export const useKLineChart = (
height: 100, // 固定高度 100px（约占整体的 20-25%）
});
logger.debug('useKLineChart', 'init', '成交量窗格创建成功', {
logger.debug('useKLineChart', '成交量窗格创建成功 (init)', {
volumePaneId,
});
} catch (err) {
logger.warn('useKLineChart', 'init', '成交量窗格创建失败', {
logger.warn('useKLineChart', '成交量窗格创建失败 (init)', {
error: err,
});
// 不阻塞主流程，继续执行
}
logger.info('useKLineChart', 'init', '✅ 图表初始化成功', {
logger.info('useKLineChart', '✅ 图表初始化成功 (init)', {
containerId,
chartId: chartInstance.id,
});
@@ -146,7 +146,7 @@ export const useKLineChart = (
// 成功，直接返回清理函数
return () => {
if (chartInstanceRef.current) {
logger.debug('useKLineChart', 'dispose', '销毁图表实例', {
logger.debug('useKLineChart', '销毁图表实例 (dispose)', {
containerId,
chartId: chartInstanceRef.current.id,
});
@@ -161,7 +161,7 @@ export const useKLineChart = (
// 失败则延迟重试（处理 Modal 动画延迟导致的 DOM 未挂载）
const timer = setTimeout(() => {
logger.debug('useKLineChart', 'init', '执行延迟重试', { containerId });
logger.debug('useKLineChart', '执行延迟重试 (init)', { containerId });
initChart();
}, 50);
@@ -169,7 +169,7 @@ export const useKLineChart = (
return () => {
clearTimeout(timer);
if (chartInstanceRef.current) {
logger.debug('useKLineChart', 'dispose', '销毁图表实例', {
logger.debug('useKLineChart', '销毁图表实例 (dispose)', {
containerId,
chartId: chartInstanceRef.current.id,
});
@@ -196,7 +196,7 @@ export const useKLineChart = (
: getTheme(colorMode);
chartInstanceRef.current.setStyles(newTheme);
logger.debug('useKLineChart', 'updateTheme', '更新图表主题', {
logger.debug('useKLineChart', '更新图表主题 (updateTheme)', {
colorMode,
chartType,
chartId: chartInstanceRef.current.id,

6
src/components/StockChart/hooks/useKLineData.ts
View File

@@ -78,7 +78,7 @@ export const useKLineData = (
*/
const loadData = useCallback(async () => {
if (!stockCode) {
logger.warn('useKLineData', 'loadData', '股票代码为空', { chartType });
logger.warn('useKLineData', '股票代码为空 (loadData)', { chartType });
return;
}
@@ -86,7 +86,7 @@ export const useKLineData = (
setError(null);
try {
logger.debug('useKLineData', 'loadData', '开始加载数据', {
logger.debug('useKLineData', '开始加载数据 (loadData)', {
stockCode,
chartType,
eventTime,
@@ -126,7 +126,7 @@ export const useKLineData = (
setData(processedData);
logger.info('useKLineData', 'loadData', '数据加载成功', {
logger.info('useKLineData', '数据加载成功 (loadData)', {
stockCode,
chartType,
rawCount: rawDataList.length,

24
src/components/StockChart/utils/chartUtils.ts
View File

@@ -50,7 +50,7 @@ export const createIndicator = (
isStack
);
logger.debug('chartUtils', 'createIndicator', '创建技术指标', {
logger.debug('chartUtils', '创建技术指标 (createIndicator)', {
indicatorName,
params,
isStack,
@@ -70,7 +70,7 @@ export const createIndicator = (
export const removeIndicator = (chart: Chart, indicatorId?: string): void => {
safeChartOperation('removeIndicator', () => {
chart.removeIndicator(indicatorId);
logger.debug('chartUtils', 'removeIndicator', '移除技术指标', { indicatorId });
logger.debug('chartUtils', '移除技术指标 (removeIndicator)', { indicatorId });
});
};
@@ -94,7 +94,7 @@ export const createSubIndicators = (
}
});
logger.debug('chartUtils', 'createSubIndicators', '批量创建副图指标', {
logger.debug('chartUtils', '批量创建副图指标 (createSubIndicators)', {
indicators,
createdIds: ids,
});
@@ -130,7 +130,7 @@ export const setChartZoom = (chart: Chart, zoom: number): void => {
},
});
logger.debug('chartUtils', 'setChartZoom', '设置图表缩放', {
logger.debug('chartUtils', '设置图表缩放 (setChartZoom)', {
zoom,
newBarSpace,
});
@@ -148,7 +148,7 @@ export const scrollToTimestamp = (chart: Chart, timestamp: number): void => {
// KLineChart 10.0: 使用 scrollToTimestamp 方法
chart.scrollToTimestamp(timestamp);
logger.debug('chartUtils', 'scrollToTimestamp', '滚动到指定时间', { timestamp });
logger.debug('chartUtils', '滚动到指定时间 (scrollToTimestamp)', { timestamp });
});
};
@@ -160,7 +160,7 @@ export const scrollToTimestamp = (chart: Chart, timestamp: number): void => {
export const resizeChart = (chart: Chart): void => {
safeChartOperation('resizeChart', () => {
chart.resize();
logger.debug('chartUtils', 'resizeChart', '调整图表大小');
logger.debug('chartUtils', '调整图表大小 (resizeChart)');
});
};
@@ -194,7 +194,7 @@ export const getVisibleRange = (chart: Chart): { from: number; to: number } | nu
export const clearChartData = (chart: Chart): void => {
safeChartOperation('clearChartData', () => {
chart.resetData();
logger.debug('chartUtils', 'clearChartData', '清空图表数据');
logger.debug('chartUtils', '清空图表数据 (clearChartData)');
});
};
@@ -213,7 +213,7 @@ export const exportChartImage = (
// KLineChart 10.0: 使用 getConvertPictureUrl 方法
const imageData = chart.getConvertPictureUrl(includeOverlay, 'png', '#ffffff');
logger.debug('chartUtils', 'exportChartImage', '导出图表图片', {
logger.debug('chartUtils', '导出图表图片 (exportChartImage)', {
includeOverlay,
hasData: !!imageData,
});
@@ -236,7 +236,7 @@ export const toggleCrosshair = (chart: Chart, show: boolean): void => {
},
});
logger.debug('chartUtils', 'toggleCrosshair', '切换十字光标', { show });
logger.debug('chartUtils', '切换十字光标 (toggleCrosshair)', { show });
});
};
@@ -254,7 +254,7 @@ export const toggleGrid = (chart: Chart, show: boolean): void => {
},
});
logger.debug('chartUtils', 'toggleGrid', '切换网格', { show });
logger.debug('chartUtils', '切换网格 (toggleGrid)', { show });
});
};
@@ -272,7 +272,7 @@ export const subscribeChartEvent = (
): void => {
safeChartOperation(`subscribeChartEvent:${eventName}`, () => {
chart.subscribeAction(eventName, handler);
logger.debug('chartUtils', 'subscribeChartEvent', '订阅图表事件', { eventName });
logger.debug('chartUtils', '订阅图表事件 (subscribeChartEvent)', { eventName });
});
};
@@ -290,6 +290,6 @@ export const unsubscribeChartEvent = (
): void => {
safeChartOperation(`unsubscribeChartEvent:${eventName}`, () => {
chart.unsubscribeAction(eventName, handler);
logger.debug('chartUtils', 'unsubscribeChartEvent', '取消订阅图表事件', { eventName });
logger.debug('chartUtils', '取消订阅图表事件 (unsubscribeChartEvent)', { eventName });
});
};

14
src/components/StockChart/utils/dataAdapter.ts
View File

@@ -22,7 +22,7 @@ export const convertToKLineData = (
eventTime?: string
): KLineDataPoint[] => {
if (!rawData || !Array.isArray(rawData) || rawData.length === 0) {
logger.warn('dataAdapter', 'convertToKLineData', '原始数据为空', { chartType });
logger.warn('dataAdapter', '原始数据为空 (convertToKLineData)', { chartType });
return [];
}
@@ -90,7 +90,7 @@ const parseTimestamp = (
}
// 默认返回当前时间（避免图表崩溃）
logger.warn('dataAdapter', 'parseTimestamp', '无法解析时间戳，使用当前时间', { item });
logger.warn('dataAdapter', '无法解析时间戳，使用当前时间 (parseTimestamp)', { item });
return Date.now();
};
@@ -126,19 +126,19 @@ export const validateAndCleanData = (data: KLineDataPoint[]): KLineDataPoint[] =
return data.filter((item) => {
// 移除价格为 0 或负数的数据
if (item.open <= 0 || item.high <= 0 || item.low <= 0 || item.close <= 0) {
logger.warn('dataAdapter', 'validateAndCleanData', '价格异常，已移除', { item });
logger.warn('dataAdapter', '价格异常，已移除 (validateAndCleanData)', { item });
return false;
}
// 移除 high < low 的数据（数据错误）
if (item.high < item.low) {
logger.warn('dataAdapter', 'validateAndCleanData', '最高价 < 最低价，已移除', { item });
logger.warn('dataAdapter', '最高价 < 最低价，已移除 (validateAndCleanData)', { item });
return false;
}
// 移除成交量为负数的数据
if (item.volume < 0) {
logger.warn('dataAdapter', 'validateAndCleanData', '成交量异常，已移除', { item });
logger.warn('dataAdapter', '成交量异常，已移除 (validateAndCleanData)', { item });
return false;
}
@@ -213,7 +213,7 @@ export const trimDataByEventTime = (
return item.timestamp >= startTime && item.timestamp <= endTime;
});
logger.debug('dataAdapter', 'trimDataByEventTime', '数据时间范围裁剪完成', {
logger.debug('dataAdapter', '数据时间范围裁剪完成 (trimDataByEventTime)', {
originalLength: data.length,
trimmedLength: trimmedData.length,
eventTime,
@@ -260,7 +260,7 @@ export const processChartData = (
data = trimDataByEventTime(data, eventTime, chartType);
}
logger.debug('dataAdapter', 'processChartData', '数据处理完成', {
logger.debug('dataAdapter', '数据处理完成 (processChartData)', {
rawLength: rawData.length,
processedLength: data.length,
chartType,

18
src/components/StockChart/utils/eventMarkerUtils.ts
View File

@@ -27,7 +27,7 @@ export const createEventMarkerOverlay = (
const closestPoint = findClosestDataPoint(data, marker.timestamp);
if (!closestPoint) {
logger.warn('eventMarkerUtils', 'createEventMarkerOverlay', '未找到匹配的数据点', {
logger.warn('eventMarkerUtils', '未找到匹配的数据点', {
markerId: marker.id,
timestamp: marker.timestamp,
});
@@ -77,7 +77,7 @@ export const createEventMarkerOverlay = (
},
};
logger.debug('eventMarkerUtils', 'createEventMarkerOverlay', '创建事件标记', {
logger.debug('eventMarkerUtils', '创建事件标记', {
markerId: marker.id,
timestamp: closestPoint.timestamp,
label: marker.label,
@@ -108,7 +108,7 @@ export const createEventHighlightOverlay = (
const closestPoint = findClosestDataPoint(data, eventTimestamp);
if (!closestPoint) {
logger.warn('eventMarkerUtils', 'createEventHighlightOverlay', '未找到匹配的数据点');
logger.warn('eventMarkerUtils', '未找到匹配的数据点');
return null;
}
@@ -135,7 +135,7 @@ export const createEventHighlightOverlay = (
},
};
logger.debug('eventMarkerUtils', 'createEventHighlightOverlay', '创建事件高亮覆盖层', {
logger.debug('eventMarkerUtils', '创建事件高亮覆盖层', {
timestamp: closestPoint.timestamp,
eventTime,
});
@@ -219,7 +219,7 @@ export const createEventMarkerOverlays = (
}
});
logger.debug('eventMarkerUtils', 'createEventMarkerOverlays', '批量创建事件标记', {
logger.debug('eventMarkerUtils', '批量创建事件标记', {
totalMarkers: markers.length,
createdOverlays: overlays.length,
});
@@ -236,7 +236,7 @@ export const createEventMarkerOverlays = (
export const removeEventMarker = (chart: any, markerId: string): void => {
try {
chart.removeOverlay(markerId);
logger.debug('eventMarkerUtils', 'removeEventMarker', '移除事件标记', { markerId });
logger.debug('eventMarkerUtils', '移除事件标记', { markerId });
} catch (error) {
logger.error('eventMarkerUtils', 'removeEventMarker', error as Error, { markerId });
}
@@ -251,7 +251,7 @@ export const removeAllEventMarkers = (chart: any): void => {
try {
// KLineChart 10.0 API: removeOverlay() 不传参数时移除所有 overlays
chart.removeOverlay();
logger.debug('eventMarkerUtils', 'removeAllEventMarkers', '移除所有事件标记');
logger.debug('eventMarkerUtils', '移除所有事件标记');
} catch (error) {
logger.error('eventMarkerUtils', 'removeAllEventMarkers', error as Error);
}
@@ -276,7 +276,7 @@ export const updateEventMarker = (
// 重新创建标记（KLineChart 10.0 不支持直接更新 overlay）
// 注意：需要在调用方重新创建并添加 overlay
logger.debug('eventMarkerUtils', 'updateEventMarker', '更新事件标记', {
logger.debug('eventMarkerUtils', '更新事件标记', {
markerId,
updates,
});
@@ -309,7 +309,7 @@ export const highlightEventMarker = (
},
});
logger.debug('eventMarkerUtils', 'highlightEventMarker', '高亮事件标记', {
logger.debug('eventMarkerUtils', '高亮事件标记', {
markerId,
highlight,
});