feat: 优化二步验证界面，添加状态提示和描述信息，提升用户体验

src/components/common/google-auth.vue

@@ -114,7 +114,17 @@ async function disableTwoFactor() {
   <div class="google-auth">
     <template v-if="!twoFactorEnabled">
       <template v-if="!qrCodeUrl">
-        <NButton type="primary" :loading="loading" @click="enableTwoFactor">开启二步验证</NButton>
+        <NSpace vertical align="center" justify="center">
+          <NResult
+            status="success"
+            title="二步验证暂未开启"
+            description="开启二步验证可提升账户安全性，登录时需要输入动态验证码。"
+          >
+            <template #footer>
+              <NButton type="primary" :loading="loading" @click="enableTwoFactor">开启二步验证</NButton>
+            </template>
+          </NResult>
+        </NSpace>
       </template>
 
       <template v-else>
@@ -136,12 +146,16 @@ async function disableTwoFactor() {
     </template>
 
     <template v-else>
-      <NSpace align="center">
+      <NSpace vertical align="center" justify="center">
-        <div class="text-success">
+        <NResult
-          <i class="i-carbon-checkmark-filled mr-1" />
+          status="success"
-          二步验证已开启
+          title="二步验证已开启"
-        </div>
+          description="您的账户已启用二步验证，登录时需要输入动态验证码以增强安全性。"
-        <NButton type="error" :loading="disabling" @click="disableTwoFactor">关闭二步验证</NButton>
+        >
+          <template #footer>
+            <NButton type="error" :loading="disabling" @click="disableTwoFactor">关闭二步验证</NButton>
+          </template>
+        </NResult>
       </NSpace>
     </template>
   </div>

src/typings/components.d.ts

@@ -75,6 +75,7 @@ declare module 'vue' {
     NModal: typeof import('naive-ui')['NModal']
     NNotificationProvider: typeof import('naive-ui')['NNotificationProvider']
     NPopover: typeof import('naive-ui')['NPopover']
+    NResult: typeof import('naive-ui')['NResult']
     NRow: typeof import('naive-ui')['NRow']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
     NSelect: typeof import('naive-ui')['NSelect']
@@ -171,6 +172,7 @@ declare global {
   const NModal: typeof import('naive-ui')['NModal']
   const NNotificationProvider: typeof import('naive-ui')['NNotificationProvider']
   const NPopover: typeof import('naive-ui')['NPopover']
+  const NResult: typeof import('naive-ui')['NResult']
   const NRow: typeof import('naive-ui')['NRow']
   const NScrollbar: typeof import('naive-ui')['NScrollbar']
   const NSelect: typeof import('naive-ui')['NSelect']