From 0aa983085eeb1455e1bd0f07f33ea906cefcc7e2 Mon Sep 17 00:00:00 2001 From: Caihaohan Date: Tue, 27 Jan 2026 20:31:57 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=20TypeScript=20?= =?UTF-8?q?=E7=B1=BB=E5=9E=8B=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- scripts/test-keyword-api.ts | 15 +++++--- .../keyword-cloud/components/CloudWord.tsx | 2 +- .../keyword-cloud/components/KeywordCloud.tsx | 37 ++++--------------- .../components/QuarterNavigator.tsx | 18 ++++++++- src/hooks/useKeywordCloudClient.ts | 15 +------- 5 files changed, 36 insertions(+), 51 deletions(-) diff --git a/scripts/test-keyword-api.ts b/scripts/test-keyword-api.ts index 431fbe8..4fc935a 100644 --- a/scripts/test-keyword-api.ts +++ b/scripts/test-keyword-api.ts @@ -23,7 +23,8 @@ async function testAPI() { if (data.quarters?.length > 0) { console.log(` 第一个季度: ${data.quarters[0].quarter} (${data.quarters[0].keywordCount} 个关键词)`); } - } catch (error) { + } catch (err) { + const error = err as Error; console.log('❌ 失败:', error.message); } console.log(); @@ -38,7 +39,8 @@ async function testAPI() { if (data.keywords?.length > 0) { console.log(` 最热词汇: ${data.keywords[0].word} (${data.keywords[0].trendScore}分)`); } - } catch (error) { + } catch (err) { + const error = err as Error; console.log('❌ 失败:', error.message); } console.log(); @@ -53,7 +55,8 @@ async function testAPI() { if (data.rules?.length > 0) { console.log(` 规则示例: ${data.rules[0].name} (${data.rules[0].minScore}-${data.rules[0].maxScore}分)`); } - } catch (error) { + } catch (err) { + const error = err as Error; console.log('❌ 失败:', error.message); } console.log(); @@ -114,7 +117,8 @@ async function testAPI() { } else { console.log('❌ 失败:', data.error); } - } catch (error) { + } catch (err) { + const error = err as Error; console.log('❌ 失败:', error.message); } console.log(); @@ -129,7 +133,8 @@ async function testAPI() { if (data.keywords?.length > 0) { console.log(` 关键词: ${data.keywords.map((k: any) => k.word).join(', ')}`); } - } catch (error) { + } catch (err) { + const error = err as Error; console.log('❌ 失败:', error.message); } console.log(); diff --git a/src/app/[locale]/keyword-cloud/components/CloudWord.tsx b/src/app/[locale]/keyword-cloud/components/CloudWord.tsx index 8d58f81..57a1bdd 100644 --- a/src/app/[locale]/keyword-cloud/components/CloudWord.tsx +++ b/src/app/[locale]/keyword-cloud/components/CloudWord.tsx @@ -10,7 +10,7 @@ interface VisualConfig { rotation?: string; } -interface KeywordData { +export interface KeywordData { id: number; word: string; trendScore: number; diff --git a/src/app/[locale]/keyword-cloud/components/KeywordCloud.tsx b/src/app/[locale]/keyword-cloud/components/KeywordCloud.tsx index 6ccf4ef..6907580 100644 --- a/src/app/[locale]/keyword-cloud/components/KeywordCloud.tsx +++ b/src/app/[locale]/keyword-cloud/components/KeywordCloud.tsx @@ -1,34 +1,11 @@ 'use client'; import React, { useState, useEffect } from 'react'; -import { CloudWord } from './CloudWord'; +import { CloudWord, type KeywordData } from './CloudWord'; import { QuarterNavigator } from './QuarterNavigator'; import { ProgressIndicator } from './ProgressIndicator'; import { useKeywordCloud } from '@/hooks/useKeywordCloudClient'; -interface KeywordData { - id: number; - word: string; - trendScore: number; - description: string; - detailPoints: string[]; - visualConfig: { - color: string; - size: string; - border: string; - rotation?: string; - }; -} - -interface QuarterData { - quarter: string; - title: string; - titleEn?: string; - subtitle?: string; - subtitleEn?: string; - keywords: KeywordData[]; -} - export function KeywordCloud({ initialQuarter }: { initialQuarter: string }) { const [currentQuarter, setCurrentQuarter] = useState(initialQuarter); const [quarters, setQuarters] = useState([]); @@ -44,8 +21,8 @@ export function KeywordCloud({ initialQuarter }: { initialQuarter: string }) { const quarterStrings = json.quarters.map((q: any) => q.quarter); setQuarters(quarterStrings); } - } catch (error) { - console.error('Failed to load quarters:', error); + } catch (err) { + console.error('Failed to load quarters:', err); } } loadQuarters(); @@ -88,6 +65,8 @@ export function KeywordCloud({ initialQuarter }: { initialQuarter: string }) { ); } + const firstKeyword = data.keywords[0]; + return (
{/* 进度条 */} @@ -107,16 +86,16 @@ export function KeywordCloud({ initialQuarter }: { initialQuarter: string }) { {/* 词云区域 */}
- {data.keywords.map((keyword: KeywordData) => ( + {data.keywords.map((keyword) => ( ))}
{/* 装饰元素 */} - {data.keywords.length > 0 && ( + {data.keywords.length > 0 && firstKeyword && (
- "{data.keywords[0].word}" 是本季度最热门词汇! + "{firstKeyword.word}" 是本季度最热门词汇!
)} diff --git a/src/app/[locale]/keyword-cloud/components/QuarterNavigator.tsx b/src/app/[locale]/keyword-cloud/components/QuarterNavigator.tsx index b189d38..56d5f82 100644 --- a/src/app/[locale]/keyword-cloud/components/QuarterNavigator.tsx +++ b/src/app/[locale]/keyword-cloud/components/QuarterNavigator.tsx @@ -15,6 +15,20 @@ export function QuarterNavigator({ current, quarters, onNavigate }: QuarterNavig const canGoPrev = currentIndex > 0; const canGoNext = currentIndex < quarters.length - 1; + const handlePrev = () => { + if (canGoPrev) { + const prevQuarter = quarters[currentIndex - 1]; + if (prevQuarter) onNavigate(prevQuarter); + } + }; + + const handleNext = () => { + if (canGoNext) { + const nextQuarter = quarters[currentIndex + 1]; + if (nextQuarter) onNavigate(nextQuarter); + } + }; + return (
{/* 上一个季度按钮 */} @@ -32,7 +46,7 @@ export function QuarterNavigator({ current, quarters, onNavigate }: QuarterNavig 'transition-all', !canGoPrev && 'opacity-50 cursor-not-allowed' )} - onClick={() => canGoPrev && onNavigate(quarters[currentIndex - 1])} + onClick={handlePrev} aria-label="Previous quarter" > @@ -60,7 +74,7 @@ export function QuarterNavigator({ current, quarters, onNavigate }: QuarterNavig 'transition-all', !canGoNext && 'opacity-50 cursor-not-allowed' )} - onClick={() => canGoNext && onNavigate(quarters[currentIndex + 1])} + onClick={handleNext} aria-label="Next quarter" > diff --git a/src/hooks/useKeywordCloudClient.ts b/src/hooks/useKeywordCloudClient.ts index 8fce05d..d9b53de 100644 --- a/src/hooks/useKeywordCloudClient.ts +++ b/src/hooks/useKeywordCloudClient.ts @@ -1,20 +1,7 @@ 'use client'; import { useState, useEffect } from 'react'; - -interface KeywordData { - id: number; - word: string; - trendScore: number; - description: string; - detailPoints: string[]; - visualConfig: { - color: string; - size: string; - border: string; - rotation?: string; - }; -} +import type { KeywordData } from '@/app/[locale]/keyword-cloud/components/CloudWord'; interface QuarterData { quarter: string;