diff --git a/src/pages/dialog/index.vue b/src/pages/dialog/index.vue index e1d2b27..4f0c0d0 100644 --- a/src/pages/dialog/index.vue +++ b/src/pages/dialog/index.vue @@ -219,10 +219,19 @@
正在加载数据中 ... - + 查看更多消息 ... - + 没有更多消息了
@@ -616,7 +625,8 @@ const state = ref({ lastMentionText: '', // 记录上一次触发@时的完整文本内容 lastMentionTriggered: false, // 记录当前@是否已经触发过 lastMentionPosition: -1, // 添加新的状态来记录上一次@的位置 - isLoading: false,//发送按钮loading + isLoading: false, //发送按钮loading + lastSelection: 0, }) uniOnload(async (options) => { @@ -676,7 +686,8 @@ const handleHidePanel = () => { //点击编辑区聚焦输入框 const onEditorClick = () => { handleHidePanel() - const quill = getQuill() + // const quill = getQuill(); + // if (quill.getText().endsWith('@\n')) { // showMentionSelectDebounced(quill) // } @@ -1429,10 +1440,6 @@ const getMentionSelectLists = (mentionSelectList) => { ) }) - // 将光标设置到文本末尾 - const length = quill.getLength() - quill.setSelection(length, 0) - // 清除保存的光标位置 state.value.lastCursorIndex = undefined @@ -1707,18 +1714,33 @@ onUnmounted(() => { // 修改防抖函数的实现 const showMentionSelectDebounced = (quill) => { const text = quill.getText() - // 如果文本内容与上次不同,重置触发状态 + // 以下逻辑是 光标与@之间存在其他内容时 不触发选人弹窗 + const selection = quill.getSelection() + if (selection) { + state.lastSelection = selection.index + if ( + text[selection.index - 1].charCodeAt(0) !== 64 && + text[selection.index - 1].charCodeAt(0) !== 32 && + text[selection.index - 1].charCodeAt(0) !== 10 + ) { + uni.showToast({ + title: text[selection.index - 1], + icon: 'none', + }) + state.value.lastMentionTriggered = false + return + } + } + // 以下逻辑是 记录触发@时,用户的输入框内容,下次一样内容得@不会再次触发 if (text !== state.value.lastMentionText) { state.value.lastMentionTriggered = false } - // 如果已经触发过,则不再触发 if (state.value.lastMentionTriggered) { console.log('return') return } - // 记录当前文本内容和触发状态 state.value.lastMentionText = text state.value.lastMentionTriggered = true @@ -1997,11 +2019,6 @@ const showMentionSelectDebounced = (quill) => { } .quillBox { - display: flex; - flex-direction: column; - align-items: flex-start; - justify-content: center; - :deep(.ql-clipboard) { position: relative; opacity: 0; @@ -2020,19 +2037,10 @@ const showMentionSelectDebounced = (quill) => { line-height: 44rpx; font-size: 32rpx; - p { - display: inline-flex; - align-items: center; - justify-content: flex-start; - flex-wrap: wrap; - white-space: normal; - word-break: break-all; - - .ed-emoji { - width: 44rpx; - height: 44rpx; - display: inline-block; - } + .ed-emoji { + width: 44rpx; + height: 44rpx; + display: inline-block; } } }