display total price on order form

This commit is contained in:
Laetitia Getti 2023-07-25 13:58:22 +02:00
parent c8811f93d0
commit 27fc20090e
2 changed files with 47 additions and 5 deletions

View file

@ -79,7 +79,7 @@
{% csrf_token %}
<td>{{ item.name }}</td>
<td>{{ item.price }} €</td>
<td><input name="quantity_{{ item.id }}" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}></input>
<td><input name="quantity_{{ item.id }}" onblur="findTotal()" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}></input>
{% if item.get_remaining_nb is not null %}
<span class="is-italic mini-title">
{% if item.get_remaining_nb == 0 %}Produit épuisé
@ -88,6 +88,10 @@
{% endif %}{% endif %}</td>
</tr>
{% endfor %}
<tr>
<td></td><td></td>
<td><strong>Total : <span class="total">0</span></strong></td>
</tr>
</tbody>
</table>
@ -104,7 +108,8 @@
<p>{{ item.price }} €</p>
</div>
<div class="card-footer-item">
<td><input name="quantity_{{ item.id }}" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}></input></td>
<td><input name="quantity_{{ item.id }}" onblur="findTotal()" size="4" type="number" value="0" min="0" {% if item.get_remaining_nb == 0 %}disabled{% endif %}>
</input></td>
{% if item.get_remaining_nb is not null %}
<span class="is-italic mini-title">
{% if item.get_remaining_nb == 0 %}Produit épuisé
@ -115,6 +120,7 @@
</div>
</div>
{% endfor %}
<div><strong>Total : <span class="total">0</span></strong></div>
</div>
{% if error_message %}<p class="has-text-danger">{{ error_message }}</p>{% endif %}
@ -131,7 +137,7 @@
</div>
<div class="column">
<p><label for="phone">Numéro de téléphone :</label>
<input id="phone" type="text" placeholder="0601020304" name="phone" value="{{ phone }}" required></p>
<input id="phone" type="tel" pattern="[0-9]{10}" placeholder="0601020304" name="phone" value="{{ phone }}" required></p>
<p><label for="email">Adresse mail : </label>
<input id="email" type="email" placeholder="exemple@mail.fr" name="email" value="{{ email }}" required></p>
</div>
@ -141,9 +147,36 @@
<div class="buttons">
<button type="submit" value="Order" class="button is-primary">
<i class="fa fa-shopping-basket mr-3" aria-hidden="true"></i>Commander</button>
<i class="fa fa-shopping-basket mr-3" aria-hidden="true"></i>Commander
</button>
<p>Total : <span class="total">0</span></p>
</div>
</form>
{% endif %}
</div>
{% endblock %}
{% endblock %}
<script>
{% block extra_js %}
// Compute total price whenever a value in input is modified
function findTotal(){
var inputs = document.getElementsByTagName("input");
total_price = 0;
for (x = 0 ; x < inputs.length ; x++){
input_name = inputs[x].getAttribute("name");
if(input_name.indexOf("quantity_")==0){ // get the quantities inputs only
item_id = input_name.split("_")[1];
prices = {{ prices_dict | safe }};
total_price += prices[item_id] * inputs[x].value;
console.log(prices[item_id] * inputs[x].value);
}
}
console.log(total_price);
console.log(document.getElementsByClassName('total'));
[].forEach.call(document.getElementsByClassName('total'), function (el) {
el.innerHTML = total_price;
})
}
{% endblock %}
</script>

View file

@ -1,8 +1,10 @@
import csv
import json
from io import BytesIO
from django import http
from django.contrib.auth.mixins import LoginRequiredMixin, UserPassesTestMixin
from django.core.serializers.json import DjangoJSONEncoder
from django.shortcuts import get_object_or_404
from django.template.loader import get_template
from django.urls import reverse, reverse_lazy
@ -68,10 +70,17 @@ class GroupedOrderDetailView(generic.DetailView):
def get_context_data(self, **kwargs):
context = super().get_context_data(**kwargs)
# Get remaining quantities
qty_dict = {}
for item in self.get_object().item_set.all():
qty_dict[item.id] = item.get_remaining_nb()
context["remaining_qty"] = qty_dict
# Get a dict with prices for the js display of total price of an order
prices_dict = {}
for item in self.get_object().item_set.all():
prices_dict[item.id] = item.price
context["prices_dict"] = json.dumps(prices_dict, cls=DjangoJSONEncoder)
return context