From 897ac7528137dc395357db52c103498d995fbf05 Mon Sep 17 00:00:00 2001
From: freedomlang <blackywkl@gmail.com>
Date: Thu, 5 Dec 2019 17:14:44 +0800
Subject: [PATCH] refactor: Use v-for for language option

---
 .../src/components/settings/Languages.vue     | 44 +++++++++++--------
 1 file changed, 26 insertions(+), 18 deletions(-)

diff --git a/frontend/src/components/settings/Languages.vue b/frontend/src/components/settings/Languages.vue
index f07d4f85..ad11a60a 100644
--- a/frontend/src/components/settings/Languages.vue
+++ b/frontend/src/components/settings/Languages.vue
@@ -1,30 +1,38 @@
 <template>
   <select v-on:change="change" :value="locale">
-    <option value="ar">{{ $t('languages.ar') }}</option>
-    <option value="de">{{ $t('languages.de') }}</option>
-    <option value="en">{{ $t('languages.en') }}</option>
-    <option value="es">{{ $t('languages.es') }}</option>
-    <option value="fr">{{ $t('languages.fr') }}</option>
-    <option value="is">{{ $t('languages.is') }}</option>
-    <option value="it">{{ $t('languages.it') }}</option>
-    <option value="ja">{{ $t('languages.ja') }}</option>
-    <option value="ko">{{ $t('languages.ko') }}</option>
-    <option value="nl-be">{{ $t('languages.nlBE') }}</option>
-    <option value="pl">{{ $t('languages.pl') }}</option>
-    <option value="pt-br">{{ $t('languages.ptBR') }}</option>
-    <option value="pt">{{ $t('languages.pt') }}</option>
-    <option value="ro">{{ $t('languages.ro') }}</option>
-    <option value="ru">{{ $t('languages.ru') }}</option>
-    <option value="sv-se">{{ $t('languages.svSE') }}</option>
-    <option value="zh-cn">{{ $t('languages.zhCN') }}</option>
-    <option value="zh-tw">{{ $t('languages.zhTW') }}</option>
+    <option v-for="(language, value) in locales" :key="value" :value="value">{{ $t('languages.' + language) }}</option>
   </select>
 </template>
 
 <script>
+
 export default {
   name: 'languages',
   props: [ 'locale' ],
+  data() {
+    return {
+      locales: {
+        ar: 'ar',
+        de: 'de',
+        en: 'en',
+        es: 'es',
+        fr: 'fr',
+        is: 'is',
+        it: 'it',
+        ja: 'ja',
+        ko: 'ko',
+        'nl-be': 'nlBE',
+        pl: 'pl',
+        'pt-br': 'ptBR',
+        pt: 'pt',
+        ro: 'ro',
+        ru: 'ru',
+        'sv-se': 'svSE',
+        'zh-cn': 'zhCN',
+        'zh-tw': 'zhTW'
+      }
+    };
+  },
   methods: {
     change (event) {
       this.$emit('update:locale', event.target.value)