change table of order to list of cards

This commit is contained in:
Richard Schreiber
2024-11-18 12:10:59 +01:00
parent 4765dd5c9a
commit 3f499447da
2 changed files with 61 additions and 55 deletions

View File

@@ -51,63 +51,67 @@
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="orders"> <div role="tabpanel" class="tab-pane active" id="orders">
<table class="panel-body table table-hover"> {% if orders %}
<thead> <ol class="event-list list-unstyled">
<tr>
<th>{% trans "Order code" %}</th>
<th>{% trans "Event" %}</th>
<th>{% trans "Order date" %}</th>
<th class="text-right">{% trans "Order total" %}</th>
<th class="text-right">{% trans "Positions" %}</th>
<th class="text-right">{% trans "Status" %}</th>
<th></th>
</tr>
</thead>
<tbody>
{% for o in orders %} {% for o in orders %}
<tr> <li class="row">
<td> <dl>
<strong> <div class="col-md-3 col-sm-3 col-xs-8">
<a href="{% abseventurl o.event "presale:event.order" order=o.code secret=o.secret %}" target="_blank"> <dt class="sr-only">{% trans "Order" %}</dt>
{{ o.code }} <dd><strong>
</a> <a href="{% abseventurl o.event "presale:event.order" order=o.code secret=o.secret %}" target="_blank">
</strong> <i class="fa fa-shopping-cart" aria-hidden="true"></i>
{% if o.testmode %} {{ o.code }}</a>
<span class="label label-warning">{% trans "TEST MODE" %}</span> </strong>
{% endif %} {% if o.customer_id != customer.pk %}
</td> <span class="fa fa-compress text-muted"
<td> data-toggle="tooltip"
{{ o.event }} title="{% trans "Matched to the account based on the email address." %}"
{% if not o.event.has_subevents and o.event.settings.show_dates_on_frontpage %} ></span>
<br><small class="text-muted">{{ o.event.get_date_range_display }}</small> {% endif %}
{% endif %} <small>{% include "pretixpresale/event/fragment_order_status.html" with order=o event=o.event %}</small>
</td> {% if o.testmode and False %}
<td> <span class="label label-warning">{% trans "TEST MODE" %}</span>
{{ o.datetime|date:"SHORT_DATETIME_FORMAT" }} {% endif %}
{% if o.customer_id != customer.pk %} </dd>
<span class="fa fa-link text-muted" <dd><time datetime="{{ o.datetime|date:"Y-m-d H:i" }}" class="text-muted small">{{ o.datetime|date:"SHORT_DATETIME_FORMAT" }}</time></dd>
data-toggle="tooltip" <dd class="small"></dd>
title="{% trans "Matched to the account based on the email address." %}" </div>
></span> <div class="col-md-2 col-sm-2 col-xs-4 text-right">
{% endif %} <dt class="sr-only">{% trans "Order total" %}</dt>
</td> <dd>{{ o.total|money:o.event.currency }}</dd>
<td class="text-right flip"> <dt class="sr-only">{% trans "Positions" %}</dt>
{{ o.total|money:o.event.currency }} <dd class="text-muted"><small>{% blocktranslate count counter=o.count_positions|default_if_none:0 %}{{ counter }} item{% plural %}{{ counter }} items{% endblocktranslate %}</small>
</td> </dd>
<td class="text-right flip">{{ o.count_positions|default_if_none:"0" }}</td> </div>
<td class="text-right flip">{% include "pretixpresale/event/fragment_order_status.html" with order=o event=o.event %}</td> <div class="col-md-5 col-sm-5 col-xs-8">
<td class="text-right flip"> <dt class="sr-only">{% trans "Event" %}</dt>
<a href="{% abseventurl o.event "presale:event.order" order=o.code secret=o.secret %}" <dd>
target="_blank" <br class="hidden-sm"/>
class="btn btn-default"> {{ o.event }}
{% if not o.event.has_subevents and o.event.settings.show_dates_on_frontpage %}
<br><small class="text-muted">{{ o.event.get_date_range_display }}</small>
{% endif %}
</dd>
</div>
<div class="col-md-2 col-sm-2 col-xs-4">
<dt class="sr-only">{% trans "Actions" %}</dt>
<dd class="text-right">
<br class="hidden-sm"/>
<a href="{% abseventurl o.event "presale:event.order" order=o.code secret=o.secret %}"
target="_blank">
<span class="fa fa-list-ul" aria-hidden="true"></span>
{% trans "Details" %} {% trans "Details" %}
</a> </a></dd>
</td> </div>
</tr> </dl>
</li>
{% endfor %} {% endfor %}
</tbody> </ol>
</table>
{% include "pretixcontrol/pagination.html" %} {% include "pretixcontrol/pagination.html" %}
{% else %}
<p class="text-center">{% trans "You dont have any orders in your account yet." %}</p>
{% endif %}
</div> </div>
<div role="tabpanel" class="tab-pane" id="memberships"> <div role="tabpanel" class="tab-pane" id="memberships">
<table class="panel-body table table-hover"> <table class="panel-body table table-hover">

View File

@@ -254,11 +254,13 @@ svg.svg-icon {
@include table-row-variant('danger', var(--pretix-brand-danger-lighten-30), var(--pretix-brand-danger-lighten-25)); @include table-row-variant('danger', var(--pretix-brand-danger-lighten-30), var(--pretix-brand-danger-lighten-25));
.text-blob-success, .text-blob-info, .text-blob-warning, .text-blob-danger { .text-blob-success, .text-blob-info, .text-blob-warning, .text-blob-danger {
padding: .25em .8em; padding: .125em .5em;
border-radius: 1em; border-radius: 1em;
font-weight: bold;
white-space: nowrap;
&:has(.status-dot) { &:has(.status-dot) {
padding-left: .45em; padding-left: .3em;
} }
} }
.text-blob-success { .text-blob-success {