add multilanguage support and add russian language

src/www/js/app.js

@@ -23,8 +23,15 @@ function bytes(bytes, decimals, kib, maxunit) {
   return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
 }
 
+const i18n = new VueI18n({
+  locale: localStorage.getItem('lang') || 'en',
+  fallbackLocale: 'en',
+  messages,
+});
+
 new Vue({
   el: '#app',
+  i18n,
   components: {
     apexchart: VueApexCharts,
   },
@@ -48,6 +55,8 @@ new Vue({
     currentRelease: null,
     latestRelease: null,
 
+    langDropdownShow: false,
+
     chartOptions: {
       chart: {
         background: 'transparent',
@@ -243,11 +252,15 @@ new Vue({
         .catch(err => alert(err.message || err.toString()))
         .finally(() => this.refresh().catch(console.error));
     },
+    changeLang(lang) {
+      localStorage.setItem('lang', lang);
+      i18n.locale = lang;
+    },
   },
   filters: {
     bytes,
     timeago: value => {
-      return timeago().format(value);
+      return timeago.format(value, i18n.locale);
     },
   },
   mounted() {

src/www/js/i18n.js

@@ -0,0 +1,60 @@
+'use strict';
+
+const messages = { // eslint-disable-line no-unused-vars
+  en: {
+    name: 'Name',
+    password: 'Password',
+    signIn: 'Sign In',
+    logout: 'Logout',
+    updateAvailable: 'There is an update available!',
+    update: 'Update',
+    clients: 'Clients',
+    new: 'New',
+    deleteClient: 'Delete Client',
+    deleteDialog1: 'Are you sure you want to delete',
+    deleteDialog2: 'This action cannot be undone.',
+    cancel: 'Cancel',
+    create: 'Create',
+    createdAt: 'Created at ',
+    lastSeen: 'Last seen at ',
+    totalDownload: 'Total Download: ',
+    totalUpload: 'Total Upload: ',
+    newClient: 'New Client',
+    disableClient: 'Disable Client',
+    enableClient: 'Enable Client',
+    noClients: 'There are no clients yet.',
+    showQR: 'Show QR Code',
+    downloadConfig: 'Download Configuration',
+    madeBy: 'Made by',
+    donate: 'Donate',
+    changeLang: 'Change language',
+  },
+  ru: {
+    name: 'Имя',
+    password: 'Пароль',
+    signIn: 'Войти',
+    logout: 'Выйти',
+    updateAvailable: 'Доступно обновление!',
+    update: 'Обновить',
+    clients: 'Клиенты',
+    new: 'Создать',
+    deleteClient: 'Удалить клиента',
+    deleteDialog1: 'Вы уверены, что хотите удалить',
+    deleteDialog2: 'Это действие невозможно отменить.',
+    cancel: 'Закрыть',
+    create: 'Создать',
+    createdAt: 'Создано в ',
+    lastSeen: 'Последнее подключение в ',
+    totalDownload: 'Всего скачано: ',
+    totalUpload: 'Всего загружено: ',
+    newClient: 'Создать клиента',
+    disableClient: 'Выключить клиента',
+    enableClient: 'Включить клиента',
+    noClients: 'Пока нету клиентов.',
+    showQR: 'Показать QR код',
+    downloadConfig: 'Скачать конфигурацию',
+    madeBy: 'Сделано',
+    donate: 'Поблагодарить',
+    changeLang: 'Выбор языка',
+  },
+};

src/www/js/vendor/timeago.min.js

@@ -1 +0,0 @@
-!function(t,e){"object"==typeof module&&module.exports?module.exports=e(t):t.timeago=e(t)}("undefined"!=typeof window?window:this,function(){function t(t){return t instanceof Date?t:isNaN(t)?/^\d+$/.test(t)?new Date(e(t,10)):(t=(t||"").trim().replace(/\.\d+/,"").replace(/-/,"/").replace(/-/,"/").replace(/T/," ").replace(/Z/," UTC").replace(/([\+\-]\d\d)\:?(\d\d)/," $1$2"),new Date(t)):new Date(e(t))}function e(t){return parseInt(t)}function n(t,n,r){n=d[n]?n:d[r]?r:"en";var i=0;for(agoin=t<0?1:0,t=Math.abs(t);t>=l[i]&&i<p;i++)t/=l[i];return t=e(t),i*=2,t>(0===i?9:1)&&(i+=1),d[n](t,i)[agoin].replace("%s",t)}function r(e,n){return n=n?t(n):new Date,(n-t(e))/1e3}function i(t){for(var e=1,n=0,r=Math.abs(t);t>=l[n]&&n<p;n++)t/=l[n],e*=l[n];return r%=e,r=r?e-r:e,Math.ceil(r)}function o(t){return t.getAttribute?t.getAttribute(h):t.attr?t.attr(h):void 0}function a(t,e){function a(o,c,f,s){var d=r(c,t);o.innerHTML=n(d,f,e),u["k"+s]=setTimeout(function(){a(o,c,f,s)},1e3*i(d))}var u={};return e||(e="en"),this.format=function(i,o){return n(r(i,t),o,e)},this.render=function(t,e){void 0===t.length&&(t=[t]);for(var n=0;n<t.length;n++)a(t[n],o(t[n]),e,++c)},this.cancel=function(){for(var t in u)clearTimeout(u[t]);u={}},this.setLocale=function(t){e=t},this}function u(t,e){return new a(t,e)}var c=0,f="second_minute_hour_day_week_month_year".split("_"),s="秒_分钟_小时_天_周_月_年".split("_"),d={en:function(t,e){if(0===e)return["just now","right now"];var n=f[parseInt(e/2)];return t>1&&(n+="s"),[t+" "+n+" ago","in "+t+" "+n]},zh_CN:function(t,e){if(0===e)return["刚刚","片刻后"];var n=s[parseInt(e/2)];return[t+n+"前",t+n+"后"]}},l=[60,60,24,7,365/7/12,12],p=6,h="datetime";return u.register=function(t,e){d[t]=e},u});