|
|
<!DOCTYPE html> |
|
|
<html lang="fr"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Générateur Fiche Évaluation Gym</title> |
|
|
<style> |
|
|
body { font-family: sans-serif; margin: 20px; } |
|
|
label { display: block; margin-top: 10px; font-weight: bold; } |
|
|
input[type=text], input[type=number] { width: 95%; padding: 8px; margin-top: 5px; border: 1px solid #ccc; border-radius: 4px; } |
|
|
.element-row { display: flex; align-items: center; margin-bottom: 10px; border: 1px solid #eee; padding: 10px; border-radius: 5px;} |
|
|
.element-row input { margin-right: 10px; } |
|
|
.element-row input[name="new_element_name"] { flex-grow: 3; } |
|
|
.element-row input[name="new_element_categorie"] { flex-grow: 1; } |
|
|
.element-row input[name="new_element_points"] { flex-grow: 1; } |
|
|
button { padding: 10px 15px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; margin-top: 5px; } |
|
|
button:hover { background-color: #0056b3; } |
|
|
.remove-btn { background-color: #dc3545; margin-left: 10px; } |
|
|
.remove-btn:hover { background-color: #c82333; } |
|
|
#elements-container { margin-top: 15px; padding-top: 10px; border-top: 1px dashed #ccc; } |
|
|
fieldset { border: 1px solid #ddd; padding: 15px; margin-bottom: 20px; border-radius: 5px; } |
|
|
legend { font-weight: bold; padding: 0 10px; } |
|
|
.format-options label { display: inline-block; margin-right: 15px; font-weight: normal;} |
|
|
.format-options input[type=radio] { margin-right: 5px; } |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<h1>Générateur de Fiche d'Évaluation Gymnastique</h1> |
|
|
|
|
|
<form method="post"> |
|
|
|
|
|
<fieldset> |
|
|
<legend>Informations Générales</legend> |
|
|
<label for="centre_examen">Centre d'examen:</label> |
|
|
<input type="text" id="centre_examen" name="centre_examen" value="Centre d'examen"> |
|
|
|
|
|
<label for="type_examen">Type d'examen:</label> |
|
|
<input type="text" id="type_examen" name="type_examen" value="Bac Général"> |
|
|
|
|
|
<label for="serie">Série:</label> |
|
|
<input type="text" id="serie" name="serie" value="Série"> |
|
|
|
|
|
<label for="etablissement">Établissement:</label> |
|
|
<input type="text" id="etablissement" name="etablissement" value="Établissement"> |
|
|
|
|
|
<label for="session">Session:</label> |
|
|
<input type="number" id="session" name="session" value="2025"> |
|
|
|
|
|
<label for="nom_candidat">Nom du Candidat:</label> |
|
|
<input type="text" id="nom_candidat" name="nom_candidat" value="Nom Prénom"> |
|
|
</fieldset> |
|
|
|
|
|
<fieldset> |
|
|
<legend>Éléments Techniques</legend> |
|
|
<div id="elements-container"> |
|
|
|
|
|
<div class="element-row"> |
|
|
<input type="text" name="new_element_name" placeholder="Nom de l'élément" required> |
|
|
<input type="text" name="new_element_categorie" placeholder="Catégorie (A, B...)" required> |
|
|
<input type="number" step="0.1" name="new_element_points" placeholder="Points max" required> |
|
|
<button type="button" class="remove-btn" onclick="removeElement(this)">Supprimer</button> |
|
|
</div> |
|
|
</div> |
|
|
<button type="button" id="add-element-btn">Ajouter un élément</button> |
|
|
</fieldset> |
|
|
|
|
|
<fieldset> |
|
|
<legend>Format de Sortie</legend> |
|
|
<div class="format-options"> |
|
|
<label> |
|
|
<input type="radio" name="format" value="docx" checked> DOCX |
|
|
</label> |
|
|
<label> |
|
|
<input type="radio" name="format" value="pdf"> PDF (Nécessite ConvertAPI) |
|
|
</label> |
|
|
</div> |
|
|
</fieldset> |
|
|
|
|
|
<button type="submit">Générer le Document</button> |
|
|
|
|
|
</form> |
|
|
|
|
|
<script> |
|
|
const container = document.getElementById('elements-container'); |
|
|
const addButton = document.getElementById('add-element-btn'); |
|
|
|
|
|
function createEmptyElementRow() { |
|
|
const newRow = document.createElement('div'); |
|
|
newRow.classList.add('element-row'); |
|
|
newRow.innerHTML = ` |
|
|
<input type="text" name="new_element_name" placeholder="Nom de l'élément" required> |
|
|
<input type="text" name="new_element_categorie" placeholder="Catégorie (A, B...)" required> |
|
|
<input type="number" step="0.1" name="new_element_points" placeholder="Points max" required> |
|
|
<button type="button" class="remove-btn" onclick="removeElement(this)">Supprimer</button> |
|
|
`; |
|
|
container.appendChild(newRow); |
|
|
} |
|
|
|
|
|
function removeElement(button) { |
|
|
|
|
|
if (container.children.length > 1) { |
|
|
button.parentElement.remove(); |
|
|
} else { |
|
|
alert("Vous devez avoir au moins un élément."); |
|
|
} |
|
|
} |
|
|
|
|
|
addButton.addEventListener('click', createEmptyElementRow); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script> |
|
|
|
|
|
</body> |
|
|
</html> |
