feat: configurable locales path per story, dynamic language switching from story data

src/components/LangSwitch.vue

@@ -1,23 +1,30 @@
 <script setup lang="ts">
 import { useI18n } from '@/composables/useI18n'
+import { useGameStore } from '@/stores/gameStore'
 
-const { currentLang, setLang, t } = useI18n()
+const { currentLang, setLang } = useI18n()
+const store = useGameStore()
+
+const langLabels: Record<string, string> = {
+  zh: '中文',
+  en: 'English',
+  ja: '日本語',
+  ko: '한국어',
+  fr: 'Français',
+  de: 'Deutsch',
+  es: 'Español',
+  pt: 'Português',
+}
 </script>
 
 <template>
-  <div class="lang-switch">
+  <div class="lang-switch" v-if="store.storyLocales.languages.length > 1">
     <button
-      :class="['lang-btn', { active: currentLang === 'zh' }]"
-      @click="setLang('zh')"
-    >中文</button>
-    <button
-      :class="['lang-btn', { active: currentLang === 'en' }]"
-      @click="setLang('en')"
-    >English</button>
-    <button
-      :class="['lang-btn', { active: currentLang === 'ja' }]"
-      @click="setLang('ja')"
-    >日本語</button>
+      v-for="lang in store.storyLocales.languages"
+      :key="lang"
+      :class="['lang-btn', { active: currentLang === lang }]"
+      @click="setLang(lang)"
+    >{{ langLabels[lang] || lang.toUpperCase() }}</button>
   </div>
 </template>