safetwitch/src/components/LanguageSwitcher.vue
2023-07-10 15:59:56 -04:00

32 lines
929 B
Vue

<template>
<div class="flex">
<select v-model="$i18n.locale" @change="onChange()" class="my-auto p-0 pr-9 bg-transparent border-0" :selected="$i18n.locale">
<option v-for="(lang, i) in langs" :key="`Lang${i}`" :value="lang">
{{ names[i] }}
</option>
</select>
</div>
</template>
<script lang="ts">
export default {
setup() {
return {
langs: ['en-US', 'es-ES', 'nl-NL', 'pt-PT'],
names: ['English', 'Español', 'Nederlands', 'Português']
}
},
mounted() {
const savedLocale = localStorage.getItem("language")
if (savedLocale != null && this.langs.includes(savedLocale)) {
this.$i18n.locale = savedLocale
}
},
methods: {
onChange() {
localStorage.setItem("language", this.$i18n.locale)
window.location.reload()
}
}
}
</script>