From 625645dad4e4b28cd52255a54ffa7c4f2239d2f6 Mon Sep 17 00:00:00 2001
From: congsh <congsh@jiulu-gameplay.com.cn>
Date: Thu, 23 Apr 2026 17:21:04 +0800
Subject: [PATCH] fix: approval queue loading timing and sync issues

- Fix GroupMembersPanel join requests not loading when navigating
  from homepage (onMounted timing issue), replaced with watch
- Fix GroupView pending count not syncing after reject/approve,
  added requestHandled event communication between components
- Update changelog with all v0.3.5 fixes and new features

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 .../src/components/group/GroupMembersPanel.vue    | 15 ++++++++++-----
 frontend/src/views/Changelog.vue                  |  6 +++++-
 frontend/src/views/GroupView.vue                  | 14 +++++++++-----
 3 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/frontend/src/components/group/GroupMembersPanel.vue b/frontend/src/components/group/GroupMembersPanel.vue
index 7bd1bac..485511f 100644
--- a/frontend/src/components/group/GroupMembersPanel.vue
+++ b/frontend/src/components/group/GroupMembersPanel.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, ref, onMounted, onUnmounted } from 'vue'
+import { computed, ref, watch, onUnmounted } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { useGroupStore } from '@/stores/group'
 import { useUserStore } from '@/stores/user'
@@ -18,6 +18,7 @@ import JoinRequestCard from './JoinRequestCard.vue'
 
 const groupStore = useGroupStore()
 const userStore = useUserStore()
+const emit = defineEmits<{ requestHandled: [] }>()
 
 const group = computed(() => groupStore.currentGroup)
 const members = computed(() => groupStore.currentMembers)
@@ -33,14 +34,17 @@ const inviteLink = computed(() => {
   return `${window.location.origin}/join/group/${group.value.id}`
 })
 
-onMounted(async () => {
-  if (group.value && canManage.value) {
+let subscribedGroupId = ''
+
+watch(group, async (g) => {
+  if (g && canManage.value && g.id !== subscribedGroupId) {
+    subscribedGroupId = g.id
     await loadJoinRequests()
-    subscribeJoinRequests(group.value.id, () => {
+    subscribeJoinRequests(g.id, () => {
       loadJoinRequests()
     })
   }
-})
+}, { immediate: true })
 
 onUnmounted(() => {
   // cleanup handled by PocketBase
@@ -125,6 +129,7 @@ async function onJoinRequestResponded(requestId: string) {
   if (group.value) {
     await groupStore.setCurrentGroup(group.value.id)
   }
+  emit('requestHandled')
 }
 
 async function handleTransferOwnership(userId: string, username: string) {
diff --git a/frontend/src/views/Changelog.vue b/frontend/src/views/Changelog.vue
index 4bec289..ccb05d7 100644
--- a/frontend/src/views/Changelog.vue
+++ b/frontend/src/views/Changelog.vue
@@ -12,9 +12,13 @@ interface LogEntry {
 const logs = ref<LogEntry[]>([
   {
     version: 'v0.3.5',
-    date: '2026-04-21',
+    date: '2026-04-23',
     title: 'Bug 修复与体验优化',
     items: [
+      { type: 'feat', text: '群组页面顶部新增待审核入群申请徽章（脉冲动画提示），点击可滚动定位到审核列表' },
+      { type: 'feat', text: '个人中心新增"我的入群申请"记录，展示申请状态、时间和拒绝原因' },
+      { type: 'fix', text: '修复群组审核队列从首页进入时不显示的问题，改用 watch 监听群组数据加载' },
+      { type: 'fix', text: '修复拒绝入群申请后标题区待审核计数不同步更新的问题' },
       { type: 'fix', text: '修复邀请链接复制在 HTTP 环境下报错的问题，添加 execCommand 降级方案' },
       { type: 'fix', text: '修复小队邀请链接页面未加载用户群组数据，导致始终提示"需要先加入群组"' },
       { type: 'fix', text: '修复加入群组页面 isMember 判断错误，使用了群组对象而非用户 ID' },
diff --git a/frontend/src/views/GroupView.vue b/frontend/src/views/GroupView.vue
index 2e3392a..5058709 100644
--- a/frontend/src/views/GroupView.vue
+++ b/frontend/src/views/GroupView.vue
@@ -82,15 +82,19 @@ const statusColors: Record<string, string> = {
   away: 'var(--gg-text-muted)'
 }
 
-onMounted(async () => {
-  await groupStore.setCurrentGroup(groupId)
-
-  // 加载待审核入群申请（管理员可见）
+async function refreshPendingRequests() {
   if (canManage.value) {
     try {
       pendingJoinRequests.value = await getGroupJoinRequests(groupId)
     } catch { /* ignore */ }
   }
+}
+
+onMounted(async () => {
+  await groupStore.setCurrentGroup(groupId)
+
+  // 加载待审核入群申请（管理员可见）
+  await refreshPendingRequests()
 
   // 订阅用户状态变更
   unsubFns.push(await pb.collection('users').subscribe('*', () => {
@@ -296,7 +300,7 @@ function scrollToRequests() {
 
       <!-- 右列: 群组成员管理面板 -->
       <aside class="right-col">
-        <GroupMembersPanel />
+        <GroupMembersPanel @request-handled="refreshPendingRequests" />
       </aside>
         </div>
       </el-tab-pane>