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

{% block title %}Nouvelle Version{% endblock %}

{% block body %}
<script>
    $(document).ready(function () {
        $(".page-title h1").text("Nouvelle version");
        $(".bandeau-img img").attr("src","https://edgarpetrus.fr/site-perso/web/app/uploads/2023/12/icon_ticket.png");
    })
</script>
<!--begin::Main-->
<div class="app-main flex-column flex-row-fluid " id="kt_app_main">
	<!--begin::Content wrapper-->
	<div class="d-flex flex-column flex-column-fluid">       
		<!--begin::Toolbar-->
		<div id="kt_app_toolbar" class="app-toolbar  py-3 py-lg-6 ">
            <!--begin::Toolbar container-->
        	<div id="kt_app_toolbar_container" class="app-container  container-xxl d-flex flex-stack ">
				<!--begin::Page title-->
				<div class="page-title d-flex flex-column justify-content-center flex-wrap me-3 ">
					<!--begin::Title-->
					<h1 class="page-heading d-flex text-gray-900 fw-bold fs-3 flex-column justify-content-center my-0">Multipurpose</h1>
					<!--end::Title-->
					<!--begin::Breadcrumb-->
					<ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
                        <!--begin::Item-->
                        <li class="breadcrumb-item text-muted">
							<a href="/" class="text-muted text-hover-primary">
                                Accueil                            
							</a>
                        </li>
                        <!--end::Item-->
                        <!--begin::Item-->
						<li class="breadcrumb-item">
							<span class="bullet bg-gray-500 w-5px h-2px"></span>
						</li>
                    	<!--end::Item--> 
                        <!--begin::Item-->
                        <li class="breadcrumb-item text-muted">
                            <a href="/versions" class="text-muted text-hover-primary">
                                Liste des versions                                  
							</a>
						</li>
                        <!--end::Item-->
                        <!--begin::Item-->
						<li class="breadcrumb-item">
							<span class="bullet bg-gray-500 w-5px h-2px"></span>
						</li>
                    	<!--end::Item--> 
                        <!--begin::Item-->
                        <li class="breadcrumb-item text-muted">
                            Nouvelle version                                 
						</li>
                        <!--end::Item-->            
                    </ul>
        			<!--end::Breadcrumb-->
    			</div>
				<!--end::Page title-->
				<!--begin::Actions-->
				<!--div class="d-flex align-items-center gap-2 gap-lg-3">
            		<a href="/uploads/projects/digistack-logo-6599e5052c381.png#" class="btn btn-sm fw-bold btn-secondary" data-bs-toggle="modal" data-bs-target="#kt_modal_create_app">Rollover</a>
					<a href="/user/add" class="btn btn-sm fw-bold btn-primary" data-bs-toggle="modal" data-bs-target="#kt_modal_new_target">
						Ajouter un utilisateur
					</a>
				</div-->
			<!--end::Actions-->
			</div>
		<!--end::Toolbar container-->
		</div>
		<!--end::Toolbar-->                                        
                    
		<!--begin::Content-->
		<div id="kt_app_content" class="app-content  flex-column-fluid ">
			<!--begin::Content container-->
			<div id="kt_app_content_container" class="app-container  container-xxl ">
                <div class="digi-card card-flush">
                    <div class="card-header align-items-center py-2 gap-2 gap-md-2">
                        
                    </div>
                    <div class="card-body pt-0">
                        <h1>Ajout d'une version</h1>
                        {{ form_start(versionForm) }}

                            <!-- Nom du projet -->
                            <div class="mb-3">
                                <label for="project_projectName" class="form-label">Projet</label>
                                <select name="{{ field_name(versionForm.project) }}" class="form-control" id="project_projectName">
                                    {% for label, value in field_choices(versionForm.project) %}
                                        {% set selected = '' %}
                                            {% if label == '' %}
                                                {% set selected = 'selected' %}
                                            {% endif %}
                                            <option value="{{ value }}" {{ selected }}>{{ label }}</option>
                                    {% endfor %}
                                </select>
                            </div>

                            <!-- Nom de la version -->
                            <div class="mb-3">
                                <label for="versionName" class="form-label">Nom de la version</label>
                                <input type="text" name="{{ field_name(versionForm.versionName) }}" class="form-control" id="versionName" placeholder="Nom de la version">
                            </div>

                            <!-- Date de démarrage -->
                            <div class="mb-3" style="display: flex; justify-content: space-between; margin-left: 20px; margin-right: 20px; gap: 100px;">
                                <div class="col" style="width: 100px;">
                                    <label for="versionStartDate" class="form-label">Date de démarrage de la version</label>
                                    <input type="date" name="{{ field_name(versionForm.versionStartDate) }}" class="form-control" id="versionStartDate" placeholder="Date de démarrage">
                                </div>

                                <!-- Date d'échéance -->
                                <div class="col" style="width: 100px;">
                                    <label for="versionEndDate" class="form-label">Date d'échéance de la version</label>
                                    <input type="date" name="{{ field_name(versionForm.versionEndDate) }}" class="form-control" id="versionEndDate" placeholder="Date d'échéance">
                                </div>

                                <!-- Date de livraison estimée -->
                                <div class="col" style="width: 100px;">
                                    <label for="estimatedDeliveryDate" class="form-label">Date prévisionnelle de livraison</label>
                                    <input type="date" name="{{ field_name(versionForm.estimatedDeliveryDate) }}" class="form-control" id="estimatedDeliveryDate" placeholder="Date de livraison estimée">
                                </div>
                            </div>

                            <!-- Descriptif du statut -->
                            <div class="mb-3">
                                <label for="versionTitle" class="form-label">Description</label>
                                <textarea id="versionTitle" class="form-control" name="{{ field_name(versionForm.versionTitle) }}" rows="7" cols="20"></textarea>
                                <div id="emailHelp" class="form-text">Ce texte court s'affichera sous le nom de la version.</div>
                            </div>

                            <!-- Commentaire du statut -->
                            <div class="mb-3">
                                <label for="versionComments" class="form-label">Commentaires</label>
                                <textarea id="versionComments" class="form-control" name="{{ field_name(versionForm.versionComments) }}" rows="7" cols="20"></textarea>
                                <div id="emailHelp" class="form-text">Ce texte s'affichera au survol de l'info-bulle associé à la version.</div>
                            </div>

                            <!-- Couleur du texte -->
                            <div class="mb-3">
                                <label for="color" class="form-label">Couleur à associer au texte</label>
                                <input type="color" class="form-control form-control-color" id="color" name="{{ field_name(versionForm.color) }}" value="#ffffff" title="Sélectionner une couleur">
                                <div id="emailHelp" class="form-text">Choisir une couleur pour le texte</div>
                            </div>

                            <!-- Couleur du statut -->
                            <div class="mb-3">
                                <label for="backgroundColor" class="form-label">Couleur à associer au fond</label>
                                <input type="color" class="form-control form-control-color" id="backgroundColor" name="{{ field_name(versionForm.backgroundColor) }}" value="#563d7c" title="Sélectionner une couleur">
                                <div id="emailHelp" class="form-text">Choisir une couleur pour le fond</div>
                            </div>

                            <br>
                            <button type="submit" class="btn glossy-button">Enregistrer</button>
                            <button type="cancel" class="btn btn-secondary" href="/status">Annuler</button>

                            {{ form_rest(versionForm) }}
                        {{ form_end(versionForm) }}
                    </div>
                </div>
			</div>
		</div>
	</div>
</div>
<!--end::Row-->
{% endblock %}