mirror of
https://github.com/rjNemo/rentease.git
synced 2026-06-06 02:36:49 +00:00
Ruidy
cf1620592a
### TL;DR Enhanced invoice generation with improved formatting and Euro symbol display ### What changed? - Added Euro symbol (€) to monetary values in the invoice template - Implemented new invoice data structure with dedicated types for lines and payments - Created ToInvoice method to properly format booking data for invoice generation - Added HTML template parsing and rendering functionality - Improved date formatting for consistency - Added new API endpoint for booking creation ### How to test? 1. Create a new booking through the API 2. Navigate to the PDF generation endpoint 3. Verify that monetary values display with Euro symbol 4. Check that dates are properly formatted 5. Confirm that payment history and totals are correctly calculated 6. Validate that the generated HTML maintains proper formatting ### Why make this change? To improve invoice readability and consistency by standardizing monetary value display and providing better data structure for invoice generation. This change also makes the system more maintainable by separating concerns between data transformation and presentation.
290 lines
No EOL
7.5 KiB
HTML
290 lines
No EOL
7.5 KiB
HTML
<!doctype html>
|
||
<html lang="fr">
|
||
|
||
<head>
|
||
<style>
|
||
body {
|
||
font-family: Arial, sans-serif;
|
||
margin: 0;
|
||
padding: 0;
|
||
background-color: #f9f9f9;
|
||
color: #333;
|
||
}
|
||
|
||
.header {
|
||
background-color: #007b8f;
|
||
color: #fff;
|
||
padding: 20px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.logo {
|
||
height: 60px;
|
||
}
|
||
|
||
.payee {
|
||
text-align: right;
|
||
}
|
||
|
||
hr {
|
||
border: none;
|
||
border-top: 2px solid #ddd;
|
||
margin: 20px 0;
|
||
}
|
||
|
||
.info-table {
|
||
width: 48%;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.info-table td {
|
||
padding: 5px 10px;
|
||
}
|
||
|
||
.billing-details {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.items-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.items-table th,
|
||
.items-table td {
|
||
border: 1px solid #ddd;
|
||
padding: 10px;
|
||
text-align: left;
|
||
}
|
||
|
||
.items-table th {
|
||
background-color: #007b8f;
|
||
color: #fff;
|
||
}
|
||
|
||
.items-table .align-right {
|
||
text-align: right;
|
||
}
|
||
|
||
.bg-gray {
|
||
background-color: #f4f4f4;
|
||
}
|
||
|
||
.payment-summary {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.summary-table {
|
||
width: 100%;
|
||
}
|
||
|
||
.summary-table td {
|
||
padding: 10px;
|
||
}
|
||
|
||
.payment-history h3 {
|
||
color: #007b8f;
|
||
}
|
||
|
||
.history-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
}
|
||
|
||
.history-table th,
|
||
.history-table td {
|
||
border: 1px solid #ddd;
|
||
padding: 10px;
|
||
text-align: left;
|
||
}
|
||
|
||
.history-table th {
|
||
background-color: #007b8f;
|
||
color: #fff;
|
||
}
|
||
|
||
.card {
|
||
background-color: #eef7f9;
|
||
padding: 15px;
|
||
border-radius: 5px;
|
||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||
}
|
||
|
||
.order-total {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.total {
|
||
text-align: right;
|
||
}
|
||
|
||
.amount-due {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.amount-due-total {
|
||
font-size: 24px;
|
||
font-weight: bold;
|
||
color: #007b8f;
|
||
}
|
||
|
||
.space-between {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.text-break {
|
||
word-wrap: break-word;
|
||
}
|
||
</style>
|
||
</head>
|
||
|
||
<body>
|
||
<div class="header space-between">
|
||
<img class="logo" src="/static/img/logo.png" />
|
||
<div class="payee">
|
||
<b>{{ .Host.Name }}</b><br />
|
||
{{ .Host.Address }}<br />
|
||
{{ .Host.ZipCode }} {{ .Host.City }}<br />
|
||
<b>Tel :</b> {{ .Host.PhoneNumber }}<br />
|
||
<b>Mail :</b> {{ .Host.Email }}<br />
|
||
</div>
|
||
</div>
|
||
<hr />
|
||
<div class="billing-details space-between">
|
||
<table class="info-table">
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>{{ .Name }}</strong></td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Tel :</strong></td>
|
||
<td>{{ .PhoneNumber }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Nombre de clients :</strong></td>
|
||
<td>{{ .CustomersNumber }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Plateforme :</strong></td>
|
||
<td>{{ .Platform }}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<table class="info-table">
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Nº de facture :</strong></td>
|
||
<td>{{ .ID }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Du :</strong></td>
|
||
<td>{{ .From }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Au :</strong></td>
|
||
<td>{{ .To }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Montant Total :</strong></td>
|
||
<td>{{ .Total }} €</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<hr />
|
||
<div class="order-details">
|
||
<table class="items-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Objet</th>
|
||
<th>Quantité</th>
|
||
<th>Prix (€)</th>
|
||
<th class="align-right">Total (€)</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody class="bg-gray rounded">
|
||
{{ range .Lines }}
|
||
<tr class="item-row">
|
||
<td class="text-break product_name">{{ .Name }}</td>
|
||
<td>{{ .Quantity }}</td>
|
||
<td>{{ .Price }}</td>
|
||
<td class="align-right">{{ .Total }}</td>
|
||
</tr>
|
||
{{ end }}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div class="payment-history">
|
||
<h3>Historique des Paiements</h3>
|
||
<table class="history-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Date</th>
|
||
<th>Mode de Paiement</th>
|
||
<th>Montant (€)</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{{ range .Payments }}
|
||
<tr>
|
||
<td>{{ .Date }}</td>
|
||
<td>{{ .Method }}</td>
|
||
<td>{{ .Amount }}</td>
|
||
</tr>
|
||
{{ end }}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div class="payment-summary space-between">
|
||
<table class="summary-table">
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Montant Total :</strong></td>
|
||
<td>{{ .Total }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Montant Payé :</strong></td>
|
||
<td>{{ .AmountPaid }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Solde Restant :</strong></td>
|
||
<td>{{ .BalanceDue }}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<hr />
|
||
<div class="order-summary space-between">
|
||
<div class="card">
|
||
<b>Notes</b> <br />
|
||
TVA non applicable, art. 293 B du CGI <br />
|
||
Dispensé d’immatriculation au registre du commerce et des sociétés (RCS)
|
||
et au répertoire des métiers. <br />
|
||
Conditions de paiement : paiement à réception de facture. Aucun escompte
|
||
consenti pour règlement anticipé ou désistement. Tout incident de
|
||
paiement est passible d'intérêts de retard. Le montant des pénalités
|
||
résulte de l'application aux sommes restant dues d'un taux d'intérêt
|
||
légal en vigueur au moment de l'incident. <br />
|
||
</div>
|
||
</div>
|
||
<div class="order-total space-between">
|
||
<div></div>
|
||
<div class="total">
|
||
<div class="amount-due">Total</div>
|
||
<div class="amount-due-total">{{ .Total }} €</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
|
||
</html> |