feat: settings page i18n supported (#42)

* feat: add config to resolve path alias.

* feat: use vue-i18n for language switch

* feat: add .editorconfig for ide

* fix: add no-referrer to avoid CROB

* fix: setCookie and fix typo

* feat: integrate vue-i18n

* feat: player component i18n support

* fix: duplicate key warning in explore page

* fix: like songs number changed in library page

* fire: remove todo

* fix: same text search on enter will cause error

* fix: scrobble error params type

* feat: prettier task supported

* fix: prettier ignore config update

* fix: conflict

* fix: commitMP3 and countrycode to countryCode

* lint: prettier

* feat: settings page i18n supported

src/locale/lang/en.js

@@ -97,4 +97,16 @@ export default {
   common: {
     songs: "Songs",
   },
+  settings: {
+    settings: "Settings",
+    logout: "LOGOUT",
+    language: "Languages",
+    musicQuality: {
+      text: "Music Quality",
+      low: "Low",
+      medium: "Medium",
+      high: "High",
+      lossless: "Lossless",
+    },
+  },
 };

src/locale/lang/zh-CN.js

@@ -102,4 +102,16 @@ export default {
   common: {
     songs: "首歌",
   },
+  settings: {
+    settings: "选项",
+    logout: "登出",
+    language: "语言",
+    musicQuality: {
+      text: "音质选择",
+      low: "普通",
+      medium: "较高",
+      high: "极高",
+      lossless: "无损",
+    },
+  },
 };

src/views/settings.vue

@@ -18,18 +18,16 @@
           </div>
         </div>
         <div class="right">
-          <button @click="logout"
-            ><svg-icon icon-class="logout" />LOGOUT</button
-          >
+          <button @click="logout">
+            <svg-icon icon-class="logout" />
+            {{ $t("settings.logout") }}
+          </button>
         </div>
       </div>
-
-      <h2>Settings</h2>
+      <h2>{{ $t("settings.settings") }}</h2>
       <div class="item">
         <div class="left">
-          <div class="title">
-            Languages
-          </div>
+          <div class="title"> {{ $t("settings.language") }} </div>
         </div>
         <div class="right">
           <select v-model="lang">
@@ -40,16 +38,22 @@
       </div>
       <div class="item">
         <div class="left">
-          <div class="title">
-            Music Quality
-          </div>
+          <div class="title"> {{ $t("settings.musicQuality.text") }} </div>
         </div>
         <div class="right">
           <select v-model="musicQuality">
-            <option value="128000">Low - 128Kbps</option>
-            <option value="192000">Medium - 192Kbps</option>
-            <option value="320000">Hight - 320Kbps</option>
-            <option value="999000">Lossless - FLAC</option>
+            <option value="128000">
+              {{ $t("settings.musicQuality.low") }} - 128Kbps
+            </option>
+            <option value="192000">
+              {{ $t("settings.musicQuality.medium") }} - 192Kbps
+            </option>
+            <option value="320000">
+              {{ $t("settings.musicQuality.high") }} - 320Kbps
+            </option>
+            <option value="999000">
+              {{ $t("settings.musicQuality.lossless") }} - FLAC
+            </option>
           </select>
         </div>
       </div>