chore: Amélioration de la fiche d'élève

This commit is contained in:
N3WT DE COMPET
2025-05-31 11:08:21 +02:00
parent 5be5f9f70d
commit f265540da2

View File

@ -1,6 +1,6 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Fiche élève de {{ student.last_name }} {{ student.first_name }}</title> <title>Fiche élève de {{ student.last_name }} {{ student.first_name }}</title>
<style> <style>
@ -11,28 +11,25 @@
body { body {
font-family: 'Arial', sans-serif; font-family: 'Arial', sans-serif;
font-size: 12pt; font-size: 12pt;
line-height: 1.6; color: #222;
background: #fff;
margin: 0; margin: 0;
padding: 0; padding: 0;
color: #333;
background-color: #f9f9f9;
} }
.container { .container {
width: 100%; width: 100%;
padding: 20px; padding: 0;
background-color: #fff; background: #fff;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
} }
.header { .header {
text-align: center; text-align: center;
margin-bottom: 30px; margin-bottom: 24px;
border-bottom: 3px solid #4CAF50; border-bottom: 2px solid #4CAF50;
padding-bottom: 15px; padding-bottom: 12px;
position: relative; position: relative;
} }
.title { .title {
font-size: 20pt; font-size: 22pt;
font-weight: bold; font-weight: bold;
color: #4CAF50; color: #4CAF50;
margin: 0; margin: 0;
@ -41,51 +38,47 @@
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
width: 100px; width: 90px;
height: 100px; height: 90px;
object-fit: cover; object-fit: cover;
border: 2px solid #4CAF50; border: 1px solid #4CAF50;
border-radius: 10px; border-radius: 8px;
} }
.section { .section {
margin-bottom: 20px; margin-bottom: 32px; /* Espacement augmenté entre les sections */
padding: 15px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #fefefe;
} }
.section-title { .section-title {
font-size: 18pt; font-size: 15pt;
font-weight: bold; font-weight: bold;
color: #4CAF50; color: #4CAF50;
margin-bottom: 10px; margin-bottom: 18px; /* Espacement sous le titre de section */
text-align: left; border-bottom: 1px solid #4CAF50;
border-bottom: 2px solid #4CAF50; padding-bottom: 2px;
padding-bottom: 5px;
} }
table { table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin-top: 10px; margin-bottom: 8px;
} }
td { th, td {
padding: 8px; border: 1px solid #bbb;
vertical-align: top; padding: 6px 8px;
text-align: left;
}
th {
background: #f3f3f3;
font-weight: bold;
}
tr:nth-child(even) {
background: #fafafa;
} }
.label-cell { .label-cell {
font-weight: bold; font-weight: bold;
color: #555; width: 30%;
width: 35%; background: #f3f3f3;
text-align: right;
padding-right: 10px;
} }
.value-cell { .value-cell {
color: #333; width: 70%;
width: 65%;
text-align: left;
}
.phone {
white-space: nowrap;
} }
.signature { .signature {
margin-top: 30px; margin-top: 30px;
@ -97,137 +90,139 @@
font-weight: bold; font-weight: bold;
color: #333; color: #333;
} }
.subsection-title {
font-size: 12pt;
color: #333;
margin: 8px 0 4px 0;
font-weight: bold;
}
</style> </style>
</head> </head>
<body> <body>
{% load myTemplateTag %} {% load myTemplateTag %}
<div class="container"> <div class="container">
<!-- Header Section --> <!-- Header Section -->
<div class="header"> <div class="header">
<h1 class="title">Fiche élève de {{ student.last_name }} {{ student.first_name }}</h1> <h1 class="title">Fiche élève de {{ student.last_name }} {{ student.first_name }}</h1>
{% if student.photo %} {% if student.photo %}
<img <img src="{{ student.get_photo_url }}" alt="Photo de l'élève" class="photo" />
src="{{ student.get_photo_url }}"
alt="Photo de l'élève"
class="photo"
/>
{% else %} {% else %}
<img <img src="/static/img/default-photo.jpg" alt="Photo par défaut" class="photo" />
src="/static/img/default-photo.jpg"
alt="Photo par défaut"
class="photo"
/>
{% endif %} {% endif %}
</div> </div>
<!-- Student Section --> <!-- Élève -->
<div class="section"> <div class="section">
<h2 class="section-title">ÉLÈVE</h2> <div class="section-title">ÉLÈVE</div>
<table> <table>
<tr> <tr>
<td class="label-cell">Nom :</td> <td class="label-cell">Nom</td>
<td class="value-cell">{{ student.last_name }}</td> <td class="value-cell">{{ student.last_name }}</td>
<td class="label-cell">Prénom :</td> <td class="label-cell">Prénom</td>
<td class="value-cell">{{ student.first_name }}</td> <td class="value-cell">{{ student.first_name }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Adresse :</td> <td class="label-cell">Adresse</td>
<td colspan="3" class="value-cell">{{ student.address }}</td> <td class="value-cell" colspan="3">{{ student.address }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Genre :</td> <td class="label-cell">Genre</td>
<td class="value-cell">{{ student|getStudentGender }}</td> <td class="value-cell">{{ student|getStudentGender }}</td>
<td class="label-cell">Né(e) le :</td> <td class="label-cell">Né(e) le</td>
<td class="value-cell">{{ student.birth_date }}</td> <td class="value-cell">{{ student.birth_date }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">À :</td> <td class="label-cell">À</td>
<td colspan="3" class="value-cell">{{ student.birth_place }} ({{ student.birth_postal_code }})</td> <td class="value-cell">{{ student.birth_place }} ({{ student.birth_postal_code }})</td>
<td class="label-cell">Nationalité</td>
<td class="value-cell">{{ student.nationality }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Nationalité :</td> <td class="label-cell">Niveau</td>
<td class="value-cell">{{ student.nationality }}</td>
<td class="label-cell">Niveau :</td>
<td class="value-cell">{{ student|getStudentLevel }}</td> <td class="value-cell">{{ student|getStudentLevel }}</td>
<td class="label-cell"></td>
<td class="value-cell"></td>
</tr> </tr>
</table> </table>
</div> </div>
<!-- Guardians Section --> <!-- Responsables -->
<div class="section"> <div class="section">
<h2 class="section-title">RESPONSABLES</h2> <div class="section-title">RESPONSABLES</div>
{% for guardian in student.getGuardians %} {% for guardian in student.getGuardians %}
<div class="subsection"> <div>
<h3 class="subsection-title">Responsable {{ forloop.counter }}</h3> <div class="subsection-title">Responsable {{ forloop.counter }}</div>
<table> <table>
<tr> <tr>
<td class="label-cell">Nom :</td> <td class="label-cell">Nom</td>
<td class="value-cell">{{ guardian.last_name }}</td> <td class="value-cell">{{ guardian.last_name }}</td>
<td class="label-cell">Prénom :</td> <td class="label-cell">Prénom</td>
<td class="value-cell">{{ guardian.first_name }}</td> <td class="value-cell">{{ guardian.first_name }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Adresse :</td> <td class="label-cell">Adresse</td>
<td colspan="3" class="value-cell">{{ guardian.address }}</td> <td class="value-cell" colspan="3">{{ guardian.address }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Né(e) le :</td> <td class="label-cell">Email</td>
<td class="value-cell" colspan="3">{{ guardian.email }}</td>
</tr>
<tr>
<td class="label-cell">Né(e) le</td>
<td class="value-cell">{{ guardian.birth_date }}</td> <td class="value-cell">{{ guardian.birth_date }}</td>
<td class="label-cell">Email :</td> <td class="label-cell">Téléphone</td>
<td class="value-cell">{{ guardian.email }}</td> <td class="value-cell">{{ guardian.phone|phone_format }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Téléphone :</td> <td class="label-cell">Profession</td>
<td class="value-cell phone">{{ guardian.phone|phone_format }}</td> <td class="value-cell" colspan="3">{{ guardian.profession }}</td>
<td class="label-cell">Profession :</td>
<td class="value-cell">{{ guardian.profession }}</td>
</tr> </tr>
</table> </table>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
<!-- Siblings Section --> <!-- Fratrie -->
<div class="section"> <div class="section">
<h2 class="section-title">FRATRIE</h2> <div class="section-title">FRATRIE</div>
{% for sibling in student.getSiblings %} {% for sibling in student.getSiblings %}
<div class="subsection"> <div>
<h3 class="subsection-title">Frère/Soeur {{ forloop.counter }}</h3> <div class="subsection-title">Frère/Soeur {{ forloop.counter }}</div>
<table> <table>
<tr> <tr>
<td class="label-cell">Nom :</td> <td class="label-cell">Nom</td>
<td class="value-cell">{{ sibling.last_name }}</td> <td class="value-cell">{{ sibling.last_name }}</td>
<td class="label-cell">Prénom :</td> <td class="label-cell">Prénom</td>
<td class="value-cell">{{ sibling.first_name }}</td> <td class="value-cell">{{ sibling.first_name }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Né(e) le :</td> <td class="label-cell">Né(e) le</td>
<td colspan="3" class="value-cell">{{ sibling.birth_date }}</td> <td class="value-cell" colspan="3">{{ sibling.birth_date }}</td>
</tr> </tr>
</table> </table>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
<!-- Payment Section --> <!-- Paiement -->
<div class="section"> <div class="section">
<h2 class="section-title">MODALITÉS DE PAIEMENT</h2> <div class="section-title">MODALITÉS DE PAIEMENT</div>
<table> <table>
<tr> <tr>
<td class="label-cell">Frais d'inscription :</td> <td class="label-cell">Frais d'inscription</td>
<td class="value-cell">{{ student|getRegistrationPaymentMethod }} en {{ student|getRegistrationPaymentPlan }}</td> <td class="value-cell">{{ student|getRegistrationPaymentMethod }} en {{ student|getRegistrationPaymentPlan }}</td>
</tr> </tr>
<tr> <tr>
<td class="label-cell">Frais de scolarité :</td> <td class="label-cell">Frais de scolarité</td>
<td class="value-cell">{{ student|getTuitionPaymentMethod }} en {{ student|getTuitionPaymentPlan }}</td> <td class="value-cell">{{ student|getTuitionPaymentMethod }} en {{ student|getTuitionPaymentPlan }}</td>
</tr> </tr>
</table> </table>
</div> </div>
<!-- Signature Section --> <!-- Signature -->
<div class="signature"> <div class="signature">
Fait le <span class="signature-text">{{ signatureDate }}</span> à <span class="signature-text">{{ signatureTime }}</span> Fait le <span class="signature-text">{{ signatureDate }}</span> à <span class="signature-text">{{ signatureTime }}</span>
</div> </div>
</div> </div>
</body> </body>
</html> </html>