From 72472979bd603c44179d69d002fbd46dfa7daa54 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=98=B1=E8=BE=BE?= <chen.yuda@ebiz-digits.com>
Date: Tue, 14 Oct 2025 11:51:03 +0800
Subject: [PATCH] =?UTF-8?q?feat(portal):=20=E6=94=AF=E6=8C=81=E6=B6=88?=
 =?UTF-8?q?=E6=81=AF=E5=86=85=E5=AE=B9=E7=9A=84=20Markdown=20=E5=92=8C=20L?=
 =?UTF-8?q?aTeX=20=E6=B8=B2=E6=9F=93-=20=E5=BC=95=E5=85=A5=20markdown-it?=
 =?UTF-8?q?=20=E4=B8=8E=20highlight.js=20=E5=AE=9E=E7=8E=B0=20Markdown=20?=
 =?UTF-8?q?=E6=B8=B2=E6=9F=93-=20=E9=9B=86=E6=88=90=20KaTeX=20=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E6=95=B0=E5=AD=A6=E5=85=AC=E5=BC=8F=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=20-=20=E6=9B=B4=E6=96=B0=E6=B6=88=E6=81=AF=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E4=BB=A5=E6=94=AF=E6=8C=81=E5=AE=9E=E6=97=B6=E6=B8=B2=E6=9F=93?=
 =?UTF-8?q?=20Markdown=20=E4=B8=8E=20LaTeX=20-=20=E8=B0=83=E6=95=B4=20AI?=
 =?UTF-8?q?=20=E5=AF=B9=E8=AF=9D=E6=A1=86=E5=AE=BD=E5=BA=A6=E4=B8=BA?=
 =?UTF-8?q?=E7=99=BE=E5=88=86=E6=AF=94=E5=B8=83=E5=B1=80=20-=20=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E5=88=9D=E5=A7=8B=E6=AC=A2=E8=BF=8E=E6=96=87=E6=A1=88?=
 =?UTF-8?q?=E6=A0=BC=E5=BC=8F=E5=B9=B6=E6=B7=BB=E5=8A=A0=E6=AE=B5=E8=90=BD?=
 =?UTF-8?q?=E9=97=B4=E8=B7=9D=20-=20=E6=B7=BB=E5=8A=A0=E5=BF=85=E8=A6=81?=
 =?UTF-8?q?=E7=9A=84=E4=BE=9D=E8=B5=96=E9=A1=B9=EF=BC=9Akatex=E3=80=81mark?=
 =?UTF-8?q?down-it=E3=80=81markdown-it-highlightjs=20=E7=AD=89-=20?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE=20vue-katex=20=E6=8F=92=E4=BB=B6=E5=B9=B6?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89=E5=88=86=E9=9A=94=E7=AC=A6=E8=A7=84=E5=88=99?=
 =?UTF-8?q?=20-=20=E4=BD=BF=E7=94=A8=20null-loader=20=E5=A4=84=E7=90=86?=
 =?UTF-8?q?=E9=83=A8=E5=88=86=E8=B5=84=E6=BA=90=E5=8A=A0=E8=BD=BD=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |  6 ++++++
 src/main.js                                   | 16 ++++++++++++++++
 src/views/portal/case/AICall.vue              | 10 +++++-----
 src/views/portal/case/components/messages.vue | 14 +++++++++++---
 4 files changed, 38 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index f8aa805a..affc1572 100644
--- a/package.json
+++ b/package.json
@@ -23,9 +23,13 @@
     "element-ui": "^2.15.7",
     "file-saver": "^2.0.5",
     "fuse.js": "^6.4.6",
+    "highlight.js": "^11.11.1",
     "image-conversion": "^2.1.1",
     "jsencrypt": "^3.2.1",
     "json-bigint": "^1.0.0",
+    "katex": "^0.16.25",
+    "markdown-it": "^14.1.0",
+    "markdown-it-highlightjs": "^4.2.0",
     "mockjs": "^1.1.0",
     "moment": "^2.29.1",
     "nprogress": "^0.2.0",
@@ -43,6 +47,7 @@
     "vue": "^2.6.11",
     "vue-awesome-swiper": "^3.1.3",
     "vue-cookies": "^1.7.4",
+    "vue-katex": "^0.5.0",
     "vue-pdf": "^4.2.0",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "^3.5.2",
@@ -60,6 +65,7 @@
     "html-webpack-plugin": "^5.5.0",
     "less": "^4.1.1",
     "less-loader": "^6.2.0",
+    "null-loader": "^4.0.1",
     "sass": "^1.32.13",
     "sass-loader": "^10.1.0",
     "vue-template-compiler": "^2.6.11"
diff --git a/src/main.js b/src/main.js
index 3c3b4968..15f2fc68 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,6 +3,22 @@ import App from './App.vue'
 import router from './router'
 import store from './store'
 
+import vueKatexEs from "vue-katex";
+import "katex/dist/katex.min.css"
+
+
+Vue.use(vueKatexEs,{
+  globalOptions:{
+    delimiters:[
+      {left:"$$",right:"$$",display:true},
+      {left:"$",right:"$",display:false},
+      {left:"\\[",right:"\\]",display:true},
+      {left:"\\(",right:"\\)",display:false}
+    ],
+    throwOnError:true
+  }
+})
+
 //import './mock/index'
 
 import xpage from '@/utils/xpage'
diff --git a/src/views/portal/case/AICall.vue b/src/views/portal/case/AICall.vue
index 8c35e37a..44328079 100644
--- a/src/views/portal/case/AICall.vue
+++ b/src/views/portal/case/AICall.vue
@@ -4,7 +4,7 @@
     <el-dialog
       v-if="dialogVisible"
       :visible="true"
-      width="800px"
+      width="65%"
       :close-on-click-modal="false"
       :show-close="true"
       @close="onClose"
@@ -128,10 +128,10 @@ export default {
         {
           typing:true,
           isBot: true, // 是否为机器人
-          text: `<p><b>您好！我是京东方案侧智能问答助手，随时为您服务。</b></p>
-          <p>我可以帮您快速查找和解读平台内的各类案例内容。只需输入您想了解的问题或关键词，我会从案例库中精准匹配相关信息，并提供清晰的解答。每条回答都会附上来源链接，方便您随时查阅原始案例全文。</p>
-          <p>我还会根据您的提问，智能推荐相关延伸问题，助您更高效地探索知识、解决问题。</p>
-          <p>现在，欢迎随时向我提问，开启高效的知识查询体验吧！</p>`
+          text: `\n\n **您好！我是京东方案侧智能问答助手，随时为您服务。** \n\n
+          \n\n我可以帮您快速查找和解读平台内的各类案例内容。只需输入您想了解的问题或关键词，我会从案例库中精准匹配相关信息，并提供清晰的解答。每条回答都会附上来源链接，方便您随时查阅原始案例全文。\n\n
+          \n\n我还会根据您的提问，智能推荐相关延伸问题，助您更高效地探索知识、解决问题。\n\n
+          \n\n现在，欢迎随时向我提问，开启高效的知识查询体验吧！\n\n `
         }
       ],
       suggestions:[],
diff --git a/src/views/portal/case/components/messages.vue b/src/views/portal/case/components/messages.vue
index e970921b..9dc9e171 100644
--- a/src/views/portal/case/components/messages.vue
+++ b/src/views/portal/case/components/messages.vue
@@ -1,5 +1,12 @@
 <!--消息渲染-->
 <script>
+import MarkdownIt from 'markdown-it';
+import highlight from 'markdown-it-highlightjs'
+import "highlight.js/styles/a11y-dark.css"
+import katex from "katex"
+
+const md = new MarkdownIt({
+}).use(highlight);
 export default {
   name: "message",
   props: {
@@ -16,6 +23,7 @@ export default {
   },
   data() {
     return {
+      md,
       displayText: '',
       typingTimer: null,
       typingSpeed: 30, // 打字机速度（毫秒/字符）
@@ -72,7 +80,7 @@ export default {
       // 开始打字机效果
       this.typingTimer = setInterval(() => {
         if (index < text.length) {
-          this.displayText += text.charAt(index)
+          this.displayText += md.render(text.charAt(index))
           index++
         } else {
           // 打字完成，清除定时器
@@ -101,8 +109,8 @@ export default {
  <div class="messages">
    <!--          机器人消息-->
    <div v-if="messageData.isBot" class="bot-message">
-     <div class="bot-think" v-if="messageData.thinkText" v-html="messageData.thinkText"></div>
-     <div v-html="displayText" ></div>
+     <div class="bot-think" v-if="messageData.thinkText" v-katex:auto v-html="md.render(messageData.thinkText)"></div>
+     <div v-katex:auto v-html="md.render(displayText)" ></div>
      <div v-if="messageData.caseRefers && messageData.caseRefers.length > 0 && messageData.textCompleted">
        <div class="case-refers">
          <div class="case-refers-title">