feat(editor): 添加自定义编辑器组件并优化消息处理
1. 新增 CustomEditor.vue 组件,提供富文本编辑功能,支持@提及、表情、图片和文件上传 2. 优化消息处理逻辑,增加空值检查和错误处理 3. 替换 PanelFooter.vue 中的默认编辑器为自定义编辑器 4. 更新 util.ts 和 talk.ts 中的相关逻辑,增强健壮性 自定义编辑器实现了更丰富的交互功能,包括: - 支持@提及用户并显示选择列表 - 支持插入表情符号和图片 - 优化文件上传处理流程 - 增强粘贴和键盘事件处理
This commit is contained in:
parent
2c1ae41c3e
commit
d9f41e563e
1078
src/components/editor/CustomEditor.vue
Normal file
1078
src/components/editor/CustomEditor.vue
Normal file
File diff suppressed because it is too large
Load Diff
@ -103,7 +103,7 @@ export function deltaToMessage(delta: Delta): AnalysisResp {
|
||||
}
|
||||
|
||||
if (insert && insert.quote) {
|
||||
resp.quoteId = insert.quote.id
|
||||
resp.quoteId = insert.quote.id||''
|
||||
continue
|
||||
}
|
||||
}
|
||||
|
@ -99,7 +99,11 @@ export const useTalkStore = defineStore('talk', {
|
||||
|
||||
const draft = useEditorDraftStore().items[value.index_name]
|
||||
if (draft) {
|
||||
value.draft_text = JSON.parse(draft).text || ''
|
||||
try {
|
||||
value.draft_text = JSON.parse(draft).text || ''
|
||||
} catch (e) {
|
||||
value.draft_text = draft
|
||||
}
|
||||
}
|
||||
|
||||
if (value.is_robot == 1) {
|
||||
|
@ -18,7 +18,7 @@ export function isLoggedIn() {
|
||||
*/
|
||||
export function getAccessToken() {
|
||||
// return storage.get(AccessToken) || ''
|
||||
return JSON.parse(localStorage.getItem('token'))||'46d71a72d8d845ad7ed23eba9bdde260e635407190c2ce1bf7fd22088e41682ea07773ec65cae8946d2003f264d55961f96e0fc5da10eb96d3a348c1664e9644ce2108c311309f398ae8ea1b8200bfd490e5cb6e8c52c9e5d493cbabb163368f8351420451a631dbfa749829ee4cda49b77b5ed2d3dced5d0f2b7dd9ee76ba5465c84a17c23af040cd92b6b2a4ea48befbb5c729dcdad0a9c9668befe84074cc24f78899c1d947f8e7f94c7eda5325b8ed698df729e76febb98549ef3482ae942fb4f4a1c92d21836fa784728f0c5483aab2760a991b6b36e6b10c84f840a6433a6ecc31dee36e8f1c6158818bc89d227de310c4e6f5d7ff11a9e1ea73aba3f6c749f75a50a2aeaed07b14bc0d8b1db6428caf891f0a0b0c84a49697f4a4e7c8b87d972340ecbf02ddbc4d4f1e51b057c822f8351524e19d52a3ec5ce8c83e2f'
|
||||
return JSON.parse(localStorage.getItem('token'))||'46d71a72d8d845ad7ed23eba9bdde260e635407190c2ce1bf7fd22088e41682ea07773ec65cae8946d2003f264d55961f96e0fc5da10eb96d3a348c1664e9644ce2108c311309f398ae8ea1b8200bfd490e5cb6e8c52c9e5d493cbabb163368f8351420451a631dbfa749829ee4cda49b77b5ed2d3dced5d0f2b7dd9ee76ba5465c84a17c23af040cd92b6b2a4ea48befbb5c729dcdad0a9c9668befe84074cc24f78899c1d947f8e7f94c7eda5325b8ed698df729e76febb98549ef3482ae942fb4f4a1c92d21836fa784728f0c5483aab2760a991b6b36e6b10c84f840a6433a6ecc31dee36e8f1c6158818bc89d22cfdbfc3bc1d58c0fc81df3825ac0a76436ffc05a48efbb059bc6ec71c3405b3d02bbfd64af6e95f2d65bb8e21b5f94aa2de31ba7d103d900afbe3c668a78f089238c92090ce94a0cbf04aeda28ec697d'
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -12,7 +12,8 @@ import ws from '@/connect'
|
||||
import { ServePublishMessage, ServeSendVote } from '@/api/chat'
|
||||
import { throttle, getVideoImage } from '@/utils/common'
|
||||
import { parseTime } from '@/utils/datetime'
|
||||
import Editor from '@/components/editor/Editor.vue'
|
||||
// import Editor from '@/components/editor/Editor.vue'
|
||||
import CustomEditor from '@/components/editor/CustomEditor.vue'
|
||||
import MultiSelectFooter from './MultiSelectFooter.vue'
|
||||
import HistoryRecord from '@/components/talk/HistoryRecord.vue'
|
||||
import {scrollToBottom} from '@/utils/dom.ts'
|
||||
@ -80,7 +81,7 @@ const onSendTextEvent = throttle((value: any) => {
|
||||
let message = {
|
||||
type: 'text',
|
||||
content: data.items[0].content,
|
||||
quote_id: data.quoteId,
|
||||
quote_id: data.quoteId ||'',
|
||||
mentions: data.mentionUids
|
||||
}
|
||||
|
||||
@ -233,7 +234,7 @@ const onSendEmoticonEvent = ({ data, callBack }) => {
|
||||
const onSendMixedEvent = ({ data, callBack }) => {
|
||||
let message = {
|
||||
type: 'mixed',
|
||||
quote_id: data.quoteId,
|
||||
quote_id: data.quoteId ||'',
|
||||
items: data.items
|
||||
}
|
||||
|
||||
@ -291,7 +292,8 @@ onMounted(() => {
|
||||
<footer class="el-footer">
|
||||
<MultiSelectFooter v-if="dialogueStore.isOpenMultiSelect" />
|
||||
|
||||
<Editor v-else @editor-event="onEditorEvent" :vote="talk_type == 2" :members="members" />
|
||||
<!-- <Editor v-else @editor-event="onEditorEvent" :vote="talk_type == 2" :members="members" /> -->
|
||||
<CustomEditor v-else @editor-event="onEditorEvent" :vote="talk_type == 2" :members="members" />
|
||||
</footer>
|
||||
|
||||
<HistoryRecord
|
||||
|
Loading…
Reference in New Issue
Block a user