feat: i18n StoryGallery UI labels and data layer chapter/ending names

This commit is contained in:
2026-06-10 16:29:25 +08:00
parent d057beb82d
commit e51b5e234e
10 changed files with 50 additions and 8 deletions

View File

@@ -1,6 +1,9 @@
<script setup lang="ts">
import { computed, ref } from 'vue'
import type { ChapterInfo, SceneNode, EndingDef } from '@engine/types'
import { useI18n } from '@/composables/useI18n'
const { t } = useI18n()
const props = defineProps<{
chapters: ChapterInfo[]
@@ -117,7 +120,7 @@ function toggleExpand(chapterId: string) {
<template>
<div class="story-overlay" @click.self="emit('close')" @keydown.escape="emit('close')">
<div class="story-panel">
<h2 class="story-title">故事进度</h2>
<h2 class="story-title">{{ t('ui.story') }}</h2>
<div class="story-grid">
<div
@@ -131,7 +134,7 @@ function toggleExpand(chapterId: string) {
<img v-if="ch.thumbnail" :src="ch.thumbnail" class="thumb-img" />
<div v-else class="thumb-placeholder">?</div>
</div>
<div class="card-label">{{ ch.label }}</div>
<div class="card-label">{{ t(ch.labelKey || ch.label) }}</div>
<div class="card-progress" v-if="unlockedChapterIds.has(ch.id)">
<div class="mini-progress-bar">
@@ -146,14 +149,14 @@ function toggleExpand(chapterId: string) {
:key="end.id"
class="ending-tag"
:class="{ unlocked: endingStatus(end.id) }"
>{{ endingStatus(end.id) ? '✅' : '🔒' }} {{ end.label }}</span>
>{{ endingStatus(end.id) ? '✅' : '🔒' }} {{ t(end.labelKey || end.label) }}</span>
</div>
<button
v-if="unlockedChapterIds.has(ch.id)"
class="card-start-btn"
@click.stop="emit('startChapter', ch.id)"
> 开始</button>
> {{ t('ui.startChapter') }}</button>
</div>
<div class="card-recap" v-if="expandedChapterId === ch.id">
@@ -173,7 +176,7 @@ function toggleExpand(chapterId: string) {
</div>
</div>
<button class="story-close" @click="emit('close')">关闭</button>
<button class="story-close" @click="emit('close')">{{ t('ui.close') }}</button>
</div>
</div>
</template>