mirror of
				https://github.com/mealie-recipes/mealie.git
				synced 2025-11-03 18:53:17 -05:00 
			
		
		
		
	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:
		@@ -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();
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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 });
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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',
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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);
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user