trustchain-oc1-orchestral
/
devicehub-teal
Archived
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #237 from RubenPX/feature/confirm-trade-changes 

Create confirmation dialog on apply lots changes
This commit is contained in:
Santiago L 2022-05-06 19:46:29 +02:00 committed by GitHub
parent 7177b0fbfd e1513e2ccf
commit 563f13ea43
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 76 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
ereuse_devicehub/static/js/main_inventory.js
View File

@ -18,7 +18,7 @@ $(document).ready(() => {
})
class TableController {
static #tableRows = table.activeRows;
static #tableRows = () => table.activeRows.length > 0 ? table.activeRows : [];
static #tableRowsPage = () => table.pages[table.rows().dt.currentPage - 1];
@ -26,7 +26,8 @@ class TableController {
* @returns Selected inputs from device list
*/
static getSelectedDevices() {
return this.#tableRows
if (this.#tableRows() == undefined) return [];
return this.#tableRows()
.filter(element => element.querySelector("input").checked)
.map(element => element.querySelector("input"))
}
@ -35,6 +36,7 @@ class TableController {
* @returns Selected inputs in current page from device list
*/
static getAllSelectedDevicesInCurrentPage() {
if (this.#tableRowsPage() == undefined) return [];
return this.#tableRowsPage()
.filter(element => element.querySelector("input").checked)
.map(element => element.querySelector("input"))
@ -44,7 +46,8 @@ class TableController {
* @returns All inputs from device list
*/
static getAllDevices() {
return this.#tableRows
if (this.#tableRows() == undefined) return [];
return this.#tableRows()
.map(element => element.querySelector("input"))
}
@ -52,13 +55,14 @@ class TableController {
* @returns All inputs from current page in device list
*/
static getAllDevicesInCurrentPage() {
if (this.#tableRowsPage() == undefined) return [];
return this.#tableRowsPage()
.map(element => element.querySelector("input"))
}
/**
*
* @param {HTMLElement} DOMElements
*
* @param {HTMLElement} DOMElements
* @returns Procesed input atributes to an Object class
*/
static ProcessTR(DOMElements) {
@ -367,7 +371,7 @@ async function processSelectedDevices() {
try {
const devicesIDs = action.devices.filter(dev => !action.lot.devices.includes(dev.id)).map(dev => dev.id)
await Api.devices_add(action.lot.id, devicesIDs);
this.notifyUser("Devices sucefully aded to selected lot/s", "", false);
this.notifyUser("Devices sucefully added to selected lot/s", "", false);
} catch (error) {
this.notifyUser("Failed to add devices to selected lot/s", error.responseJSON.message, true);
}
@ -377,7 +381,7 @@ async function processSelectedDevices() {
await Api.devices_remove(action.lot.id, devicesIDs);
this.notifyUser("Devices sucefully removed from selected lot/s", "", false);
} catch (error) {
this.notifyUser("Fail to remove devices from selected lot/s", error.responseJSON.message, true);
this.notifyUser("Failed to remove devices from selected lot/s", error.responseJSON.message, true);
}
}
requestCount += 1
@ -386,6 +390,7 @@ async function processSelectedDevices() {
this.list = [];
}
})
$("#confirmLotsModal").modal("hide"); // Hide dialog when click "Save changes"
document.getElementById("dropDownLotsSelector").classList.remove("show");
}
@ -423,7 +428,7 @@ async function processSelectedDevices() {
* Generates a list item with a correspondient checkbox state
* @param {Object} lot Lot model server
* @param {Device[]} selectedDevices list selected devices
* @param {HTMLElement} elementTarget
* @param {HTMLElement} elementTarget
* @param {Action[]} actions
*/
function templateLot(lot, selectedDevices, elementTarget, actions) {
@ -471,7 +476,48 @@ async function processSelectedDevices() {
if (eventClickActions) {
document.getElementById("ApplyDeviceLots").removeEventListener(eventClickActions);
}
eventClickActions = document.getElementById("ApplyDeviceLots").addEventListener("click", () => actions.doActions());
eventClickActions = document.getElementById("ApplyDeviceLots").addEventListener("click", () => {
const modal = $("#confirmLotsModal")
modal.modal({ keyboard: false })
let list_changes_html = "";
// {type: ["Remove" | "Add"], "LotID": string, "devices": number[]}
actions.list.forEach(action => {
let type;
let devices;
if (action.type == "Add") {
type = "success";
devices = action.devices.filter(dev => !action.lot.devices.includes(dev.id)) // Only show affected devices
} else {
type = "danger";
devices = action.devices.filter(dev => action.lot.devices.includes(dev.id)) // Only show affected devices
}
list_changes_html += `
<div class="card border-primary mb-3 w-100">
<div class="card-header" title="${action.lotID}">${action.lot.name}</div>
<div class="card-body pt-3">
<p class="card-text">
${devices.map(item => {
const name = `${item.type} ${item.manufacturer} ${item.model}`
return `<span class="badge bg-${type}" title="${name}">${item.devicehubID}</span>`;
}).join(" ")}
</p>
</div>
</div>`;
})
modal.find(".modal-body").html(list_changes_html)
const el = document.getElementById("SaveAllActions")
const elClone = el.cloneNode(true);
el.parentNode.replaceChild(elClone, el);
elClone.addEventListener("click", () => actions.doActions())
modal.modal("show")
// actions.doActions();
});
document.getElementById("ApplyDeviceLots").classList.add("disabled");
try {

19
ereuse_devicehub/templates/inventory/alert_lots_changes.html Normal file
View File

@ -0,0 +1,19 @@
<!-- Modal -->
<div class="modal fade" id="confirmLotsModal" tabindex="-1" role="dialog" aria-labelledby="confirmLotsModal"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Confirm lots changes</h5>
</div>
<div class="modal-body">
IF THIS TEXT APEARS THERE HAS AN ERROR
</div>
<div class="modal-footer">
<button type="button" onclick="$('#confirmLotsModal').modal('hide');" class="btn btn-secondary"
style="margin-right: auto;" data-dismiss="#confirmLotsModal">Cancel</button>
<button type="button" class="btn btn-primary" id="SaveAllActions">Save changes</button>
</div>
</div>
</div>
</div>

3
ereuse_devicehub/templates/inventory/device_list.html
View File

@ -344,7 +344,7 @@
<td>
<input type="checkbox" class="deviceSelect" data="{{ dev.id }}"
data-device-type="{{ dev.type }}" data-device-manufacturer="{{ dev.manufacturer }}"
data-device-dhid="{{ dev.devicehub_id }}"
data-device-dhid="{{ dev.devicehub_id }}" data-device-vname="{{ dev.verbose_name }}"
{% if form_new_allocate.type.data and dev.id in list_devices %}
checked="checked"
{% endif %}
@ -426,6 +426,7 @@
{% include "inventory/trade.html" %}
{% include "inventory/alert_export_error.html" %}
{% include "inventory/alert_unlink_tag_error.html" %}
{% include "inventory/alert_lots_changes.html" %}
<!-- Custom Code -->
<script>