feat: 统一所有页面的AI结果markdown渲染逻辑

- 统一使用全局的markdownToHtml函数 - 删除本地的markdownToHtml方法 - 确保所有页面的排版一致 - 优化AI返回结果的样式和布局
2026-03-07 17:21:00 +08:00
1 parent e695863192
commit 7047fd7d0e
@@ -164,6 +164,8 @@
 </template>

 <script>
+import { markdownToHtml } from '@/utils/markdownToHtml.js'
+
 export default {
  data() {
    return {
@@ -200,13 +202,10 @@ export default {
        '时柱': this.result.hourGanZhiShenSha || []
      }
    },
-    parsedAiAnalysis() {
-      if (!this.result.aiAnalysis) return []
-      return this.parseMarkdown(this.result.aiAnalysis)
-    },
+
    markdownHtml() {
      if (!this.result.aiAnalysis) return ''
-      return this.markdownToHtml(this.result.aiAnalysis)
+      return markdownToHtml(this.result.aiAnalysis)
    }
  },
  onLoad() {
@@ -221,173 +220,6 @@ export default {
    }
  },
  methods: {
-    markdownToHtml(markdown) {
-      if (!markdown) return ''
-      
-      let html = markdown
-      
-      const lines = html.split('\n')
-      if (lines.length > 0) {
-        lines.shift()
-        html = lines.join('\n').trim()
-      }
-      
-      html = html.replace(/^### (.*$)/gim, '<h3 style="font-size:28rpx;font-weight:600;color:#92400E;margin:24rpx 0 12rpx 0;padding:8rpx 16rpx;border-bottom:2rpx dashed #F59E0B;display:inline-block">$1</h3>')
-      html = html.replace(/^## (.*$)/gim, '<h2 style="font-size:32rpx;font-weight:bold;color:#B91C1C;margin:28rpx 0 16rpx 0;padding:12rpx 20rpx;background:linear-gradient(90deg,#FFF7ED 0%,transparent 100%);border-left:4rpx solid #F59E0B">$1</h2>')
-      html = html.replace(/^# (.*$)/gim, '<h1 style="font-size:36rpx;font-weight:bold;color:#DC2626;margin:32rpx 0 20rpx 0;padding:16rpx 24rpx;background:linear-gradient(135deg,#FEF2F2 0%,#FEE2E2 100%);border-left:6rpx solid #DC2626;border-radius:8rpx">$1</h1>')
-      
-      html = html.replace(/\*\*(.+?)\*\*/g, '<strong style="font-weight:bold;color:#DC2626;background:linear-gradient(135deg,#FEF2F2 0%,transparent 100%);padding:2rpx 8rpx;border-radius:4rpx">$1</strong>')
-      html = html.replace(/\*(.+?)\*/g, '<em style="font-style:normal;color:#7C3AED;font-weight:500">$1</em>')
-      html = html.replace(/`(.+?)`/g, '<code style="font-family:Courier New,monospace;background:linear-gradient(135deg,#FEF3C7 0%,#FDE68A 100%);padding:4rpx 12rpx;border-radius:6rpx;color:#92400E;font-size:24rpx;border:1rpx solid #F59E0B;font-weight:500">$1</code>')
-      
-      html = html.replace(/^\s*[-•]\s(.+)$/gim, '<li style="margin:12rpx 0;padding:12rpx 16rpx 12rpx 24rpx;background:linear-gradient(90deg,#F0FDF4 0%,transparent 100%);border-left:3rpx solid #10B981;color:#374151;line-height:1.8">$1</li>')
-      
-      html = html.replace(/(<li[^>]*>.*<\/li>\n?)+/g, function(match) {
-        return '<ul style="margin:16rpx 0;padding-left:0;list-style:none">' + match + '</ul>'
-      })
-      
-      html = html.replace(/\n\n/g, '</p><p style="margin:16rpx 0;text-align:justify;text-indent:2em;color:#4B5563;line-height:2">')
-      html = html.replace(/\n/g, '<br/>')
-      
-      if (!html.startsWith('<')) {
-        html = '<p style="margin:16rpx 0;text-align:justify;text-indent:2em;color:#4B5563;line-height:2">' + html + '</p>'
-      }
-      
-      return html
-    },
-    parseMarkdown(text) {
-      if (!text) return []
-      
-      const nodes = []
-      const lines = text.split('\n')
-      let currentParagraph = []
-      let listItems = []
-      
-      lines.forEach((line) => {
-        line = line.trim()
-        
-        if (line === '') {
-          if (currentParagraph.length > 0) {
-            nodes.push({
-              type: 'paragraph',
-              text: currentParagraph.join('\n')
-            })
-            currentParagraph = []
-          }
-          if (listItems.length > 0) {
-            nodes.push({
-              type: 'list',
-              items: listItems
-            })
-            listItems = []
-          }
-          return
-        }
-        
-        if (line.startsWith('### ')) {
-          if (currentParagraph.length > 0) {
-            nodes.push({
-              type: 'paragraph',
-              text: currentParagraph.join('\n')
-            })
-            currentParagraph = []
-          }
-          if (listItems.length > 0) {
-            nodes.push({
-              type: 'list',
-              items: listItems
-            })
-            listItems = []
-          }
-          nodes.push({
-            type: 'h3',
-            text: line.substring(4)
-          })
-        } else if (line.startsWith('## ')) {
-          if (currentParagraph.length > 0) {
-            nodes.push({
-              type: 'paragraph',
-              text: currentParagraph.join('\n')
-            })
-            currentParagraph = []
-          }
-          if (listItems.length > 0) {
-            nodes.push({
-              type: 'list',
-              items: listItems
-            })
-            listItems = []
-          }
-          nodes.push({
-            type: 'h2',
-            text: line.substring(3)
-          })
-        } else if (line.startsWith('# ')) {
-          if (currentParagraph.length > 0) {
-            nodes.push({
-              type: 'paragraph',
-              text: currentParagraph.join('\n')
-            })
-            currentParagraph = []
-          }
-          if (listItems.length > 0) {
-            nodes.push({
-              type: 'list',
-              items: listItems
-            })
-            listItems = []
-          }
-          nodes.push({
-            type: 'h1',
-            text: line.substring(2)
-          })
-        } else if (line.startsWith('• ') || line.startsWith('- ') || line.startsWith('* ')) {
-          if (currentParagraph.length > 0) {
-            nodes.push({
-              type: 'paragraph',
-              text: currentParagraph.join('\n')
-            })
-            currentParagraph = []
-          }
-          listItems.push(line.substring(2))
-        } else if (line.match(/^\d+\.\s/)) {
-          if (currentParagraph.length > 0) {
-            nodes.push({
-              type: 'paragraph',
-              text: currentParagraph.join('\n')
-            })
-            currentParagraph = []
-          }
-          const text = line.replace(/^\d+\.\s/, '')
-          listItems.push(text)
-        } else {
-          if (listItems.length > 0) {
-            nodes.push({
-              type: 'list',
-              items: listItems
-            })
-            listItems = []
-          }
-          currentParagraph.push(line)
-        }
-      })
-      
-      if (currentParagraph.length > 0) {
-        nodes.push({
-          type: 'paragraph',
-          text: currentParagraph.join('\n')
-        })
-      }
-      
-      if (listItems.length > 0) {
-        nodes.push({
-          type: 'list',
-          items: listItems
-        })
-      }
-      
-      return nodes
-    },
    getGan(index) {
      if (this.result.baZi && this.result.baZi[index]) {
        return this.result.baZi[index].charAt(0)
@@ -131,6 +131,8 @@
 </template>

 <script>
+import { markdownToHtml } from '@/utils/markdownToHtml.js'
+
 export default {
  data() {
    return {
@@ -141,7 +143,7 @@ export default {
  computed: {
    markdownHtml() {
      if (!this.result.aiAnalysis) return ''
-      return this.markdownToHtml(this.result.aiAnalysis)
+      return markdownToHtml(this.result.aiAnalysis)
    }
  },
  onLoad() {
@@ -156,40 +158,6 @@ export default {
    }
  },
  methods: {
-    markdownToHtml(markdown) {
-      if (!markdown) return ''
-      
-      let html = markdown
-      
-      const lines = html.split('\n')
-      if (lines.length > 0) {
-        lines.shift()
-        html = lines.join('\n').trim()
-      }
-      
-      html = html.replace(/^### (.*$)/gim, '<h3 style="font-size:28rpx;font-weight:600;color:#92400E;margin:24rpx 0 12rpx 0;padding:8rpx 16rpx;border-bottom:2rpx dashed #F59E0B;display:inline-block">$1</h3>')
-      html = html.replace(/^## (.*$)/gim, '<h2 style="font-size:32rpx;font-weight:bold;color:#B91C1C;margin:28rpx 0 16rpx 0;padding:12rpx 20rpx;background:linear-gradient(90deg,#FFF7ED 0%,transparent 100%);border-left:4rpx solid #F59E0B">$1</h2>')
-      html = html.replace(/^# (.*$)/gim, '<h1 style="font-size:36rpx;font-weight:bold;color:#DC2626;margin:32rpx 0 20rpx 0;padding:16rpx 24rpx;background:linear-gradient(135deg,#FEF2F2 0%,#FEE2E2 100%);border-left:6rpx solid #DC2626;border-radius:8rpx">$1</h1>')
-      
-      html = html.replace(/\*\*(.+?)\*\*/g, '<strong style="font-weight:bold;color:#DC2626;background:linear-gradient(135deg,#FEF2F2 0%,transparent 100%);padding:2rpx 8rpx;border-radius:4rpx">$1</strong>')
-      html = html.replace(/\*(.+?)\*/g, '<em style="font-style:normal;color:#7C3AED;font-weight:500">$1</em>')
-      html = html.replace(/`(.+?)`/g, '<code style="font-family:Courier New,monospace;background:linear-gradient(135deg,#FEF3C7 0%,#FDE68A 100%);padding:4rpx 12rpx;border-radius:6rpx;color:#92400E;font-size:24rpx;border:1rpx solid #F59E0B;font-weight:500">$1</code>')
-      
-      html = html.replace(/^\s*[-•]\s(.+)$/gim, '<li style="margin:12rpx 0;padding:12rpx 16rpx 12rpx 24rpx;background:linear-gradient(90deg,#F0FDF4 0%,transparent 100%);border-left:3rpx solid #10B981;color:#374151;line-height:1.8">$1</li>')
-      
-      html = html.replace(/(<li[^>]*>.*<\/li>\n?)+/g, function(match) {
-        return '<ul style="margin:16rpx 0;padding-left:0;list-style:none">' + match + '</ul>'
-      })
-      
-      html = html.replace(/\n\n/g, '</p><p style="margin:16rpx 0;text-align:justify;text-indent:2em;color:#4B5563;line-height:2">')
-      html = html.replace(/\n/g, '<br/>')
-      
-      if (!html.startsWith('<')) {
-        html = '<p style="margin:16rpx 0;text-align:justify;text-indent:2em;color:#4B5563;line-height:2">' + html + '</p>'
-      }
-      
-      return html
-    },
    isMingGong(index) {
      return this.result.mingGongGongWei === (index + 1)
    },