From 5367b3b4d92588c4e76728e6bd4ad6aae0cbb967 Mon Sep 17 00:00:00 2001
From: 云 <2163098428@qq.com>
Date: 星期四, 23 七月 2026 13:05:25 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/dev_pro2.0' into dev_pro2.0
---
src/views/im/manager/group/modules/detail.vue | 151 ++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 151 insertions(+), 0 deletions(-)
diff --git a/src/views/im/manager/group/modules/detail.vue b/src/views/im/manager/group/modules/detail.vue
new file mode 100644
index 0000000..d182b3f
--- /dev/null
+++ b/src/views/im/manager/group/modules/detail.vue
@@ -0,0 +1,151 @@
+<script lang="ts" setup>
+import type { ImManagerGroupApi } from '#/api/im/manager/group';
+
+import { computed, ref } from 'vue';
+
+import { CommonStatusEnum, DICT_TYPE } from '#/packages/constants/src';
+
+import {
+ Avatar,
+ Checkbox,
+ Descriptions,
+ DescriptionsItem,
+ Drawer,
+ Table,
+ Tag,
+} from 'ant-design-vue';
+
+import { getManagerGroupMemberList } from '#/api/im/manager/group';
+import { DictTag } from '#/components/dict-tag';
+import {
+ formatDateTimeText,
+ formatUserLabel,
+} from '#/views/im/manager/utils/format';
+
+const visible = ref(false);
+const detail = ref<ImManagerGroupApi.Group>({} as ImManagerGroupApi.Group);
+const loading = ref(false);
+const activeOnly = ref(true);
+const memberList = ref<ImManagerGroupApi.GroupMember[]>([]);
+
+const filteredMembers = computed(() =>
+ activeOnly.value
+ ? memberList.value.filter((item) => item.status === CommonStatusEnum.ENABLE)
+ : memberList.value,
+);
+
+const columns = [
+ { title: '澶村儚', dataIndex: 'avatar', width: 80 },
+ { title: '鐢ㄦ埛缂栧彿', dataIndex: 'userId', width: 100 },
+ { title: '瑙掕壊', dataIndex: 'role', width: 100 },
+ { title: '鏄电О', dataIndex: 'nickname' },
+ { title: '缁勫唴鏄剧ず鍚�', dataIndex: 'displayUserName' },
+ { title: '缇ゅ娉�', dataIndex: 'groupRemark' },
+ { title: '鍏嶆墦鎵�', dataIndex: 'silent', width: 90 },
+ { title: '鐘舵��', dataIndex: 'status', width: 100 },
+ { title: '鍏ョ兢鏃堕棿', dataIndex: 'joinTime', width: 180 },
+ { title: '閫�缇ゆ椂闂�', dataIndex: 'quitTime', width: 180 },
+ { title: '绂佽█鐘舵��', dataIndex: 'muteEndTime', width: 180 },
+];
+
+/** 鎵撳紑璇︽儏 */
+async function open(row: ImManagerGroupApi.Group) {
+ detail.value = row;
+ visible.value = true;
+ activeOnly.value = true;
+ loading.value = true;
+ try {
+ memberList.value = await getManagerGroupMemberList(row.id);
+ } finally {
+ loading.value = false;
+ }
+}
+
+defineExpose({ open });
+</script>
+
+<template>
+ <Drawer v-model:open="visible" destroy-on-close title="缇よ鎯�" width="900">
+ <Descriptions bordered :column="2">
+ <DescriptionsItem label="缇ょ紪鍙�">{{ detail.id }}</DescriptionsItem>
+ <DescriptionsItem label="缇ゅ悕绉�">{{ detail.name }}</DescriptionsItem>
+ <DescriptionsItem label="澶村儚">
+ <Avatar :src="detail.avatar" :size="36">
+ {{ detail.name?.charAt(0) || '?' }}
+ </Avatar>
+ </DescriptionsItem>
+ <DescriptionsItem label="缇や富">
+ {{ formatUserLabel(detail.ownerNickname, detail.ownerUserId) }}
+ </DescriptionsItem>
+ <DescriptionsItem label="鎴愬憳鏁�">{{ detail.memberCount || 0 }}</DescriptionsItem>
+ <DescriptionsItem label="缇ょ姸鎬�">
+ <DictTag :type="DICT_TYPE.IM_GROUP_STATUS" :value="detail.status" />
+ </DescriptionsItem>
+ <DescriptionsItem label="灏佺鐘舵��">
+ <DictTag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="detail.banned" />
+ <span v-if="detail.banned" class="ml-2 text-gray-400">
+ {{ detail.bannedReason }}
+ </span>
+ </DescriptionsItem>
+ <DescriptionsItem label="鍏ㄧ兢绂佽█">
+ <Tag v-if="detail.mutedAll" color="error">宸茬瑷�</Tag>
+ <Tag v-else>鏈瑷�</Tag>
+ </DescriptionsItem>
+ <DescriptionsItem label="缇ゅ叕鍛�" :span="2">
+ {{ detail.notice || '-' }}
+ </DescriptionsItem>
+ <DescriptionsItem label="鍒涘缓鏃堕棿" :span="2">
+ {{ formatDateTimeText(detail.createTime) }}
+ </DescriptionsItem>
+ </Descriptions>
+
+ <div class="mb-4 mt-5 flex items-center justify-between">
+ <span class="font-bold">缇ゆ垚鍛�</span>
+ <Checkbox v-model:checked="activeOnly">浠呭睍绀哄綋鍓嶇兢鍐呯殑鎴愬憳</Checkbox>
+ </div>
+ <Table
+ :columns="columns"
+ :data-source="filteredMembers"
+ :loading="loading"
+ :pagination="false"
+ bordered
+ row-key="userId"
+ size="small"
+ >
+ <template #bodyCell="{ column, record, text }">
+ <template v-if="column.dataIndex === 'avatar'">
+ <Avatar :src="record.avatar" :size="40">
+ {{ record.nickname?.charAt(0) || '?' }}
+ </Avatar>
+ </template>
+ <template v-else-if="column.dataIndex === 'role'">
+ <DictTag :type="DICT_TYPE.IM_GROUP_MEMBER_ROLE" :value="record.role" />
+ </template>
+ <template v-else-if="column.dataIndex === 'silent'">
+ <DictTag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="record.silent" />
+ </template>
+ <template v-else-if="column.dataIndex === 'status'">
+ <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="record.status" />
+ </template>
+ <template v-else-if="column.dataIndex === 'joinTime'">
+ {{ formatDateTimeText(record.joinTime) }}
+ </template>
+ <template v-else-if="column.dataIndex === 'quitTime'">
+ {{ formatDateTimeText(record.quitTime) }}
+ </template>
+ <template v-else-if="column.dataIndex === 'muteEndTime'">
+ <template v-if="record.muteEndTime && new Date(record.muteEndTime) > new Date()">
+ <Tag color="error">绂佽█涓�</Tag>
+ <div class="mt-1 text-xs text-gray-400">
+ {{ formatDateTimeText(record.muteEndTime) }}
+ </div>
+ </template>
+ <span v-else>-</span>
+ </template>
+ <template v-else>
+ {{ text || '-' }}
+ </template>
+ </template>
+ </Table>
+ </Drawer>
+</template>
--
Gitblit v1.9.3