mirror of
https://gitlab2.federez.net/re2o/re2o
synced 2024-11-16 08:23:12 +00:00
[Printer] Refactor frontend of printer interface (1st step)
This commit is contained in:
parent
d7233a0845
commit
8656f6dcf3
1 changed files with 51 additions and 41 deletions
|
@ -13,56 +13,66 @@
|
|||
<h3>{% trans "Printing Menu" %}</h3>
|
||||
{{ jobform.management_form }}
|
||||
{% bootstrap_formset_errors jobform %}
|
||||
<div id="form_set" class="form-group">
|
||||
<div class="row">
|
||||
<div id="form_set" class="form-group container">
|
||||
{% for job in jobform.forms %}
|
||||
<div class='file_to_print form-inline'>
|
||||
<div class="file_to_print col-xs-12 col-sm-4 col-md-3" style="margin-top:1em">
|
||||
{% massive_bootstrap_form job "" %}
|
||||
<button class="btn btn-danger" id="id_form-0-job-remove" type="button">
|
||||
<button class="btn btn-danger form-job-remove" type="button">
|
||||
<span class="fa fa-times"></span>
|
||||
</button>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 row btn-toolbar">
|
||||
<button type="button" class="btn btn-primary" role="button" id="add_one">{% trans "Add a file"%}</button>
|
||||
|
||||
{% bootstrap_button action_name name="options" button_type="submit" icon="star" %}
|
||||
{% bootstrap_button action_name name="Next" button_type="submit" icon="star" %}
|
||||
</div>
|
||||
<div style="clear:both; margin-bottom:1em"></div>
|
||||
</form>
|
||||
<script type="text/javascript">
|
||||
|
||||
var template = `{% bootstrap_form jobform.empty_form %}
|
||||
<button class="btn btn-danger btn-sm"
|
||||
id="id_form-__prefix__-job-remove" type="button">
|
||||
<button class="btn btn-danger form-job-remove" type="button">
|
||||
<span class="fa fa-times"></span>
|
||||
</button>`
|
||||
|
||||
function add_job() {
|
||||
var new_index =
|
||||
document.getElementsByClassName('file_to_print').length;
|
||||
newId = document.getElementsByClassName('file_to_print').length;
|
||||
|
||||
|
||||
document.getElementById('id_form-TOTAL_FORMS').value ++;
|
||||
|
||||
var new_job = document.createElement('div');
|
||||
new_job.className = 'file_to_print form-inline';
|
||||
new_job.innerHTML = template.replace(/__prefix__/g, new_index);
|
||||
|
||||
new_job.className = 'file_to_print col-xs-12 col-sm-4 col-md-3';
|
||||
|
||||
new_job.style.marginTop = '1em';
|
||||
|
||||
new_job.innerHTML = template.replace(/__prefix__/g, newId);
|
||||
|
||||
document.getElementById('form_set').appendChild(new_job);
|
||||
add_listener_for_id(new_index);
|
||||
|
||||
var newJobLength = new_job.childNodes.length
|
||||
|
||||
add_listener_for_btn(new_job.childNodes[newJobLength - 1]);
|
||||
}
|
||||
|
||||
|
||||
function del_job(event){
|
||||
var job = event.target.parentNode;
|
||||
function del_job(job, event){
|
||||
// var job = event.target.parentNode;
|
||||
job.parentNode.removeChild(job);
|
||||
document.getElementById('id_form-TOTAL_FORMS').value --;
|
||||
}
|
||||
|
||||
|
||||
function add_listener_for_id(i){
|
||||
document.getElementById('id_form-' + i.toString() + '-job-remove')
|
||||
.addEventListener("click", function(event){
|
||||
var job = event.target.parentNode;
|
||||
job.parentNode.removeChild(job);
|
||||
document.getElementById('id_form-TOTAL_FORMS').value --;
|
||||
}
|
||||
)
|
||||
function add_listener_for_btn(rmBtn){
|
||||
|
||||
rmBtn.addEventListener("click", function(event){del_job(rmBtn.parentNode, event)});
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
@ -70,19 +80,19 @@ function add_listener_for_id(i){
|
|||
document.addEventListener(
|
||||
"DOMContentLoaded",
|
||||
function() {
|
||||
document.getElementById("add_one")
|
||||
.addEventListener("click", add_job, true);
|
||||
document.getElementById('id_form-0-job-remove')
|
||||
.addEventListener("click", function(event){
|
||||
var job = event.target.parentNode;
|
||||
job.parentNode.removeChild(job);
|
||||
document.getElementById('id_form-TOTAL_FORMS').value --;
|
||||
document.getElementById("add_one").addEventListener("click", add_job, true);
|
||||
|
||||
// Array of all the delete buttons
|
||||
var allBtns = document.getElementsByClassName("form-job-remove");
|
||||
|
||||
for (var i=0; i < allBtns.length; i++) {
|
||||
add_listener_for_btn(allBtns[i]);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
);
|
||||
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
Loading…
Reference in a new issue