pingu_98/cara
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

changed the UI from the export csv form

Browse source
This commit is contained in:
Luis Aleixo 2022-08-25 15:13:36 +01:00
parent 914de7421f
commit 09cfa57e36
2 changed files with 64 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
cara/apps/calculator/static/js/report.js
View file

@ -868,6 +868,11 @@ function check_download_button() {
document.querySelectorAll('input[type="checkbox"]:checked').length <= 1 ? download_button.disabled = true : download_button.disabled = false;
}
function display_column_name_warning(checked) {
let warning_element = document.getElementById("alternative_scenario_warning");
checked ? warning_element.style.display = 'flex' : warning_element.style.display = 'none';
}
function display_rename_column(bool, id) {
check_download_button();
// Change the visibility of renaming section
@ -890,20 +895,35 @@ function export_csv() {
let has_alternative_scenario = false;
export_lists.forEach(e => {
if (e.checked) {
if (e.id != "Alternative Scenarios") {
let has_rename = document.getElementById(`${e.id}__rename`).value;
let column_name = has_rename != '' ? has_rename : e.id;
checked_names.push(column_name);
checked_items.push(e.id);
}
else if (e.id == "Alternative Scenarios") {
if (e.id == "Alternative Scenarios") {
Object.entries(alternative_scenarios).map((scenario) => {
if (scenario[0] != 'Current scenario') {
checked_names.push(`Alternative scenario - ${scenario[0]}`);
checked_names.push(`Alternative scenario concentrations - ${scenario[0]} (virions m⁻³)`);
has_alternative_scenario = true;
};
});
}
else if (e.id == "Cumulative Dose") {
var has_rename = document.getElementById(`${e.id}__rename`).value;
var column_name = has_rename != '' ? has_rename : e.id;
if (short_range_expirations.length > 0) {
checked_names.push(`Long-Range ${column_name} (infectious virus)`);
checked_items.push('Long-Range Dose');
// When we have short range interactions, we want the column for the cumulative dose to have the "Total" word before the column name
checked_names.push(`Total ${column_name} (infectious virus)`);
}
else {
checked_names.push(`${column_name} (infectious virus)`);
}
checked_items.push(e.id);
}
else {
var has_rename = document.getElementById(`${e.id}__rename`).value;
var column_name = has_rename != '' ? has_rename : e.id;
if (e.id == "Times") checked_names.push(`${column_name} (h)`);
else if (e.id == "Concentrations") checked_names.push(`${column_name} (virions m⁻³)`);
checked_items.push(e.id);
}
}
});
final_export.push(checked_names);
@ -911,7 +931,7 @@ function export_csv() {
// Add data for each column.
times.forEach((e, i) => {
let this_row = [];
checked_items.includes("Times") && this_row.push(times[i]);
checked_items.includes("Times") && this_row.push(times[i].toFixed(2));
checked_items.includes("Concentrations") && this_row.push(concentrations[i]);
checked_items.includes("Cumulative Dose") && this_row.push(cumulative_doses[i]);
checked_items.includes("Long-Range Dose") && this_row.push(long_range_cumulative_doses[i]);

66
cara/apps/templates/base/calculator.report.html.j2
View file

@ -241,42 +241,46 @@
<div class="form-check mt-3">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Times" onclick="display_rename_column(this.checked, 'times-rename-div')" checked disabled>
<label class="form-check-label" for="Times">Times of day</label>
<div id="times-rename-div" class="align-items-center">
<div id="times-rename-div" class="d-flex align-items-center">
<label class="col-form-label" for="times-rename-div">Column name:</label>
<input type="text" class="form-control form-control-sm col-sm-4 ml-2" id="Times__rename" placeholder="Times" value="Times">
</div>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Concentrations" onclick="display_rename_column(this.checked, 'concentrations-rename-div')">
<label class="form-check-label" for="Concentrations">Concentration - Current scenario</label>
<div id="concentrations-rename-div" class="align-items-center" style="display:none">
<label class="col-form-label" for="concentrations-rename-div">Column name:</label>
<input type="text" class="form-control form-control-sm col-sm-4 ml-2" id="Concentrations__rename" placeholder="Concentrations" value="Concentrations">
</div>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Cumulative Dose" onclick="display_rename_column(this.checked, 'cumulative-dose-rename-div')">
<label class="form-check-label" for="Cumulative Dose">Cumulative dose</label>
<div id="cumulative-dose-rename-div" class="align-items-center" style="display:none">
<label class="col-form-label" for="cumulative-dose-rename-div">Column name:</label>
<input type="text" class="form-control form-control-sm col-sm-4 ml-2" id="Cumulative Dose__rename" placeholder="Cumulative Dose" value="Cumulative Dose">
</div>
</div>
{% if form.short_range_option == "short_range_yes" %}
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Long-Range Dose" onclick="display_rename_column(this.checked, 'long-range-rename-div')">
<label class="form-check-label" for="Long-Range Dose">Long-range dose</label>
<div id="long-range-rename-div" class="align-items-center" style="display:none">
<label class="col-form-label" for="long-range-rename-div">Column name:</label>
<input type="text" class="form-control form-control-sm col-sm-4 ml-2" id="Long-Range Dose__rename" placeholder="Long-Range Dose" value="Long-Range Dose">
</div>
</div>
{% else %}
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Alternative Scenarios" onclick="check_download_button()">
<label class="form-check-label" for="Alternative Scenarios">Concentration - Alternative scenarios</label>
</div>
{# If short-range interactions are set, we don't display Alternative Scenarios, and there is no need to arrange items in a list #}
{% if form.short_range_option == "short_range_no" %}
<ul style="padding-left: inherit">
<li>
Current Scenario
{% endif %}
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Concentrations" onclick="display_rename_column(this.checked, 'concentrations-rename-div')">
<label class="form-check-label" for="Concentrations">Concentrations</label>
<div id="concentrations-rename-div" class="align-items-center" style="display:none">
<label class="col-form-label" for="concentrations-rename-div">Column name:</label>
<input type="text" class="form-control form-control-sm col-sm-4 ml-2" id="Concentrations__rename" placeholder="Concentrations" value="Concentrations">
</div>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Cumulative Dose" onclick="display_rename_column(this.checked, 'cumulative-dose-rename-div')">
<label class="form-check-label" for="Cumulative Dose">Cumulative dose</label>
<div id="cumulative-dose-rename-div" class="align-items-center" style="display:none">
<label class="col-form-label" for="cumulative-dose-rename-div">Column name:</label>
<input type="text" class="form-control form-control-sm col-sm-4 ml-2" id="Cumulative Dose__rename" placeholder="Cumulative Dose" value="Cumulative Dose">
</div>
</div>
{% if form.short_range_option == "short_range_no" %}
</li>
<li>
Alternative Scenarios
<div class="form-check">
<input type="checkbox" class="form-check-input" name="checkedItems" id="Alternative Scenarios" onclick="check_download_button(); display_column_name_warning(this.checked);">
<label class="form-check-label" for="Alternative Scenarios">Concentrations</label>
<p id="alternative_scenario_warning" class="text-warning" style="display: none">The column name will be the scenario name.</p>
</div>
</li>
{% endif %}
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>