92 lines
No EOL
4.6 KiB
HTML
92 lines
No EOL
4.6 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Mes horaires — GMAO Collège{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="py-2 py-md-3" style="max-width:700px;">
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<h2 class="mb-0 h5"><i class="bi bi-clock"></i> Mes horaires</h2>
|
|
<a href="{{ url_for('planning.index') }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-arrow-left"></i> Planning</a>
|
|
</div>
|
|
|
|
<p class="text-muted small mb-3">Configure tes jours et horaires de travail. Le planning tiendra compte de tes disponibilités pour les interventions préventives.</p>
|
|
|
|
<form method="POST">
|
|
{{ csrf_token|safe if csrf_token else '' }}
|
|
|
|
{% for day_num in range(1, 8) %}
|
|
{% set ws = schedules.get(day_num) %}
|
|
<div class="card border-0 shadow-sm mb-2" id="day-card-{{ day_num }}">
|
|
<div class="card-body py-2 px-3">
|
|
<!-- Ligne jour principal -->
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div class="form-check form-switch mb-0">
|
|
<input class="form-check-input" type="checkbox" name="working_{{ day_num }}" id="working_{{ day_num }}"
|
|
{% if not ws or ws.is_working %}checked{% endif %}
|
|
onchange="toggleDay({{ day_num }})">
|
|
<label class="form-check-label fw-bold" for="working_{{ day_num }}">{{ weekdays[day_num] }}</label>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Détail horaires (caché si jour off) -->
|
|
<div id="day-detail-{{ day_num }}" class="{% if ws and not ws.is_working %}d-none{% endif %}">
|
|
<div class="row g-2 mt-1 align-items-center">
|
|
<!-- Matin -->
|
|
<div class="col-6">
|
|
<div class="form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" name="am_working_{{ day_num }}" id="am_{{ day_num }}"
|
|
{% if not ws or ws.am_working %}checked{% endif %}
|
|
onchange="toggleHalf('am',{{ day_num }})">
|
|
<label class="form-check-label small" for="am_{{ day_num }}">Matin</label>
|
|
</div>
|
|
<div id="am-times-{{ day_num }}" class="d-flex gap-1 mt-1 {% if ws and not ws.am_working %}d-none{% endif %}">
|
|
<input type="time" name="am_start_{{ day_num }}" value="{{ ws.am_start if ws and ws.am_start else '08:00' }}" class="form-control form-control-sm" style="max-width:90px;">
|
|
<span class="align-self-center small">→</span>
|
|
<input type="time" name="am_end_{{ day_num }}" value="{{ ws.am_end if ws and ws.am_end else '12:00' }}" class="form-control form-control-sm" style="max-width:90px;">
|
|
</div>
|
|
</div>
|
|
<!-- Après-midi -->
|
|
<div class="col-6">
|
|
<div class="form-check form-switch">
|
|
<input class="form-check-input" type="checkbox" name="pm_working_{{ day_num }}" id="pm_{{ day_num }}"
|
|
{% if not ws or ws.pm_working %}checked{% endif %}
|
|
onchange="toggleHalf('pm',{{ day_num }})">
|
|
<label class="form-check-label small" for="pm_{{ day_num }}">Après-midi</label>
|
|
</div>
|
|
<div id="pm-times-{{ day_num }}" class="d-flex gap-1 mt-1 {% if ws and not ws.pm_working %}d-none{% endif %}">
|
|
<input type="time" name="pm_start_{{ day_num }}" value="{{ ws.pm_start if ws and ws.pm_start else '13:00' }}" class="form-control form-control-sm" style="max-width:90px;">
|
|
<span class="align-self-center small">→</span>
|
|
<input type="time" name="pm_end_{{ day_num }}" value="{{ ws.pm_end if ws and ws.pm_end else '17:00' }}" class="form-control form-control-sm" style="max-width:90px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Jour off -->
|
|
<div id="day-off-{{ day_num }}" class="{% if not ws or ws.is_working %}d-none{% endif %}">
|
|
<small class="text-muted">Non travaillé</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<button type="submit" class="btn btn-primary mt-2">
|
|
<i class="bi bi-check-lg"></i> Enregistrer mes horaires
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
function toggleDay(n) {
|
|
const checked = document.getElementById('working_'+n).checked;
|
|
document.getElementById('day-detail-'+n).classList.toggle('d-none', !checked);
|
|
document.getElementById('day-off-'+n).classList.toggle('d-none', checked);
|
|
}
|
|
function toggleHalf(half, n) {
|
|
const checked = document.getElementById(half+'_'+n).checked;
|
|
document.getElementById(half+'-times-'+n).classList.toggle('d-none', !checked);
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
{% endblock %} |