Add ability to mark event checklists as Large Event

This just disables the checks to allow the rest of it to be filled out for large events, though I expect paper forms may still be used...
This commit is contained in:
2020-09-25 22:06:06 +01:00
parent 143b654210
commit 018397d28e
4 changed files with 71 additions and 29 deletions

View File

@@ -92,9 +92,15 @@
</table>
</div>
<div class="card card-default mb-3">
<div class="card-header">Power {% if object.medium_event %}<span class="badge badge-warning p-2 my-3">Medium Event</span>{%else%}<span class="badge badge-success p-2 my-3">Small Event</span>{%endif%}</div>
<div class="card-header">Power {% if object.event_size == 2 %}
<span class="badge badge-danger p-2 my-3">Large Event</span>
{% elif object.event_size == 1 %}
<span class="badge badge-warning p-2 my-3">Medium Event</span>
{%else%}<span class="badge badge-success p-2 my-3">Small Event</span>
{%endif%}</div>
{% if object.event_size != 2 %}
<div class="card-body">
{% if object.medium_event %}
{% if object.event_size == 1 %}
<dl class="row">
<dt class="col-10">{{ object|help_text:'source_rcd'|safe }}</dt>
<dd class="col-2">
@@ -220,6 +226,7 @@
</dl>
{% endif %}
</div>
{% endif %}
</div>
</div>
<div class="col-12 text-right">

View File

@@ -32,31 +32,28 @@
{% if not object.pk %}
$('.form-hide').slideUp();
{% else %}
{% if object.medium_event %}
$('#small-event').slideUp();
$('#medium-event').slideDown();
$('#size-selector button[data-event-size=1]').addClass('active');
{% else %}
$('#small-event').slideDown();
$('#medium-event').slideUp();
$('#size-selector button[data-event-size=0]').addClass('active');
{% endif%}
$('#size-selector button[data-event-size={{object.event_size}}]').addClass('active');
for(i = 0; i < 3; i++) {
if(i == {{object.event_size}}) {
$('#size-{{object.event_size}}').slideDown();
}
else {
$('#size-' + i).slideUp();
}
}
{% endif %}
$('#size-selector button').on('click', function () {
$('#{{form.event_size.auto_id}}').val($(this).data('event-size'))
$(this).toggleClass('active');
$('#size-selector button').not(this).removeClass('active');
if ($(this).data('event-size') == 1) {
$('#{{form.medium_event.auto_id}}').prop('checked', true);
$('#small-event').slideUp();
$('#medium-event').slideDown();
//$('#medium-event').find('select,input').attr('required', 'true');
//$('#small-event').find('select,input').removeAttr('required');
} else {
$('#{{form.medium_event.auto_id}}').prop('checked', false);
$('#small-event').slideDown();
$('#medium-event').slideUp();
//('#small-event').find('select,input').attr('required', 'true');
//('#medium-event').find('select,input').removeAttr('required');
$('#size-' + $(this).data('event-size')).slideDown();
for(i = 0; i < 3; i++) {
if(i == $(this).data('event-size')) {
$('#size-' + $(this).data('event-size')).slideDown();
}
else {
$('#size-' + i).slideUp();
}
}
});
$('button[data-action=add]').on('click', function (event) {
@@ -238,14 +235,15 @@
<div class="card">
<div class="card-header">Event Size</div>
<div class="card-body" id="size-selector">
{% render_field form.medium_event style="display: none" %}
{% render_field form.event_size style="display: none;" %}
<button type="button" class="btn btn-success" data-event-size="0" style="width: 10rem;">Small</button>
<button type="button" class="btn btn-warning" data-event-size="1" style="width: 10rem;">Medium</button>
<button type="button" class="btn btn-danger" data-event-size="2" style="width: 10rem;">Large</button>
</div>
</div>
</div>
</div>
<div class="row my-3 form-hide" id="small-event">
<div class="row my-3 form-hide" id="size-0">
<div class="col-12">
<div class="card">
<div class="card-header">Electrical Checks <small>for Small TEC Events <6kVA (aprox. 26A)</small></div>
@@ -258,7 +256,7 @@
</div>
</div>
</div>
<div class="row my-3 form-hide" id="medium-event">
<div class="row my-3 form-hide" id="size-1">
<div class="col-12">
<div class="card">
<div class="card-header">Electrical Checks <small>for Medium TEC Events </small></div>
@@ -348,6 +346,16 @@
</div>
</div>
</div>
<div class="row my-3 form-hide" id="size-2">
<div class="col-12">
<div class="card">
<div class="card-header">Electrical Checks <small>for Large TEC Events</div>
<div class="card-body">
<p>Outside the scope of this assessment. Carry on.</p>
</div>
</div>
</div>
</div>
<div class="row mt-3">
<div class="col-sm-12 text-right">
<div class="btn-group">