Bug 38689: Display errors in a modal

This patch adds a `(with errors)` link next to the status of any edifact
messages that produced errors on processing.  The link will popup a
modal containing the error details recorded for that message.

Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
This commit is contained in:
Martin Renvoize 2024-12-19 17:37:31 +00:00 committed by Katrin Fischer
parent 6ffb26cd0b
commit b1b96351b7
No known key found for this signature in database
GPG Key ID: 0EF6E2C03357A834
2 changed files with 74 additions and 18 deletions

View File

@ -55,4 +55,6 @@ properties:
- string
- "null"
description: EDIFACT file name
additionalProperties: false
errors:
type: array
additionalProperties: false

View File

@ -34,26 +34,42 @@
<h1>EDIFACT messages</h1>
<div id="acqui_edifactmsgs" class="page-section">
<table id="edi_msgs"></table>
</div>
<!-- /#acqui_edifactmsgs -->
<!-- Modal to display EDIFACT messages -->
<div class="modal" id="EDI_modal" tabindex="-1" role="dialog" aria-labelledby="EDI_modal_label" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="EDI_modal_label">EDIFACT message</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="loading"> <img src="[% interface | html %]/[% theme | html %]/img/spinner-small.gif" alt="" /> Loading </div>
</div>
<div class="modal-footer">
<button class="btn btn-default" data-bs-dismiss="modal">Close</button>
</div>
<!-- Modal to display EDIFACT messages -->
<div class="modal" id="EDI_modal" tabindex="-1" role="dialog" aria-labelledby="EDI_modal_label" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="EDI_modal_label">EDIFACT message</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body"> </div>
<div class="modal-footer">
<button class="btn btn-default" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal to display EDIFACT errors -->
<div class="modal" id="EDI_errors_modal" tabindex="-1" role="dialog" aria-labelledby="EDI_errors_modal_label" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="EDI_errors_modal_label">EDIFACT processing errors for <span id="EDI_errors_filename"></span></h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="loading"> <img src="[% interface | html %]/[% theme | html %]/img/spinner-small.gif" alt="" /> Loading </div>
</div>
<div class="modal-footer">
<button class="btn btn-default" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- /#acqui_edifactmsgs -->
[% END %]
[% MACRO jsinclude BLOCK %]
@ -69,7 +85,8 @@
},
"embed": [
"vendor",
"basket"
"basket",
"errors"
],
"order": [[ 1, "desc" ]],
"columns": [
@ -92,7 +109,23 @@
"data": "status",
"title": _("Status"),
"searchable": true,
"orderable": true
"orderable": true,
"render": function(daya, type, row, meta) {
let rendered = '';
if ( row.errors.length > 0 ) {
let errorsList = '<ul>';
row.errors.forEach(error => {
if (error.details) {
errorsList += '<li>' + error.details + '</li>';
}
});
errorsList += '</ul>';
rendered = row.status + ' (<a href="#" data-bs-toggle="modal" data-bs-target="#EDI_errors_modal" data-bs-errors="'+ errorsList + '" data-bs-filename="' + row.filename + '">' + _("with errors") + '</a>)';
} else {
rendered = row.status;
}
return rendered;
}
},
{
"data": "vendor.name",
@ -167,6 +200,27 @@
EDIModal.on("hidden.bs.modal", function(){
EDIModalBody.html("<div id=\"loading\"><img src=\"[% interface | html %]/[% theme | html %]/img/spinner-small.gif\" alt=\"\" /> "+_("Loading")+"</div>");
});
const errorsModal = document.getElementById('EDI_errors_modal')
if (errorsModal) {
errorsModal.addEventListener('show.bs.modal', event => {
// Link that triggered the modal
const link = event.relatedTarget
// Extract info from data-bs-* attributes
const filename = link.getAttribute('data-bs-filename')
const errors = link.getAttribute('data-bs-errors')
// Update the modal's title.
const modalTitleSpan = errorsModal.querySelector('.modal-title #EDI_errors_filename')
modalTitleSpan.textContent = filename;
// Update the modal's content.
const modalBody = errorsModal.querySelector('.modal-body')
modalBody.innerHTML = errors;
})
}
$("body").on("click", ".delete_msg" ,function(){
return confirm(_("Are you sure you want to delete this message?"));
});