-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcovid-vaccine-qr-gen.html.html
143 lines (127 loc) · 5.83 KB
/
covid-vaccine-qr-gen.html.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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!DOCTYPE html>
<html lang="en">
<head>
<title>Patient List</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-csv@1.0.11/src/jquery.csv.min.js"></script>
<!--<script src="https://cdn.jsdelivr.net/npm/davidshimjs-qrcodejs@0.0.2/qrcode.js"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/lrsjng.jquery-qrcode/0.18.0/jquery-qrcode.min.js" integrity="sha512-P9oNnyfvOZrY1H0D5js+UcLZr+vLkX50glCUlpJAd/RL84+KBtGI4yvH5YVM5TejD+jbURwQq3C/7hgYWOo8bQ==" crossorigin="anonymous"></script>
<style>
.col-print-6 {
width: 50%;
float: left;
height:450px;
}
.page-break-clear {
clear: both;
}
.page-break {
page-break-after: always;
/* depreciating, use break-after */
break-after: page;
height: 0px;
display: block !important;
}
.qr-code canvas {
margin: 0 auto;
width: 128px;
height: 128px;
}
table {
text-align: center;
width: 100%;
}
html,
body {
height: 100%
}
</style>
</head>
<body>
<div id="input-modal" class="h-100 row align-items-center justify-content-center">
<div class="col-sm-6">
<h1>COVID Vaccine Patient Slip Generator</h1>
<p>Upload a CSV list of patients from AccuBook and you will automatically be generated a printable pack of patient slips to make using Pinnacle a breeze.</p>
<p><a href="https://youtu.be/GmWTVxI_sx4">See this video</a> for instructions on how it works in detail.</p>
<p>No data is transferred anywhere when using this tool, all the process is done in your web browser so there are no IG concerns.</p>
<label for="filename">Add Patient List File:</label>
<input type="file" name="filename" id="filename" class="form-control-file">
<small class="form-text text-muted">This should be in csv format</small>
</div>
</div>
<div class="container-fluid" id="patient-list">
</div>
<script>
//Format date into the pinnacle format
function formatDate(date) {
var dateString = date;
var splitDate = dateString.split('-');
var month = splitDate[1] - 1; //Javascript months are 0-11
return new Date(splitDate[2], month, splitDate[0]).toLocaleDateString(
'en-gb', {
year: 'numeric',
month: 'short',
day: 'numeric'
}
).replace(/ /g, '-')
}
$("#filename").change(function(e) {
$("#input-modal").css('display', 'none');
var ext = $("input#filename").val().split(".").pop().toLowerCase();
if ($.inArray(ext, ["csv"]) == -1) {
alert('Error');
return false;
}
if (e.target.files != undefined) {
var reader = new FileReader();
reader.onload = function(e) {
csvResult = e.target.result;
csvResult = $.csv.toObjects(csvResult);
var i = 0;
var fullhtml = '';
csvResult.forEach(function(patient, index) {
if (i == 0) {
start = `<div class="row">`;
} else {
start = '';
}
if (i == 3) {
end = `</div><div class="page-break-clear"></div><div class="page-break"> </div>`;
i = 0;
} else {
end = '';
i++;
}
html = start+`<div class="col-print-6">
<h1>` + patient.Name + `</h1>
<p>Session Date: ` + patient.SessionDate + `</p>
<p>Session Time: ` + patient.StartTime + `</p>
<table>
<tr>
<td>DOB: ` + formatDate(patient.DateOfBirth) + `</td>
<td>NHS: ` + patient.NhsNumber + `</td>
</tr>
<tr>
<td><div class="qr-code" id="dob-qr-` + index + `"></div></td>
<td><div class="qr-code" id="nhs-qr-` + index + `"></div></td>
</tr>
</table></div>` + end;
fullhtml = fullhtml + html;
});
$("#patient-list").append(fullhtml);
csvResult.forEach(function(patient, index) {
$('#dob-qr-' + index).qrcode({text:formatDate(patient.DateOfBirth)});
$('#nhs-qr-' + index).qrcode({text:patient.NhsNumber});
});
window.print();
};
reader.readAsText(e.target.files.item(0));
}
return false;
});
</script>
</body>
</html>