开发搜索跳转聊天记录并查询上下文功能
This commit is contained in:
parent
e4c2b7cdcb
commit
55e13e6024
2
components.d.ts
vendored
2
components.d.ts
vendored
@ -30,6 +30,8 @@ declare module 'vue' {
|
||||
LoginMessage: typeof import('./src/components/talk/message/LoginMessage.vue')['default']
|
||||
Message: typeof import('./src/components/x-message/message/index.vue')['default']
|
||||
MixedMessage: typeof import('./src/components/talk/message/MixedMessage.vue')['default']
|
||||
NButton: typeof import('naive-ui')['NButton']
|
||||
NIcon: typeof import('naive-ui')['NIcon']
|
||||
PageAnimation: typeof import('./src/components/page-animation/index.vue')['default']
|
||||
RevokeMessage: typeof import('./src/components/talk/message/RevokeMessage.vue')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
|
@ -13,9 +13,10 @@
|
||||
v-model="virtualList"
|
||||
:loading-more-custom-style="{ display: 'none', height: '0' }"
|
||||
@scrolltolower="onScrollToLower"
|
||||
@scrolltoupper="onScrollToUpper"
|
||||
>
|
||||
<template #top>
|
||||
<customNavbar :title="talkParams.username">
|
||||
<customNavbar :title="talkParams.username" id="navBarArea">
|
||||
<template
|
||||
#subTitle
|
||||
v-if="talkStore?.findItem(talkParams.index_name)?.group_type === 4"
|
||||
@ -47,7 +48,7 @@
|
||||
<div
|
||||
class="message-item"
|
||||
v-for="item in virtualList"
|
||||
:id="`zp-id-${item.zp_index}`"
|
||||
:id="`zp-id-${item.msg_id}`"
|
||||
:key="item.zp_index"
|
||||
style="transform: scaleY(-1);"
|
||||
>
|
||||
@ -183,7 +184,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<template #bottom>
|
||||
<div class="footBox">
|
||||
<div class="footBox" id="footBoxArea">
|
||||
<div v-if="!dialogueStore.isOpenMultiSelect">
|
||||
<div
|
||||
class="pt-[16rpx] ml-[32rpx] mr-[32rpx] flex items-start justify-between"
|
||||
@ -531,12 +532,20 @@ const state = ref({
|
||||
mentionSelectHeight: 0, //选择要提醒人的区域高度
|
||||
selectAreaHeight: 0, //选择要提醒人的可选人员列表区域高度
|
||||
isShowMentionSelect: false, //是否显示要提醒人的选择区域
|
||||
useCustomLoadMore: false, //是否使用自定义加载更多事件(下拉刷新、上拉加载)
|
||||
})
|
||||
|
||||
uniOnload((options) => {
|
||||
if (options.sessionId) {
|
||||
state.value.sessionId = options.sessionId
|
||||
}
|
||||
if (options.msgInfo) {
|
||||
const msgInfo = JSON.parse(decodeURIComponent(options.msgInfo))
|
||||
queryRecordsByMsgInfo(msgInfo)
|
||||
state.value.useCustomLoadMore = true
|
||||
return
|
||||
}
|
||||
initData()
|
||||
})
|
||||
|
||||
const handleEmojiPanel = () => {
|
||||
@ -1010,12 +1019,79 @@ watch(
|
||||
)
|
||||
|
||||
const onScrollToLower = () => {
|
||||
if (state.value.useCustomLoadMore) {
|
||||
const tempVirtualList = lodash.cloneDeep(virtualList.value).reverse()
|
||||
const dialogueList = getDialogueList(talkParams.index_name)
|
||||
const recordIndex = dialogueList.records.findIndex(
|
||||
(record) => record.msg_id === tempVirtualList[0].msg_id,
|
||||
)
|
||||
if (recordIndex === -1) {
|
||||
} else {
|
||||
if (tempVirtualList[0].sequence > dialogueList.records[0].sequence) {
|
||||
virtualList.value = dialogueList.records
|
||||
.slice(0, recordIndex)
|
||||
.concat(tempVirtualList)
|
||||
.reverse()
|
||||
// zpagingRef.value.setLocalPaging(
|
||||
// dialogueList.records
|
||||
// .slice(0, recordIndex)
|
||||
// .concat(tempVirtualList)
|
||||
// .reverse(),
|
||||
// // zpagingRef.value.scrollIntoViewById('zp-id-' + virtualList.value[virtualList.value.length - 1].msg_id)
|
||||
// )
|
||||
|
||||
console.log(virtualList.value)
|
||||
}
|
||||
}
|
||||
return
|
||||
}
|
||||
if (state.value.localPageLoadDone) {
|
||||
//本地缓存的聊天记录分页加载完之后,才可以请求接口
|
||||
onRefreshLoad()
|
||||
}
|
||||
}
|
||||
|
||||
//本来的下拉刷新——列表倒置后为上拉加载
|
||||
const onScrollToUpper = () => {
|
||||
if (state.value.useCustomLoadMore) {
|
||||
const tempVirtualList = lodash.cloneDeep(virtualList.value).reverse()
|
||||
const dialogueList = getDialogueList(talkParams.index_name)
|
||||
const recordIndex = dialogueList.records.findIndex(
|
||||
(record) =>
|
||||
record.msg_id === tempVirtualList[tempVirtualList.length - 1].msg_id,
|
||||
)
|
||||
if (recordIndex === -1) {
|
||||
} else {
|
||||
if (
|
||||
tempVirtualList[tempVirtualList.length - 1].sequence <
|
||||
dialogueList.records[dialogueList.records.length - 1].sequence
|
||||
) {
|
||||
virtualList.value = tempVirtualList
|
||||
.concat(
|
||||
dialogueList.records.slice(
|
||||
recordIndex + 1,
|
||||
dialogueList.records.length,
|
||||
),
|
||||
)
|
||||
.reverse()
|
||||
// zpagingRef.value.setLocalPaging(
|
||||
// tempVirtualList
|
||||
// .concat(
|
||||
// dialogueList.records.slice(
|
||||
// recordIndex + 1,
|
||||
// dialogueList.records.length,
|
||||
// ),
|
||||
// )
|
||||
// .reverse(),
|
||||
// // zpagingRef.value.scrollIntoViewById('zp-id-' + virtualList.value[virtualList.value.length - 1].msg_id)
|
||||
// )
|
||||
|
||||
console.log(virtualList.value)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const clearMultiSelect = () => {
|
||||
dialogueStore.setMultiSelect(false)
|
||||
virtualList.value.forEach((item) => {
|
||||
@ -1092,11 +1168,13 @@ const getMentionSelectLists = (mentionSelectList) => {
|
||||
mentionUsers[0].insert.slice(0, -2) + mentionUsers[0].insert.slice(-1)
|
||||
console.log(mentionUsers[0].insert)
|
||||
mentionSelectList.forEach((mentionSelectItem) => {
|
||||
mentionUserIds.push(mentionSelectItem.erp_user_id)
|
||||
mentionUserIds.push(mentionSelectItem.id)
|
||||
mentionUsers.push({
|
||||
insert: '@' + mentionSelectItem.nickname + ' ',
|
||||
attributes: {
|
||||
// mention: {
|
||||
// id: mentionSelectItem.id,
|
||||
// },
|
||||
color: '#1890ff',
|
||||
},
|
||||
})
|
||||
@ -1105,8 +1183,61 @@ const getMentionSelectLists = (mentionSelectList) => {
|
||||
hideMentionSelect()
|
||||
}
|
||||
|
||||
//根据msg信息找到对应的聊天记录,并根据sequence等查看上下文
|
||||
const queryRecordsByMsgInfo = (msgInfo) => {
|
||||
console.log(msgInfo)
|
||||
const dialogueList = getDialogueList(talkParams.index_name)
|
||||
const recordIndex = dialogueList.records.findIndex(
|
||||
(record) => record.msg_id === msgInfo.msg_id,
|
||||
)
|
||||
if (recordIndex === -1) {
|
||||
} else {
|
||||
// console.log(recordIndex)
|
||||
const startRecordIndex = Math.max(0, recordIndex - 10)
|
||||
const endRecordIndex = Math.max(0, recordIndex + 10)
|
||||
// console.log(dialogueList.records.slice(startRecordIndex, endRecordIndex))
|
||||
// console.log(recordIndex-startRecordIndex)
|
||||
const recordsList = dialogueList.records.slice(
|
||||
startRecordIndex,
|
||||
endRecordIndex,
|
||||
)
|
||||
nextTick(() => {
|
||||
zpagingRef.value.complete(recordsList.reverse())
|
||||
loadConfig.status = dialogueList.records?.[0]?.sequence > 1 ? 1 : 2
|
||||
nextTick(() => {
|
||||
let offset = uni.getSystemInfoSync().windowHeight
|
||||
const navBarAreaQuery = uni.createSelectorQuery()
|
||||
navBarAreaQuery
|
||||
.select('#navBarArea')
|
||||
.boundingClientRect((res) => {
|
||||
if (res) {
|
||||
// console.log('元素高度:', res.height)
|
||||
offset = offset - res.height
|
||||
}
|
||||
})
|
||||
.exec()
|
||||
const footBoxAreaQuery = uni.createSelectorQuery()
|
||||
footBoxAreaQuery
|
||||
.select('#footBoxArea')
|
||||
.boundingClientRect((res) => {
|
||||
if (res) {
|
||||
// console.log('元素高度:', res.height)
|
||||
offset = offset - res.height
|
||||
}
|
||||
})
|
||||
.exec()
|
||||
setTimeout(() => {
|
||||
zpagingRef.value.scrollIntoViewById(
|
||||
'zp-id-' + msgInfo.msg_id,
|
||||
offset - 60,
|
||||
)
|
||||
}, 1000)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
initData()
|
||||
nextTick(() => {
|
||||
state.value.mentionSelectHeight = pxTorPx(
|
||||
uni.getSystemInfoSync().windowHeight * 0.86,
|
||||
@ -1425,6 +1556,10 @@ onUnmounted(() => {
|
||||
height: 44rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
span {
|
||||
user-select: all;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -361,6 +361,7 @@ const clickSearchItem = (searchResultKey, searchItem) => {
|
||||
searchResultKey,
|
||||
searchItem.talk_type,
|
||||
searchItem.receiver_id,
|
||||
encodeURIComponent(JSON.stringify(searchItem)),
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
@ -10,6 +10,7 @@
|
||||
:isPagination="true"
|
||||
:searchRecordDetail="true"
|
||||
@lastIdChange="lastIdChange"
|
||||
@clickSearchItem="clickSearchItem"
|
||||
></searchList>
|
||||
</div>
|
||||
</div>
|
||||
@ -19,6 +20,9 @@ import searchList from '../components/searchList.vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { ServeTalkRecord } from '@/api/search/index'
|
||||
import { reactive } from 'vue'
|
||||
import { useDialogueStore } from "@/store";
|
||||
|
||||
const dialogueStore = useDialogueStore();
|
||||
|
||||
const state = reactive({
|
||||
apiParams: String,
|
||||
@ -67,5 +71,24 @@ const lastIdChange = (last_id, last_group_id, last_member_id) => {
|
||||
),
|
||||
)
|
||||
}
|
||||
|
||||
//点击了搜索结果项
|
||||
const clickSearchItem = (
|
||||
searchText,
|
||||
searchResultKey,
|
||||
talk_type,
|
||||
receiver_id,
|
||||
res,
|
||||
) => {
|
||||
let result = JSON.parse(decodeURIComponent(res))
|
||||
dialogueStore.setDialogue({
|
||||
name: result.receiver_name,
|
||||
talk_type: talk_type,
|
||||
receiver_id: receiver_id,
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/pages/dialog/index?msgInfo=' + res,
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
|
@ -5,7 +5,7 @@ import { userInfoApi } from "@/api/user";
|
||||
import {ref} from 'vue'
|
||||
export const useAuth = createGlobalState(() => {
|
||||
// const token = useStorage('token', '', uniStorage)
|
||||
const token = ref("79b5c732d96d2b27a48a99dfd4a5566c43aaa5796242e854ebe3ffc198d6876b9628e7b764d9af65ab5dbb2d517ced88170491b74b048c0ba827c0d3741462cb89dc59ed46653a449af837a8262941caba0afc18e7cb819d125e8c04282beb5d4dd454307169f7eb51cd3dbbee20c1a17784f78ad30c3b3a102bd03c3218080beedae501a95c365d360a7a0d682cba2eca94a2915c13f0bdcb42f2eab9458cb4bd89ae6f3200fe4893d64caf1bce02894aab876f94f7825d23be507733468deba21734b6d666b75fd0bee74753fdd6ca5def7ec42cd7dbb47750e61cac6965f34fd71b52be66a472d3ee5b1e4661e59db28983527a8af787c5212a06f9b116a37a6679c7ce23b7307a093ea17841ab84695183fbec1f0e683a48ed05133f80a21c30d1cdd7faf3123e3cd69a8da6ae9240e08767898cf1c5f156be8c175066f9")
|
||||
const token = ref("79b5c732d96d2b27a48a99dfd4a5566c43aaa5796242e854ebe3ffc198d6876b9628e7b764d9af65ab5dbb2d517ced88170491b74b048c0ba827c0d3741462cb89dc59ed46653a449af837a8262941caaef1334d640773710f8cd96473bacfb190cba595a5d6a9c87d70f0999a3ebb41147213b31b4bdccffca66a56acf3baab5af0154f0dce360079f37709f78e13711036899344bddb0fb4cf0f2890287cb62c3fcbe33368caa5e213624577be8b8420ab75b1f50775ee16142a4321c5d56995f37354a66a969da98d95ba6e65d142ed097e04b411c1ebad2f62866d0ec7e1838420530a9941dbbcd00490199f8b8961712d09ad4341bcaab5b062522953817c4351903bd6c5a0e3c73eb82eb8319bd2d906e0c066b816cd8d565eb802a94b79ec6d60dc2d3b522574ed8fa44a1b8ed2e4a22b74356d3988db0427f9502d01")
|
||||
const refreshToken = useStorage('refreshToken', '', uniStorage)
|
||||
const userInfo = useStorage('userInfo', {}, uniStorage)
|
||||
const leaderList = useStorage('leaderList', [], uniStorage)
|
||||
|
Loading…
Reference in New Issue
Block a user