From 72d8c499a48b4095c91145ae5a9e47f35d556575 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 22 May 2026 20:15:15 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(im):=20=E4=BF=AE=E4=B8=80?=
 =?UTF-8?q?=E6=89=B9=E7=AE=A1=E7=90=86=E7=AB=AF=E7=BB=9F=E8=AE=A1=E4=B8=8E?=
 =?UTF-8?q?=E6=88=90=E5=91=98=E9=80=89=E6=8B=A9=E5=99=A8=E7=BB=86=E8=8A=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 消息趋势 / 用户趋势图表加 loading 态（接口错误由全局拦截器统一提示）
- 群成员选择器 grid 模式补右上角 × 移除按钮
- 统计接口 6 个 API 补全返回值泛型
---
 src/api/im/manager/statistics/index.ts           | 16 ++++++++++------
 .../components/picker/GroupMemberPickerPanel.vue | 12 ++++++++++--
 .../statistics/components/MessageTrendChart.vue  | 12 +++++++++---
 .../statistics/components/UserTrendChart.vue     | 12 +++++++++---
 4 files changed, 38 insertions(+), 14 deletions(-)

diff --git a/src/api/im/manager/statistics/index.ts b/src/api/im/manager/statistics/index.ts
index 675a5cd82..10d10fe5e 100644
--- a/src/api/im/manager/statistics/index.ts
+++ b/src/api/im/manager/statistics/index.ts
@@ -37,30 +37,34 @@ export interface ImStatisticsTopSenderVO {
 
 // 获得 KPI 概览
 export const getStatisticsOverview = (): Promise<ImStatisticsOverviewVO> => {
-  return request.get({ url: '/im/manager/statistics/overview' })
+  return request.get<ImStatisticsOverviewVO>({ url: '/im/manager/statistics/overview' })
 }
 
 // 获得消息趋势（私聊 + 群聊双线）
 export const getMessageTrend = (days: number): Promise<ImStatisticsTrendVO> => {
-  return request.get({ url: '/im/manager/statistics/message-trend', params: { days } })
+  return request.get<ImStatisticsTrendVO>({ url: '/im/manager/statistics/message-trend', params: { days } })
 }
 
 // 获得用户趋势（新增注册 + 日活双线）
 export const getUserTrend = (days: number): Promise<ImStatisticsTrendVO> => {
-  return request.get({ url: '/im/manager/statistics/user-trend', params: { days } })
+  return request.get<ImStatisticsTrendVO>({ url: '/im/manager/statistics/user-trend', params: { days } })
 }
 
 // 获得消息类型分布（最近 30 天）
 export const getMessageTypeDistribution = (): Promise<ImStatisticsMessageTypeVO[]> => {
-  return request.get({ url: '/im/manager/statistics/message-type-distribution' })
+  return request.get<ImStatisticsMessageTypeVO[]>({
+    url: '/im/manager/statistics/message-type-distribution'
+  })
 }
 
 // 获得群规模分布
 export const getGroupSizeDistribution = (): Promise<ImStatisticsGroupSizeVO[]> => {
-  return request.get({ url: '/im/manager/statistics/group-size-distribution' })
+  return request.get<ImStatisticsGroupSizeVO[]>({
+    url: '/im/manager/statistics/group-size-distribution'
+  })
 }
 
 // 获得消息 TOP 发送者（最近 30 天）
 export const getTopSenders = (): Promise<ImStatisticsTopSenderVO[]> => {
-  return request.get({ url: '/im/manager/statistics/top-senders' })
+  return request.get<ImStatisticsTopSenderVO[]>({ url: '/im/manager/statistics/top-senders' })
 }
diff --git a/src/views/im/home/components/picker/GroupMemberPickerPanel.vue b/src/views/im/home/components/picker/GroupMemberPickerPanel.vue
index ecb948be2..101dd79b6 100644
--- a/src/views/im/home/components/picker/GroupMemberPickerPanel.vue
+++ b/src/views/im/home/components/picker/GroupMemberPickerPanel.vue
@@ -84,13 +84,21 @@
           </div>
         </template>
 
-        <!-- grid 形态：宫格预览（管理员设置等场景沿用） -->
+        <!-- grid 形态：宫格预览；非 locked 成员右上角叠加 × 移除（locked 不渲染） -->
         <div v-else class="flex flex-wrap p-2.5">
           <GroupMemberGrid
             v-for="member in selectedMembers"
             :key="member.userId"
             :member="member"
-          />
+          >
+            <Icon
+              v-if="!isLocked(member)"
+              icon="ant-design:close-circle-filled"
+              :size="16"
+              class="absolute top-0 right-0 cursor-pointer transition-colors text-[var(--el-text-color-placeholder)] hover:text-[var(--el-color-danger)]"
+              @click="handleToggle(member)"
+            />
+          </GroupMemberGrid>
         </div>
 
         <div
diff --git a/src/views/im/manager/statistics/components/MessageTrendChart.vue b/src/views/im/manager/statistics/components/MessageTrendChart.vue
index f8790ca3d..81c40b2df 100644
--- a/src/views/im/manager/statistics/components/MessageTrendChart.vue
+++ b/src/views/im/manager/statistics/components/MessageTrendChart.vue
@@ -10,7 +10,7 @@
         </el-select>
       </div>
     </template>
-    <div ref="chartRef" style="width: 100%; height: 320px"></div>
+    <div ref="chartRef" v-loading="loading" style="width: 100%; height: 320px"></div>
   </el-card>
 </template>
 
@@ -22,6 +22,7 @@ defineOptions({ name: 'ImStatisticsMessageTrendChart' })
 
 const chartRef = ref<HTMLElement>()
 const days = ref(7)
+const loading = ref(false)
 let chart: echarts.ECharts | null = null
 
 const buildOption = (dates: string[], priv: number[], grp: number[]): echarts.EChartsCoreOption => ({
@@ -71,8 +72,13 @@ const buildOption = (dates: string[], priv: number[], grp: number[]): echarts.EC
 })
 
 const loadData = async () => {
-  const data = await StatisticsApi.getMessageTrend(days.value)
-  chart?.setOption(buildOption(data.dates, data.series.private || [], data.series.group || []))
+  loading.value = true
+  try {
+    const data = await StatisticsApi.getMessageTrend(days.value)
+    chart?.setOption(buildOption(data.dates, data.series.private || [], data.series.group || []))
+  } finally {
+    loading.value = false
+  }
 }
 
 onMounted(async () => {
diff --git a/src/views/im/manager/statistics/components/UserTrendChart.vue b/src/views/im/manager/statistics/components/UserTrendChart.vue
index 56e1bf426..d218d8e34 100644
--- a/src/views/im/manager/statistics/components/UserTrendChart.vue
+++ b/src/views/im/manager/statistics/components/UserTrendChart.vue
@@ -10,7 +10,7 @@
         </el-select>
       </div>
     </template>
-    <div ref="chartRef" style="width: 100%; height: 320px"></div>
+    <div ref="chartRef" v-loading="loading" style="width: 100%; height: 320px"></div>
   </el-card>
 </template>
 
@@ -22,6 +22,7 @@ defineOptions({ name: 'ImStatisticsUserTrendChart' })
 
 const chartRef = ref<HTMLElement>()
 const days = ref(7)
+const loading = ref(false)
 let chart: echarts.ECharts | null = null
 
 const buildOption = (dates: string[], reg: number[], act: number[]): echarts.EChartsCoreOption => ({
@@ -50,8 +51,13 @@ const buildOption = (dates: string[], reg: number[], act: number[]): echarts.ECh
 })
 
 const loadData = async () => {
-  const data = await StatisticsApi.getUserTrend(days.value)
-  chart?.setOption(buildOption(data.dates, data.series.register || [], data.series.active || []))
+  loading.value = true
+  try {
+    const data = await StatisticsApi.getUserTrend(days.value)
+    chart?.setOption(buildOption(data.dates, data.series.register || [], data.series.active || []))
+  } finally {
+    loading.value = false
+  }
 }
 
 onMounted(async () => {