Added UI input field for vaccination (primary and booster)

This commit is contained in:
Luis Aleixo 2022-09-22 11:25:06 +02:00
parent b2d6a308a5
commit 4dee41a41e
2 changed files with 96 additions and 4 deletions

View file

@ -328,6 +328,28 @@ function on_wearing_mask_change() {
})
}
function on_vaccination_change() {
vaccination_option = $('input[type=radio][name=vaccine_option]');
vaccination_option.each(function (index) {
if (this.checked) {
getChildElement($(this)).show();
require_fields(this);
}
else {
getChildElement($(this)).hide();
require_fields(this);
}
})
}
function on_vaccination_booster_change() {
vaccination_booster_option = $('input[type=radio][name=vaccine_booster_option]');
vaccination_booster_option.each(function (index) {
if (this.checked) getChildElement($(this)).show();
else getChildElement($(this)).hide();
})
}
function populate_temp_hum_values(data, index) {
$("#sensor_temperature").text(Math.round(data[index].Details.T) + '°C');
$("#sensor_humidity").text(Math.round(data[index].Details.RH) + '%');
@ -931,6 +953,18 @@ $(document).ready(function () {
// Call the function now to handle forward/back button presses in the browser.
on_wearing_mask_change();
// When the vaccinated_option_option changes we want to make its respective
// children show/hide.
$("input[type=radio][name=vaccine_option]").change(on_vaccination_change);
// Call the function now to handle forward/back button presses in the browser.
on_vaccination_change();
// When the vaccinated_booster_option changes we want to make its respective
// children show/hide.
$("input[type=radio][name=vaccine_booster_option]").change(on_vaccination_booster_change);
// Call the function now to handle forward/back button presses in the browser.
on_vaccination_booster_change();
// When the short_range_option changes we want to make its respective
// children show/hide.
$("input[type=radio][name=short_range_option]").change(on_short_range_option_change);

View file

@ -359,6 +359,67 @@
</div>
<span id="training_limit_error" class="red_text" hidden>Conference/Training activities limited to 1 infected<br></span>
<div class="form-group row">
<div class="col-sm-4">Vaccinated? 💉</div>
<div class="col-sm-6 ml-0">
<input type="radio" id="vaccinated_no" name="vaccine_option" value="0" checked="checked">
<label class="mb-0" for="vaccinated_no">No</label>
<input class="ml-2" type="radio" id="vaccinated_yes" name="vaccine_option" value="1" data-enables="#DIVvaccine_booster">
<label class="mb-0" for="vaccinated_yes">Yes</label>
</div>
</div>
<div id="DIVvaccine_booster" style="display: none;" class="mt-3">
<div class="form-group row">
<div class="d-flex flex-row col-sm-4"><div class="ml-4" style="border: 1px solid #2f4858"></div><p class="ml-2">With booster?</p></div>
<div class="col-sm-6 ml-0">
<input type="radio" id="vaccinated_booster_no" name="vaccine_booster_option" value="0" data-enables="#DIVvaccine_booster_no" checked="checked">
<label class="mb-0" for="vaccinated_booster_no">No</label>
<input class="ml-2" type="radio" id="vaccinated_booster_yes" name="vaccine_booster_option" value="1" data-enables="#DIVvaccine_booster_yes">
<label class="mb-0" for="vaccinated_booster_yes">Yes</label>
</div>
</div>
<div id="DIVvaccine_booster_no" class="mt-3" style="display: none;">
<div class="form-group row">
<div class="col-sm-4"><label class="col-form-label">Primary vaccine:</label></div>
<div class="col-sm-6 align-self-center">
<select id="vaccine_type" name="vaccine_type" class="form-control form-control-sm">
<option value="janssen">Ad26.COV2.S (Janssen)</option>
<option value="any_mRNA">Any mRNA - heterologous</option>
<option value="astraZeneca">AZD1222 (AstraZeneca)</option>
<option value="astraZeneca_mRNA">AZD1222 (AstraZeneca) & any mRNA - heterologous</option>
<option value="astraZeneca_mRNA_pfizer">AZD1222 (AstraZeneca) & BNT162b2 (Pfizer)</option>
<option value="beijingCNBG">BBIBP-CorV (Beijing CNBG)</option>
<option value="pfizer">BNT162b2 (Pfizer)</option>
<option value="pfizer_moderna">BNT162b2 (Pfizer) & mRNA-1273 (Moderna)</option>
<option value="sinovac">CoronaVac (Sinovac)</option>
<option value="sinovac_astraZeneca">CoronaVac (Sinovac) & AZD1222 (AstraZeneca)</option>
<option value="covishield">Covishield</option>
<option value="moderna">mRNA-1273 (Moderna)</option>
<option value="gamaleya">Sputnik V (Gamaleya)</option>
<option value="sinovac_pfizer">CoronaVac (Sinovac) & BNT162b2 (Pfizer)</option>
</select>
</div>
</div>
</div>
<div id="DIVvaccine_booster_yes" class="mt-3" style="display: none;">
<div class="form-group row">
<div class="col-sm-4"><label class="col-form-label">Booster:</label></div>
<div class="col-sm-6 align-self-center">
<select id="vaccine_booster_type" name="vaccine_booster_type" class="form-control form-control-sm">
<option value="booster_janssen">Ad26.COV2.S (Janssen)</option>
<option value="booster_astraZeneca">AZD1222 (AstraZeneca)</option>
<option value="booster_pfizer">BNT162b2 (Pfizer)</option>
<option value="booster_pfizer_moderna">BNT162b2 (Pfizer) & mRNA-1273 (Moderna)</option>
<option value="booster_sinovac">CoronaVac (Sinovac)</option>
<option value="booster_moderna">mRNA-1273 (Moderna)</option>
</select>
</div>
</div>
</div>
</div>
<hr width="80%">
<div class="form-group row">
@ -381,7 +442,6 @@
</div>
</div>
<div style=" margin-right:2rem;">
<div class="boxMargin pb-0">
<div class='sub_title'>Exposed person(s) presence:</div>
@ -427,7 +487,7 @@
</div>
<p id="short_range_warning" class="red_text" style="margin-right: 2rem">The use of masks mitigates exposure at short-range. The analytical model with short-range interactions does not take mask wearing into account.</p>
<div id="DIVsr_interactions" class="none">
<div id="DIVsr_interactions">
<div class="d-flex">
<button type="button" id="set_interactions_button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#short_range_dialog" data-keyboard="false" data-backdrop="static">Set interactions</button>
<p class="align-self-center pl-4"><b id="sr_interactions">0</b> short-range interactions.</p>
@ -604,8 +664,6 @@
<br style="clear:both;">
<i>Coffee breaks are spread evenly throughout the day.</i><br>
<br><br>
</div>
</div>