Add a progress spinner to modal forms

This commit is contained in:
Oliver 2021-12-04 10:44:48 +11:00
parent 9ba6ac423d
commit e9796676c0
3 changed files with 14 additions and 2 deletions

View File

@ -167,8 +167,13 @@ src="{% static 'img/blank_image.png' %}"
{% if order.shipment_date %}
<tr>
<td><span class='fas fa-truck'></span></td>
<td>{% trans "Shipped" %}</td>
<td>{{ order.shipment_date }}<span class='badge badge-right rounded-pill bg-dark'>{{ order.shipped_by }}</span></td>
<td>{% trans "Completed" %}</td>
<td>
{{ order.shipment_date }}
{% if order.shipped_by %}
<span class='badge badge-right rounded-pill bg-dark'>{{ order.shipped_by }}</span>
{% endif %}
</td>
</tr>
{% endif %}
{% if order.responsible %}

View File

@ -730,6 +730,9 @@ function submitFormData(fields, options) {
data = options.processBeforeUpload(data);
}
// Show the progress spinner
$(options.modal).find('#modal-progress-spinner').show();
// Submit data
upload_func(
options.url,
@ -737,10 +740,13 @@ function submitFormData(fields, options) {
{
method: options.method,
success: function(response) {
$(options.modal).find('#modal-progress-spinner').hide();
handleFormSuccess(response, options);
},
error: function(xhr) {
$(options.modal).find('#modal-progress-spinner').hide();
switch (xhr.status) {
case 400:
handleFormErrors(xhr.responseJSON, fields, options);

View File

@ -72,6 +72,7 @@ function createNewModal(options={}) {
<!-- Extra buttons can be inserted here -->
</div>
<span class='flex-item' style='flex-grow: 1;'></span>
<h4><span id='modal-progress-spinner' class='fas fa-circle-notch fa-spin' style='display: none;'></span></h4>
<button type='button' class='btn btn-secondary' id='modal-form-close' data-bs-dismiss='modal'>{% trans "Cancel" %}</button>
<button type='button' class='btn btn-primary' id='modal-form-submit'>{% trans "Submit" %}</button>
</div>