93 lines
3.1 KiB
JavaScript
93 lines
3.1 KiB
JavaScript
// 引入markdown-it库
|
|
import MarkdownIt from '@/utils/markdown-it.min.js'
|
|
// hljs是由 Highlight.js 经兼容性修改后的文件,请勿直接升级。否则会造成uni-app-vue3-Android下有兼容问题
|
|
import hljs from '@/utils/highlight/highlight-uni.min.js'
|
|
// 引入html-parser.js库
|
|
// import parseHtml from '@/utils/html-parser.js'
|
|
|
|
// 初始化 MarkdownIt库
|
|
const markdownIt = MarkdownIt({
|
|
// 在源码中启用 HTML 标签
|
|
html: true,
|
|
// 如果结果以 <pre ... 开头,内部包装器则会跳过。
|
|
highlight: function(str, lang) {
|
|
// if (lang && hljs.getLanguage(lang)) {
|
|
// console.error('lang', lang)
|
|
// try {
|
|
// return '<pre class="hljs" style="padding: 5px 8px;margin: 5px 0;overflow: auto;display: block;"><code>' +
|
|
// hljs.highlight('lang', str, true).value +
|
|
// '</code></pre>';
|
|
// } catch (__) {}
|
|
// }
|
|
// 经过highlight.js处理后的html
|
|
let preCode = ''
|
|
try {
|
|
preCode = hljs.highlightAuto(str).value
|
|
} catch (err) {
|
|
preCode = markdownIt.utils.escapeHtml(str)
|
|
}
|
|
|
|
// 以换行进行分割
|
|
const lines = preCode.split(/\n/).slice(0, -1)
|
|
// 添加自定义行号
|
|
let html = lines.map((item, index) => {
|
|
// 去掉空行
|
|
if (item === '') {
|
|
return ''
|
|
}
|
|
return '<li><span class="line-num" data-line="' + (index + 1) + '"></span>' + item + '</li>'
|
|
}).join('')
|
|
html = '<ol style="padding: 0px 30px;">' + html + '</ol>'
|
|
let htmlCode = `<div style="background:#0d1117;margin-top: 5px;color: #888;padding:5px 0;border-radius: 5px;">`
|
|
htmlCode += `<pre class="hljs" style="padding:0 8px;margin-bottom:5px;overflow: auto;display: block;border-radius: 5px;"><code>${html}</code></pre>`
|
|
htmlCode += '</div>'
|
|
return htmlCode
|
|
}
|
|
})
|
|
|
|
export function formatAiMsgContent(val) {
|
|
if (!val) {
|
|
return ''
|
|
}
|
|
let htmlString = ''
|
|
// 修改转换结果的htmlString值 用于正确给界面增加鼠标闪烁的效果
|
|
// 判断markdown中代码块标识符的数量是否为偶数
|
|
if (val.split('```').length % 2) {
|
|
let msgContent = val
|
|
if (msgContent[msgContent.length - 1] !== '\n') {
|
|
msgContent += '\n'
|
|
}
|
|
msgContent += ' <span class="cursor">|</span>'
|
|
htmlString = markdownIt.render(msgContent)
|
|
} else {
|
|
htmlString = markdownIt.render(val)
|
|
htmlString = markdownIt.render(val) + ' \n <span class="cursor">|</span>'
|
|
}
|
|
// console.log(htmlString)
|
|
return htmlString
|
|
}
|
|
|
|
/**
|
|
* 简单实现防抖方法
|
|
*
|
|
* 防抖(debounce)函数在第一次触发给定的函数时,不立即执行函数,而是给出一个期限值(delay),比如100ms。
|
|
* 如果100ms内再次执行函数,就重新开始计时,直到计时结束后再真正执行函数。
|
|
* 这样做的好处是如果短时间内大量触发同一事件,只会执行一次函数。
|
|
*
|
|
* @param fn 要防抖的函数
|
|
* @param delay 防抖的毫秒数
|
|
* @returns {Function}
|
|
*/
|
|
export function simpleDebounce(fn, delay = 100) {
|
|
let timer = null
|
|
return function() {
|
|
const args = arguments
|
|
if (timer) {
|
|
clearTimeout(timer)
|
|
}
|
|
timer = setTimeout(() => {
|
|
fn.apply(null, args)
|
|
}, delay)
|
|
}
|
|
}
|