支持消息 Markdown 与欢迎语富文本

聊天/离线提示使用 Markdown 安全渲染;欢迎语改为 TipTap 富文本(颜色字号),DOMPurify 白名单清洗后展示。
This commit is contained in:
yml2213
2026-07-19 00:03:05 +08:00
parent 970bae16d1
commit fea5f4acf5
12 changed files with 3235 additions and 32 deletions
+10 -4
View File
@@ -7,6 +7,7 @@ import {
} from '@ant-design/icons'
import EmojiPicker, { insertAtCursor } from '@/components/common/EmojiPicker'
import { ChatImage } from '@/components/common/ImagePreview'
import MarkdownBody, { stripMarkdown } from '@/components/common/MarkdownBody'
import { useAuth } from '@/stores/auth'
import {
addSessionNote, claimSession, endSession, getAvailableAgents, getCustomers, getKnowledgeEntries,
@@ -327,7 +328,7 @@ const Dashboard = () => {
cursor = lastBatchSeq
}
if (latest && selectedIdRef.current === id) {
const preview = latest.type === 'image' ? '[图片]' : latest.content
const preview = latest.type === 'image' ? '[图片]' : stripMarkdown(latest.content)
setSessions(previous => previous.map(session =>
session.id === id
? {
@@ -360,7 +361,7 @@ const Dashboard = () => {
return true
}
const preview = msg.type === 'image' ? '[图片]' : msg.content
const preview = msg.type === 'image' ? '[图片]' : stripMarkdown(msg.content)
let appended = false
setDetail(previous => {
if (selectedIdRef.current !== sessionId) return previous
@@ -1183,7 +1184,12 @@ const Dashboard = () => {
{message.type === 'image' ? (
<ChatImage src={message.content} alt="聊天图片" className="max-w-64 max-h-64" />
) : (
<p className="text-sm leading-normal whitespace-pre-wrap break-words m-0">{message.content}</p>
<MarkdownBody
tone={isAgent ? 'inverse' : 'default'}
className="text-sm"
>
{message.content}
</MarkdownBody>
)}
</div>
<div className={`mt-1 text-xs text-neutral-400 ${isAgent ? 'text-right' : ''}`}>
@@ -1289,7 +1295,7 @@ const Dashboard = () => {
ref={messageInputRef}
rows={3}
className="flex-1 min-w-0 min-h-[88px] max-h-[160px] rounded-xl px-3.5 py-3 bg-neutral-50 border border-neutral-200 text-sm leading-6 text-neutral-800 placeholder:text-neutral-400 outline-none resize-y focus:border-[#2563eb] transition-colors"
placeholder="输入回复内容… / 调话术,Enter 发送Shift+Enter 换行"
placeholder="支持 Markdown**加粗** *斜体* 列表 链接)… / 调话术,Enter 发送"
value={messageInput}
onChange={event => {
const v = event.target.value