@@ -107,24 +107,6 @@
|
||||
<view class="detail-audio-progress-fill"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
v-if="isAudioLanguageSwitchVisible"
|
||||
class="detail-audio-language-switch"
|
||||
@tap.stop
|
||||
>
|
||||
<view
|
||||
v-for="option in detailAudioLanguageOptions"
|
||||
:key="option.value"
|
||||
class="detail-audio-language-option"
|
||||
:class="{ active: selectedAudioLanguage === option.value }"
|
||||
@tap.stop="handleDetailAudioLanguageChange(option.value)"
|
||||
>
|
||||
<text class="detail-audio-lang-text">{{ option.shortLabel }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="detail-audio-lang">
|
||||
<text class="detail-audio-lang-text">{{ audioLanguageShortText }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="isLocationActionVisible" class="action-bar">
|
||||
@@ -230,14 +212,6 @@ const contentLanguageOptions: Array<{
|
||||
}
|
||||
]
|
||||
|
||||
const audioLanguageOptions: Array<{
|
||||
value: AudioLanguage
|
||||
shortLabel: string
|
||||
}> = [
|
||||
{ value: 'zh-CN', shortLabel: '中文' },
|
||||
{ value: 'en-US', shortLabel: 'EN' }
|
||||
]
|
||||
|
||||
const isAudioLanguage = (value: unknown): value is AudioLanguage => (
|
||||
value === 'zh-CN' || value === 'en-US'
|
||||
)
|
||||
@@ -284,21 +258,6 @@ const audioDockSubtitle = computed(() => [
|
||||
exhibit.value.title,
|
||||
exhibit.value.audio.durationLabel
|
||||
].filter(Boolean).join(' · ') || '讲解音频')
|
||||
const audioLanguageShortText = computed(() => (
|
||||
selectedAudioLanguage.value === 'en-US' ? 'EN' : '中文'
|
||||
))
|
||||
const supportedDetailAudioLanguages = computed<AudioLanguage[]>(() => {
|
||||
const languages = exhibit.value.audio.supportedLanguages?.length
|
||||
? exhibit.value.audio.supportedLanguages
|
||||
: [selectedAudioLanguage.value]
|
||||
|
||||
const normalized = Array.from(new Set(languages.filter(isAudioLanguage)))
|
||||
return normalized.length ? normalized : [selectedAudioLanguage.value]
|
||||
})
|
||||
const detailAudioLanguageOptions = computed(() => (
|
||||
audioLanguageOptions.filter((option) => supportedDetailAudioLanguages.value.includes(option.value))
|
||||
))
|
||||
const isAudioLanguageSwitchVisible = computed(() => detailAudioLanguageOptions.value.length > 1)
|
||||
const isCurrentDetailAudioTarget = computed(() => {
|
||||
const source = globalAudioPlayer.currentSource.value
|
||||
const targetType = exhibit.value.audio.playTargetType || 'ITEM'
|
||||
@@ -501,11 +460,6 @@ const handleLanguageChange = async (lang: AudioLanguage, options: { syncAudio?:
|
||||
}
|
||||
}
|
||||
|
||||
const handleDetailAudioLanguageChange = (lang: AudioLanguage) => {
|
||||
if (!supportedDetailAudioLanguages.value.includes(lang)) return
|
||||
void handleLanguageChange(lang)
|
||||
}
|
||||
|
||||
watch(
|
||||
() => globalAudioPlayer.currentSource.value,
|
||||
(source) => {
|
||||
@@ -1430,44 +1384,6 @@ const handleBack = () => {
|
||||
border: 1px solid rgba(255, 255, 255, 0.46);
|
||||
}
|
||||
|
||||
.detail-audio-language-switch {
|
||||
flex-shrink: 0;
|
||||
min-width: 74px;
|
||||
height: 36px;
|
||||
padding: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 3px;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(255, 255, 255, 0.34);
|
||||
border-radius: 13px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.detail-audio-language-option {
|
||||
min-width: 31px;
|
||||
height: 28px;
|
||||
padding: 0 6px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
border-radius: 10px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.detail-audio-language-option.active {
|
||||
background: #e7e900;
|
||||
color: #0b0f0a;
|
||||
}
|
||||
|
||||
.detail-audio-lang-text {
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
font-weight: 900;
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
@media (max-width: 360px) {
|
||||
.immersive-hero {
|
||||
padding-left: 20px;
|
||||
@@ -1489,13 +1405,5 @@ const handleBack = () => {
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.detail-audio-language-switch {
|
||||
min-width: 68px;
|
||||
}
|
||||
|
||||
.detail-audio-language-option {
|
||||
min-width: 28px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user