NEZ-908 feat：用户编辑页面增加 2FA 配置选项

nezha-fronted/src/components/common/language/cn.js

@@ -721,7 +721,11 @@ const cn = {
       confirmPinErr: '两次密码输入不一致',
       reinputPin: '请再次输入密码',
       notification: '通知',
-      mobile: '电话'
+      mobile: '电话',
+      disable: '关闭',
+      enableMfa: '开启',
+      forceEnable: '强制开启',
+      mfaTitle: 'Two-Factor Authentication'
     },
     roles: {
       roles: '角色',

nezha-fronted/src/components/common/language/en.js

@@ -730,7 +730,11 @@ const en = {
       confirmPinErr: 'The two passwords are inconsistent',
       reinputPin: 'Enter password again',
       notification: 'Notification',
-      mobile: 'Mobile'
+      mobile: 'Mobile',
+      disable: 'Disable',
+      enableMfa: 'EnableMfa',
+      forceEnable: 'ForceEnable',
+      mfaTitle: 'Two-Factor Authentication'
     },
     roles: {
       roles: 'Role',

nezha-fronted/src/components/common/login.vue

@@ -164,10 +164,10 @@ export default {
         this.$post('sys/login', this.loginData).then(res => {
           if (res.code == 200) {
             // 登录成功，记录用户名、token和lang
-            // res.data.authFlag = 1
+            // res.data.authFlag = 0
             // res.data.authBind = 1
             this.authToken = res.data.token
-            sessionStorage.setItem('nz-token', this.authToken)
+            sessionStorage.setItem('nz-token', res.data.token)
             if (res.data.authFlag === 1) {
               if (res.data.authBind === 0) {
                 this.verifyShow = true
@@ -176,8 +176,8 @@ export default {
                 this.dialogLoading = true
                 this.$post('mfa/genKey', { authToken: this.authToken }).then(res => {
                   this.$nextTick(() => {
-                    this.authToken = res.data.token
+                    this.authToken = res.data.authToken
-                    sessionStorage.setItem('nz-token', this.authToken)
+                    // sessionStorage.setItem('nz-token', this.authToken)
                     this.authKey = res.data.authKey
                     this.bindQRCode(res.data.otpauth)
                   })
@@ -208,12 +208,17 @@ export default {
         authCode: this.loginData.authCode
       }
       this.$post('mfa/verify', params).then(res => {
+        if (res.code === 200) {
+          res.data.token = res.data.authToken
           sessionStorage.setItem('nz-username', this.loginData.username)
           localStorage.setItem('nz-username', this.loginData.username)
           localStorage.setItem('nz-prometheus-federation-enabled', res.data.prometheusFederationEnabled)
           localStorage.setItem('nz-language', this.lang)
           this.$i18n.locale = this.lang
           this.loginSuccess(res)
+        } else {
+          this.authToken = res.data.authToken
+        }
       })
     },
     changeLang (lang) {

nezha-fronted/src/components/common/rightBox/administration/userBox.vue

@@ -29,6 +29,21 @@
             <el-input id="account-input-pinChange" v-model="editUser.pinChange"  maxlength="64" placeholder=""
                       show-word-limit size="small" type="password"></el-input>
           </el-form-item>
+          <!--mfaLevel-->
+          <el-form-item :label="$t('config.user.mfaTitle')" label-width="200px" prop="mfaTitle">
+            <el-select id="account-input-mfaLevel"
+                       v-model="editUser.mfaLevel"
+                       class="right-box__select"
+                       clearable
+                       collapse-tags
+                       placeholder=""
+                       popper-class="right-box-select-dropdown prevent-clickoutside"
+                       size="small">
+              <template v-for="item in mfaLevelList">
+                <el-option :key="item.value" :label="item.label" :value="item.value"></el-option>
+              </template>
+            </el-select>
+          </el-form-item>
           <!--email-->
           <el-form-item label="E-mail" prop="email">
             <el-input id="account-input-email" v-model="editUser.email" maxlength="64" show-word-limit placeholder="" size="small" type="text"></el-input>
@@ -151,7 +166,12 @@ export default {
           { type: 'email', message: this.$t('validate.email') }
         ]
       },
-      roles: []
+      roles: [],
+      mfaLevelList: [
+        { value: 0, label: this.$t('config.user.disable') },
+        { value: 1, label: this.$t('config.user.enableMfa') },
+        { value: 2, label: this.$t('config.user.forceEnable') }
+      ]
     }
   },
   watch: {

nezha-fronted/src/components/common/table/settings/userTable.vue

@@ -34,7 +34,13 @@
         <div class="col-resize-area"></div>
       </template>
       <template slot-scope="scope" :column="item">
-        <template v-if="item.prop === 'roles'">
+        <template v-if="item.prop === 'name'">
+          <div class="flex-align-center">
+            <span>{{scope.row[item.prop]}}</span>
+            <el-tag size="mini" v-if="mfaEnable || scope.row.mfaLevel > 0" style="margin-left: 5px">Mfa</el-tag>
+          </div>
+        </template>
+        <template v-else-if="item.prop === 'roles'">
           <template v-if="scope.row[item.prop]">
             {{scope.row[item.prop].map(t=>t.name).join(',')}}
           </template>
@@ -135,7 +141,8 @@ export default {
           show: true,
           width: 100
         }
-      ]
+      ],
+      mfaEnable: localStorage.getItem('nz-mfa-enable')
     }
   },
   methods: {
@@ -162,3 +169,9 @@ export default {
   }
 }
 </script>
+<style scoped>
+  .flex-align-center{
+    display: flex;
+    align-items: center;
+  }
+</style>

nezha-fronted/src/components/page/config/user.vue

@@ -72,7 +72,8 @@ export default {
         roleIds: '',
         roles: [],
         lang: '',
-        notifications: []
+        notifications: [],
+        mfaLevel: 0
       },
       tableId: 'userTable',
       searchMsg: { // 给搜索框子组件传递的信息
@@ -114,6 +115,9 @@ export default {
             pin: '',
             pinChange: ''
           }
+          if (!this.object.mfaLevel) {
+            this.object.mfaLevel = 0
+          }
           this.rightBox.show = true
         }
       })

nezha-fronted/src/store/user.js

@@ -50,6 +50,7 @@ const user = {
       localStorage.setItem('nz-sys-max-terminal-num', res.data.maxTerminalNum)
       localStorage.setItem('nz-sys-asset-ping-switch', res.data.assetPingSwitch)
       localStorage.setItem('nz-unnsaved-change', res.data.unsavedChange)
+      localStorage.setItem('nz-mfa-enable', res.data.mfaAuthEnable)
       post('/sys/user/permissions', { token: res.data.token }).then(res => {
         const menuList = sortByOrderNum(res.data.menus)
         store.commit('setMenuList', menuList)