management of the form of adding a device in a batch from the frontend

This commit is contained in:
Cayo Puigdefabregas 2021-12-30 12:41:37 +01:00
parent a5a08a162c
commit 94bf3aaf87
4 changed files with 53 additions and 16 deletions

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,19 @@
$(document) .ready(function() {
$(".deviceSelect").on("change", deviceSelect);
})
function deviceSelect() {
var devices = $(".deviceSelect").filter(':checked');
var devices_id = $.map(devices, function(x) { return $(x).attr('data')}).join(",");
if (devices_id == "") {
$("#addingLotModal .text-danger").show();
$("#addingLotModal .btn-primary").hide();
} else {
$("#addingLotModal .text-danger").hide();
$("#addingLotModal .btn-primary").removeClass('d-none');
$("#addingLotModal .btn-primary").show();
}
$.map($(".devicesList"), function(x) {
$(x).val(devices_id);
});
}

View File

@ -1,28 +1,39 @@
<div class="modal fade" id="addingLotModal" tabindex="-1" style="display: none;" aria-hidden="true"> <div class="modal fade" id="addingLotModal" tabindex="-1" style="display: none;" aria-hidden="true">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title">Adding to a lot</h5> <h5 class="modal-title">Adding to a lot</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body">
Please write a name of a lot <form action="/inventory/lot/devices/add" method="post">
<select class="form-control selectpicker" id="selectLot" data-live-search="true"> {# form.csrf_token #}
{% for lot in lots %} <div class="modal-body">
<option value="{{ lot.id }}">{{ lot.name }}</option> Please write a name of a lot
{% endfor %} <select class="form-control selectpicker" id="selectLot" name="lot" data-live-search="true">
</select> {% for lot in lots %}
</div> <option value="{{ lot.id }}">{{ lot.name }}</option>
<div class="modal-footer"> {% endfor %}
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> </select>
<button type="button" class="btn btn-primary">Save changes</button> <input class="devicesList" type="hidden" name="devices" />
</div> <p class="text-danger">
You need select first some device for adding this in a lot
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<input type="submit" class="btn btn-primary d-none" value="Save changes" />
</div>
</form>
</div> </div>
</div> </div>
</div> </div>
<script> <script>
$(function() { //$(function() {
$('#selectLot').selectpicker(); // $('#selectLot').selectpicker();
}); //});
</script> </script>

View File

@ -126,7 +126,7 @@
<tbody> <tbody>
{% for dev in devices %} {% for dev in devices %}
<tr> <tr>
<td><input type="checkbox" /></td> <td><input type="checkbox" class="deviceSelect" data="{{ dev.id }}"/></td>
<td>{{ dev.type }} {{ dev.manufacturer }} {{ dev.model }}</td> <td>{{ dev.type }} {{ dev.manufacturer }} {{ dev.model }}</td>
<td>{{ dev.devicehub_id }}</td> <td>{{ dev.devicehub_id }}</td>
<td> <td>
@ -158,4 +158,9 @@
<script> <script>
const table = new simpleDatatables.DataTable("table") const table = new simpleDatatables.DataTable("table")
</script> </script>
<script>
</script>
<script src="{{ url_for('static', filename='js/jquery-3.6.0.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/main_inventory.js') }}"></script>
{% endblock main %} {% endblock main %}