Add qr to conso + fix issues
This commit is contained in:
parent
c73123f450
commit
79d51eecfc
2 changed files with 111 additions and 15 deletions
|
|
@ -21,6 +21,7 @@ SPDX-License-Identifier: GPL-3.0-or-later
|
||||||
<div class="card-body text-center text-break p-2">
|
<div class="card-body text-center text-break p-2">
|
||||||
<span id="user_note"><i class="small">{% trans "Please select a note" %}</i></span>
|
<span id="user_note"><i class="small">{% trans "Please select a note" %}</i></span>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="qrreader"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -159,6 +160,79 @@ SPDX-License-Identifier: GPL-3.0-or-later
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block extrajavascript %}
|
{% block extrajavascript %}
|
||||||
|
<script>
|
||||||
|
function onScanSuccess(decodedText, decodedResult) {
|
||||||
|
// handle the scanned code as you like, for example:
|
||||||
|
// Add user if exist on sources_notes_display
|
||||||
|
$.getJSON('/api/note/consumer/?format=json&alias=' + decodedText + '&search=user|club',
|
||||||
|
function (consumers) {
|
||||||
|
if (consumers.count > 0) {
|
||||||
|
// Add the user to the list of sources
|
||||||
|
let consumer = consumers.results[0];
|
||||||
|
// check if already in the list
|
||||||
|
let found = false;
|
||||||
|
notes_display.forEach(function (disp) {
|
||||||
|
if (disp.id === consumer.id) {
|
||||||
|
disp.quantity += 1;
|
||||||
|
found = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (!found) {
|
||||||
|
let disp = {
|
||||||
|
name: consumer.name,
|
||||||
|
id: consumer.id,
|
||||||
|
note: consumer.note,
|
||||||
|
quantity: 1
|
||||||
|
}
|
||||||
|
notes_display.push(disp);
|
||||||
|
}
|
||||||
|
// Display
|
||||||
|
const note_list = $('#' + 'note_list');
|
||||||
|
let html = ''
|
||||||
|
notes_display.forEach(function (disp) {
|
||||||
|
html += li('note' + '_' + disp.id,
|
||||||
|
disp.name +
|
||||||
|
'<span class="badge badge-dark badge-pill">' +
|
||||||
|
disp.quantity + '</span>',
|
||||||
|
displayStyle(disp.note))
|
||||||
|
})
|
||||||
|
|
||||||
|
// Emitters are displayed
|
||||||
|
note_list.html(html);
|
||||||
|
|
||||||
|
|
||||||
|
// Add the hover and click events
|
||||||
|
notes_display.forEach(function (disp) {
|
||||||
|
const line_obj = $('#' + 'note' + '_' + disp.id)
|
||||||
|
// Hover an emitter display also the profile picture
|
||||||
|
line_obj.hover(function () {
|
||||||
|
displayNote(disp.note, disp.name, 'user_note', 'profile_pic');
|
||||||
|
})
|
||||||
|
|
||||||
|
// When an emitter is clicked, it is removed
|
||||||
|
line_obj.click(removeNote(disp, 'note', notes_display, 'note_list', 'user_note', 'profile_pic'))
|
||||||
|
})
|
||||||
|
|
||||||
|
// Stop the scanner
|
||||||
|
html5QrcodeScanner.clear();
|
||||||
|
html5QrcodeScanner.render(onScanSuccess, onScanFailure);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
console.log(`Code matched = ${decodedText}`, decodedResult);
|
||||||
|
}
|
||||||
|
|
||||||
|
function onScanFailure(error) {}
|
||||||
|
// check if html5QrcodeScanner is already defined
|
||||||
|
if (typeof html5QrcodeScanner === 'undefined') {
|
||||||
|
var html5QrcodeScanner = null;
|
||||||
|
}
|
||||||
|
html5QrcodeScanner = new Html5QrcodeScanner(
|
||||||
|
"qrreader",
|
||||||
|
{ fps: 10, qrbox: {width: 200, height: 200} },
|
||||||
|
/* verbose= */ false);
|
||||||
|
html5QrcodeScanner.render(onScanSuccess, onScanFailure);
|
||||||
|
</script>
|
||||||
<script type="text/javascript" src="{% static "note/js/consos.js" %}"></script>
|
<script type="text/javascript" src="{% static "note/js/consos.js" %}"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
{% for button in highlighted %}
|
{% for button in highlighted %}
|
||||||
|
|
|
||||||
|
|
@ -172,13 +172,22 @@ SPDX-License-Identifier: GPL-2.0-or-later
|
||||||
if (consumers.count > 0) {
|
if (consumers.count > 0) {
|
||||||
// Add the user to the list of sources
|
// Add the user to the list of sources
|
||||||
let consumer = consumers.results[0];
|
let consumer = consumers.results[0];
|
||||||
disp = {
|
let found = false;
|
||||||
name: consumer.name,
|
sources_notes_display.forEach(function (disp) {
|
||||||
id: consumer.id,
|
if (disp.id === consumer.id) {
|
||||||
note: consumer.note,
|
disp.quantity += 1;
|
||||||
quantity: 1
|
found = true;
|
||||||
}
|
}
|
||||||
sources_notes_display.push(disp);
|
});
|
||||||
|
if (!found) {
|
||||||
|
let disp = {
|
||||||
|
name: consumer.name,
|
||||||
|
id: consumer.id,
|
||||||
|
note: consumer.note,
|
||||||
|
quantity: 1
|
||||||
|
}
|
||||||
|
sources_notes_display.push(disp);
|
||||||
|
}
|
||||||
// Display
|
// Display
|
||||||
const note_list = $('#' + 'source_note_list');
|
const note_list = $('#' + 'source_note_list');
|
||||||
let html = ''
|
let html = ''
|
||||||
|
|
@ -191,20 +200,33 @@ SPDX-License-Identifier: GPL-2.0-or-later
|
||||||
})
|
})
|
||||||
|
|
||||||
// Emitters are displayed
|
// Emitters are displayed
|
||||||
note_list.html(html)
|
note_list.html(html);
|
||||||
|
// Stop the scanner
|
||||||
|
sources_notes_display.forEach(function (disp) {
|
||||||
|
const line_obj = $('#' + 'source_note' + '_' + disp.id)
|
||||||
|
// Hover an emitter display also the profile picture
|
||||||
|
line_obj.hover(function () {
|
||||||
|
displayNote(disp.note, disp.name, 'user_note', 'profile_pic');
|
||||||
|
})
|
||||||
|
|
||||||
|
// When an emitter is clicked, it is removed
|
||||||
|
line_obj.click(removeNote(disp, 'source_note', sources_notes_display, 'source_note_list', 'user_note', 'profile_pic'))
|
||||||
|
})
|
||||||
|
|
||||||
|
// Stop the scanner
|
||||||
|
html5QrcodeScanner.clear();
|
||||||
|
html5QrcodeScanner.render(onScanSuccess, onScanFailure);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
console.log(`Code matched = ${decodedText}`, decodedResult);
|
console.log(`Code matched = ${decodedText}`, decodedResult);
|
||||||
}
|
}
|
||||||
|
|
||||||
function onScanFailure(error) {
|
function onScanFailure(error) {}
|
||||||
// handle scan failure, usually better to ignore and keep scanning.
|
if (typeof html5QrcodeScanner === 'undefined') {
|
||||||
// for example:
|
var html5QrcodeScanner = null;
|
||||||
console.warn(`Code scan error = ${error}`);
|
}
|
||||||
}
|
html5QrcodeScanner = new Html5QrcodeScanner(
|
||||||
|
|
||||||
let html5QrcodeScanner = new Html5QrcodeScanner(
|
|
||||||
"qrreader",
|
"qrreader",
|
||||||
{ fps: 10, qrbox: {width: 250, height: 250} },
|
{ fps: 10, qrbox: {width: 250, height: 250} },
|
||||||
/* verbose= */ false);
|
/* verbose= */ false);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue