From e1488e834e378f602523f4cd77a037446edcb04c Mon Sep 17 00:00:00 2001 From: Moriz Wahl Date: Tue, 23 Mar 2021 19:29:12 +0100 Subject: [PATCH] localize error messages from vee-validate --- frontend/src/i18n.js | 20 ++++++++++++---- frontend/src/locales/en.json | 44 ++++++++++++++++++------------------ frontend/src/main.js | 1 + frontend/src/vee-validate.js | 28 +++++++++++++++++++++++ 4 files changed, 66 insertions(+), 27 deletions(-) create mode 100644 frontend/src/vee-validate.js diff --git a/frontend/src/i18n.js b/frontend/src/i18n.js index 7b76454aa..b0f2f94b1 100644 --- a/frontend/src/i18n.js +++ b/frontend/src/i18n.js @@ -1,6 +1,9 @@ import Vue from 'vue' import VueI18n from 'vue-i18n' +import en from 'vee-validate/dist/locale/en' +import de from 'vee-validate/dist/locale/de' + Vue.use(VueI18n) function loadLocaleMessages () { @@ -11,6 +14,18 @@ function loadLocaleMessages () { if (matched && matched.length > 1) { const locale = matched[1] messages[locale] = locales(key) + if(locale === 'de') { + messages[locale] = { + validations: de, + ...messages[locale] + } + } + if(locale === 'en') { + messages[locale] = { + validations: en, + ...messages[locale] + } + } } }) return messages @@ -33,14 +48,9 @@ const numberFormats = { } } - export default new VueI18n({ locale: 'en', fallbackLocale: 'en', messages: loadLocaleMessages(), numberFormats }) - - - - \ No newline at end of file diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json index 2e6e9dbf7..21ece848a 100644 --- a/frontend/src/locales/en.json +++ b/frontend/src/locales/en.json @@ -11,8 +11,8 @@ "transactions":"transactions", "language":"Sprache", "languages":{ - "de": "Deutsch", - "en": "English" + "de": "Deutsch", + "en": "English" }, "form": { "cancel":"Cancel", @@ -74,32 +74,32 @@ "support":"Support" }, "sidebar" : { - "community":"Community", - "members_area":"Members area", - "membership":"Membership" + "community":"Community", + "members_area":"Members area", + "membership":"Membership" }, "landing1" : { - "explore":"Explore Gradido", - "text":"If you want to get inspiration or just show something directly to your clients, you can jump start your development with our pre-built example pages.", - "link":"Explore pages" + "explore":"Explore Gradido", + "text":"If you want to get inspiration or just show something directly to your clients, you can jump start your development with our pre-built example pages.", + "link":"Explore pages" }, "404" : { - "ooops" : "Ooops!", - "text" : "Page not found. Don't worry though, we have plenty of other pages to explore", - "back" : "Back to dashboard!" + "ooops" : "Ooops!", + "text" : "Page not found. Don't worry though, we have plenty of other pages to explore", + "back" : "Back to dashboard!" } -}, -"admin": { - "site": { - "overview": { - "creation": "Creation", - "transience" : "Transience", - "exchanged": "Exchanged", - "members" : "Members" + }, + "admin": { + "site": { + "overview": { + "creation": "Creation", + "transience" : "Transience", + "exchanged": "Exchanged", + "members" : "Members" + } } - } -}, + }, "nav": { "features": "Features" } -} \ No newline at end of file +} diff --git a/frontend/src/main.js b/frontend/src/main.js index 78d03e58f..63af33282 100755 --- a/frontend/src/main.js +++ b/frontend/src/main.js @@ -2,6 +2,7 @@ import Vue from 'vue'; import DashboardPlugin from './plugins/dashboard-plugin'; import App from './App.vue'; import i18n from './i18n.js'; +import VeeValidate from './vee-validate.js' import VueCookies from 'vue-cookies'; // store diff --git a/frontend/src/vee-validate.js b/frontend/src/vee-validate.js new file mode 100644 index 000000000..d72679f18 --- /dev/null +++ b/frontend/src/vee-validate.js @@ -0,0 +1,28 @@ +import { configure, extend } from 'vee-validate' +import { required, email, min } from "vee-validate/dist/rules" +import i18n from './i18n' + + +configure({ + defaultMessage: (field, values) => { + console.log('defaultMessage', field, value) + values._field_ = i18n.t(`fields.${field}`) + return i18n.t(`validations.messages.${values._rule_}`, values) + } +}) + +extend('email', { + ...email, + message: (_, values) => i18n.t('validations.messages.email', values) +}) + +extend('required', { + ...required, + message: (_, values) => i18n.t('validations.messages.required', values) +}) + +extend('min', { + ...min, + message: (_, values) => i18n.t('validations.messages.min', values) +}) +