Commit b0dc8858 authored by HEVELINE Thomas's avatar HEVELINE Thomas Committed by HEVELINE Thomas

(44): implement dynamic item table

parent c20be33a
......@@ -12,35 +12,50 @@
{% block main %}
<h1>Livraison</h1>
<script>
var url = new URL(window.location.href);
console.log(url.searchParams)
function applyFilter(){
url.searchParams.set('delivered', document.getElementById('delivered').checked);
url.searchParams.set('delivery_in_progress', document.getElementById('delivery_in_progress').checked);
window.location.href = url
}
</script>
<form>
<label for="delivered">Déjà remis</label>
<input type="checkbox" id="delivered">
<label for="delivery_in_progress">Distribution en cours</label>
<input type="checkbox" id="delivery_in_progress">
</form>
<button onclick="applyFilter()">Appliquer</button>
<div id="deliveries"></div>
<script>
window.addEventListener('load', function(){
var orderedItemList = new OrderedItemList('deliveries', '/boutique/ordered_items', function(item){
function sendMail(){
console.log(1)
};
function viewProfile(){
console.log(2)
};
return [
new OrderedItemList.ItemAction('Envoyer un email', sendMail),
new OrderedItemList.ItemAction('Voir le profil', viewProfile),
];
});
});
</script>
<table id="deliveries">
<tr>
<th>Produit</th>
<th>Client</th>
<th>Commandé</th>
<th>Livré</th>
<th></th>
</tr>
{% for orderitem in object_list %}
<tr data-id="{{ orderitem.id }}">
<td>{{ orderitem.item }}</td>
<td>{{ orderitem.order.user.profile }}</td>
<td class="quantity_ordered">{{ orderitem.quantity }}</td>
<td class="quantity_delivered">{{ orderitem.quantity_delivered }}</td>
<td><button>Livrer</button></td>
</tr>
{% empty %}
<tr>
<td colspan="5">
Aucun produit en cours de livraison, allez sur la page
d'administration pour lancer une livraison.
</td>
</tr>
{% endfor %}
</table>
{% endblock %}
{% block scripts %}
<script src="{% static 'js/json_request.js' %}" ></script>
<script src="{% static 'boutique/js/deliver.js' %}" ></script>
<script src="{% static 'js/json_request.js' %}"></script>
<script src="{% static 'js/table_list.js' %}"></script>
<script src="{% static 'js/ordered_items.js' %}"></script>
{% endblock %}
......@@ -49,4 +49,7 @@ urlpatterns = [
),
),
path("delivery", views.DeliveryView.as_view(), name="delivery"),
path("ordered_items", views.orderedItems, name="ordered_items"),
]
......@@ -6,6 +6,7 @@ from typing import Type
from django.contrib import messages
from django.contrib.auth import get_user_model
from django.contrib.auth.decorators import permission_required
from django.contrib.auth.mixins import LoginRequiredMixin
from django.contrib.auth.mixins import PermissionRequiredMixin
from django.contrib.auth.models import AnonymousUser
......@@ -22,6 +23,7 @@ from django.forms import inlineformset_factory
from django.http import HttpRequest
from django.http import HttpResponse
from django.http import JsonResponse
from django.shortcuts import render
from django.urls import reverse
from django.urls import reverse_lazy
from django.utils import timezone
......@@ -596,3 +598,23 @@ class DeliveryView(PermissionRequiredMixin, ListView):
{"status": "error", "code": 400, "message": "Erreur inconnue"},
status_code=400,
)
@permission_required("permissions.default_rights")
def orderedItems(request: HttpRequest) -> HttpResponse:
if request.method == "OPTIONS":
orderedItems = [
{"id": orderItem.id,
"item": str(orderItem.item),
"image": str(orderItem.item.image),
"display_name": str(orderItem.order.user.profile),
"quantity": orderItem.quantity,
"quantity_delivered": orderItem.quantity_delivered
}
for orderItem in OrderItem.objects.filter(
beeing_delivered=True,
quantity_delivered__lt=F("quantity"),
order__payment__paid=True,
).select_related("order__user__profile", "order__user", "item").all()
]
return JsonResponse({"orderedItems": orderedItems})
return render(request, "", {} )
\ No newline at end of file
'use strict';
(function () {
var OrderedItemList = function (containerId, listProvider, buildCallback) {
TableList.call(this, containerId, buildCallback);
queryJson(listProvider, {}, this.populate.bind(this));
};
OrderedItemList.prototype = Object.create(TableList.prototype, {
populate: {
value: function (json) {
this.elems = json['orderedItems']
var header = document.createElement('tr');
header.appendChild(document.createElement('th')).appendChild(document.createTextNode('Photo'));
header.appendChild(document.createElement('th')).appendChild(document.createTextNode('Produit'));
header.appendChild(document.createElement('th')).appendChild(document.createTextNode('Client'));
header.appendChild(document.createElement('th')).appendChild(document.createTextNode('Remis'));
header.appendChild(document.createElement('th'));
this.header.appendChild(header);
for (var i in this.elems) {
var item = this.elems[i];
var pictureContainer = document.createElement('div');
pictureContainer.setAttribute('class', 'picture_container');
pictureContainer.setAttribute('style', 'background-color: ' + item['color']);
var nameContainer = document.createElement('div');
nameContainer.appendChild(document.createTextNode(item['display_name']));
var actionContainer = document.createElement('div');
actionContainer.setAttribute('class', 'action_container');
item.element = document.createElement('tr');
item.element.appendChild(document.createElement('td')).appendChild(document.createElement('img'))
.setAttribute('src', '/medias/'+item['image']);
item.element.appendChild(document.createElement('td')).appendChild(document.createTextNode(item['item']));
item.element.appendChild(document.createElement('td')).appendChild(document.createTextNode(item['display_name']));
item.element.appendChild(document.createElement('td')).appendChild(document.createTextNode(item['quantity_delivered']+' / '+item['quantity']));
item.element.appendChild(document.createElement('td')).appendChild(document.createTextNode('remettre'));
console.log(item);
this.body.appendChild(item.element);
}
this.matchingElems = this.elems;
this.matchingElems.sort(function (a, b) {
var nameA = a['display_name'].toLowerCase();
var nameB = b['display_name'].toLowerCase();
if (nameA > nameB) return 1;
else if (nameA < nameB) return -1;
else return 0;
});
this.render();
},
},
match: {
value: function (item) {
var match = false;
var regex = this.cachedSearchRegex;
match |= regex.test(item['display_name']);
return match;
},
},
});
window.OrderedItemList = OrderedItemList;
window.OrderedItemList.ItemAction = Action;
})();
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment