From 2f833fcc0adb7d3258e00a5975ed2603980a0702 Mon Sep 17 00:00:00 2001 From: bob <312777916@qq.com> Date: Thu, 7 Nov 2024 17:40:25 +0800 Subject: [PATCH] =?UTF-8?q?=E9=80=9A=E8=AE=AF=E5=BD=95=E4=B8=AD=E7=BE=A4?= =?UTF-8?q?=E7=BB=84=E5=A2=9E=E5=8A=A0=E6=90=9C=E7=B4=A2=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/group.js | 4 ++ .../group/ContactListGroupItem.vue | 2 +- src/components/item/ContactItem.vue | 1 + src/views/contactList/group/SubAll.vue | 59 +++++++++++++++---- src/views/contactList/user/SubAll.vue | 4 +- 5 files changed, 54 insertions(+), 16 deletions(-) diff --git a/src/api/group.js b/src/api/group.js index 5ae1cac..2721f9d 100644 --- a/src/api/group.js +++ b/src/api/group.js @@ -8,3 +8,7 @@ export const groupCreateService = (obj) => { export const groupListService = () => { return request.post('/groupmng/queryGroupList', getReqBody()) } + +export const groupSearchByMemberService = (obj) => { + return request.post('/groupmng/searchGroupByMember', getReqBody(obj)) +} diff --git a/src/components/contactList/group/ContactListGroupItem.vue b/src/components/contactList/group/ContactListGroupItem.vue index 7432f34..bed532d 100644 --- a/src/components/contactList/group/ContactListGroupItem.vue +++ b/src/components/contactList/group/ContactListGroupItem.vue @@ -32,7 +32,7 @@ const goToSessionTab = () => { @showGroupCard="onShowGroupCard" style="width: 300px; margin-right: 20px" > - +
diff --git a/src/components/item/ContactItem.vue b/src/components/item/ContactItem.vue index 02ae772..8d06372 100644 --- a/src/components/item/ContactItem.vue +++ b/src/components/item/ContactItem.vue @@ -66,6 +66,7 @@ const onOpenSession = () => { margin-left: 5px; flex: 1; overflow: hidden; + user-select: text; .title { height: 20px; diff --git a/src/views/contactList/group/SubAll.vue b/src/views/contactList/group/SubAll.vue index 7f39fb2..6febc59 100644 --- a/src/views/contactList/group/SubAll.vue +++ b/src/views/contactList/group/SubAll.vue @@ -10,15 +10,22 @@ import { combineId } from '@/js/utils/common' import { userQueryService } from '@/api/user' import { ElLoading, ElMessage } from 'element-plus' import { el_loading_options } from '@/const/commonConst' -import { groupCreateService } from '@/api/group' +import { groupCreateService, groupSearchByMemberService } from '@/api/group' import ContactListGroupItem from '@/components/contactList/group/ContactListGroupItem.vue' const groupData = groupStore() const userData = userStore() const messageData = messageStore() -const totalCount = ref(0) const searchKey = ref('') const isShowSelectDialog = ref(false) +const allData = ref([]) + +onMounted(async () => { + messageData.loadSessionList() + await groupData.loadGroupList() //页面打开要立即展示，所以用await + allData.value = Object.values(groupData.groupList) +}) + const selectDialogOptions = computed(() => { const data = {} Object.values(messageData.sessionList).forEach((item) => { @@ -27,13 +34,37 @@ const selectDialogOptions = computed(() => { return data }) -onMounted(async () => { - messageData.loadSessionList() - groupData.loadGroupList() -}) +// 这里不能使用计算属性的特点去改变allData的值 +// 因为这里有云端查询，会有延迟，会二次改变allData，造成页面数据跳变 +let timer +const onSearch = () => { + if (!searchKey.value) return + clearTimeout(timer) + const key = searchKey.value + timer = setTimeout(() => { + const searchResult = [] + groupSearchByMemberService({ searchKey: key }).then((res) => { + res.data.data?.forEach((item) => { + searchResult.push(item.groupId) + }) -const allData = computed(() => { - return Object.values(groupData.groupList) + const data = [] + Object.values(groupData.groupList).forEach((item) => { + if ( + item.groupName.toLowerCase().includes(searchKey.value.toLowerCase()) || + item.groupId === searchKey.value || + searchResult.includes(item.groupId) + ) { + data.push(item) + } + }) + allData.value = data + }) + }, 300) +} + +const totalCount = computed(() => { + return Object.keys(allData.value).length }) const onCreateGroup = () => { @@ -76,7 +107,7 @@ const onConfirmSelect = async (selected) => { groupType: 1, //普通群 accounts: selected.map((item) => item.account) }) - console.log(res.data.data) + groupData.addGroup(res.data.data.groupInfo) isShowSelectDialog.value = false } @@ -87,10 +118,11 @@ const onConfirmSelect = async (selected) => {
全部({{ totalCount }})
@@ -103,6 +135,9 @@ const onConfirmSelect = async (selected) => { :groupInfo="item" @showUserCard="onShowUserCard" > +
@@ -142,7 +177,7 @@ const onConfirmSelect = async (selected) => { align-items: center; .el-input { - width: 210px; + width: 300px; height: 30px; margin-right: 10px; diff --git a/src/views/contactList/user/SubAll.vue b/src/views/contactList/user/SubAll.vue index 2274f56..3f49c06 100644 --- a/src/views/contactList/user/SubAll.vue +++ b/src/views/contactList/user/SubAll.vue @@ -22,8 +22,6 @@ onMounted(async () => { const searchKey = ref('') const allData = computed(() => { - if (Object.values(messageData.sessionList).length === 0) return [] - const data = [] Object.values(messageData.sessionList).forEach((item) => { const sessionType = item.sessionType @@ -42,7 +40,7 @@ const allData = computed(() => { }) if (data.length === 0) { - return [] + return data } else { return data.sort((a, b) => { const bTime = new Date(b.lastMsgTime).getTime()