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">
-        <div class="flex flex-grow justify-between items-center gap-2 p-4">
-            <UDropdown v-if="$isSignIn" 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>
-                    <UBadge v-if="$info.pro" size="xs" color="purple" variant="soft" label="PRO" />
-                    <UBadge v-else size="xs" color="gray" variant="soft" label="FREE" />
-                    <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 v-if="$isSignIn">
+            <div class="flex flex-grow justify-between items-center gap-2 p-4">
+                <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>
+                        <UBadge v-if="$info.pro" size="xs" color="purple" variant="soft" label="PRO" />
+                        <UBadge v-else size="xs" color="gray" variant="soft" label="FREE" />
+                        <UIcon name="i-heroicons-chevron-down-20-solid" />
+                    </UButton>
+                </UDropdown>
+            </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"
             />
-            <UButton
-                icon="i-heroicons-language-20-solid"
-                color="gray"
-                variant="ghost"
-            />
+            <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>