From 387e9956341ab4b2c4f6ba6d4dc304956c0047fa Mon Sep 17 00:00:00 2001
From: Timi <imyeyu6@qq.com>
Date: Sat, 22 Aug 2026 11:00:49 +0800
Subject: [PATCH] fix role list

---
 src/pages/user/UserList.vue | 26 +++++++++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/src/pages/user/UserList.vue b/src/pages/user/UserList.vue
index 7dbb575..378d6cc 100644
--- a/src/pages/user/UserList.vue
+++ b/src/pages/user/UserList.vue
@@ -23,7 +23,17 @@
 					<template #title>
 						<div class="header">
 							<span class="name" v-text="getUserName(item)" />
-							<t-tag class="meta" size="small" theme="success" variant="outline" :content="getRoleName(item)" />
+							<div class="meta-list">
+								<t-tag
+									v-for="(roleName, index) in getRoleNameList(item)"
+									:key="`${roleName}-${index}`"
+									class="meta"
+									size="small"
+									theme="success"
+									variant="outline"
+									:content="roleName"
+								/>
+							</div>
 						</div>
 					</template>
 					<template #description>
@@ -132,8 +142,11 @@ function getUserName(item: ManagedUser): string {
 	return item.user?.nick || item.user?.name || "未命名用户";
 }
 
-function getRoleName(item: ManagedUser): string {
-	return getRoleDisplayName(getManagedUserRoleList(item)[0], permissionStore.roleList);
+function getRoleNameList(item: ManagedUser): string[] {
+	const roleList = getManagedUserRoleList(item);
+	return roleList.length
+		? roleList.map(role => getRoleDisplayName(role, permissionStore.roleList))
+		: [getRoleDisplayName(undefined, permissionStore.roleList)];
 }
 
 // ---------- 头像 ----------
@@ -256,6 +269,13 @@ onUnmounted(() => navBarStore.clearRight());
 			align-items: center;
 			justify-content: space-between;
 		}
+
+		.meta-list {
+			gap: .25rem;
+			display: flex;
+			flex-wrap: wrap;
+			justify-content: flex-end;
+		}
 	}
 }