fix: update login settings UI and improve localization for verification code messages

Author: wxg0103

ui/src/locales/lang/en-US/views/system.ts

@@ -131,7 +131,9 @@ export default {
     management: 'management',
   },
     default_login: 'Default Login Method',
-  display_code: 'Display verification code when login fails',
+  display_code: 'Account login verification code setting',
+    loginFailed: 'Login failed',
+  loginFailedMessage: 'Display verification code twice',
   display_codeTip: 'When the value is -1, the verification code is not displayed',
   time: 'Times',
   setting: 'Login Setting',

ui/src/locales/lang/zh-CN/views/system.ts

@@ -132,7 +132,9 @@ export default {
     management: '管理',
   },
   default_login: '默认登录方式',
-  display_code: '登录失败显示验证码',
+  display_code: '账号登录验证码设置',
+  loginFailed: '登录失败',
+  loginFailedMessage: '次显示验证码',
   display_codeTip: '值为-1时，不显示验证码',
   time: '次',
   setting: '登录设置',

ui/src/locales/lang/zh-Hant/views/system.ts

@@ -131,7 +131,9 @@ export default {
     management: '管理',
   },
     default_login: '預設登入方式',
-  display_code: '登入失敗顯示驗證碼',
+  display_code: '帳號登入驗證碼設定',
+  loginFailed: '登入失敗',
+  loginFailedMessage: '次顯示驗證碼',
   display_codeTip: '值為-1時，不顯示驗證碼',
   time: '次',
   setting: '登录設置',

ui/src/views/application-overview/xpack-component/XPackLimitDrawer.vue

@@ -116,6 +116,7 @@
             </el-checkbox-group>
           </el-form-item>
           <el-form-item
+            v-if="form.authentication_value.type === 'login' && form.authentication_value?.login_value?.includes('LOCAL')"
             :label="$t('views.system.display_code')"
             :rules="[
               {
@@ -126,15 +127,22 @@
             ]"
             prop="authentication_value.max_attempts"
           >
+             <span style="font-size: 13px;">
+      {{ $t('views.system.loginFailed') }}
+    </span>
             <el-input-number
+              style="margin-left: 8px;"
               v-model="form.authentication_value.max_attempts"
               :min="-1"
               :max="10"
               :step="1"
               controls-position="right"
             />
+            <span style="margin-left: 8px; font-size: 13px;">
+      {{ $t('views.system.loginFailedMessage') }}
+    </span>
             <span style="margin-left: 8px; color: #909399; font-size: 12px;">
-      {{ $t('views.system.display_codeTip') }}
+      ({{ $t('views.system.display_codeTip') }})
     </span>
           </el-form-item>
         </el-card>
@@ -220,9 +228,6 @@ const open = (data: any) => {
   form.value.authentication_value = data.authentication_value || {
     type: 'password',
   }
-  if (!form.value.authentication_value.max_attempts) {
-    form.value.authentication_value.max_attempts = 1
-  }
   if (
     form.value.authentication_value.type === 'password' &&
     !form.value.authentication_value.password_value
@@ -279,6 +284,9 @@ function firstGeneration() {
       type: 'password',
       password_value: generateAuthenticationValue(),
     }
+    if (!form.value.authentication_value.max_attempts) {
+      form.value.authentication_value.max_attempts = 1
+    }
   }
 }
 

ui/src/views/system-setting/authentication/component/Setting.vue

@@ -40,15 +40,22 @@
             ]"
             prop="max_attempts"
           >
+            <span style="font-size: 13px;">
+      {{ $t('views.system.loginFailed') }}
+    </span>
             <el-input-number
+              style="margin-left: 8px;"
               v-model="form.max_attempts"
               :min="-1"
               :max="10"
               :step="1"
               controls-position="right"
             />
+            <span style="margin-left: 8px; font-size: 13px;">
+      {{ $t('views.system.loginFailedMessage') }}
+    </span>
             <span style="margin-left: 8px; color: #909399; font-size: 12px;">
-      {{ $t('views.system.display_codeTip') }}
+      ({{ $t('views.system.display_codeTip') }})
     </span>
           </el-form-item>
         </el-form>