ExportButton.jsx
2.94 KB
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
export default function ExportButton({
label = "Export",
filename = "export",
className = "",
id = "",
}) {
const responseToExport = () => {
const response_to_export = document.querySelector(".response-to-export");
if (response_to_export) {
let response = '';
for(var i = 0; i < response_to_export.children.length; i++) {
if(!response_to_export.children[i].querySelector(".message")) continue;
let img_url = window.location.origin + "/assets/images/";
if(response_to_export.children[i].classList.contains("chatgpt")) {
let msg = "<div style='float: left; margin-left: 10px; padding-top: 5px;'>"+response_to_export.children[i].querySelector(".message").innerHTML+"</div>";
let profile = "<div style='width: 36px; height: 36px; background: #4c66ef; border-radius: 5px; float: left;'><img style='width: 24px; height: 24px; margin-top: 6px; margin-left: 6px;' src='" + img_url + "bot.png'></div>";
response = response + "<div style='background: #ddf1f9; padding: 5px'>"+ profile + msg +"</div>";
} else {
let msg = "<div style='float: left; margin-left: 10px;'>"+response_to_export.children[i].querySelector(".message").innerHTML+"</div>";
let profile = "<div style='width: 36px; height: 36px; background: #6BA447; border-radius: 5px; float: left;'><img style='width: 24px; height: 24px; margin-top: 6px; margin-left: 6px;' src='" + img_url + "user.png'></div>";
response = response + "<div style='padding: 5px'>"+ profile + msg +"</div>";
}
}
return response;
}
}
const generatePDF = window.generatePDF;
const onClickExportToPDF = () => {
const response = responseToExport();
generatePDF(response, filename);
};
const onClickExportButton = () => {
let modal = document.querySelector(".export-modal-container");
const response = responseToExport();
if (!response) return;
if (!modal) {
const btutil_buildExportModal = window.btutil_buildExportModal;
modal = btutil_buildExportModal(onClickExportToPDF);
document.body.appendChild(modal);
}
modal.classList.add("active");
};
return (
<>
<div
className={`export-button ${className}`}
id={id}
onClick={onClickExportButton}
>
<svg
fill="#ffffff"
xmlns="http://www.w3.org/2000/svg"
height="1em"
viewBox="0 0 512 512"
>
<path d="M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z" />
</svg>
<span>{label}</span>
</div>
</>
);
}