本帖最后由 openbilibili 于 2024-3-2 12:47 编辑
根据楼主的思路 写了一个脚本 方法一：路由在/cv/edit/的路由里面去用执行
[JavaScript] 纯文本查看 复制代码 function getPdfCss() {
for (var e = document.querySelector("head").querySelectorAll("style"), t = "", i = 0; i < e.length; i++) {
var n = e[i].innerHTML || e[i].sheet.cssText || ""
, a = n.substring(0, 300);
if (/(\.resume_box)|(\.cover_all)/.test(a) || /qmfont/.test(a) && /data:application/.test(a)) {
var s = n.replace(/(\[data.*?\])|(\/\*.*\*\/)|\r\n|\r|\n/g, "");
if (document.querySelector("#resume_cover") && /\.cover_all/.test(s)) {
var o = s.replace(/(\.cover_all )|\n|( )/g, "");
t += o.substring(o.indexOf(".resume_cover"))
}
/\.resume_box/.test(s) && (/qmfont/.test(a) ? t += '@font-face {font-family: "qmfont";src:url("https://www.qmjianli.com/font/resume/iconfont.ttf") format("truetype");' + s.substring(s.indexOf("}")).replace(/(\.resume_all \.pc_main )|\n|( )/g, "") : t += s.replace(/(\.resume_all \.pc_main )|\n|( )/g, ""))
}
}
return 'html{font-size:12px;}body{font: 12px/1.5 Arial,PingFang SC,"Microsoft YaHei",SimSun;color:#333;}div,p,input,textarea,ul,li,dl,dt,dd{box-sizing:border-box}*{margin:0;padding:0;border:0}*,*:before,*:after{box-sizing:border-box;margin:0}h1,h2,h3,h4,h5{font-weight:normal}ul,li{list-style:none}img{vertical-align:top}dfn{font-style:normal}i{font-style:normal}a{color:#333;text-decoration:none}a:hover{color:#13d8a7!important}table{border-collapse:collapse}th,td{padding:0}' + (t = t.replace(/font-size:50px/g, "")) + ".jineng_list .el-progress__text{vertical-align: top;line-height: 16px;}.jineng_list .is_text .el-progress__text{display: none;}.jineng_list .is_text .shuliandu{display: block!important;}"
}
var n = document.querySelector("#resume_cover") ? document.querySelector("#resume_cover").innerHTML.replace(/\r\n|\r|\n/g, "").replace(/data-v-[a-z0-9]{4,9}=""/g, "") : ""
, a = document.querySelector("#resume_pc").innerHTML.replace(/<!---->|\r\n|\r|\n/g, "").replace(/data-v-[a-z0-9]{4,9}=""/g, "")
, o = document.querySelector("#zijianxin_tpl_box") ? document.querySelector("#zijianxin_tpl_box").innerHTML.replace(/<!---->|\r\n|\r|\n/g, "").replace(/data-v-[a-z0-9]{4,9}=""/g, "") : "";
document.documentElement.innerHTML = `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="/_nuxt/app.94b91fdc14df6dd7632538db6975b113.css">
<style type="text/css">
${getPdfCss()}
</style>
</head>
<body>
${a}
</body>
</html>`
方法二： 路由在cvs/:resumeId 那个页面可以去直接下载 JS代码如下
[JavaScript] 纯文本查看 复制代码 document.body.innerHTML = resume_tpl_box.getInnerHTML()
保存的方法有两种。
利用打印PDF保存(目前看来可能有颜色或者图标缺失，有些模板可能比较麻烦)。
还可以就是选择该节点，截取节点屏幕截图(路由在cvs/:resumeId或者/cv/edit/，都为完整)。
最终效果
| 
[复制链接]
发表于 2024-2-27 18:51
