212 lines
7.3 KiB
HTML
212 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
line-height: 1.6;
|
|
color: #333;
|
|
max-width: 600px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
.header {
|
|
text-align: center;
|
|
margin-bottom: 30px;
|
|
}
|
|
.logo {
|
|
max-width: 200px;
|
|
margin-bottom: 20px;
|
|
}
|
|
.notification {
|
|
background: #f8f9fa;
|
|
padding: 20px;
|
|
border-radius: 5px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.notification-type {
|
|
display: inline-block;
|
|
padding: 5px 12px;
|
|
border-radius: 4px;
|
|
font-weight: bold;
|
|
color: white;
|
|
margin-bottom: 15px;
|
|
}
|
|
.type-new_order {
|
|
background-color: #0d6efd;
|
|
}
|
|
.type-payment_failed {
|
|
background-color: #dc3545;
|
|
}
|
|
.type-custom_design {
|
|
background-color: #6f42c1;
|
|
}
|
|
.type-fursuit_order {
|
|
background-color: #fd7e14;
|
|
}
|
|
.customer-info {
|
|
background: #e9ecef;
|
|
padding: 15px;
|
|
border-radius: 4px;
|
|
margin: 15px 0;
|
|
}
|
|
.product {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 15px;
|
|
padding-bottom: 15px;
|
|
border-bottom: 1px solid #dee2e6;
|
|
}
|
|
.product:last-child {
|
|
border-bottom: none;
|
|
margin-bottom: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.product-image {
|
|
width: 50px;
|
|
height: 50px;
|
|
object-fit: cover;
|
|
border-radius: 4px;
|
|
margin-right: 15px;
|
|
}
|
|
.badge {
|
|
display: inline-block;
|
|
padding: 3px 8px;
|
|
border-radius: 3px;
|
|
font-size: 12px;
|
|
color: white;
|
|
}
|
|
.badge-fursuit {
|
|
background-color: #0d6efd;
|
|
}
|
|
.badge-printed {
|
|
background-color: #198754;
|
|
}
|
|
.button {
|
|
display: inline-block;
|
|
padding: 10px 20px;
|
|
background-color: #0d6efd;
|
|
color: white;
|
|
text-decoration: none;
|
|
border-radius: 5px;
|
|
margin-top: 20px;
|
|
}
|
|
.total {
|
|
text-align: right;
|
|
margin-top: 20px;
|
|
padding-top: 20px;
|
|
border-top: 2px solid #dee2e6;
|
|
font-size: 1.2em;
|
|
font-weight: bold;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<img src="{{ logo_url }}" alt="Fursuit Shop" class="logo">
|
|
<h1>
|
|
{% if notification_type == 'new_order' %}
|
|
{% trans "New Order Received" %}
|
|
{% elif notification_type == 'payment_failed' %}
|
|
{% trans "Payment Failed" %}
|
|
{% elif notification_type == 'custom_design' %}
|
|
{% trans "New Custom Design Order" %}
|
|
{% elif notification_type == 'fursuit_order' %}
|
|
{% trans "New Fursuit Order" %}
|
|
{% else %}
|
|
{% trans "Order Notification" %}
|
|
{% endif %}
|
|
</h1>
|
|
</div>
|
|
|
|
<div class="notification">
|
|
<span class="notification-type type-{{ notification_type }}">
|
|
{% if notification_type == 'new_order' %}
|
|
{% trans "New Order" %}
|
|
{% elif notification_type == 'payment_failed' %}
|
|
{% trans "Payment Failed" %}
|
|
{% elif notification_type == 'custom_design' %}
|
|
{% trans "Custom Design" %}
|
|
{% elif notification_type == 'fursuit_order' %}
|
|
{% trans "Fursuit Order" %}
|
|
{% endif %}
|
|
</span>
|
|
|
|
<h2>{% trans "Order" %} #{{ order.id }}</h2>
|
|
|
|
<div class="customer-info">
|
|
<h3>{% trans "Customer Information" %}</h3>
|
|
<p>
|
|
<strong>{% trans "Name" %}:</strong>
|
|
{{ order.shipping_address.first_name }} {{ order.shipping_address.last_name }}
|
|
</p>
|
|
<p>
|
|
<strong>{% trans "Email" %}:</strong>
|
|
{{ order.shipping_address.email }}
|
|
</p>
|
|
<p>
|
|
<strong>{% trans "Address" %}:</strong><br>
|
|
{{ order.shipping_address.address }}<br>
|
|
{{ order.shipping_address.zip }} {{ order.shipping_address.city }}<br>
|
|
{{ order.shipping_address.get_country_display }}
|
|
</p>
|
|
</div>
|
|
|
|
<h3>{% trans "Ordered Items" %}</h3>
|
|
{% for product in order.products.all %}
|
|
<div class="product">
|
|
{% if product.image %}
|
|
<img src="{{ product.image.url }}" alt="{{ product.name }}" class="product-image">
|
|
{% endif %}
|
|
<div style="flex-grow: 1;">
|
|
<h4 style="margin: 0;">{{ product.name }}</h4>
|
|
{% if product.product_type == 'fursuit' %}
|
|
<span class="badge badge-fursuit">{% trans "Fursuit" %}</span>
|
|
{% else %}
|
|
<span class="badge badge-printed">{% trans "Printed Item" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
<div style="text-align: right;">
|
|
<strong>{{ product.base_price }} €</strong>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<div class="total">
|
|
{% trans "Total" %}: {{ order.total_price }} €
|
|
</div>
|
|
|
|
{% if notification_type == 'payment_failed' and payment_error %}
|
|
<div style="margin-top: 20px; padding: 15px; background-color: #f8d7da; border-radius: 4px; color: #721c24;">
|
|
<h3 style="margin-top: 0;">{% trans "Payment Error Details" %}</h3>
|
|
<p><strong>{% trans "Error Code" %}:</strong> {{ payment_error.error_code }}</p>
|
|
<p><strong>{% trans "Error Message" %}:</strong> {{ payment_error.error_message }}</p>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if notification_type == 'custom_design' and order.customer_design %}
|
|
<div style="margin-top: 20px;">
|
|
<h3>{% trans "Custom Design Details" %}</h3>
|
|
<p><strong>{% trans "Design Name" %}:</strong> {{ order.customer_design.name }}</p>
|
|
{% if order.customer_design.notes %}
|
|
<p><strong>{% trans "Notes" %}:</strong> {{ order.customer_design.notes }}</p>
|
|
{% endif %}
|
|
{% if order.customer_design.design_file %}
|
|
<p><strong>{% trans "Design File" %}:</strong>
|
|
<a href="{{ order.customer_design.design_file.url }}">
|
|
{% trans "Download Design File" %}
|
|
</a>
|
|
</p>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div style="text-align: center;">
|
|
<a href="{{ order_url }}" class="button">
|
|
{% trans "View Order Details" %}
|
|
</a>
|
|
</div>
|
|
</body>
|
|
</html> |