goddonebianu/learn-languages
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

重构

Browse Source
This commit is contained in:
goddonebianu
2026-01-13 23:02:07 +08:00
parent a1e42127e6
commit 804baa64b2
71 changed files with 658 additions and 925 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/app/(features)/dictionary/DictionaryEntry.tsx
View File

@@ -1,75 +1,42 @@
import { DictWordEntry, DictPhraseEntry } from "./types";
import { TSharedEntry } from "@/shared";
interface DictionaryEntryProps {
entry: DictWordEntry | DictPhraseEntry;
entry: TSharedEntry;
}
export function DictionaryEntry({ entry }: DictionaryEntryProps) {
// 检查是否有 ipa 字段来判断是否为单词条目
const isWordEntry = "ipa" in entry && "partOfSpeech" in entry;
if (isWordEntry) {
// 单词条目
const wordEntry = entry as DictWordEntry;
return (
<div>
{/* 音标和词性 */}
<div className="flex items-center gap-3 mb-3">
{wordEntry.ipa && (
<span className="text-gray-600 text-lg">
[{wordEntry.ipa}]
</span>
)}
{wordEntry.partOfSpeech && (
<span className="px-3 py-1 bg-[#35786f] text-white text-sm rounded-full">
{wordEntry.partOfSpeech}
</span>
)}
</div>
{/* 释义 */}
<div className="mb-3">
<h3 className="text-sm font-semibold text-gray-700 mb-1">
释义
</h3>
<p className="text-gray-800">{wordEntry.definition}</p>
</div>
{/* 例句 */}
{wordEntry.example && (
<div>
<h3 className="text-sm font-semibold text-gray-700 mb-1">
例句
</h3>
<p className="text-gray-700 pl-4 border-l-4 border-[#35786f]">
{wordEntry.example}
</p>
</div>
)}
</div>
);
}
// 短语条目
const phraseEntry = entry as DictPhraseEntry;
return (
<div>
{/* 音标和词性 */}
<div className="flex items-center gap-3 mb-3">
{entry.ipa && (
<span className="text-gray-600 text-lg">
[{entry.ipa}]
</span>
)}
{entry.partOfSpeech && (
<span className="px-3 py-1 bg-[#35786f] text-white text-sm rounded-full">
{entry.partOfSpeech}
</span>
)}
</div>
{/* 释义 */}
<div className="mb-3">
<h3 className="text-sm font-semibold text-gray-700 mb-1">
释义
</h3>
<p className="text-gray-800">{phraseEntry.definition}</p>
<p className="text-gray-800">{entry.definition}</p>
</div>
{/* 例句 */}
{phraseEntry.example && (
{entry.example && (
<div>
<h3 className="text-sm font-semibold text-gray-700 mb-1">
例句
</h3>
<p className="text-gray-700 pl-4 border-l-4 border-[#35786f]">
{phraseEntry.example}
{entry.example}
</p>
</div>
)}