feat: i18n system, lang switch component, english subtitles, UI improvements, roadmap update

This commit is contained in:
2026-06-09 15:40:51 +08:00
parent 6b4114af43
commit 59aed77199
16 changed files with 410 additions and 33 deletions

View File

@@ -1,5 +1,8 @@
<script setup lang="ts">
import type { SlotInfo } from '@/stores/gameStore'
import { useI18n } from '@/composables/useI18n'
const { t } = useI18n()
defineProps<{
saves: SlotInfo[]
@@ -17,7 +20,7 @@ const maxSlots = 5
<template>
<div class="save-overlay" @click.self="emit('close')" @keydown.escape="emit('close')">
<div class="save-panel">
<h2 class="save-title">存档 / 读档</h2>
<h2 class="save-title">{{ t('ui.save') }} / {{ t('ui.load') }}</h2>
<div class="slot-list">
<div class="save-slot auto-save-slot">
@@ -30,11 +33,11 @@ const maxSlots = 5
<span v-else class="thumb-empty">自动</span>
</div>
<div class="slot-meta">
<div class="slot-label auto-save-label">自动存档</div>
<div class="slot-label auto-save-label">{{ t('ui.autoSave') }}</div>
<div class="slot-info" v-if="saves.find(s => s.slot === 0)">
{{ saves.find(s => s.slot === 0)!.sceneLabel }}
</div>
<div class="slot-info empty" v-else>暂无自动存档</div>
<div class="slot-info empty" v-else>{{ t('ui.noAutoSave') }}</div>
</div>
<div class="slot-actions">
<button
@@ -42,7 +45,7 @@ const maxSlots = 5
:disabled="!saves.find(s => s.slot === 0)"
@click="emit('load', 0)"
>
读取
{{ t('ui.load') }}
</button>
</div>
</div>
@@ -58,30 +61,30 @@ const maxSlots = 5
:src="saves.find(s => s.slot === slot)!.thumbnail"
class="thumb-img"
/>
<span v-else class="thumb-empty"></span>
<span v-else class="thumb-empty">{{ t('ui.empty') }}</span>
</div>
<div class="slot-meta">
<div class="slot-label">存档 {{ slot }}</div>
<div class="slot-label">{{ t('ui.save') }} {{ slot }}</div>
<div class="slot-info" v-if="saves.find(s => s.slot === slot)">
{{ saves.find(s => s.slot === slot)!.sceneLabel }}
</div>
<div class="slot-info empty" v-else></div>
<div class="slot-info empty" v-else>{{ t('ui.empty') }}</div>
</div>
<div class="slot-actions">
<button class="slot-btn save-btn" @click="emit('save', slot)">保存</button>
<button class="slot-btn save-btn" @click="emit('save', slot)">{{ t('ui.save') }}</button>
<button
class="slot-btn load-btn"
:disabled="!saves.find(s => s.slot === slot)"
@click="emit('load', slot)"
>
读取
{{ t('ui.load') }}
</button>
</div>
</div>
</div>
<div class="save-hint">游戏会在每次场景切换时自动保存到槽位 0</div>
<button class="close-btn" @click="emit('close')">关闭</button>
<div class="save-hint">{{ t('ui.autoSaveHint') }}</div>
<button class="close-btn" @click="emit('close')">{{ t('ui.close') }}</button>
</div>
</div>
</template>