Fix date picker not properly localized (#330)

* Fix language in date picker

Vuetify allows custom-named locales,
but the date-picker really only works with BCP 47 language tag

* Save lang at proper time + Update Vuetify lang on the fly
This commit is contained in:
sephrat 2021-04-21 18:36:49 +02:00 committed by GitHub
parent 8e27d0b83f
commit 29b9c231d3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 31 additions and 24 deletions

View File

@ -211,7 +211,6 @@ export default {
methods: { methods: {
writeLang(val) { writeLang(val) {
this.$store.commit("setLang", val);
this.settings.language = val; this.settings.language = val;
}, },
deleteCategoryfromDatabase(category) { deleteCategoryfromDatabase(category) {
@ -225,7 +224,9 @@ export default {
}, },
async saveSettings() { async saveSettings() {
await api.siteSettings.update(this.settings); await api.siteSettings.update(this.settings);
this.$store.commit("setLang", this.settings.language); this.$store.dispatch("setLang", {
currentVueComponent: this,
language: this.settings.language });
this.getOptions(); this.getOptions();
}, },
}, },

View File

@ -47,7 +47,7 @@ export default {
items: [ items: [
{ {
name: "English", name: "English",
value: "en", value: "en-US",
}, },
], ],
}; };
@ -72,7 +72,9 @@ export default {
if (this.siteSettings) { if (this.siteSettings) {
this.$emit(SELECT_EVENT, selectedLanguage); this.$emit(SELECT_EVENT, selectedLanguage);
} else { } else {
this.$store.commit("setLang", selectedLanguage); this.$store.dispatch("setLang", {
currentVueComponent: this,
language: selectedLanguage });
} }
}, },
}, },

View File

@ -3,15 +3,14 @@ import Vuetify from "vuetify/lib";
Vue.use(Vuetify); Vue.use(Vuetify);
// language IDs should match those from VueI18n with _ instead of - import de from 'vuetify/es5/locale/de';
import de_DE from 'vuetify/es5/locale/de'; import en from 'vuetify/es5/locale/en';
import en_US from 'vuetify/es5/locale/en'; import fr from 'vuetify/es5/locale/fr';
import fr_FR from 'vuetify/es5/locale/fr'; import pl from 'vuetify/es5/locale/pl';
import pl_PL from 'vuetify/es5/locale/pl'; import pt from 'vuetify/es5/locale/pt';
import pt_PT from 'vuetify/es5/locale/pt'; import sv from 'vuetify/es5/locale/sv';
import sv_SE from 'vuetify/es5/locale/sv'; import zhHans from 'vuetify/es5/locale/zh-Hans';
import zh_CN from 'vuetify/es5/locale/zh-Hans'; import zhHant from 'vuetify/es5/locale/zh-Hant';
import zh_TW from 'vuetify/es5/locale/zh-Hant';
const vuetify = new Vuetify({ const vuetify = new Vuetify({
@ -42,16 +41,16 @@ const vuetify = new Vuetify({
}, },
lang: { lang: {
locales: { locales: {
de_DE, 'de-DE' : de,
en_US, 'en-US' : en,
fr_FR, 'fr-FR' : fr,
pl_PL, 'pl-PL' : pl,
pt_PT, 'pt-PT' : pt,
sv_SE, 'sv-SE' : sv,
zh_CN, 'zh-CN' : zhHans,
zh_TW 'zh-TW' : zhHant
}, },
current: 'en_US', current: 'en-US',
}, },
}); });

View File

@ -1,7 +1,7 @@
import VueI18n from "../../i18n"; import VueI18n from "../../i18n";
const state = { const state = {
lang: "en", lang: "en-US",
allLangs: [ allLangs: [
{ {
name: "English", name: "English",
@ -52,7 +52,12 @@ const mutations = {
const actions = { const actions = {
initLang({ getters }, { currentVueComponent }) { initLang({ getters }, { currentVueComponent }) {
VueI18n.locale = getters.getActiveLang; VueI18n.locale = getters.getActiveLang;
currentVueComponent.$vuetify.lang.current = getters.getActiveLang.replace('-', '_'); currentVueComponent.$vuetify.lang.current = getters.getActiveLang;
},
setLang({ commit }, { language, currentVueComponent }) {
VueI18n.locale = language;
currentVueComponent.$vuetify.lang.current = language;
commit('setLang', language);
}, },
}; };