forked from X-lab2017/open-digger
-
Notifications
You must be signed in to change notification settings - Fork 0
/
REPORT_TEMPLATE.html
101 lines (92 loc) · 2.86 KB
/
REPORT_TEMPLATE.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<html>
<head>
<title>{{pageTitle}}</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-LCPyFKQyML7mqtS+4XytolfqyqSlcbB3bvDuH9vX2sdQMxRonb/M3b9EmhCNNNrV" crossorigin="anonymous"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.0.2/echarts.min.js"></script>
<script src="http://opendigger-oss.x-lab.info/js/html2pdf.bundle.min.js"></script>
<style>
body {
background-color: #212332;
}
.content {
width: 80%;
margin-left: 10%;
margin-top: 20px;
}
* {
color: #D1E1F0;
}
.report-title-text {
font-size: 48px;
margin-bottom: 24px;
}
.component-title-text {
font-size: 36px;
margin-top: 42px;
margin-bottom: 42px;
}
.component-content-text {
font-size: 16px;
margin-bottom: 42px;
}
.figure-text {
font-size: 14px;
}
.download-button {
margin-top: 50px;
margin-bottom: 50px;
}
{{css}}
</style>
</head>
<body>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<div class="content">
<div class="text-center">
<text class="report-title-text">{{contentTitle}}</text>
</div>
<div class="component-content-text">
{{head}}
</div>
<div>
{{html}}
</div>
<div id="download-button" class="text-center">
<button class="btn-success download-button" onclick="saveAsPdf()">Save As PDF</button>
</div>
</div>
<script type='text/javascript'>
const colors = ['#33B3FF', '#8B73FF', '#21D096', '#E17070', '#03FFFF', 'F4DD67', 'CC529B'];
const textColor = '#D1E1F0';
function saveAsPdf() {
var opt = {
filename: '{{pageTitle}}.pdf',
image: {
type: 'jpeg',
quality: 0.98
},
html2canvas: {
ignoreElements: ele => {
if (ele.id == 'download-button') return true;
return false;
},
},
jsPDF: {
unit: 'px',
format: [ document.body.scrollWidth, document.body.scrollHeight - 50 ],
orientation: 'portrait'
},
};
html2pdf(document.body, opt);
};
{{js}}
</script>
<script type="text/babel">
{{jsx}}
</script>
</body>
</html>