Commit b6851d78 authored by Sébastiaan Versteeg's avatar Sébastiaan Versteeg Committed by Sébastiaan Versteeg
Browse files

Migrate pizzas to new template

parent a3abc08f
......@@ -209,7 +209,7 @@
Pizza
</th>
<td>
<a href="{% url "pizzas:index" %}" class="btn btn-style1">
<a href="{% url "pizzas:index" %}" class="btn btn-primary">
{% trans "Order" context "pizzas" %}
</a>
</td>
......
.pizza-order-form, .activity-form, .paid-form, .collected-form, .delete-form {
margin-bottom: 0px;
}
#button-container {
clear: both;
overflow: auto;
margin-bottom: 15px;
}
#button-container a:first-child {
margin-right: 0;
}
#button-container a {
float: right;
}
.paid {
background-color: #8FCC74;
}
.unpaid {
background-color: #E05C50;
}
.product-name {
font-weight: bolder;
font-size: 40px;
}
.form-group {
margin-bottom: 15px;
}
@media (max-width: 767px) {
#main .main-content {
padding-right: 16px !important;
padding-left: 16px !important;
max-width: none;
}
.main-content .btn, .main-content .btn:hover {
clear: right;
margin-bottom: 4px;
}
}
\ No newline at end of file
.pizza-header {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
h1 {
font-size: 2rem;
text-align: center;
color: $white;
}
h2 {
text-align: center;
color: $white;
}
&.paid {
background-color: $success;
}
&.unpaid {
background-color: $danger;
}
}
......@@ -9,7 +9,7 @@ $(function() {
return parseInt($(td).html().replace('', ''));
});
$('input.paid-button').click(function() {
$('a.paid-button').click(function() {
var id = $(this).data('id');
var paid = $(this).data('paid');
var button = $(this);
......@@ -22,19 +22,19 @@ $(function() {
'Accept': 'application/json',
'Content-Type': 'application/json'
}
}).success(function(data, status) {
}).done(function(data) {
button.data('paid', data.paid);
if (data.paid) {
button.addClass('btn-style3');
button.removeClass('btn-style4');
button.val(gettext('Yes'));
button.addClass('btn-success');
button.removeClass('btn-danger');
button.html(gettext('Yes'));
} else {
button.addClass('btn-style4');
button.removeClass('btn-style3');
button.val(gettext('No'));
button.addClass('btn-danger');
button.removeClass('btn-success');
button.html(gettext('No'));
}
button.blur();
}).fail(function(xhr, status) {
}).fail(function(xhr) {
var data = $.parseJSON(xhr.responseText);
if (data.message !== undefined) {
alert(data.message);
......
{% extends "pizzas/base.html" %}
{% load i18n staticfiles %}
{% extends "base.html" %}
{% load i18n static %}
{% block title %}{% trans "Add order" %} — {{ event.title }} — {% trans "Pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block opengraph_title %}{% trans "Add order" %} — {{ event.title }} — {% trans "Pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block title %}{% trans "Add order" %} — {{ event.title }} — {% trans "pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block opengraph_title %}{% trans "Add order" %} — {{ event.title }} — {% trans "pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block body %}
<h1>{% blocktrans with title=event.title %}Add order for {{ title }}{% endblocktrans %}</h1>
......
{% extends 'old-base.html' %}
{% load staticfiles compress %}
{% block css_head %}
{{ block.super }}
{% compress css %}
<link href="{% static "pizzas/css/style.css" %}" rel="stylesheet" type="text/css">
{% endcompress %}
{% endblock %}
{% extends "pizzas/base.html" %}
{% load i18n staticfiles %}
{% extends "base.html" %}
{% load i18n static %}
{% block title %}{% if event %}{{ event.title }} — {% endif %}{% trans "Pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block opengraph_title %}{% if event %}{{ event.title }} — {% endif %}{% trans "Pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block title %}{% if event %}{{ event.title }}
— {% endif %}{% trans "pizzas"|capfirst %} —
{{ block.super }}{% endblock %}
{% block opengraph_title %}{% if event %}{{ event.title }}
— {% endif %}{% trans "pizzas"|capfirst %} —
{{ block.super }}{% endblock %}
{% block opengraph %}
{% if event %}
<meta property="og:description" content="{% blocktrans with title=event.title %}Order food for {{ title }}{% endblocktrans %}" />
<meta property="og:description"
content="{% blocktrans with title=event.title %}Order food for {{ title }}{% endblocktrans %}"/>
{% else %}
<meta property="og:description" content="{% trans "There is no current event for which you can order food" %}" />
<meta property="og:description"
content="{% trans "There is no current event for which you can order food" %}"/>
{% endif %}
{% endblock %}
{% block header_image_container %}
{% if event.just_ended %}
<div class="header-image container {{ order.paid|yesno:'paid,unpaid' }}">
{% if event.just_ended and order %}
<div class="image pizza-header {{ order.paid|yesno:'paid,unpaid' }}">
<h1>
{{ order.product.name }}
</h1>
<h2>
{{ request.member.get_full_name }}
</h2>
</div>
{% else %}
{{ block.super }}
......@@ -21,121 +33,181 @@
{% endblock %}
{% block body %}
{% if event %}
{% if event.just_ended and order %}
<div class="text-center">
<span class="product-name">
{{ order.product.name }}
</span>
<br>
<br>
<span style="font-size: 24px;">
{{ member.get_full_name }}
</span>
</div>
{% endif %}
<h1>
{% blocktrans with title=event.title %}Order food for {{ title }}{% endblocktrans %}
</h1>
{% else %}
<h1>
{% trans "There is no current event for which you can order food" %}
</h1>
{% endif %}
<div id="button-container">
{% if perms.pizzas.change_product %}
<a href="{% url 'admin:pizzas_product_changelist' %}" class="btn btn-style1 pull-right">{% trans "All products" %}</a>
{% endif %}
{% if perms.pizzas.change_pizzaevent %}
<a href="{% url 'admin:pizzas_pizzaevent_changelist' %}" class="btn btn-style1 pull-right">{% trans "All events" %}</a>
{% endif %}
{% if perms.pizzas.change_order and event %}
<a href="{% url 'pizzas:orders' event.pk %}" class="btn btn-style1 pull-right">{% trans "All orders" %}</a>
{% endif %}
<br><br>
</div>
{% if event %}
{% if event.in_the_future %}
<h2>
{% blocktrans with start=event.start|date:"Y-m-d H:i:s" %}It will be possible to order from {{ start }}.{% endblocktrans %}
</h2>
{% if event %}
<section class="page-section" id="pizzas-index">
<div class="container">
<h1 class="text-center section-title">
{% blocktrans trimmed with title=event.title %}
Order food for {{ title }}
{% endblocktrans %}
</h1>
<div class="mb-3 row">
{% if perms.pizzas.change_product %}
<div class="col-12 col-md-4 my-1">
<a href="{% url 'admin:pizzas_product_changelist' %}"
class="btn btn-primary d-block">
{% trans "All products" %}
</a>
</div>
{% endif %}
{% if perms.pizzas.change_pizzaevent %}
<div class="col-12 col-md-4 my-1">
<a href="{% url 'admin:pizzas_pizzaevent_changelist' %}"
class="btn btn-primary d-block">
{% trans "All events" %}
</a>
</div>
{% endif %}
{% if perms.pizzas.change_order and event %}
<div class="col-12 col-md-4 my-1">
<a href="{% url 'pizzas:orders' event.pk %}"
class="btn btn-primary d-block">
{% trans "All orders" %}
</a>
</div>
{% endif %}
</div>
{% if event.in_the_future %}
<h3 class="text-center">
{% blocktrans trimmed with start=event.start|date:"Y-m-d H:i:s" %}
It will be possible to order from {{ start }}.
{% endblocktrans %}
</h3>
{% else %}
{% if event.just_ended %}
<h3 class="text-center">
{% blocktrans trimmed with end=event.end|date:"Y-m-d H:i:s" %}
It was possible to order until {{ end }}.
{% endblocktrans %}
</h3>
{% else %}
<h3 class="text-center">
{% blocktrans trimmed with end=event.end|date:"Y-m-d H:i:s" %}
It is possible to order until {{ end }}.
{% endblocktrans %}
</h3>
{% endif %}
{% if order %}
{% if order.paid %}
<div class="alert alert-success mt-3">
{% trans "The order has been paid for." %}
</div>
{% else %}
<div class="alert alert-danger mt-3">
{% trans "The order has not yet been paid for." %}
</div>
{% endif %}
<h4 class="text-center">{% trans "Current order" %}</h4>
<div class="table-responsive mt-3">
<table class="table table-bordered">
<thead>
<tr>
<th>{% trans "Name" %}</th>
<th class="d-none d-md-table d-none d-md-table-cell">{% trans "Description" %}</th>
<th>{% trans "Price" %}</th>
<th>{% trans "Cancel" %}</th>
</tr>
</thead>
<tbody>
<tr>
<td class="align-middle">{{ order.product.name }}</td>
<td class="align-middle d-none d-md-table-cell">{{ order.product.description }}</td>
<td class="align-middle">
&euro;&nbsp;{{ order.product.price }}
</td>
<td class="align-middle">
{% if not order.can_be_changed %}
{% trans "You can no longer cancel." %}
{% else %}
<form
class="d-inline-block"
method="post"
action="{% url 'pizzas:cancel-order' %}">
{% csrf_token %}
<input type="hidden"
name="order"
value="{{ order.pk }}"/>
<input type="submit"
value="{% trans "Cancel" %}"
class="btn btn-primary"
onclick="return confirm('{% trans "Are you sure you want to cancel your order?" %}')"/>
</form>
{% endif %}
</td>
</tr>
</tbody>
</table>
</div>
{% if not event.just_ended %}
<h4 class="text-center">{% trans "Changing your order" %}</h4>
{% endif %}
{% elif event.just_ended %}
<p class="text-center">
{% trans "You did not place an order." %}
</p>
{% endif %}
{% if not event.has_ended %}
{% if order == None or order.can_be_changed %}
<div class="table-responsive mt-3">
<table class="table table-bordered">
<thead>
<tr>
<th>{% trans "Name" %}</th>
<th class="d-none d-md-table-cell">{% trans "Description" %}</th>
<th>{% trans "Price" %}</th>
<th>{% if order %}
{% trans "Modify" %}{% else %}
{% trans "Order" context "pizzas" %}{% endif %}</th>
</tr>
</thead>
<tbody>
{% for product in products %}
<tr>
<td class="align-middle">
{{ product.name }}
</td>
<td class="align-middle d-none d-md-table-cell">
{{ product.description }}
</td>
<td class="align-middle">
&euro;&nbsp;{{ product.price }}
</td>
<td class="align-middle">
<form
class="d-inline-block"
method="post"
action="{% url 'pizzas:order' %}">
{% csrf_token %}
<input type="hidden"
name="product"
value="{{ product.pk }}"/>
<input type="submit"
class="btn btn-primary"
{% if order %}value="{% trans "Modify" %}"
onclick="return confirm('{% trans "Are you sure you want to modify your order?" %}')"
{% else %}value="{% trans "Order" context "pizzas" %}"{% endif %}/>
</form>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
{% endif %}
{% endif %}
</div>
</section>
{% else %}
{% if event.just_ended %}
<h2>
{% blocktrans with end=event.end|date:"Y-m-d H:i:s" %}It was possible to order until {{ end }}.{% endblocktrans %}
</h2>
{% else %}
<h2>
{% blocktrans with end=event.end|date:"Y-m-d H:i:s" %}It is possible to order until {{ end }}.{% endblocktrans %}
</h2>
{% endif %}
{% if order %}
{% if order.paid %}
<div class="alert alert-success">{% trans "The order has been paid for." %}</div>
{% else %}
<div class="alert alert-error">{% trans "The order has not yet been paid for." %}</div>
{% endif %}
<h4>{% trans "Current order" %}</h4>
<div style="overflow-x: auto;">
<table class="table table-striped table-bordered table-hover">
<tr>
<th>{% trans "Name" %}</th>
<th>{% trans "Description" %}</th>
<th>{% trans "Price" %}</th>
<th>{% trans "Cancel" %}</th>
</tr>
<tr>
<td>{{ order.product.name }}</td>
<td>{{ order.product.description }}</td>
<td>&euro;&nbsp;{{ order.product.price }}</td>
<td>
{% if not order.can_be_changed %}
{% trans "You can no longer cancel." %}
{% else %}
<form class="form-horizontal pizza-order-form" method="post" action="{% url 'pizzas:cancel-order' %}">
{% csrf_token %}
<input type='hidden' name='order' value='{{ order.pk }}' />
<input type='submit' value='{% trans "Cancel" %}' class='btn btn-style1' onclick="return confirm('{% trans "Are you sure you want to cancel your order?" %}')" />
</form>
{% endif %}
</td>
</tr>
</table>
<section class="page-section" id="pizzas-index">
<div class="container">
<h1 class="text-center section-title">{% trans 'pizzas'|capfirst %}</h1>
<p class="text-center">
{% trans "There is no current event for which you can order food" %}l
</p>
</div>
{% if not event.just_ended %}
<h4>{% trans "Changing your order" %}</h4>
{% endif %}
{% elif event.just_ended %}
{% trans "You did not place an order." %}
{% endif %}
{% if not event.has_ended %}
{% if order == None or order.can_be_changed %}
<div style="overflow-x: auto;">
<table class="category table table-striped table-bordered table-hover">
<tr>
<th>{% trans "Name" %}</th>
<th>{% trans "Description" %}</th>
<th>{% trans "Price" %}</th>
<th>{% if order %}{% trans "Modify" %}{% else %}{% trans "Order" context "pizzas" %}{% endif %}</th>
</tr>
{% for product in products %}
<tr>
<td>{{ product.name }}</td>
<td>{{ product.description }}</td>
<td>&euro;&nbsp;{{ product.price }}</td>
<td>
<form class="form-horizontal pizza-order-form" method="post" action="{% url 'pizzas:order' %}">
{% csrf_token %}
<input type="hidden" name="product" value="{{ product.pk }}" />
<input type="submit" class="btn btn-style1" {% if order %}value='{% trans "Modify" %}' onclick="return confirm('{% trans "Are you sure you want to modify your order?" %}')"{% else %}value='{% trans "Order" context "pizzas" %}'{% endif %} />
</form>
</td>
</tr>
{% endfor %}
</table>
</div>
{% endif %}
{% endif %}
</section>
{% endif %}
{% endif %}
{% endblock %}
{% extends "pizzas/base.html" %}
{% extends "base.html" %}
{% load i18n static compress %}
{% load i18n staticfiles %}
{% block title %}{{ event.title }} — {% trans "Pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block opengraph_title %}{{ event.title }} — {% trans "Pizzas"|capfirst %} — {{ block.super }}{% endblock %}
{% block title %}{{ event.title }} — {% trans "pizzas"|capfirst %}
{{ block.super }}{% endblock %}
{% block opengraph_title %}{{ event.title }} — {% trans "pizzas"|capfirst %} —
{{ block.super }}{% endblock %}
{% block body %}
<h1>
{% blocktrans with title=event.title %}Orders for {{ title }}{% endblocktrans %}
</h1>
<section class="page-section" id="events-detail">
<div class="container">
<h1 class="text-center section-title">
{% blocktrans trimmed with title=event.title %}
Orders for {{ title }}
{% endblocktrans %}
</h1>
<div class="mb-3 row">
{% if perms.pizzas.change_product %}
<div class="col-12 col-md-4 my-1">
<a href="{% url 'admin:pizzas_product_changelist' %}"
class="btn btn-primary d-block">
{% trans "All products" %}
</a>
</div>
{% endif %}
{% if perms.pizzas.change_pizzaevent %}
<div class="col-12 col-md-4 my-1">
<a href="{% url 'admin:pizzas_pizzaevent_changelist' %}"
class="btn btn-primary d-block">
{% trans "All events" %}
</a>
</div>
{% endif %}
<div class="col-12 col-md-4 my-1">
<a href="{% url 'pizzas:overview' event.pk %}"
class="btn btn-primary d-block">
{% trans "Overview" %}
</a>
</div>
</div>
<div id="button-container">
<a href="{% url 'pizzas:add-order' event.pk %}" class="btn btn-style1 pull-right">{% trans "Add a new order" %}</a>
<a href="{% url 'admin:pizzas_pizzaevent_changelist' %}" class="btn btn-style1 pull-right">{% trans "All events" %}</a>
<a href="{% url 'pizzas:overview' event.pk %}" class="btn btn-style1 pull-right">{% trans "Overview" %}</a>
<br><br>
</div>
<div style="overflow-x: auto;">
<table class="category table table-striped table-bordered table-hover">
<thead>
<tr>
<th scope="col">{% trans "Name" %}</th>
<th scope="col">{% trans "Product" %}</th>
<th class='paid-title' scope="col">{% trans "Paid" %}</th>
<th class="no-sort"><i class="fa fa-trash"></i></th>
</tr>
</thead>
<tbody>
{% for order in orders %}
<tr>
<td>
{{ order.member_name }}
</td>
<td>
{{ order.product }}
</td>
<td>
<input type="button" class="btn btn-style{{ order.paid|yesno:'3,4' }} paid-button" value="{% if order.paid %}{% trans 'Yes' %}{% else %}{% trans 'No' %}{% endif %}" data-paid="{{ order.paid|yesno:'true,false' }}" data-id="{{ order.pk }}">
</td>
<td>
<form class="form-horizontal delete-form" method="post" action="{% url 'pizzas:delete-order' %}">
{% csrf_token %}
<input type='hidden' name='order' value='{{ order.pk }}' />
<button type="submit" class="btn btn-style1 btn" onclick="return confirm('{% trans "Are you sure you want to delete this order?" %}');">
<i class="fa fa-trash"></i>
</button>
</form>
</td>
</tr>
{% empty %}
<tr class="model-events">
<th scope="row">{% trans "Nobody ordered yet" %}</th>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">{% trans "Name" %}</th>
<th scope="col">{% trans "Product" %}</th>
<th class="paid-title"
scope="col">{% trans "Paid" %}</th>
<th class="no-sort"><i class="fas fa-trash"></i></th>
</tr>
</thead>
<tbody>
{% for order in orders %}
<tr>
<td class="align-middle">
{{ order.member_name }}
</td>
<td class="align-middle">
{{ order.product }}
</td>
<td class="align-middle">
<a
class="btn btn-{{ order.paid|yesno:'success,danger' }} paid-button"
data-paid="{{ order.paid|yesno:'true,false' }}"
data-id="{{ order.pk }}">
{% if order.paid %}
{% trans 'Yes' %}
{% else %}
{% trans 'No' %}
{% endif %}
</a>