diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/SystemRecommendRemarkMessage/index.module.scss b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/SystemRecommendRemarkMessage/index.module.scss new file mode 100644 index 00000000..99c88d3a --- /dev/null +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/SystemRecommendRemarkMessage/index.module.scss @@ -0,0 +1,24 @@ +// 系统推荐备注消息样式 +.systemRecommendRemarkMessage { + .systemMessageText { + font-size: 14px; + font-weight: 500; + color: #8c8c8c; + line-height: 1.4; + word-break: break-word; + padding: 8px 12px; + border-radius: 8px; + max-width: 320px; + } +} + +// 响应式设计 +@media (max-width: 768px) { + .systemRecommendRemarkMessage { + .systemMessageText { + font-size: 13px; + padding: 6px 10px; + max-width: 280px; + } + } +} diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/SystemRecommendRemarkMessage/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/SystemRecommendRemarkMessage/index.tsx new file mode 100644 index 00000000..83d8bccc --- /dev/null +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/SystemRecommendRemarkMessage/index.tsx @@ -0,0 +1,66 @@ +import React from "react"; +import styles from "./index.module.scss"; +import { WarningOutlined } from "@ant-design/icons"; + +interface SystemRecommendRemarkMessageProps { + content: string; +} + +const SystemRecommendRemarkMessage: React.FC< + SystemRecommendRemarkMessageProps +> = ({ content }) => { + // 解析XML内容 + const parseSystemMessage = (xmlContent: string) => { + try { + // 使用正则表达式提取关键信息 + const templateMatch = xmlContent.match( + /