feat: show episode titles

This commit is contained in:
shinya
2025-08-17 18:55:31 +08:00
parent e1c33c9e39
commit 863a5fd0b0
2 changed files with 38 additions and 43 deletions
+1 -1
View File
@@ -1835,7 +1835,7 @@ function PlayPageClient() {
{videoTitle || '影片标题'} {videoTitle || '影片标题'}
{totalEpisodes > 1 && ( {totalEpisodes > 1 && (
<span className='text-gray-500 dark:text-gray-400'> <span className='text-gray-500 dark:text-gray-400'>
{` > 第 ${currentEpisodeIndex + 1}`} {` > ${detail?.episodes_titles?.[currentEpisodeIndex] || `${currentEpisodeIndex + 1}`}`}
</span> </span>
)} )}
</h1> </h1>
+7 -12
View File
@@ -312,8 +312,7 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
<div <div
onClick={() => setActiveTab('episodes')} onClick={() => setActiveTab('episodes')}
className={`flex-1 py-3 px-6 text-center cursor-pointer transition-all duration-200 font-medium className={`flex-1 py-3 px-6 text-center cursor-pointer transition-all duration-200 font-medium
${ ${activeTab === 'episodes'
activeTab === 'episodes'
? 'text-green-600 dark:text-green-400' ? 'text-green-600 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3' : 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3'
} }
@@ -325,8 +324,7 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
<div <div
onClick={handleSourceTabClick} onClick={handleSourceTabClick}
className={`flex-1 py-3 px-6 text-center cursor-pointer transition-all duration-200 font-medium className={`flex-1 py-3 px-6 text-center cursor-pointer transition-all duration-200 font-medium
${ ${activeTab === 'sources'
activeTab === 'sources'
? 'text-green-600 dark:text-green-400' ? 'text-green-600 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3' : 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3'
} }
@@ -353,8 +351,7 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
}} }}
onClick={() => handleCategoryClick(idx)} onClick={() => handleCategoryClick(idx)}
className={`w-20 relative py-2 text-sm font-medium transition-colors whitespace-nowrap flex-shrink-0 text-center className={`w-20 relative py-2 text-sm font-medium transition-colors whitespace-nowrap flex-shrink-0 text-center
${ ${isActive
isActive
? 'text-green-500 dark:text-green-400' ? 'text-green-500 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 dark:text-gray-300 dark:hover:text-green-400' : 'text-gray-700 hover:text-green-600 dark:text-gray-300 dark:hover:text-green-400'
} }
@@ -408,8 +405,7 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
key={episodeNumber} key={episodeNumber}
onClick={() => handleEpisodeClick(episodeNumber - 1)} onClick={() => handleEpisodeClick(episodeNumber - 1)}
className={`h-10 min-w-10 px-3 py-2 flex items-center justify-center text-sm font-medium rounded-md transition-all duration-200 whitespace-nowrap font-mono className={`h-10 min-w-10 px-3 py-2 flex items-center justify-center text-sm font-medium rounded-md transition-all duration-200 whitespace-nowrap font-mono
${ ${isActive
isActive
? 'bg-green-500 text-white shadow-lg shadow-green-500/25 dark:bg-green-600' ? 'bg-green-500 text-white shadow-lg shadow-green-500/25 dark:bg-green-600'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300 hover:scale-105 dark:bg-white/10 dark:text-gray-300 dark:hover:bg-white/20' : 'bg-gray-200 text-gray-700 hover:bg-gray-300 hover:scale-105 dark:bg-white/10 dark:text-gray-300 dark:hover:bg-white/20'
}`.trim()} }`.trim()}
@@ -419,8 +415,8 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
if (!title) { if (!title) {
return episodeNumber; return episodeNumber;
} }
// 如果匹配"第X集"格式,提取中间的数字 // 如果匹配"第X集"、"第X话"、"X集"、"X话"格式,提取中间的数字
const match = title.match(/第(\d+)集/); const match = title.match(/(?:第)?(\d+)(?:集|话)/);
if (match) { if (match) {
return match[1]; return match[1];
} }
@@ -496,8 +492,7 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
!isCurrentSource && handleSourceClick(source) !isCurrentSource && handleSourceClick(source)
} }
className={`flex items-start gap-3 px-2 py-3 rounded-lg transition-all select-none duration-200 relative className={`flex items-start gap-3 px-2 py-3 rounded-lg transition-all select-none duration-200 relative
${ ${isCurrentSource
isCurrentSource
? 'bg-green-500/10 dark:bg-green-500/20 border-green-500/30 border' ? 'bg-green-500/10 dark:bg-green-500/20 border-green-500/30 border'
: 'hover:bg-gray-200/50 dark:hover:bg-white/10 hover:scale-[1.02] cursor-pointer' : 'hover:bg-gray-200/50 dark:hover:bg-white/10 hover:scale-[1.02] cursor-pointer'
}`.trim()} }`.trim()}