scout666/chat-pc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' of http://172.16.100.91:3000/scout666/chat-pc into dev

Browse Source
This commit is contained in:
Phoenix 2025-07-07 10:26:52 +08:00
commit e5a5b36dcc
10 changed files with 256 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

146
src/components/search/highLightText.vue
View File

@ -1,70 +1,172 @@
<template>
<span>
<template v-if="isHtml">
<span v-html="highlightedHtml" />
</template>
<template v-else>
<span class="text-content">
<template v-for="(part, index) in parts" :key="index">
<span v-if="part.highlighted" :class="highlightClass">
{{ part.text }}
<span
v-if="part.highlighted"
:class="highlightClass"
v-html="textReplaceEmoji(part.text)"
/>
<span v-else v-html="textReplaceEmoji(part.text)" />
</template>
</span>
<span v-else>{{ part.text }}</span>
</template>
</span>
</template>
<script setup>
import { computed } from 'vue'
import { textReplaceEmoji } from '@/utils/emojis'
const props = defineProps({
text: {
type: String,
required: true,
required: true
},
searchText: {
type: String,
default: '',
default: ''
},
highlightClass: {
type: String,
default: 'highlight',
},
default: 'highlight'
}
})
// 检测是否为HTML内容
const isHtml = computed(() => {
return /<[^>]*>/g.test(props.text)
})
const escapedSearchText = computed(() =>
String(props.searchText).replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),
String(props.searchText).replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&')
)
const pattern = computed(() => new RegExp(escapedSearchText.value, 'gi'))
const parts = computed(() => {
if (!props.searchText || !props.text)
return [{ text: props.text, highlighted: false }];
if (!props.searchText || !props.text) return [{ text: props.text, highlighted: false }]
const result = [];
let currentIndex = 0;
const escapedSearchTextValue = escapedSearchText.value;
const searchPattern = new RegExp(`(${escapedSearchTextValue})`, 'gi');
const result = []
let currentIndex = 0
const escapedSearchTextValue = escapedSearchText.value
const searchPattern = new RegExp(`(${escapedSearchTextValue})`, 'gi')
props.text.replace(searchPattern, (match, p1, offset) => {
// 添加非高亮文本
if (currentIndex < offset) {
result.push({ text: props.text.slice(currentIndex, offset), highlighted: false });
result.push({ text: props.text.slice(currentIndex, offset), highlighted: false })
}
// 添加高亮文本
result.push({ text: p1, highlighted: true });
result.push({ text: p1, highlighted: true })
// 更新当前索引
currentIndex = offset + p1.length;
return p1; // 这个返回值不影响最终结果，只是replace方法的要求
});
currentIndex = offset + p1.length
return p1 // 这个返回值不影响最终结果，只是replace方法的要求
})
// 添加剩余的非高亮文本（如果有的话）
if (currentIndex < props.text.length) {
result.push({ text: props.text.slice(currentIndex), highlighted: false });
result.push({ text: props.text.slice(currentIndex), highlighted: false })
}
return result;
});
return result
})
// 处理特殊字符的函数
const processSpecialChars = (text) => {
return (
text
// 处理换行符
.replace(/\n/g, '<br>')
// 处理制表符
.replace(/\t/g, '&nbsp;&nbsp;&nbsp;&nbsp;')
// 处理连续空格（保留第一个，其余转换为&nbsp;）
.replace(/ {2,}/g, (match) => {
return '&nbsp;'.repeat(match.length)
})
// 处理不可见字符（零宽空格等）
.replace(/[\u200B-\u200D\uFEFF]/g, '')
)
}
// 处理HTML内容的高亮 - 使用字符串处理方法
const highlightedHtml = computed(() => {
if (!props.searchText || !props.text) {
// 先处理特殊字符，再处理表情
return textReplaceEmoji(processSpecialChars(props.text))
}
// 对于富文本，使用一个更安全的方法
// 将HTML内容按标签分割，只对文本部分进行高亮
// 分割HTML字符串，保护标签
const parts = []
let lastIndex = 0
const tagRegex = /<[^>]*>/g
let tagMatch
// 重置正则表达式的lastIndex
tagRegex.lastIndex = 0
while ((tagMatch = tagRegex.exec(props.text)) !== null) {
// 添加标签前的文本
if (tagMatch.index > lastIndex) {
const textBeforeTag = props.text.slice(lastIndex, tagMatch.index)
if (textBeforeTag) {
// 先处理特殊字符，再处理高亮
const processedText = processSpecialChars(textBeforeTag)
const searchPattern = new RegExp(`(${escapedSearchText.value})`, 'gi')
const highlightedText = processedText.replace(
searchPattern,
`<span class="${props.highlightClass}">$1</span>`
)
parts.push(highlightedText)
}
}
// 添加标签本身（不处理）
parts.push(tagMatch[0])
lastIndex = tagMatch.index + tagMatch[0].length
}
// 添加最后一个标签后的文本
if (lastIndex < props.text.length) {
const textAfterLastTag = props.text.slice(lastIndex)
if (textAfterLastTag) {
// 先处理特殊字符，再处理高亮
const processedText = processSpecialChars(textAfterLastTag)
const searchPattern = new RegExp(`(${escapedSearchText.value})`, 'gi')
const highlightedText = processedText.replace(
searchPattern,
`<span class="${props.highlightClass}">$1</span>`
)
parts.push(highlightedText)
}
}
let html = parts.join('')
// 最后处理表情
return textReplaceEmoji(html)
})
</script>
<style scoped>
.highlight {
color: #7a58de;
}
.text-content {
white-space: pre-wrap;
word-break: break-word;
:deep(.emoji) {
vertical-align: text-bottom!important;
margin: 0 5px !important;
width: 22px !important;
height: 22px !important;
}
}
</style>

25
src/components/search/searchByCondition.vue
View File

@ -137,7 +137,7 @@
@click="toDialogueByMember(item)"
:searchResultKey="'search_by_member_condition'"
:searchItem="item"
:searchText="state.searchText"
:searchText="props?.searchRecordByConditionText"
:searchRecordDetail="true"
></searchItem>
</div>
@ -305,6 +305,7 @@ import { parseTime } from '@/utils/datetime'
import { fileFormatSize, fileSuffix } from '@/utils/strings'
import { NImage, NInfiniteScroll, NScrollbar, NIcon, NDatePicker } from 'naive-ui'
import { MessageComponents } from '@/constant/message'
import { checkFileCanPreview } from '@/utils/helper/form'
const emits = defineEmits([
'clearSearchMemberByAlphabet',
@ -667,15 +668,23 @@ const queryAllSearch = () => {
//文件类型图标
const fileTypeAvatar = (fileType) => {
//PDF文件扩展名映射
const PDF_EXTENSIONS = ['PDF', 'pdf']
// Excel文件扩展名映射
const EXCEL_EXTENSIONS = ['XLS', 'XLSX', 'CSV', 'xls', 'xlsx', 'csv']
// Word文件扩展名映射
const WORD_EXTENSIONS = ['DOC', 'DOCX', 'RTF', 'DOT', 'DOTX', 'doc', 'docx', 'rtf', 'dot', 'dotx']
// PPT文件扩展名映射
const PPT_EXTENSIONS = ['PPT', 'PPTX', 'PPS', 'PPSX', 'ppt', 'pptx', 'pps', 'ppsx']
let file_type_avatar = fileType_Files
if (fileType) {
if (fileType === 'ppt' || fileType === 'pptx') {
if (PPT_EXTENSIONS.includes(fileType)) {
file_type_avatar = fileType_PPT
} else if (fileType === 'pdf') {
} else if (PDF_EXTENSIONS.includes(fileType)) {
file_type_avatar = fileType_PDF
} else if (fileType === 'doc' || fileType === 'docx') {
} else if (WORD_EXTENSIONS.includes(fileType)) {
file_type_avatar = fileType_WORD
} else if (fileType === 'xls' || fileType === 'xlsx') {
} else if (EXCEL_EXTENSIONS.includes(fileType)) {
file_type_avatar = fileType_EXCEL
} else {
file_type_avatar = fileType_Files
@ -693,11 +702,15 @@ const previewPDF = (item) => {
// downloadAndOpenFile(item)
// })
// }
if (checkFileCanPreview(item?.extra?.path || '')) {
window.open(
`${import.meta.env.VITE_PAGE_URL}/office?url=${item.extra.path}`,
'_blank',
'width=1200,height=900,left=200,top=200,toolbar=no,menubar=no,scrollbars=yes,resizable=yes,location=no,status=no'
)
} else {
toDialogueByMember(item)
}
}
const downloadAndOpenFile = (item) => {
@ -953,7 +966,7 @@ body:deep(.round-3) {
border-bottom: 1px solid #f8f8f8;
&:hover {
background-color: rgba(70, 41, 157, 0.1)
background-color: rgba(70, 41, 157, 0.1);
}
.attachment-avatar {

26
src/components/search/searchItem.vue
View File

@ -69,9 +69,17 @@
class="text-[12px] font-regular"
:text="resultDetail"
:searchText="props.searchText"
v-if="props.searchItem?.msg_type !== 3 && props.searchItem?.msg_type !== 6"
v-if="
props.searchItem?.msg_type !== 3 &&
props.searchItem?.msg_type !== 5 &&
props.searchItem?.msg_type !== 6
"
/>
<div class="message-component-wrapper" v-if="props.searchItem?.msg_type === 3" @click.stop>
<div
class="message-component-wrapper"
v-if="props.searchItem?.msg_type === 3 || props.searchItem?.msg_type === 5"
@click.stop
>
<component
:is="MessageComponents[props.searchItem?.msg_type] || 'unknown-message'"
:extra="resultDetail"
@ -122,6 +130,7 @@ import { ref, watch, computed, onMounted, onUnmounted, reactive, defineProps } f
import HighlightText from './highLightText.vue'
import { beautifyTime } from '@/utils/datetime'
import { ChatMsgTypeMapping, MessageComponents } from '@/constant/message'
import { checkFileCanPreview } from '@/utils/helper/form'
const props = defineProps({
searchItem: Object | Number,
searchResultKey: {
@ -291,7 +300,9 @@ const resultDetail = computed(() => {
result_detail =
props.searchItem?.msg_type === 1
? props.searchItem?.extra?.content
: props.searchItem?.msg_type === 3 || props.searchItem?.msg_type === 6
: props.searchItem?.msg_type === 3 ||
props.searchItem?.msg_type === 5 ||
props.searchItem?.msg_type === 6
? props.searchItem?.extra
: ChatMsgTypeMapping[props.searchItem?.msg_type]
break
@ -310,11 +321,16 @@ const previewPDF = (item) => {
// downloadAndOpenFile(item)
// })
// }
if (checkFileCanPreview(item || '')) {
window.open(
`${import.meta.env.VITE_PAGE_URL}/office?url=${item}`,
'_blank',
'width=1200,height=900,left=200,top=200,toolbar=no,menubar=no,scrollbars=yes,resizable=yes,location=no,status=no'
)
} else {
//由于聊天记录本身有跳转到指定位置的逻辑，所以这里不需要再做跳转
window['$message'].warning('暂不支持在线预览该类型文件')
}
}
</script>
<style lang="scss" scoped>
@ -377,7 +393,8 @@ const previewPDF = (item) => {
}
.file-message-wrapper {
.condition-each-result-attachments {
width: 289px;
min-width: 289px;
max-width: 660px;
height: 62px;
display: flex;
flex-direction: row;
@ -447,6 +464,7 @@ const previewPDF = (item) => {
span {
color: #191919;
word-break: break-all;
max-width: 660px;
}
.searchRecordDetail-fastLocal {
display: none;

3
src/components/talk/ForwardRecord.vue
View File

@ -55,8 +55,7 @@ const onConvertText =async (data: ITalkRecord) => {
const res = await voiceToText({ msgId: data.msg_id, voiceUrl: data.extra.url })
if (res.code == 200) {
data.extra.content = res.data.convText
}
}else data.is_convert_text = 0
}
const onloseConvertText=(data: ITalkRecord)=>{
data.is_convert_text = 0

6
src/event/talk.js
View File

@ -259,10 +259,10 @@ class Talk extends Base {
updated_at: parseTime(new Date())
})
if (this.talk_type == 1 && this.getAccountId() !== this.sender_id) {
if (this.getAccountId() !== this.sender_id) {
ServeClearTalkUnreadNum({
talk_type: 1,
receiver_id: this.sender_id
talk_type: this.talk_type,
receiver_id: this.talk_type == 1 ? this.sender_id : this.receiver_id
})
}
}

8
src/hooks/useSessionMenu.ts
View File

@ -77,11 +77,11 @@ export function useSessionMenu() {
// key: 'delete_contact'
// })
} else {
options.push({
// options.push({
label: '退出群聊',
key: 'signout_group'
})
// label: '退出群聊',
// key: 'signout_group'
// })
}
dropdown.options = [...options]

2
src/store/modules/uploads.ts
View File

@ -150,7 +150,7 @@ export const useUploadsStore = defineStore('uploads', {
}
} catch (error) {
console.error("初始化分片上传失败:", error);
message.error("初始化上传失败，请重试")
message.error("上传失败，请重试")
this.handleUploadError(upload_id, clientUploadId)
}
},

26
src/utils/helper/form.js
View File

@ -345,3 +345,29 @@ export const formatNumberWithCommas = (num) => {
}
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
};
// 判断文件是否可以预览
export const checkFileCanPreview = (path) => {
if (!path) {
return false
}
//PDF文件扩展名映射
const PDF_EXTENSIONS = ['PDF', 'pdf']
// Excel文件扩展名映射
const EXCEL_EXTENSIONS = ['XLS', 'XLSX', 'CSV', 'xls', 'xlsx', 'csv']
// Word文件扩展名映射
const WORD_EXTENSIONS = ['DOC', 'DOCX', 'RTF', 'DOT', 'DOTX', 'doc', 'docx', 'rtf', 'dot', 'dotx']
// PPT文件扩展名映射
const PPT_EXTENSIONS = ['PPT', 'PPTX', 'PPS', 'PPSX', 'ppt', 'pptx', 'pps', 'ppsx']
// 获取文件扩展名
function getFileExtension(filepath) {
const parts = filepath?.split('.')
return parts?.length > 1 ? parts?.pop()?.toUpperCase() : ''
}
const extension = getFileExtension(path)
return PDF_EXTENSIONS.includes(extension) ||
EXCEL_EXTENSIONS.includes(extension) ||
WORD_EXTENSIONS.includes(extension) ||
PPT_EXTENSIONS.includes(extension)
}

17
src/views/message/inner/panel/PanelContent.vue
View File

@ -325,7 +325,7 @@ const onConvertText = async (data: ITalkRecord) => {
const res = await voiceToText({ msgId: data.msg_id, voiceUrl: data.extra.url })
if (res.code == 200) {
data.extra.content = res.data.convText
}
} else data.is_convert_text = 0
}
const onloseConvertText = (data: ITalkRecord) => {
data.is_convert_text = 0
@ -354,6 +354,10 @@ const onRowClick = (item: ITalkRecord) => {
if (!isOneMonthBefore(item.created_at.split(' ')[0])) {
return useMessage.info('只支持转发近一个月内的消息')
}
// 语音消息和群公告不支持转发
if ([4, 13].includes(item.msg_type)) {
return useMessage.info('语音消息和群公告不支持转发')
}
console.log('item.msg_type', item.msg_type)
if (ForwardableMessageType.includes(item.msg_type)) {
item.isCheck = !item.isCheck
@ -435,12 +439,15 @@ const retry = (item: any) => {
confirmBox({
content: '确定重发吗'
}).then(() => {
item.extra.percentage = 0
uploadsStore.retryCommonUpload(item.extra.upload_id)
})
}
const onContextMenuAvatar = (e: any, item: any) => {
e.preventDefault()
// 单聊不需要@
if (+props.talk_type === 1) return
if (item.float !== 'right') {
bus.emit(EditorConst.Mention, {
id: item.user_id,
@ -940,7 +947,13 @@ const onCustomSkipBottomEvent = () => {
</div>
<!-- 已读回执 -->
<div class="talk_read_num" v-if="item.user_id === props.uid">
<!-- item.user_id:发送这条消息的人id -->
<!-- props.uid:当前登录人id -->
<!-- props.receiver_id:当前消息要发送的人id -->
<div
class="talk_read_num"
v-if="item.user_id === props.uid && props.uid !== props.receiver_id"
>
<span v-if="props.talk_type === 1">{{
item.read_total_num > 0 ? '已读' : '未读'
}}</span>

7
src/views/message/inner/panel/menu.ts
View File

@ -71,11 +71,14 @@ export function useMenu() {
dropdown.options.push({ label: '复制', key: 'copy' })
}
if (isOneMonthBefore(new Date(item.created_at.split(' ')[0]))) {
// 根据时间判断只有近一个月内的消息才能支持多选
if (isOneMonthBefore(new Date(item.created_at.split(' ')[0])) && ![4,13].includes(item.msg_type)) {
// 根据时间判断只有近一个月内的消息才能支持多选 // 语音消息和群公告不支持转发
dropdown.options.push({ label: '多选', key: 'multiSelect' })
}
if (isOneMonthBefore(new Date(item.created_at.split(' ')[0]))) {
// 根据时间判断只有近一个月内的消息才能支持引用
dropdown.options.push({ label: '引用', key: 'quote' })
}
if (canAddRevokeOption(uid, item, (dialogueStore.groupInfo as any).is_manager)) {
dropdown.options.push({ label: '撤回', key: 'revoke' });
}