fix：增加用户中心，完成Apikey功能页，增加角色工具方法

Yi.Ai.Vue3/src/layouts/components/Header/components/Avatar.vue

@@ -32,14 +32,19 @@ const popoverRef = ref();
 
 // 弹出面板内容
 const popoverList = ref([
+  // {
+  //   key: '1',
+  //   title: '收藏夹',
+  //   icon: 'book-mark-fill',
+  // },
+  // {
+  //   key: '2',
+  //   title: '设置',
+  //   icon: 'settings-4-fill',
+  // },
   {
-    key: '1',
-    title: '收藏夹',
-    icon: 'book-mark-fill',
-  },
-  {
-    key: '2',
-    title: '设置',
+    key: '5',
+    title: '用户中心',
     icon: 'settings-4-fill',
   },
   {
@@ -53,6 +58,25 @@ const popoverList = ref([
   },
 ]);
 
+const dialogVisible = ref(false);
+const navItems = [
+  // { name: 'user', label: '用户管理', icon: 'User' },
+  // { name: 'role', label: '角色管理', icon: 'Avatar' },
+  // { name: 'permission', label: '权限管理', icon: 'Key' },
+  { name: 'apiKey', label: 'API密钥', icon: 'Key' },
+];
+function openDialog() {
+  dialogVisible.value = true;
+}
+function handleConfirm(activeNav: string) {
+  console.log('确认操作，当前导航:', activeNav);
+  ElMessage.success('操作成功');
+}
+
+function handleNavChange(nav: string) {
+  console.log('导航切换:', nav);
+}
+
 // 点击
 function handleClick(item: any) {
   switch (item.key) {
@@ -64,6 +88,10 @@ function handleClick(item: any) {
       ElMessage.warning('暂未开放');
       console.log('点击了设置');
       break;
+    case '5':
+      console.log('点击了用户中心');
+      openDialog();
+      break;
     case '4':
       popoverRef.value?.hide?.();
       ElMessageBox.confirm('退出登录不会丢失任何数据，你仍可以登录此账号。', '确认退出登录？', {
@@ -226,6 +254,32 @@ function openVipGuide() {
         </div>
       </Popover>
     </div>
+    <nav-dialog
+      v-model="dialogVisible"
+      title="用户中心"
+      :nav-items="navItems"
+      @confirm="handleConfirm"
+      @nav-change="handleNavChange"
+    >
+      <!-- 用户管理内容 -->
+      <template #user>
+        <user-management />
+      </template>
+
+      <!-- 角色管理内容 -->
+      <template #role>
+        <!--        <role-management /> -->
+      </template>
+
+      <!-- 权限管理内容 -->
+      <template #permission>
+        <!--        <permission-management /> -->
+      </template>
+
+      <template #apiKey>
+        <APIKeyManagement />
+      </template>
+    </nav-dialog>
   </div>
 </template>