pdf生成与显示

This commit is contained in:
2026-01-26 09:47:55 +08:00
parent 5c7fbb76fa
commit 68b2172a35
12 changed files with 299 additions and 4379 deletions

View File

@@ -147,47 +147,53 @@ export default {
replaceWMathContent(inputHtml, callback) {
// 使用正则表达式查找所有 <wmath> 标签,并提取 data-latex 的内容
var str = inputHtml.replace(/<wmath data-latex="([^"]+)">[^<]*<\/wmath>/g, function (match, latexContent) {
// 返回 <wmath> 标签,内容替换为 data-latex 的值
return `<wmath data-latex="${latexContent}">${latexContent}</wmath>`;
// 正则逻辑:匹配整个 wmath 标签,并捕获内部所有的属性字符串
var str = inputHtml.replace(/<wmath ([^>]+)>[^<]*<\/wmath>/g, function (match, allProps) {
// 1. 从所有属性中提取 data-latex 的值
const latexMatch = allProps.match(/data-latex="([^"]+)"/);
const latexContent = latexMatch ? latexMatch[1] : '';
// 2. 从所有属性中提取 data-wrap 的值
const wrapMatch = allProps.match(/data-wrap="([^"]+)"/);
const wrapAttr = wrapMatch ? ` data-wrap="${wrapMatch[1]}"` : '';
// 3. 重新组装:只保留 data-latex 和 data-wrap
// 注意:这里去掉了多余的 prefix/suffix确保标签“干净”
return `<wmath${wrapAttr} data-latex="${latexContent}">${latexContent}</wmath>`;
});
// 调用回调函数并传递处理后的结果
callback(str);
// 输出结果到控制台
// console.log('Processed HTML:', str);
}
,
} ,
// **解析 MathJax 公式,获取 LaTeX**
async extractMathJaxLatex(cell, callback) {
return new Promise((resolve, reject) => {
// Step 1: First, process the math content and extract LaTeX from <wmath> tags
let updatedContent = cell.innerHTML; // Start with the cell's inner HTML
// Find all <wmath> elements
// Step 1: 获取初始 HTML
let updatedContent = cell.innerHTML;
// 查找所有 <wmath> 元素
const wmathElements = cell.querySelectorAll('wmath');
wmathElements.forEach((element) => {
// Get the LaTeX content from the data-latex attribute
const latexContent = element.getAttribute('data-latex');
// Replace the <wmath> tag with its LaTeX content wrapped in $$...$$
updatedContent = updatedContent.replace(element.outerHTML, `<wmath data-latex="${latexContent}">${latexContent}</wmath>`);
// 1. 提取 latex 内容
const latexContent = element.getAttribute('data-latex') || '';
// 2. 提取 wrap 模式 (只提取,不包裹)
const wrapMode = element.getAttribute('data-wrap') || 'block';
// 3. 重新组装标签:只保留属性,标签内部只放原始 latex 文本
// 这里不加 $ 或 $$,保持数据的原始性
const newWmathTag = `<wmath data-wrap="${wrapMode}" data-latex="${latexContent}">${latexContent}</wmath>`;
// 4. 执行替换
updatedContent = updatedContent.replace(element.outerHTML, newWmathTag);
});
// Step 2: Now extract content without the outer <span> tags
// Step 2: 提取去掉外层 span 的内容
updatedContent = this.extractContentWithoutOuterSpan(updatedContent);
// Step 3: Call the callback function with the final updated content
// callback(updatedContent);
// Resolve the promise with the final content
// Step 3: Resolve 结果
resolve(updatedContent);
});
}
@@ -843,7 +849,7 @@ export default {
// 使用正则表达式删除属性(保留 data-latex
let updatedAttributes = attributes.replace(/\s([a-zA-Z0-9-]+)(="[^"]*")?/g, function (attrMatch, attrName) {
if (attrName === "data-latex" || attrName === "data-id") {
if (attrName === "data-latex" || attrName === "data-id" || attrName === "data-wrap") {
return attrMatch;
}
if (type == 'table' && tag == 'img' && (attrName === "src" || attrName === "width" || attrName === "height")) {
@@ -2098,7 +2104,7 @@ export default {
const uid = 'wmath-' + Math.random().toString(36).substr(2, 9);
// 3. 创建一个 <wmath> 标签并插入到光标处
const wmathHtml = `<wmath contenteditable="false" data-id="${uid}" data-latex=""></wmath>`;
const wmathHtml = `<wmath contenteditable="false" data-id="${uid}" data-latex="" data-wrap="block"></wmath>`;
ed.insertContent(wmathHtml); // 在光标位置插入 wmath 标签
// 4. 打开公式编辑器窗口,并传递光标位置、编辑器 ID 和 wmathId