added a way to download an excel template; added a preview feature to the display CO2 table

This commit is contained in:
Luis Aleixo 2023-06-14 16:43:48 +02:00
parent 210275fc3d
commit 15d28e1711
2 changed files with 35 additions and 12 deletions

View file

@ -19,8 +19,10 @@ const CO2_data = [
'infected_start', 'infected_start',
'room_volume', 'room_volume',
'total_people', 'total_people',
'ventilation_type',
'windows_duration', 'windows_duration',
'windows_frequency', 'windows_frequency',
'window_opening_regime',
] ]
// Method to upload a valid excel file // Method to upload a valid excel file
@ -48,7 +50,6 @@ function excelFileToJSON(file) {
reader.onload = function (e) { reader.onload = function (e) {
var data = e.target.result; var data = e.target.result;
var workbook = XLSX.read(data, { type: "binary" }); var workbook = XLSX.read(data, { type: "binary" });
var result = {};
var firstSheetName = workbook.SheetNames[0]; var firstSheetName = workbook.SheetNames[0];
//reading only first sheet data //reading only first sheet data
var jsonData = XLSX.utils.sheet_to_json(workbook.Sheets[firstSheetName]); var jsonData = XLSX.utils.sheet_to_json(workbook.Sheets[firstSheetName]);
@ -67,17 +68,22 @@ function displayJsonToHtmlTable(jsonData) {
let structure = { times: [], CO2: [] }; let structure = { times: [], CO2: [] };
if (jsonData.length > 0) { if (jsonData.length > 0) {
var htmlData = "<tr><th>Time</th><th>CO2 Value</th></tr>"; var htmlData = "<tr><th>Time</th><th>CO2 Value</th></tr>";
for (var i = 0; i < jsonData.length; i++) { let jsonLength = jsonData.length;
for (var i = 0; i < jsonLength; i++) {
var row = jsonData[i]; var row = jsonData[i];
htmlData += if (i < 5) {
"<tr><td>" + htmlData +=
Math.round(row["Times"] * 10) / 10 + "<tr><td>" +
"</td><td>" + Math.round(row["Times"] * 10) / 10 +
Math.round(row["CO2"] * 10) / 10 + "</td><td>" +
"</td></tr>"; Math.round(row["CO2"] * 10) / 10 +
"</td></tr>";
}
structure["times"].push(row["Times"]); structure["times"].push(row["Times"]);
structure["CO2"].push(row["CO2"]); structure["CO2"].push(row["CO2"]);
} }
if (jsonLength >= 5) htmlData += "<tr><td> ... </td><td> ... </td></tr>";
table.innerHTML = htmlData; table.innerHTML = htmlData;
console.log(structure); console.log(structure);
format.value = JSON.stringify(structure); format.value = JSON.stringify(structure);
@ -86,6 +92,20 @@ function displayJsonToHtmlTable(jsonData) {
} }
} }
function downloadTemplate() {
let final_export = [["Times", "CO2"], [8.5, 440.44]];
// Prepare the CSV file.
let csvContent = "data:text/csv;charset=utf8,"
+ final_export.map(e => e.join(",")).join("\n");
var encodedUri = encodeURI(csvContent);
// Set a name for the file.
var link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "CO2_template.XLSX");
document.body.appendChild(link);
link.click();
}
function insertErrorFor(referenceNode, text) { function insertErrorFor(referenceNode, text) {
var element = document.createElement("span"); var element = document.createElement("span");
element.setAttribute("class", "error_text"); element.setAttribute("class", "error_text");
@ -131,7 +151,7 @@ function submit_fitting_algorithm(url) {
$("#DIV_CO2_fitting_result").show(); $("#DIV_CO2_fitting_result").show();
$("#CO2_fitting_result").val(JSON.stringify(json_response)); $("#CO2_fitting_result").val(JSON.stringify(json_response));
$("#exhalation_rate_fit").html(String(json_response['exhalation_rate'])); $("#exhalation_rate_fit").html(String(json_response['exhalation_rate']));
// $("#ventilation_rate_fit").html(json_response['ventilation_values']); $("#ventilation_rate_fit").html(json_response['ventilation_values']);
$("#CO2_data_plot").attr("src", json_response['CO2_plot']); $("#CO2_data_plot").attr("src", json_response['CO2_plot']);
$("#generate_fitting_data").html('Fit data'); $("#generate_fitting_data").html('Fit data');
$("#save_and_dismiss_dialog").show(); $("#save_and_dismiss_dialog").show();

View file

@ -685,8 +685,11 @@
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="d-flex d-row justify-content-between">
<h5>Upload an excel file to display in HTML Table</h5><br> <h5 style="margin-top: auto; margin-bottom: auto">Upload an excel file to display in HTML Table</h5>
<button type="button" class="btn btn-primary btn-sm" onclick="downloadTemplate()">Download template</button>
</div>
<br>
<!-- Input element to upload an excel file --> <!-- Input element to upload an excel file -->
<input type="file" id="file_upload" /> <input type="file" id="file_upload" />
<button type="button" class="btn btn-primary btn-sm" onclick="upload_file()">Upload</button> <button type="button" class="btn btn-primary btn-sm" onclick="upload_file()">Upload</button>
@ -703,7 +706,7 @@
<div id="DIV_CO2_fitting_result" style="display: none"> <div id="DIV_CO2_fitting_result" style="display: none">
<img id="CO2_data_plot"/> <img id="CO2_data_plot"/>
<div>Exhalation rate: <p id="exhalation_rate_fit"></p> </div> <div>Exhalation rate: <p id="exhalation_rate_fit"></p> </div>
{# <div>Air exchange: <p id="ventilation_rate_fit"></p></div> #} <div>Air exchange: <p id="ventilation_rate_fit"></p></div>
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">