{% extends "base.html.twig" %}

{% block page_title %}
	Création d'un adhérent | BO
{% endblock %}

{% block name_title_page_top %}
	<i class="fa-solid fa-plus"></i> Création d'un adhérent
{% endblock %}

{% block real_page_content %}

	<div class="tab-pane fade show active" role="tabpanel">
		<div class="card">
			<div class="card-body">
				<div class="d-flex justify-content-between align-items-center mb-3">
					<h5 class="card-title mb-0">Créer un adhérent</h5>
					<a href="{{ ea_url().setRoute('association_adherents') }}" class="btn btn-secondary">
						<i class="fas fa-arrow-left"></i> Retour à la liste
					</a>
				</div>

				<form action="{{ ea_url().setRoute('association_adherent_creer') }}" method="POST" class="row mb-5"
				      {{ stimulus_controller('geolocale-select', {apiUrl: api_url}) }}>

					<!-- Type d'adhérent -->
					<div class="col-12 col-md-6">
						<div class="mb-3">
							<label for="select-adhTad" class="form-label">Type d'adhérent <span class="text-danger">*</span></label>
							<select class="form-select" id="select-adhTad" name="form[adhTad]" required>
								<option value="">Sélectionner un type</option>
								{% for t in typesAdherents %}
									<option value="{{ t.tadId }}">{{ t.tadLibelle }}</option>
								{% endfor %}
							</select>
						</div>
					</div>
					<div class="col-12 col-md-6"></div>

					<!-- Nom et Prénom -->
					<div class="col-12 col-md-6">
						<div class="mb-3">
							<label for="input-adhNom" class="form-label">Nom <span class="text-danger">*</span></label>
							<input type="text" class="form-control" id="input-adhNom" name="form[adhNom]" placeholder="Nom..." required>
						</div>
					</div>
					<div class="col-12 col-md-6">
						<div class="mb-3">
							<label for="input-adhPrenom" class="form-label">Prénom</label>
							<input type="text" class="form-control" id="input-adhPrenom" name="form[adhPrenom]" placeholder="Prénom...">
						</div>
					</div>

					<!-- Nom personne morale -->
					<div class="col-md-12">
						<div class="mb-3">
							<label for="input-adhNomasso" class="form-label">Nom de la personne morale (si applicable)</label>
							<input type="text" class="form-control" id="input-adhNomasso" name="form[adhNomasso]" placeholder="Nom de l'association, entreprise, mairie...">
						</div>
					</div>

					<!-- Adresse -->
					<div class="col-md-12">
						<div class="mb-3">
							<label for="input-adhAdresse1" class="form-label">Adresse ligne 1</label>
							<input type="text" class="form-control" id="input-adhAdresse1" name="form[adhAdresse1]" placeholder="Adresse...">
						</div>
					</div>
					<div class="col-md-12">
						<div class="mb-3">
							<label for="input-adhAdresse2" class="form-label">Adresse ligne 2</label>
							<input type="text" class="form-control" id="input-adhAdresse2" name="form[adhAdresse2]" placeholder="Complément d'adresse...">
						</div>
					</div>
					<div class="col-12 col-md-4">
						<div class="mb-3">
							<label for="input-adhCodepostal" class="form-label">Code postal</label>
							<input type="text" class="form-control" id="input-adhCodepostal" name="form[adhCodepostal]" placeholder="35000">
						</div>
					</div>
					<div class="col-12 col-md-8">
						<div class="mb-3">
							<label for="select-adhVil" class="form-label">Ville</label>
							<select id="select-adhVil" name="form[adhVil]" class="form-control" placeholder="Cherchez la ville..."></select>
						</div>
					</div>

					<!-- Contact -->
					<div class="col-12 col-md-6">
						<div class="mb-3">
							<label for="input-adhEmail" class="form-label">Email</label>
							<input type="email" class="form-control" id="input-adhEmail" name="form[adhEmail]" placeholder="email@exemple.com">
						</div>
					</div>
					<div class="col-12 col-md-3">
						<div class="mb-3">
							<label for="input-adhTelephone" class="form-label">Téléphone</label>
							<input type="text" class="form-control" id="input-adhTelephone" name="form[adhTelephone]" placeholder="02 99 00 00 00">
						</div>
					</div>
					<div class="col-12 col-md-3">
						<div class="mb-3">
							<label for="input-adhMobile" class="form-label">Mobile</label>
							<input type="text" class="form-control" id="input-adhMobile" name="form[adhMobile]" placeholder="06 00 00 00 00">
						</div>
					</div>

					<!-- Flags -->
					<div class="col-12 col-md-6">
						<div class="mb-3">
							<div class="form-check">
								<input class="form-check-input" type="checkbox" id="check-adhCourrier" name="form[adhCourrier|int]" value="1" checked>
								<label class="form-check-label" for="check-adhCourrier">
									Accepte les courriers
								</label>
							</div>
						</div>
					</div>
					<div class="col-12 col-md-6">
						<div class="mb-3">
							<div class="form-check">
								<input class="form-check-input" type="checkbox" id="check-adhErreur" name="form[adhErreur|int]" value="1">
								<label class="form-check-label" for="check-adhErreur">
									Adresse NPAI (N'habite Plus à l'Adresse Indiquée)
								</label>
							</div>
						</div>
					</div>

					<!-- Note -->
					<div class="col-md-12">
						<div class="mb-3">
							<label for="input-adhNote" class="form-label">Note</label>
							<textarea class="form-control" id="input-adhNote" name="form[adhNote]" rows="3" placeholder="Notes sur cet adhérent..."></textarea>
						</div>
					</div>

					<!-- Submit -->
					<div class="col-12 text-center mt-3">
						<button class="btn btn-success" type="submit">
							<i class="fas fa-save"></i> Créer l'adhérent
						</button>
					</div>
				</form>

			</div>
		</div>
	</div>
{% endblock %}