patrick/OpenDTU
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

webapp: Show Locale name instead of abbreviation in Language Change Dropdown

Browse Source
This commit is contained in:
Thomas Basler 2023-01-09 20:55:48 +01:00
parent af1a2a188e
commit 587de2e3be
1 changed files with 5 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
webapp/src/components/LocaleSwitcher.vue
View File

@ -1,13 +1,14 @@
<template> <template>
<select class="form-select" @change="updateLanguage()" v-model="$i18n.locale"> <select class="form-select" @change="updateLanguage()" v-model="$i18n.locale">
<option v-for="locale in $i18n.availableLocales" :key="`locale-${locale}`" :value="locale"> <option v-for="locale in $i18n.availableLocales" :key="`locale-${locale}`" :value="locale">
{{ locale.toUpperCase() }} {{ getLocaleName(locale) }}
</option> </option>
</select> </select>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
import { LOCALES } from '@/locales';
export default defineComponent({ export default defineComponent({
name: "LocaleSwitcher", name: "LocaleSwitcher",
@ -15,6 +16,9 @@ export default defineComponent({
updateLanguage() { updateLanguage() {
localStorage.setItem("locale", this.$i18n.locale); localStorage.setItem("locale", this.$i18n.locale);
}, },
getLocaleName(locale: string): string {
return LOCALES.find(i => i.value === locale)?.caption || "";
}
}, },
mounted() { mounted() {
if (localStorage.getItem("locale")) { if (localStorage.getItem("locale")) {