|
|
|
@ -34,8 +34,105 @@ with this program; if not, write to the Free Software Foundation, Inc., |
|
|
|
|
|
|
|
<form class="form" method="post"> |
|
|
|
{% csrf_token %} |
|
|
|
<h3>{% trans "Invoice's articles" %}</h3> |
|
|
|
<div id="form_set" class="form-group"> |
|
|
|
{{ articlesformset.management_form }} |
|
|
|
{% for articlesform in articlesformset.forms %} |
|
|
|
<div class='product_to_sell form-inline'> |
|
|
|
{% trans "Article" %} : |
|
|
|
{% bootstrap_form articlesform label_class='sr-only' %} |
|
|
|
|
|
|
|
<button class="btn btn-danger btn-sm" id="id_form-0-article-remove" type="button"> |
|
|
|
<span class="fa fa-times"></span> |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
{% endfor %} |
|
|
|
</div> |
|
|
|
<input class="btn btn-primary btn-sm" role="button" value="{% trans "Add an article"%}" id="add_one"> |
|
|
|
<p> |
|
|
|
{% blocktrans %} |
|
|
|
Total price : <span id="total_price">0,00</span> € |
|
|
|
{% endblocktrans %} |
|
|
|
</p> |
|
|
|
{% bootstrap_form factureform %} |
|
|
|
{% bootstrap_button action_name button_type='submit' icon='star' %} |
|
|
|
</form> |
|
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript"> |
|
|
|
var prices = {}; |
|
|
|
{% for article in articles %} |
|
|
|
prices[{{ article.id|escapejs }}] = {{ article.prix }}; |
|
|
|
{% endfor %} |
|
|
|
|
|
|
|
var template = `Article : |
|
|
|
{% bootstrap_form articlesformset.empty_form label_class='sr-only' %} |
|
|
|
|
|
|
|
<button class="btn btn-danger btn-sm" |
|
|
|
id="id_form-__prefix__-article-remove" type="button"> |
|
|
|
<span class="fa fa-times"></span> |
|
|
|
</button>` |
|
|
|
|
|
|
|
function add_article(){ |
|
|
|
// Index start at 0 => new_index = number of items |
|
|
|
var new_index = |
|
|
|
document.getElementsByClassName('product_to_sell').length; |
|
|
|
document.getElementById('id_form-TOTAL_FORMS').value ++; |
|
|
|
var new_article = document.createElement('div'); |
|
|
|
new_article.className = 'product_to_sell form-inline'; |
|
|
|
new_article.innerHTML = template.replace(/__prefix__/g, new_index); |
|
|
|
document.getElementById('form_set').appendChild(new_article); |
|
|
|
add_listenner_for_id(new_index); |
|
|
|
} |
|
|
|
|
|
|
|
function update_price(){ |
|
|
|
var price = 0; |
|
|
|
var product_count = |
|
|
|
document.getElementsByClassName('product_to_sell').length; |
|
|
|
var article, article_price, quantity; |
|
|
|
for (i = 0; i < product_count; ++i){ |
|
|
|
article = document.getElementById( |
|
|
|
'id_form-' + i.toString() + '-article').value; |
|
|
|
if (article == '') { |
|
|
|
continue; |
|
|
|
} |
|
|
|
article_price = prices[article]; |
|
|
|
quantity = document.getElementById( |
|
|
|
'id_form-' + i.toString() + '-quantity').value; |
|
|
|
price += article_price * quantity; |
|
|
|
} |
|
|
|
document.getElementById('total_price').innerHTML = |
|
|
|
price.toFixed(2).toString().replace('.', ','); |
|
|
|
} |
|
|
|
|
|
|
|
function add_listenner_for_id(i){ |
|
|
|
document.getElementById('id_form-' + i.toString() + '-article') |
|
|
|
.addEventListener("change", update_price, true); |
|
|
|
document.getElementById('id_form-' + i.toString() + '-article') |
|
|
|
.addEventListener("onkeypress", update_price, true); |
|
|
|
document.getElementById('id_form-' + i.toString() + '-quantity') |
|
|
|
.addEventListener("change", update_price, true); |
|
|
|
document.getElementById('id_form-' + i.toString() + '-article-remove') |
|
|
|
.addEventListener("click", function(event) { |
|
|
|
var article = event.target.parentNode; |
|
|
|
article.parentNode.removeChild(article); |
|
|
|
document.getElementById('id_form-TOTAL_FORMS').value --; |
|
|
|
update_price(); |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
// Add events manager when DOM is fully loaded |
|
|
|
document.addEventListener("DOMContentLoaded", function() { |
|
|
|
document.getElementById("add_one") |
|
|
|
.addEventListener("click", add_article, true); |
|
|
|
var product_count = |
|
|
|
document.getElementsByClassName('product_to_sell').length; |
|
|
|
for (i = 0; i < product_count; ++i){ |
|
|
|
add_listenner_for_id(i); |
|
|
|
} |
|
|
|
update_price(); |
|
|
|
}); |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
{% endblock %} |
|
|
|
|