Russian language support. (#7554)

* Add Russian language

* Use prettier

---------

Co-authored-by: Bubblegum <jack_benq@selfhosted.lan>

Author: JB-SelfCompany

backend/app/dto/auth.go

@@ -29,7 +29,7 @@ type Login struct {
 	Captcha       string `json:"captcha"`
 	CaptchaID     string `json:"captchaID"`
 	AuthMethod    string `json:"authMethod" validate:"required,oneof=jwt session"`
-	Language      string `json:"language" validate:"required,oneof=zh en tw"`
+	Language      string `json:"language" validate:"required,oneof=zh en tw ru"`
 }
 
 type MFALogin struct {

backend/i18n/i18n.go

@@ -75,7 +75,6 @@ func GetMsgByKey(key string) string {
 	return content
 }
 
-//go:embed lang/*
 var fs embed.FS
 var bundle *i18n.Bundle
 
@@ -100,6 +99,7 @@ func Init() {
 	_, _ = bundle.LoadMessageFileFS(fs, "lang/zh-Hant.yaml")
 	_, _ = bundle.LoadMessageFileFS(fs, "lang/fa.yaml")
 	_, _ = bundle.LoadMessageFileFS(fs, "lang/pt.yaml")
+	_, _ = bundle.LoadMessageFileFS(fs, "lang/ru.yaml")
 }
 
 func UseI18nForCmd(lang string) {

backend/i18n/lang/ru.yaml

@@ -2,6 +2,7 @@ import { createI18n } from 'vue-i18n';
 import zh from './modules/zh';
 import tw from './modules/tw';
 import en from './modules/en';
+import ru from './modules/ru';
 
 const i18n = createI18n({
     legacy: false,
@@ -12,6 +13,7 @@ const i18n = createI18n({
         zh,
         tw,
         en,
+        ru,
     },
     warnHtmlMessage: false,
 });

frontend/src/lang/index.ts

@@ -1,5 +1,5 @@
 <template>
-    <el-row :gutter="10">
+    <el-row :gutter="10" class="status-container">
         <el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center">
             <el-popover placement="bottom" :width="loadWidth()" trigger="hover" v-if="chartsOption['cpu']">
                 <div>
@@ -52,7 +52,7 @@
             </span>
         </el-col>
         <el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center">
-            <el-popover placement="bottom" :width="160" trigger="hover" v-if="chartsOption['memory']">
+            <el-popover placement="bottom" :width="200" trigger="hover" v-if="chartsOption['memory']">
                 <el-tag style="font-weight: 500">{{ $t('home.mem') }}:</el-tag>
                 <el-tag class="tagClass">{{ $t('home.total') }}: {{ computeSize(currentInfo.memoryTotal) }}</el-tag>
                 <el-tag class="tagClass">{{ $t('home.used') }}: {{ computeSize(currentInfo.memoryUsed) }}</el-tag>
@@ -431,6 +431,39 @@ defineExpose({
 </script>
 
 <style scoped lang="scss">
+.status-container {
+    :deep(.el-button) {
+        min-width: 180px;
+        padding: 8px 16px;
+        height: auto;
+        white-space: normal;
+        line-height: 1.5;
+        text-align: left;
+    }
+
+    :deep(.el-tag) {
+        min-width: 180px;
+        padding: 8px 12px;
+        height: auto;
+        white-space: normal;
+        line-height: 1.5;
+        margin: 4px;
+        text-align: left;
+    }
+
+    :deep(.el-button--primary) {
+        background-color: var(--el-color-primary);
+        &.is-plain {
+            background: var(--el-color-primary-light-9);
+            color: var(--el-color-primary);
+            &:hover {
+                background: var(--el-color-primary);
+                color: white;
+            }
+        }
+    }
+}
+
 .cpuModeTag {
     justify-content: flex-start !important;
     text-align: left !important;
@@ -445,6 +478,10 @@ defineExpose({
 }
 .tagClass {
     margin-top: 3px;
+    min-width: 140px;
+    white-space: normal;
+    height: auto;
+    line-height: 1.5;
 }
 
 .tagCPUClass {
@@ -460,6 +497,14 @@ defineExpose({
     margin-top: 28%;
     font-size: 14px;
 }
+
+.input-help {
+    display: inline-block;
+    min-width: 120px;
+    white-space: normal;
+    line-height: 1.2;
+    padding: 2px 4px;
+}
 .nameTag {
     margin-top: 3px;
     height: auto;

frontend/src/lang/modules/ru.ts

@@ -55,12 +55,16 @@
                                         <el-dropdown-item v-if="globalStore.isIntl" command="en">
                                             English
                                         </el-dropdown-item>
+                                        <el-dropdown-item v-if="globalStore.isIntl" command="ru">
+                                            Русский
+                                        </el-dropdown-item>
                                         <el-dropdown-item command="zh">中文(简体)</el-dropdown-item>
                                         <el-dropdown-item command="tw">中文(繁體)</el-dropdown-item>
                                         <el-dropdown-item v-if="!globalStore.isIntl" command="en">
                                             English
                                         </el-dropdown-item>
                                     </el-dropdown-menu>
+                                    <el-dropdown-item v-if="!globalStore.isIntl" command="ru">Русский</el-dropdown-item>
                                 </template>
                             </el-dropdown>
                         </div>
@@ -272,6 +276,8 @@ function handleCommand(command: string) {
         dropdownText.value = 'English';
     } else if (command === 'tw') {
         dropdownText.value = '中文(繁體)';
+    } else if (command === 'ru') {
+        dropdownText.value = 'Русский';
     }
     nextTick(() => {
         loginFormRef.value.clearValidate();

frontend/src/views/home/status/index.vue

@@ -78,9 +78,11 @@
                                     v-model="form.language"
                                 >
                                     <el-radio v-if="globalStore.isIntl" value="en">English</el-radio>
+                                    <el-radio v-if="globalStore.isIntl" value="ru">Русский</el-radio>
                                     <el-radio value="zh">中文(简体)</el-radio>
                                     <el-radio value="tw">中文(繁體)</el-radio>
                                     <el-radio v-if="!globalStore.isIntl" value="en">English</el-radio>
+                                    <el-radio v-if="!globalStore.isIntl" value="ru">Русский</el-radio>
                                 </el-radio-group>
                             </el-form-item>