add i18n support

dashboard/package.json

@@ -16,6 +16,7 @@
   "dependencies": {
     "axios": "^0.18.0",
     "vue": "^2.5.2",
+    "vue-i18n": "^8.3.2",
     "vue-router": "^3.0.1",
     "vuetify": "^1.0.0"
   },

dashboard/src/i18n/config.js

@@ -0,0 +1,25 @@
+import i18n from '@/i18n'
+import map from '@/i18n/map'
+
+function setLang (lang) {
+  localStorage.setItem('lang', lang)
+  console.log(map[lang])
+  i18n.locale = map[lang]
+}
+
+function loadDefautlLang (lang) {
+  if (localStorage.getItem('lang') === null) {
+    localStorage.setItem('lang', 'English')
+  }
+  i18n.locale = map[localStorage.getItem('lang')]
+}
+
+function getLang () {
+  return localStorage.getItem('lang')
+}
+
+export {
+  getLang,
+  loadDefautlLang,
+  setLang
+}

dashboard/src/i18n/en-US.json

@@ -0,0 +1 @@
+{}

dashboard/src/i18n/index.js

@@ -0,0 +1,18 @@
+import VueI18n from 'vue-i18n'
+import Vue from 'vue'
+import enUS from './en-US.json'
+import zhCN from './zh-CN.json'
+
+Vue.use(VueI18n)
+
+const messages = {
+  en: enUS,
+  zh: zhCN
+}
+
+const i18n = new VueI18n({
+  locale: 'en',
+  messages
+})
+
+export default i18n

dashboard/src/i18n/map.json

@@ -0,0 +1,5 @@
+{
+    "English": "en",
+    "中文(简体)": "zh",
+    "Deutschland": "de"
+}

dashboard/src/i18n/zh-CN.json

@@ -0,0 +1 @@
+{}

dashboard/src/main.js

@@ -7,6 +7,8 @@ import Vuetify from 'vuetify'
 import 'vuetify/dist/vuetify.min.css'
 import '@/assets/styles/main.css'
 
+import i18n from '@/i18n'
+
 Vue.use(Vuetify)
 
 Vue.config.productionTip = false
@@ -15,6 +17,7 @@ Vue.config.productionTip = false
 new Vue({
   el: '#app',
   router,
+  i18n,
   components: { App },
   template: '<App/>'
 })

dashboard/src/pages/Main.vue

@@ -69,7 +69,7 @@
     <main>
         <v-container class="pa-4" fluid>
             <v-alert v-if="message.display" v-bind="message" v-model="message.body" dismissible="dismissible">{{message.body}}</v-alert>
-            <div class="py-2">
+            <div class="py-2" :class="{'cvpm-main-content-with-drawer': drawer, 'cvpm-main-content-without-drawer':!drawer}">
                 <v-slide-y-transition mode="out-in">
                     <router-view></router-view>
                 </v-slide-y-transition>
@@ -118,4 +118,12 @@ export default {
 .cvpm-main-drawer {
     position:fixed;
 }
+.cvpm-main-content-with-drawer {
+    margin-top: 5em;
+    margin-left:  320px;
+}
+.cvpm-main-content-without-drawer {
+    margin-top: 5em;
+    margin-left:  20px;
+}
 </style>

dashboard/src/pages/Settings.vue

@@ -1,25 +1,22 @@
 <template>
-<v-layout>
+  <v-layout>
     <v-flex md8="md8">
-        <v-form v-model="model" v-bind="$data" method="patch" action="settings" @success="onSuccess">
-            <div class="my-4" slot="buttons">
-                <v-btn class="grey" dark="dark" @click.native="$root.back()">
-                    <v-icon dark="dark" left="left">chevron_left </v-icon><span>Back</span></v-btn>
-                <v-btn primary="primary" dark="dark" type="submit">Submit
-                    <v-icon right="right" dark="dark">send</v-icon>
-                </v-btn>
-            </div>
-        </v-form>
+      <v-form>
+        <v-text-field v-model="name" :counter="10" label="Name" required></v-text-field>
+        <v-text-field v-model="email" label="E-mail" required></v-text-field>
+      </v-form>
     </v-flex>
     <v-flex md4="md4">
-        <h5>result</h5>
-        <p>model</p>
     </v-flex>
-</v-layout>
+  </v-layout>
 </template>
 
 <script>
 export default {
+  data: () => ({
+    name: '',
+    email: ''
+  }),
   methods: {
     onSubmit () {},
     onSuccess (data) {}

dashboard/yarn.lock

@@ -7244,6 +7244,10 @@ vue-hot-reload-api@^2.2.0:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.1.tgz#b2d3d95402a811602380783ea4f566eb875569a2"
 
+vue-i18n@^8.3.2:
+  version "8.3.2"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.3.2.tgz#8878a622858060a1723fca1e735053854accdd52"
+
 vue-jest@^1.0.2:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/vue-jest/-/vue-jest-1.4.0.tgz#1d6b4d2774b0aec06cfe5d39789039d3381bc528"