almet/la-chariotte
1
0
Fork 0
mirror of https://framagit.org/la-chariotte/la-chariotte.git synced 2025-05-04 21:02:01 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

design: Add new CHARIOTTE_THEME=light

Browse source
This commit is contained in:
selfhoster1312 2025-03-08 18:07:15 +01:00
parent d75002ae28
commit 337b0ee758
43 changed files with 837 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
docs/install.md
View file

@ -94,6 +94,8 @@ DATABASES = {
Everything should now be ready to start the server: Everything should now be ready to start the server:
```shell ```shell
python manage.py compilescss
python manage.py collectstatic
python manage.py migrate --settings=local_settings python manage.py migrate --settings=local_settings
python manage.py runserver --settings=local_settings python manage.py runserver --settings=local_settings
``` ```
@ -112,3 +114,14 @@ pip install sendria
sendria --db mails.sqlite sendria --db mails.sqlite
$NAVIGATOR http://127.0.0.1:1080 $NAVIGATOR http://127.0.0.1:1080
``` ```
## Using a custom theme
Themes are provided in the `la_chariotte/themes` folder. The `default` theme is enabled by default, but the `CHARIOTTE_THEME` setting and environment variable allows you to change that. Another `light` theme is provided in the repository for you to try, but you can make your own.
After changing the setting or environment variable:
- delete the `static` folder at the repository root
- run `python manage.py compilescss`
- run `python manage.py collectstatic`
- restart the server

0
la_chariotte/themes/light/__init__.py Normal file
View file

31
la_chariotte/themes/light/settings.py Normal file
View file

@ -0,0 +1,31 @@
# The theme may want to specify which URL a successful form should redirect to
def success_url(view):
from django.urls import reverse
from la_chariotte.order import views
if type(view) == views.grouped_order.GroupedOrderOverview:
return reverse(
"order:grouped_order_overview", kwargs={"code": view.object.code}
)
elif type(view) == views.grouped_order.GroupedOrderCreateView:
return reverse(
"order:grouped_order_overview", kwargs={"code": view.object.code}
)
elif type(view) == views.grouped_order.GroupedOrderUpdateView:
return reverse(
"order:grouped_order_overview", kwargs={"code": view.object.code}
)
elif type(view) == views.item.ItemCreateView:
return reverse(
"order:grouped_order_overview",
kwargs={"code": view.object.grouped_order.code},
)
elif type(view) == views.item.ItemDeleteView:
return reverse(
"order:grouped_order_overview",
kwargs={"code": view.object.grouped_order.code},
)
# No more form success URLs to overwrite
return None

1
la_chariotte/themes/light/static/fork-awesome Symbolic link
View file

@ -0,0 +1 @@
../../default/static/fork-awesome

1
la_chariotte/themes/light/static/img/contributeureuses.png Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/img/contributeureuses.png

1
la_chariotte/themes/light/static/img/icons Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/img/icons

BIN
la_chariotte/themes/light/static/img/logos/logo_chariotte_horizontal.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 52 KiB

49
la_chariotte/themes/light/static/img/logos/logo_chariotte_horizontal.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 19 KiB

1
la_chariotte/themes/light/static/img/logos/logo_hashbang.png Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/img/logos/logo_hashbang.png

1
la_chariotte/themes/light/static/img/logos/logo_la_chariotte.png Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/img/logos/logo_la_chariotte.png

1
la_chariotte/themes/light/static/img/notice Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/img/notice

1
la_chariotte/themes/light/static/img/notice_1.jpg Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/img/notice_1.jpg

1
la_chariotte/themes/light/static/img/notice_2.jpg Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/img/notice_2.jpg

1
la_chariotte/themes/light/static/img/notice_3.jpg Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/img/notice_3.jpg

1
la_chariotte/themes/light/static/sass/base/_accordion.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_accordion.sass

14
la_chariotte/themes/light/static/sass/base/_content.sass Normal file
View file

@ -0,0 +1,14 @@
@media screen and (min-width: $min-desktop)
.content
margin: $base
@media screen and (max-width: $max-tablet)
.content
margin: $small
.formatted-text
white-space: pre-wrap
img.notice-img
border: $info 3px solid
margin-bottom: 1em

1
la_chariotte/themes/light/static/sass/base/_footer.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_footer.sass

1
la_chariotte/themes/light/static/sass/base/_form.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_form.sass

1
la_chariotte/themes/light/static/sass/base/_global.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_global.sass

40
la_chariotte/themes/light/static/sass/base/_navbar.sass Normal file
View file

@ -0,0 +1,40 @@
// Desktop
@media screen and (min-width: $min-desktop)
.navbar.side-nav
right: inherit
height: 100vh
width: $side-nav-width
padding: 20px 10px
.side-nav
&.navbar, .navbar-brand, .navbar-menu, .navbar-start
flex-direction: column
overflow-y: auto
.navbar-brand .navbar-item
padding: 0 3px 15px 3px
img
max-height: 150px
.navbar.top-nav
border-bottom: $beige 1px solid
.desktop-hidden
display: none
// Mobile
@media screen and (max-width: $max-tablet)
.navbar.side-nav
.navbar-brand .navbar-item
padding-top: 3px
padding-bottom: 3px
img
max-height: 46px
.navbar-menu.is-active
padding: 10px 10px
// Global
a.navbar-item:hover
color: $bright-black
background-color: $beige
border-radius: $border-radius

1
la_chariotte/themes/light/static/sass/base/_table.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_table.sass

1
la_chariotte/themes/light/static/sass/base/_tabs.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_tabs.sass

1
la_chariotte/themes/light/static/sass/base/_titles.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_titles.sass

1
la_chariotte/themes/light/static/sass/base/_variables.sass Symbolic link
View file

@ -0,0 +1 @@
../../../../default/static/sass/base/./_variables.sass

1
la_chariotte/themes/light/static/sass/style.sass Symbolic link
View file

@ -0,0 +1 @@
../../../default/static/sass/style.sass

176
la_chariotte/themes/light/templates/base.html Normal file
View file

@ -0,0 +1,176 @@
{% load static %}
{% load settings %}
{% load sass_tags %}
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:type" content="website">
<meta property="og:locale" content="fr_FR" />
<meta property="og:site_name" content="La chariotte">
<meta property="og:url" content="{{ BASE_URL }}{{ request.path }}">
<title>
{% block title %}{% endblock %}
- La Chariotte</title>
{% block css %}
<link href="{% sass_src 'sass/style.sass' %}"
rel="stylesheet"
type="text/css" />
<link rel="stylesheet"
href="{% static 'fork-awesome/css/fork-awesome.min.css' %}">
{% block extra_css %}
{% endblock extra_css %}
{% endblock css %}
<link rel="shortcut icon" href="{% static 'img/icons/chariotte.ico' %}">
</head>
<body>
<main>
<!-- Top navbar -->
<nav class="top-nav navbar">
<!-- Navbar brand : always visible (all screen sizes)-->
<div class="navbar-brand">
<a href="{% url 'dashboard' %}" class="navbar-item">
<img src="{% static 'img/logos/logo_chariotte_horizontal.png' %}">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="top-nav-menu">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div class="navbar-menu" id="top-nav-menu">
{% if user.is_authenticated %}
<div class="navbar-start">
<a href="{% url 'order:index' %}" class="navbar-item is-size-6 has-text-weight-semibold"><i class="fa fa-shopping-basket mr-3" aria-hidden="true"></i> Commandes</a>
</div>
{% endif %}
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
{% if user.is_authenticated %}
<a class="button is-light" href="{% url 'accounts:logout' %}">
<i class="fa fa-sign-out mr-3" aria-hidden="true"></i>Se déconnecter
</a>
{% else %}
<a class="button is-light" href="{% url 'accounts:signup' %}">
<i class="fa fa-user-plus mr-3" aria-hidden="true"></i><strong>Créer un compte</strong>
</a>
<a class="button is-primary" href="{% url 'accounts:login' %}">
<i class="fa fa-sign-in mr-3" aria-hidden="true"></i>Se connecter
</a>
{% endif %}
</div>
</div>
</div>
</div>
</nav>
<!-- End Top navbar -->
<div class="content">
<div class="columns is-centered">
<div class="column {% block content_column_class %}is-6{% endblock %}">
{% block content %}{% endblock %}
</div>
</div>
</div>
</main>
<footer class="footer section">
<div class="container">
<div class="columns is-multiline is-justify-content-center">
<div class="column is-4-desktop is-4-tablet">
<div class="widget mb-0">
<div class="logo mb-4">
<p>
{% settings_value "PROJECT_NAME" %}
| <a href='{% settings_value "GITLAB_LINK" %}'>version {{ version }}</a>
</p>
</div>
<ul class="list-unstyled footer-menu lh-35">
<li>
<a href="{% url 'about_chariotte' %}">
<i class="fa fa-info-circle mr-3" aria-hidden="true"></i>La Chariotte, c'est quoi&nbsp;?
</a>
</li>
<li>
<a href="{% url 'notice' %}">
<i class="fa fa-cog mr-3" aria-hidden="true"></i>Comment ça marche&nbsp;?
</a>
</li>
<li>
<a href="{% url 'faq' %}">
<i class="fa fa-question mr-3" aria-hidden="true"></i>Foire Aux Questions
</a>
</li>
<li>
<a href="{% url 'legal_notice' %}"><i class="fa fa-legal mr-2 text-muted"></i>Mentions légales</a>
</li>
</ul>
</div>
</div>
<div class="column is-2-desktop is-4-tablet">
<div class="widget mb-0">
<h4 class="mb-4">Suivez nous</h4>
<ul class="list-unstyled footer-socials">
<li>
<a href="https://blog.chariotte.fr"><i class="fa fa-rss-square mr-2 text-muted"></i>Blog</a>
</li>
<li>
<a href="https://mastodon.scop.coop/@la_chariotte"><i class="fa fa-mastodon-square mr-2 text-muted"></i>Mastodon</a>
</li>
<li>
<a href="https://www.facebook.com/profile.php?id=100091984176981"><i class="fa fa-facebook-square mr-2 text-muted"></i>Facebook</a>
</li>
<li>
<a href="https://www.linkedin.com/company/la-chariotte-commandes-groupees/"><i class="fa fa-linkedin-square mr-2 text-muted"></i>LinkedIn</a>
</li>
</ul>
</div>
</div>
<div class="column is-3-desktop is-4-tablet">
<div class="widget mb-0">
<h4 class="mb-4">Rejoignez-nous</h4>
<ul class="list-unstyled">
<li>
<a href="{% settings_value "FEEDBACK_LINK" %}"><i class="fa fa-comments mr-2 text-muted"></i>Que pensez-vous de la Chariotte ?</a>
</li>
<li><a href="{% settings_value "HELLOASSO_LINK" %}"><i class="fa fa-heart mr-2 text-muted"></i>Faire un (petit) don</a></li>
<li>
<a href="{% settings_value "GITLAB_LINK" %}"><i class="fa fa-git mr-2 text-muted"></i>Participer au développement</a>
</li>
<li>
<a href="mailto:{% settings_value "CONTACT_MAIL" %}"><i class="fa fa-envelope-square mr-2 text-muted"></i>
{% settings_value "CONTACT_MAIL" %}
</a>
</li>
</ul>
</div>
</div>
</footer>
</body>
</html>
<script>
// For responsive menu
document.addEventListener('DOMContentLoaded', () => {
// Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Add a click event on each of them
$navbarBurgers.forEach(el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
});
{% block extra_js %} {% endblock %}
</script>

60
la_chariotte/themes/light/templates/dashboard.html Normal file
View file

@ -0,0 +1,60 @@
{% extends 'base.html' %}
{% block title %}Tableau de bord{% endblock %}
{% block content_column_class%}is-10{% endblock %}
{% block content %}
{% load static %}
<p class="desktop-hidden mobile-content-title">
{% block content_title %}{% endblock %}
</p>
{% if user.is_authenticated %}
<div class="buttons is-centered mt-3">
<a class="button is-primary" href="{% url 'order:index' %}">
<i class="fa fa-shopping-basket mr-3" aria-hidden="true"></i>Mes commandes groupées
</a>
</div>
{% else %}
<div class="columns is-centered">
<div class="column is-10">
<div class="box has-text-centered">
<p class="title">La Chariotte, gestion de commandes groupées</p>
<div class="buttons is-centered">
<a class="button is-info" href="{% url 'notice' %}">
<i class="fa fa-book mr-3" aria-hidden="true"></i>Manuel d'utilisation
</a>
<a class="button is-info" href="{% url 'about_chariotte' %}">
<i class="fa fa-info-circle mr-3" aria-hidden="true"></i>En savoir plus
</a>
<a class="button is-info" href="{% url 'faq' %}">
<i class="fa fa-question mr-3" aria-hidden="true"></i>Foire Aux Questions
</a>
</div>
</div>
</div>
</div>
{% endif %}
<div class="columns is-centered">
<div class="column is-half has-text-centered">
<div class="box full-height">
<p class="subtitle">Rejoindre une commande groupée</p>
<form method="post">
{% csrf_token %}
{% for error in form.code.errors %}
<p class="help is-danger">{{ error }}</p>
{% endfor %}
<div class="field has-addons is-justify-content-center">
<div class="control">
<input name="code" class="input {% if form.code.errors %}is-danger{% endif %}" placeholder="Code à 6 caractères" type="text">
</div>
<div class="control">
<input class="button is-primary" type="submit" value="Rejoindre">
</div>
</div>
</form>
</div>
</div>
</div>
{% endblock %}

1
la_chariotte/themes/light/templates/help/about_chariotte.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/help/about_chariotte.html

1
la_chariotte/themes/light/templates/help/faq.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/help/faq.html

1
la_chariotte/themes/light/templates/help/legal_notice.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/help/legal_notice.html

1
la_chariotte/themes/light/templates/help/notice.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/help/notice.html

1
la_chariotte/themes/light/templates/mail Symbolic link
View file

@ -0,0 +1 @@
../../default/templates/mail

1
la_chariotte/themes/light/templates/order/grouped_order_add_items.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/grouped_order_add_items.html

1
la_chariotte/themes/light/templates/order/grouped_order_confirm_delete.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/grouped_order_confirm_delete.html

1
la_chariotte/themes/light/templates/order/grouped_order_create.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/grouped_order_create.html

1
la_chariotte/themes/light/templates/order/grouped_order_detail.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/grouped_order_detail.html

421
la_chariotte/themes/light/templates/order/grouped_order_overview.html Normal file
View file

@ -0,0 +1,421 @@
{% extends 'base.html' %}
{% load crispy_forms_tags %}
{% block title %}{{ grouped_order }} - Gestion{% endblock %}
{% block content %}
<p class="desktop-hidden mobile-content-title">
{% block content_title %}{{ grouped_order }} : gestion de la commande{% endblock %}
</p>
<div class="buttons">
<a class="button is-light" href={% url 'order:grouped_order_detail' grouped_order.code %}>
<i class="fa fa-arrow-left mr-3" aria-hidden="true"></i>Retour à la page de commande
</a>
<a class="button is-primary" href="{% url 'order:index' %}">
<i class="fa fa-shopping-basket mr-3" aria-hidden="true"></i>Mes commandes
</a>
</div>
<div class="box is-info">
<div class="columns">
<div class="column is-8">
<p class="title">{{ grouped_order }}</p>
{% if grouped_order.description %}<p class="formatted-text">{{ grouped_order.description }}</p>{% endif %}
</div>
<div class="column">
{% if grouped_order.place %}
<p><i class="fa fa-map-pin mr-3" aria-label="Lieu" title="Lieu" aria-hidden="true"></i>{{ grouped_order.place }}</p>
{% endif %}
<p><i class="fa fa-calendar-check-o mr-3" aria-label="Date limite de commande" title="Date limite de commande" aria-hidden="true"></i>
Commandes avant le {{ grouped_order.deadline|date:'d M Y' }} à {{ grouped_order.deadline|date:'H:i' }}
</p>
<p><i class="fa fa-truck mr-3" aria-label="Date de livraison" title="Date de livraison" aria-hidden="true"></i>
Livraison le {{ grouped_order.delivery_date }}{% if grouped_order.delivery_slot %}, {{ grouped_order.delivery_slot }}{% endif %}
</p>
</div>
</div>
{% if not grouped_order.is_to_be_delivered %}
<p>
<strong>Cette commande groupée est terminée</strong>, la livraison a eu lieu le {{ grouped_order.deadline }}.
</p>
{% elif not grouped_order.is_open %}
<p>
<strong>La période de commande est terminée</strong> depuis le {{ grouped_order.deadline }}.
Vous pouvez préparer la livraison, qui aura lieu le {{ grouped_order.delivery_date }} !
</p>
{% else %}
<p class="subtitle mt-4 has-text-centered">Code de la commande : {{ grouped_order.code }}</p>
{% endif %}
<div class="buttons is-centered">
{% if grouped_order.is_to_be_delivered and grouped_order.is_open %}
<input type="hidden" id="shareLink" class="is-hidden" aria-hidden="true" value="{{ share_link }}">
<button class="button is-info" onclick="copyText('shareLink')">
<i class="fa fa-files-o mr-3" aria-hidden="true"></i>Copier le lien
</button>
{% endif %}
<a class="button is-light" href="{% url 'order:delete_grouped_order' grouped_order.code %}">
<i class="fa fa-trash mr-3" aria-hidden="true"></i>Supprimer la commande
</a>
</div>
</div>
<div class="tabs is-toggle is-centered is-fullwidth">
<ul>
<li>
<a id="products-opener" class="is-active tablinks" onclick="openTab('products')">
<span>Produits</span>
</a>
</li>
<li>
<a id="commandes-opener" class="tablinks" onclick="openTab('commandes')">
<span>Commandes</span>
</a>
</li>
<li>
<a id="partager-opener" class="tablinks" onclick="openTab('settings')">
<span>Paramètres</span>
</a>
</li>
</ul>
</div>
<div id="settings" class="box tabcontent">
<p class="title">Paramètres de la commande groupée</p>
<div class="box">
<form method="post" action="{% url 'order:update_grouped_order' grouped_order.code %}" onsubmit="deadlinePassedCheck(event)">{% csrf_token %}
{{ grouped_order_form | crispy }}
<div class="buttons">
<a class="button is-light" href="{% url 'order:grouped_order_overview' grouped_order.code %}">Annuler</a>
<input class="button is-primary" type="submit" value="Suivant">
</div>
</form>
</div>
</div>
<div id="products" class="box tabcontent">
<p class="title">Ajouter un produit</p>
<table class="table">
<thead>
<tr>
<th>Nom</th>
<th>Prix</th>
<th>Quantité (optionnel)</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<form method="post" action="{% url 'order:item_create' grouped_order.code %}">
{% csrf_token %}
<td><input name="name" maxlength="100" placeholder="Nom du produit" autofocus required></input></td>
<td><input type="number" min="0" step="0.01" name="price" size="4" placeholder="5,40" required></input> €</td>
<td><input type="number" min="0" name="max_limit" size="4" placeholder="42"></input></td>
<td><button type="submit" class="button is-primary">
<i class="fa fa-plus-square mr-3" aria-hidden="true"></i>Ajouter
</button></td>
</form>
</tr>
</tbody>
</table>
<p class="title">Produits commandés</p>
{% if grouped_order.item_set.all %}
<table class="table">
<thead>
<tr>
<th>Produit</th>
<th>Prix unitaire</th>
<th>Commandé</th>
<th>Disponible</th>
<th>Total</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{% for item in grouped_order.item_set.all %}
<tr>
<td>{{ item.name }}</td>
<td>{{ item.price }} €</td>
<td>{{ item.ordered_nb }}</td>
<td>{{ item.max_limit }}</td>
<td>{{ item.get_total_price }} €</td>
<td>
<button class="button is-light is-small js-modal-trigger" {% if item.ordered_nb != 0 %}disabled title="Cet item a déjà été commandé et ne peut donc pas être supprimé."{% endif %} data-target="confirm-delete-{{ item.id }}">
Supprimer
</button>
</td>
</tr>
<div id="confirm-delete-{{ item.id }}" class="modal">
<div class="modal-background"></div>
<div class="modal-content">
<div class="box">
<p>Voulez-vous vraiment supprimer le produit {{ item.name }} de la commande ?</p>
<form action="{% url 'order:item_delete' grouped_order.code item.id %}" method="post">
{% csrf_token %}
<input type="submit" name="{{ item.id }}" value="Oui" class="button is-danger"/>
<a class="button is-light" href="">Non</a>
</form>
</div>
</div>
<button class="modal-close is-large" aria-label="close"></button>
</div>
{% endfor %}
</tbody>
<tfoot>
<th>Total</th>
<th></th>
<th>{{ total_ordered_items }}</th>
<th>{{ grouped_order.total_price }} €</th>
<th>
</tfoot>
</table>
{% else %}
<p>Vous n'avez pas ajouté de produits à cette commande groupée. Ajoutez-en <a href="{% url 'order:manage_items' grouped_order.code %}">ici</a></p>
{% endif %}
</div>
<div id="commandes" class="box tabcontent">
<p class="title">Export des contacts</p>
<div class="buttons is-centered">
<a class="button is-info" href="{% url 'order:email_list' grouped_order.code %}?format=csv">
<i class="fa fa-file-excel-o mr-3" aria-hidden="true"></i>Emails en CSV
</a>
<input id="email_list" name="email_list" hidden="true" value="{{ emails_list|join:';' }}" />
<a class="button is-info" onclick="copyText('email_list')">
<i class="fa fa-files-o mr-3" aria-hidden="true"></i>Copier les emails
</a>
</div>
<p class="title">Export des commandes</p>
<div class="buttons is-centered">
<a class="button is-info" href="{% url 'order:grouped_order_sheet' grouped_order.code %}">
<i class="fa fa-file-pdf-o mr-3" aria-hidden="true"></i>Commandes en PDF
</a>
<a class="button is-info" href="{% url 'order:grouped_order_csv_export' grouped_order.code %}">
<i class="fa fa-file-excel-o mr-3" aria-hidden="true"></i>Commandes en CSV
</a>
</div>
<p class="title">Détail des commandes</p>
{% if grouped_order.order_set.all %}
<table class="table">
<thead>
<tr>
<th>Participant·e</th>
<th>Montant</th>
<th>Contact</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{% for order in grouped_order.order_set.all %}
<tr>
<td>{{ order.author }}</td>
<td>{{ order.price }} €</td>
<td><a href="mailto:{{ order.author.email }}">{{ order.author.email }}</a>{% if order.author.phone %} / {{ order.author.phone }}{% endif %}</td>
<td>
<button class="button is-info is-small js-modal-trigger" data-target="order-detail-{{ order.id }}">
Voir
</button>
{% if order.note %}
<i class="fa fa-comment ml-3 mr-2" title="{{ order.note }}" aria-hidden="true"></i>
{% else %}
<span class="ml-5 mr-4"></span>
{% endif %}
<button class="button is-light is-small js-modal-trigger" data-target="confirm-delete-{{ order.id }}">
Supprimer
</button>
</td>
</tr>
<!-- Order detail modal -->
<div id="order-detail-{{ order.id }}" class="modal">
<div class="modal-background"></div>
<div class="modal-card ">
<header class="modal-card-head has-background-info">
<div class="modal-card-title-container">
<p class="modal-card-title mb-2">Commande de {{ order.author }}</p>
<p class="has-text-grey-dark">Le {{ order.created_date|date:'d M Y' }} à {{ order.created_date|date:'H:i' }}</p>
</div>
<button class="delete" aria-label="close"></button>
</header>
<section class="modal-card-body">
<div class="columns">
<div class="column">
{% for item in order.ordered_items.all %}
{{ item.nb }} × {{ item.item.name }}
<hr class="mb-0 mt-1">
{% endfor %}
</div>
{% if order.note %}
<div class="column is-4">
<p class="mini-title">Note à l'organisateur·ice</p>
<p>{{ order.note }}</p>
</div>
</div>
{% endif %}
</section>
<footer class="modal-card-foot">
<p class="mini-title">Total à payer</p>
<p>{{ order.price }} €</p>
</footer>
</div>
</div>
<!-- Confirm delete order modal -->
<div id="confirm-delete-{{ order.id }}" class="modal">
<div class="modal-background"></div>
<div class="modal-card ">
<header class="modal-card-head">
<div class="modal-card-title-container">
<p class="modal-card-title">Supprimer la commande de {{ order.author }} ?</p>
</div>
</header>
<section class="modal-card-body">
<div class="columns">
<div class="column">
{% for item in order.ordered_items.all %}
{{ item.nb }} × {{ item.item.name }}
<hr class="mb-0 mt-1">
{% endfor %}
</div>
{% if order.note %}
<div class="column is-4">
<p class="mini-title">Note à l'organisateur·ice</p>
<p>{{ order.note }}</p>
</div>
</div>
{% endif %}
</section>
<footer class="modal-card-foot">
<div class="columns">
<div class="column is-8">
<p class="mini-title">Total à payer</p>
<p>{{ order.price }} €</p>
</div>
<div class="column">
<form action="{% url 'order:order_delete' grouped_order.code order.id %}" method="post">
{% csrf_token %}
<input type="submit" name="{{ item.id }}" value="Oui" class="button is-danger"/>
<a class="button is-light" aria-label="close">Non</a>
</form>
</div>
</footer>
</div>
</div>
{% endfor %}
</tbody>
<tfoot>
<th>Total</th>
<th>{{ grouped_order.total_price }} €</th>
<th></th>
<th></th>
</tfoot>
</table>
{% else %}
<p>Personne n'a encore commandé. Partagez l'info à votre entourage !</p>
{% endif %}
</div>
{% endblock %}
<script>
{% block extra_js %}
{% include 'warning_grouped_order_creation.html' %}
var previousCopied = null;
var previousHtmlCopied = null;
// Copy grouped order text
function copyText(elementId) {
var element = document.getElementById(elementId);
var text = element.value;
navigator.clipboard.writeText(text).then(function() {
console.debug('Copying to clipboard was successful!');
console.debug('Copied text: ', text);
var button = document.querySelector('[onclick="copyText(\'' + elementId + '\')"]');
if (button !== null) {
if (previousCopied !== null) {
previousCopied.innerHTML = previousHtmlCopied;
}
var originalWidth = button.offsetWidth;
previousHtmlCopied = button.innerHTML;
button.innerHTML = '✓ ';
previousCopied = button;
if (button.offsetWidth !== originalWidth) {
button.style.width = originalWidth + 'px';
}
}
}, function(err) {
console.error('Could not copy text: ', err);
});
}
// Tabs
function openTab(idToOpen) {
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].parentNode.classList.remove("is-active");
}
// Show the current tab, and add an "is-active" class to the button that opened the tab
document.getElementById(idToOpen).style.display = "block";
document.getElementById(idToOpen+"-opener").parentNode.classList.add("is-active");
}
// Open by default the "products" tab at first
openTab("products");
// Modal
document.addEventListener('DOMContentLoaded', () => {
// Functions to open and close a modal
function openModal($el) {
$el.classList.add('is-active');
}
function closeModal($el) {
$el.classList.remove('is-active');
}
function closeAllModals() {
(document.querySelectorAll('.modal') || []).forEach(($modal) => {
closeModal($modal);
});
}
// Add a click event on buttons to open a specific modal
(document.querySelectorAll('.js-modal-trigger') || []).forEach(($trigger) => {
const modal = $trigger.dataset.target;
const $target = document.getElementById(modal);
$trigger.addEventListener('click', () => {
openModal($target);
});
});
// Add a click event on various child elements to close the parent modal
(document.querySelectorAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button') || []).forEach(($close) => {
const $target = $close.closest('.modal');
$close.addEventListener('click', () => {
closeModal($target);
});
});
// Add a keyboard event to close all modals
document.addEventListener('keydown', (event) => {
const e = event || window.event;
if (e.keyCode === 27) { // Escape key
closeAllModals();
}
});
});
{% endblock %}
</script>

1
la_chariotte/themes/light/templates/order/grouped_order_sheet.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/grouped_order_sheet.html

1
la_chariotte/themes/light/templates/order/grouped_order_update.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/grouped_order_update.html

1
la_chariotte/themes/light/templates/order/index.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/index.html

1
la_chariotte/themes/light/templates/order/order_detail.html Symbolic link
View file

@ -0,0 +1 @@
../../../default/templates/order/order_detail.html

1
la_chariotte/themes/light/templates/registration Symbolic link
View file

@ -0,0 +1 @@
../../default/templates/registration

1
la_chariotte/themes/light/templates/warning_grouped_order_creation.html Symbolic link
View file

@ -0,0 +1 @@
../../default/templates/warning_grouped_order_creation.html