From 45d8391885d19598a04c884712885b9a8cc63e40 Mon Sep 17 00:00:00 2001
From: Ryan Wang <i@ryanc.cc>
Date: Mon, 19 Feb 2024 15:23:28 +0800
Subject: [PATCH] fix: fail to fetch correct user avatar (#5369)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#### What type of PR is this?

/area ui
/kind bug
/milestone 2.13.x

#### What this PR does / why we need it:

修复 Console 中用户头像无法正确获取的问题。

#### Which issue(s) this PR fixes:

Fixes #5368

#### Special notes for your reviewer:

测试方式：

1. 创建若干用户，并为部分用户设置不同的头像。
2. 分别进入不同用户的个人资料页面，观察头像是否符合预期。

#### Does this PR introduce a user-facing change?

```release-note
修复 Console 中用户头像无法正确获取的问题。
```
---
 ui/src/components/user-avatar/UserAvatar.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/user-avatar/UserAvatar.vue b/ui/src/components/user-avatar/UserAvatar.vue
index 4d5b02447..5bd75b03e 100644
--- a/ui/src/components/user-avatar/UserAvatar.vue
+++ b/ui/src/components/user-avatar/UserAvatar.vue
@@ -13,7 +13,7 @@ import {
   Dialog,
   VLoading,
 } from "@halo-dev/components";
-import { ref, defineAsyncComponent, type Ref } from "vue";
+import { ref, defineAsyncComponent, type Ref, toRefs } from "vue";
 import { usePermission } from "@/utils/permission";
 import { useQuery, useQueryClient } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
@@ -32,12 +32,14 @@ const props = withDefaults(
   }
 );
 
+const { isCurrentUser, name } = toRefs(props);
+
 const queryClient = useQueryClient();
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
 
 const { data: avatar, isFetching } = useQuery({
-  queryKey: ["user-avatar", props.name, props.isCurrentUser],
+  queryKey: ["user-avatar", name, isCurrentUser],
   queryFn: async () => {
     const { data } = props.isCurrentUser
       ? await apiClient.user.getCurrentUserDetail()