a

components/i/Nav.vue

@@ -42,6 +42,11 @@
                 </UButton>
             </template>
         </div>
+        <UButton
+            class="flex flex-grow gap-2 justify-center"
+            leading-icon="i-heroicons-user-circle-20-solid"
+            label="登录"
+        />
     </div>
 </template>
 <script setup>

components/i/UserInfo.vue

 <template>
     <div class="flex flex-col w-full">
+        <template v-if="$isSignIn">
             <div class="flex flex-grow justify-between items-center gap-2 p-4">
-            <UDropdown v-if="$isSignIn" class="flex flex-grow" :items="items">
+                <UDropdown class="flex flex-grow" :items="items">
                     <UButton class="flex flex-grow gap-2" color="gray" variant="ghost">
                         <UAvatar :src="$info.avatar" />
                         <div>{{ $info.name }}</div>
@@ -10,14 +11,9 @@
                         <UIcon name="i-heroicons-chevron-down-20-solid" />
                     </UButton>
                 </UDropdown>
-            <UButton
-                v-else
-                class="flex flex-grow gap-2 justify-center"
-                leading-icon="i-heroicons-user-circle-20-solid"
-                label="登录"
-            />
             </div>
             <UDivider />
+        </template>
         <div class="flex justify-between gap-2 p-4">
             <UButton
                 class="flex-grow"
@@ -32,11 +28,13 @@
                 aria-label="Theme"
                 @click="isDark = !isDark"
             />
+            <UDropdown class="flex" :items="i18nItems">
                 <UButton
                     icon="i-heroicons-language-20-solid"
                     color="gray"
                     variant="ghost"
                 />
+            </UDropdown>
         </div>
     </div>
 </template>
@@ -70,4 +68,15 @@ const items = [
         }
     ]
 ]
+
+const i18nItems = [
+    [
+        {
+            label: '简体中文'
+        },
+        {
+            label: 'English'
+        }
+    ]
+]
 </script>