eric/gitlab-instance-0a899031_linkwechat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
hackrobot
2024-05-15 23:34:32 +08:00
parent 75bd1a3d6a
commit 5a36dbab71
1 changed files with 43 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

164
src/pages/index/index.jsx
View File

@@ -154,7 +154,8 @@ renderer.hr = function () {
// 内联样式,使用直角引号「」 // 内联样式,使用直角引号「」
renderer.codespan = function (text) { renderer.codespan = function (text) {
return `「${text}」`; // return `「${text}」`;
return `『${text}』`;
}; };
// 引用符号 // 引用符号
@@ -168,130 +169,57 @@ renderer.blockquote = function (quote) {
// console.log(content); // console.log(content);
} }
// <pre></pre> // <pre></pre>
return `<span style="white-space:pre;" class="blockquote">\t👉${content}</span><br/> `; // &nbsp;
return `<span style="white-space:pre;" class="blockquote">\t 👉${content}</span><br/> `;
}; };
function formatTable(arr) {
// 计算每列的最大宽度
const maxWidths = Array.from({ length: arr[0].length }, () => 0);
arr.forEach((row) => {
row.forEach((cell, index) => {
const width = cell.replace(/[\u4e00-\u9fa5]/g, " ").length; // 中文字符算两个宽度
maxWidths[index] = Math.max(maxWidths[index], width);
});
});
// 使用 &nbsp; 填充每个元素
const formattedArr = arr.map((row) =>
row
.map((cell, index) => {
const width = maxWidths[index];
const padding = "&nbsp;".repeat(
width - cell.replace(/[\u4e00-\u9fa5]/g, " ").length
);
return `${cell}${padding}`;
})
.join(" | ")
);
// 构建 Markdown 表格
const markdownTable = formattedArr.map((row) => `|${row} | <br/>`).join("\n");
return markdownTable;
}
renderer.table = function (header, body) { renderer.table = function (header, body) {
console.log("tableRowArr", tableRowArr); if (body) body = `<tbody>${body}</tbody>`;
// 分析第一个元素中有多少个 | 字符
const firstElementPipesCount = tableRowArr[0].split("|").length - 1;
console.log("第一个元素中 | 的数量：", firstElementPipesCount);
console.log("tablecellArr", tablecellArr); return (
maxLengthCell = tablecellArr.reduce( "📊 表格 📊<br/><table>\n" +
(max, str) => Math.max(max, str.length), "<thead>\n" +
0 header +
"</thead>\n" +
body +
"</table>\n"
); );
// 构建表达式
const expression = Array.from({ length: firstElementPipesCount }, () =>
"-".repeat(maxLengthCell)
).join(" | ");
console.log("expression", expression);
bodydata = tableRowArr.map((item) =>
item
.split("|")
.map((str) => str.trim())
.filter(Boolean)
);
console.log("bodydata", bodydata);
// 测试数据
// const data = [
// ['列表1', '列表2'],
// ['这是网址', '你好啊'],
// ['abcd', '你好啊']
// ];
// 格式化表格并输出
const formattedTable = formatTable(bodydata);
const headerdata = formatTable([[header]]);
console.log("headerdata,", headerdata);
// const maxWidths = 5; // 替换为实际的最大字符宽度
function calculateWidth(str) {
let width = 0;
for (let i = 0; i < str.length; i++) {
// 判断字符是否是中文，是的话宽度加2，否则加1
width += /[\u4e00-\u9fa5]/.test(str[i]) ? 2 : 1;
}
return width;
}
const str = '这是网址';
const maxWidths = calculateWidth(str);
console.log(maxWidths); // 输出字符宽度
console.log("maxWidths", maxWidths);
// // 构建表达式
// const expression = Array.from({ length: firstElementPipesCount }, () =>
// "-".repeat(maxWidths)
// ).join(" | ");
// console.log("expression", expression);
console.log("formattedTable", formattedTable);
console.log("{header}", `${header}`);
console.log("{body}", `${body}`);
console.log("{header}${body}", `${header}${body}`);
// return `${header}${body}`;
console.log(`📊 表格 📊<br/>${header}${body}`);
// return `📊 表格 📊<br/>${header} |${expression}|<br/>${body} `;
return `📊 表格 📊<br/>${header} |${expression}|<br/>${formattedTable} `;
}; };
// 重写表格头部渲染函数
renderer.tablerow = function (content) { renderer.tablerow = function (content) {
// console.log("maxLengthCell", maxLengthCell); return `<tr>\n${content}</tr>\n`;
console.log(`|${content} <br/>\n`);
tableRowArr.push(content);
return `|${content} <br/>\n`;
}; };
// 重写表格单元格渲染函数
renderer.tablecell = function (content, flags) {
console.log("flags", flags);
// 清除其他 HTML 标签，保留 - 和 | 字符
content = content.replace(/<(?!br\/)[^>]*>?/gm, "");
// console.log(`${content} | `);
// 添加到数组,并计算最大的字符长度
tablecellArr.push(content);
// console.log("tablecellArr", tablecellArr);
return `${content} | `; renderer.tablecell = function (content, flags) {
const type = flags.header ? "th" : "td";
const tag = flags.align ? `<${type} align="${flags.align}">` : `<${type}>`;
return tag + `|${content}` + `</${type}>\n`;
};
function cleanUrl(href) {
try {
href = encodeURI(href).replace(/%25/g, '%');
} catch (e) {
return null;
}
return href;
}
renderer.link = function (href, title, text) {
const cleanHref = cleanUrl(href);
if (cleanHref === null) {
return text;
}
href = cleanHref;
let out = '<a href="' + href + '"';
if (title) {
out += ' title="' + title + '"';
}
out += ">" +`🌐`+ text + "</a>";
// out += ">" +`🌐`+ text + "</a>"+`(${href})`;
return out;
}; };
// 使用拓展 // 使用拓展
@@ -299,13 +227,7 @@ marked.use({ renderer });
// export default class Index extends Component { // export default class Index extends Component {
const Index = () => { const Index = () => {
const [markText, setmarkText] = useState(` const [markText, setmarkText] = useState(``);
| 列表1 | 列表2 |
| --- | --- |
| 这是网址我爱你你好啊| 你好啊|
| abcd | 你好啊 |
`);
const [oldmarkText, setoldmarkText] = useState(null); const [oldmarkText, setoldmarkText] = useState(null);
const [currentRender, setcurrentRender] = useState(null); const [currentRender, setcurrentRender] = useState(null);
const [markdownTable, setmarkdownTable] = useState(); const [markdownTable, setmarkdownTable] = useState();