766 lines
26 KiB
Twig
766 lines
26 KiB
Twig
|
{% extends 'base.html.twig' %}
|
||
|
|
||
|
{% block title %}Creation d'une enquête{% endblock %}
|
||
|
|
||
|
{% block localstyle %}
|
||
|
.center {
|
||
|
display: flex;
|
||
|
justify-content: center;
|
||
|
align-items: center;
|
||
|
}
|
||
|
|
||
|
|
||
|
.hourdel, .guestdel {
|
||
|
position: absolute;
|
||
|
top: 0px;
|
||
|
right: 13px;
|
||
|
}
|
||
|
|
||
|
#addGuestMail {
|
||
|
position: absolute;
|
||
|
top: 33px;
|
||
|
right: 13px;
|
||
|
}
|
||
|
|
||
|
|
||
|
// CSS timepicki non insérer en asset car le natif est en contradiction avec d'autres CSS de lib
|
||
|
.ti_tx,
|
||
|
.mi_tx,
|
||
|
.mer_tx {
|
||
|
width: 100%;
|
||
|
text-align: center;
|
||
|
margin: 10px 0;
|
||
|
}
|
||
|
|
||
|
.time,
|
||
|
.mins,
|
||
|
.meridian {
|
||
|
width: 60px;
|
||
|
float: left;
|
||
|
margin: 0 10px;
|
||
|
font-size: 20px;
|
||
|
color: #2d2e2e;
|
||
|
font-family: arial;
|
||
|
font-weight: 700;
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
.timepicker_wrap .prev,
|
||
|
.timepicker_wrap .next {
|
||
|
cursor: pointer;
|
||
|
padding: 18px;
|
||
|
width: 42px;
|
||
|
border: 1px solid #ccc;
|
||
|
margin: auto;
|
||
|
border-radius: 5px;
|
||
|
height:40px;
|
||
|
}
|
||
|
|
||
|
.timepicker_wrap .prev:after {
|
||
|
content: '\f077';
|
||
|
font-family: 'Font Awesome 5 Free';
|
||
|
position: relative;
|
||
|
top: -12px;
|
||
|
left: -6px;
|
||
|
}
|
||
|
|
||
|
.timepicker_wrap .next:after {
|
||
|
content: '\f078';
|
||
|
font-family: 'Font Awesome 5 Free';
|
||
|
position: relative;
|
||
|
top: -12px;
|
||
|
left: -6px;
|
||
|
}
|
||
|
|
||
|
|
||
|
.timepicker_wrap .prev:hover,
|
||
|
.timepicker_wrap .next:hover {
|
||
|
background-color: #ccc;
|
||
|
}
|
||
|
|
||
|
.timepicker_wrap .next {
|
||
|
background-position: 50% 150%;
|
||
|
}
|
||
|
|
||
|
.timepicker_wrap .prev {
|
||
|
background-position: 50% -50%;
|
||
|
}
|
||
|
|
||
|
.time_pick {
|
||
|
position: relative;
|
||
|
}
|
||
|
|
||
|
.timepicker_wrap {
|
||
|
padding: 10px;
|
||
|
border-radius: 5px;
|
||
|
z-index: 998;
|
||
|
display: none;
|
||
|
box-shadow: 2px 2px 5px 0 rgba(50,50,50,0.35);
|
||
|
background: #f6f6f6;
|
||
|
border: 1px solid #ccc;
|
||
|
float: left;
|
||
|
position: absolute;
|
||
|
top: 27px;
|
||
|
left: 0;
|
||
|
}
|
||
|
|
||
|
.arrow_top {
|
||
|
position: absolute;
|
||
|
top: -10px;
|
||
|
left: 20px;
|
||
|
background: url("") no-repeat;
|
||
|
width: 18px;
|
||
|
height: 10px;
|
||
|
z-index: 999;
|
||
|
}
|
||
|
input.timepicki-input {
|
||
|
background: none repeat scroll 0 0 #FFFFFF;
|
||
|
border: 1px solid #CCCCCC;
|
||
|
border-radius: 5px 5px 5px 5px;
|
||
|
float: none;
|
||
|
margin: 0;
|
||
|
text-align: center;
|
||
|
width: 70%;
|
||
|
}
|
||
|
a.reset_time {
|
||
|
float: left;
|
||
|
margin-top: 5px;
|
||
|
color: #000;
|
||
|
width: 100%;
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
{% endblock %}
|
||
|
|
||
|
{% block body %}
|
||
|
|
||
|
{% set submitaction = "Créer une Enquête" %}
|
||
|
{% if id is defined %}
|
||
|
{% set submitaction = "Modifier l'Enquête" %}
|
||
|
{% endif %}
|
||
|
|
||
|
|
||
|
<div class="container">
|
||
|
{% if id is defined %}
|
||
|
{{ form_start(form, {'action': path(app.request.attributes.get('_route'), {id:id} | craue_removeDynamicStepNavigationParameters(flow))}) }}
|
||
|
{% else %}
|
||
|
{{ form_start(form, {'action': path(app.request.attributes.get('_route'), app.request.query.all | craue_removeDynamicStepNavigationParameters(flow))}) }}
|
||
|
{% endif %}
|
||
|
<h1 class="page-header">
|
||
|
{% if id is defined %}
|
||
|
Modification d'une Enquête
|
||
|
{% else %}
|
||
|
Création d'une Enquête
|
||
|
{% endif %}
|
||
|
</h1>
|
||
|
|
||
|
<!-- Affichage des erreurs -->
|
||
|
{% if app.session.flashbag.has('error') %}
|
||
|
<div class='alert alert-danger' style='margin: 5px 0px'>
|
||
|
<strong>Erreur</strong><br>
|
||
|
{% for flashMessage in app.session.flashbag.get('error') %}
|
||
|
{{ flashMessage }}<br>
|
||
|
{% endfor %}
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- Affichage des alertes -->
|
||
|
{% if app.session.flashbag.has('notice') %}
|
||
|
<div class='alert alert-info' style='margin: 5px 0px'>
|
||
|
<strong>Information</strong><br>
|
||
|
{% for flashMessage in app.session.flashbag.get('notice') %}
|
||
|
{{ flashMessage }}<br>
|
||
|
{% endfor %}
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- Navigation flowform -->
|
||
|
{% include 'Quest/step.html.twig' %}
|
||
|
{% include '@CraueFormFlow/FormFlow/buttons.html.twig' with {
|
||
|
craue_formflow_button_class_next: 'btn btnnextstep btn-primary',
|
||
|
craue_formflow_button_class_back: 'btn btn-secondary mr-3',
|
||
|
craue_formflow_button_class_finish: 'btn btn-primary',
|
||
|
craue_formflow_button_label_next: 'Étape suivante',
|
||
|
craue_formflow_button_label_back: 'Étape précédente',
|
||
|
craue_formflow_button_label_finish: submitaction,
|
||
|
craue_formflow_button_render_reset: false,
|
||
|
} %}
|
||
|
|
||
|
|
||
|
|
||
|
<!-- ETAPE 01 = Informations ------------------------------------------------------------------------------------------------------------------------------------ -->
|
||
|
{% if flow.getCurrentStepNumber() == 1 %}
|
||
|
<div class="card mb-3 mt-3">
|
||
|
<div class="card-body">
|
||
|
<div class="row">
|
||
|
<div class="col-md-12">
|
||
|
{{ form_row(form.title) }}
|
||
|
{{ form_row(form.private) }}
|
||
|
{{ form_row(form.anonymous) }}
|
||
|
{{ form_row(form.notification) }}
|
||
|
{{ form_row(form.description) }}
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- ETAPE 02 = Options ----------------------------------------------------------------------------------------------------------------------------------------- -->
|
||
|
{% if flow.getCurrentStepNumber() == 2 %}
|
||
|
{{ form_row(form.jsonquestoptions) }}
|
||
|
<div id="options" class="row"></div>
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- ETAPE 03 = Invités ----------------------------------------------------------------------------------------------------------------------------------------- -->
|
||
|
{% if flow.getCurrentStepNumber() == 3 %}
|
||
|
{{ form_row(form.jsonquestguests) }}
|
||
|
|
||
|
{% if not quest.private %}
|
||
|
<div class="card mb-3 mt-3">
|
||
|
<div class="card-body">
|
||
|
<div class="row">
|
||
|
<div class="col-md-12">
|
||
|
Cette enquête étant public, vous devez gérer vous même l'envoi des invitations. Vous pouvez copier/coller le message type ci-dessous qui contient l'adresse à laquelle vos invités pourront répondre.
|
||
|
<br><br>
|
||
|
|
||
|
<blockquote class="blockquote" style="border-left: 5px solid #eee; padding-left:15px; ">
|
||
|
Bonjour,<br>
|
||
|
Je vous invite à répondre à l'enquête suivante : {{quest.title}}.<br>
|
||
|
Pour ce faire, veuillez cliquer sur le lien ci-après: <a href="{{ absolute_url(path('app_quest_byquestkey', {'key' : quest.key})) }}">accéder à l'enquête</a>.<br>
|
||
|
</blockquote>
|
||
|
|
||
|
<strong>Attention n'envoyez le mail qu'après avoir finaliser l'enregistrement de votre enquête.</strong>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
|
||
|
<div id="gueststools" class="card mb-3 mt-3" style="display:none">
|
||
|
<div class="card-body">
|
||
|
<div class="row" >
|
||
|
<div class="col-md-6">
|
||
|
{{ form_row(form.user) }}
|
||
|
</div>
|
||
|
<div class="col-md-6">
|
||
|
{{ form_row(form.group) }}
|
||
|
</div>
|
||
|
|
||
|
<div class="col-lg-12">
|
||
|
<div class="form-group">
|
||
|
<label class="control-label" for="guestmail">Ajouter une liste de mail séparée par des virgules</label>
|
||
|
<input type="text" id="guestmail" class="form-control">
|
||
|
<button id="addGuestMail" type="button" class="btn" aria-hidden="true"><i class="fa fa-plus"></i></button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div id="guests" class="card mb-3 mt-3" style="display:none">
|
||
|
<div class="card-header">Liste des Invités</div>
|
||
|
<div class="card-body">
|
||
|
<div class="row"></div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- ETAPE 04 = Confirmation ------------------------------------------------------------------------------------------------------------------------------------ -->
|
||
|
{% if flow.getCurrentStepNumber() == 4 %}
|
||
|
{{ form_row(form.jsonquestoptions) }}
|
||
|
{{ form_row(form.jsonquestguests) }}
|
||
|
|
||
|
<div class="alert alert-info mt-3">
|
||
|
{% if id is defined %}
|
||
|
La modification de l'enquête est presque terminée. Vérifiez les informations et cliquez sur "Modifier l'enquête".
|
||
|
{% else %}
|
||
|
La création de l'enquête est presque terminée. Vérifiez les informations et cliquez sur "Créer l'enquête".
|
||
|
{% endif %}
|
||
|
</div>
|
||
|
|
||
|
<div class="card mb-3 mt-3">
|
||
|
<div class="card-body">
|
||
|
<div class="row">
|
||
|
<div class="col-md-4">
|
||
|
TITRE = {{ quest.title }}<br>
|
||
|
TYPE = {% if quest.private %} Privé {% else %} Public {% endif %}<br>
|
||
|
ANONYME = {% if quest.anonymous %} oui {% else %} non {% endif %}<br>
|
||
|
NOTIFICATION = {% if quest.notification %} oui {% else %} non {% endif %}
|
||
|
<div id="containerguests"></div>
|
||
|
|
||
|
{% if not quest.private %}
|
||
|
<br>
|
||
|
Cette enquête étant public, vous devez gérer vous même l'envoi des invitations. Vous pouvez copier/coller le message type ci-dessous qui contient l'adresse à laquelle vos invités pourront répondre.
|
||
|
<br><br>
|
||
|
|
||
|
<blockquote class="blockquote" style="border-left: 5px solid #eee; padding-left:15px; ">
|
||
|
Bonjour,<br>
|
||
|
Je vous invite à répondre à l'enquête suivante : {{quest.title}}.<br>
|
||
|
Pour ce faire, veuillez cliquer sur le lien ci-après: <a href="{{ absolute_url(path('app_quest_byquestkey', {'key' : quest.key})) }}">accéder à l'enquête</a>.<br>
|
||
|
</blockquote>
|
||
|
|
||
|
<strong>Attention n'envoyez le mail qu'après avoir finaliser l'enregistrement de votre enquête.</strong>
|
||
|
{% endif %}
|
||
|
</div>
|
||
|
|
||
|
<div class="col-md-8">
|
||
|
<div id="containeroptions"></div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
<!-- ------------------------------------------------------------------------------------------------------------------------------------------------------------- -->
|
||
|
|
||
|
<!-- Navigation flowform -->
|
||
|
{% include '@CraueFormFlow/FormFlow/buttons.html.twig' with {
|
||
|
craue_formflow_button_class_next: 'btn btnnextstep btn-primary',
|
||
|
craue_formflow_button_class_back: 'btn btn-secondary mr-3',
|
||
|
craue_formflow_button_class_finish: 'btn btn-primary',
|
||
|
craue_formflow_button_label_next: 'Étape suivante',
|
||
|
craue_formflow_button_label_back: 'Étape précédente',
|
||
|
craue_formflow_button_label_finish: submitaction,
|
||
|
craue_formflow_button_render_reset: false,
|
||
|
} %}
|
||
|
|
||
|
{{ form_end(form) }}
|
||
|
</div>
|
||
|
|
||
|
|
||
|
{% endblock %}
|
||
|
|
||
|
|
||
|
{% block localjavascript %}
|
||
|
$(document).ready(function() {
|
||
|
var stepper = new Stepper($('.bs-stepper')[0]);
|
||
|
|
||
|
html='<a href="{{path('app_home')}}" class="btn btn-secondary float-left">Annuler</a>';
|
||
|
$(".craue_formflow_buttons").prepend(html);
|
||
|
});
|
||
|
|
||
|
<!-- ETAPE 02 = Options ----------------------------------------------------------------------------------------------------------------------------------------- -->
|
||
|
{% if flow.getCurrentStepNumber() == 2 %}
|
||
|
|
||
|
|
||
|
$(document).ready(function() {
|
||
|
if ($("#questoptions_jsonquestoptions").val() == ''||$("#questoptions_jsonquestoptions").val()=='[]'){
|
||
|
$("#questoptions_jsonquestoptions").val('[]');
|
||
|
}
|
||
|
|
||
|
var obj = JSON.parse($("#questoptions_jsonquestoptions").val());
|
||
|
initOptions(obj);
|
||
|
|
||
|
|
||
|
});
|
||
|
|
||
|
function initOptions(json) {
|
||
|
$.each(json, function(i, option) {
|
||
|
addBlockOption(option);
|
||
|
});
|
||
|
|
||
|
addBtnOption();
|
||
|
|
||
|
$( "#options" ).sortable({
|
||
|
axis: "y",
|
||
|
handle: ".fa-arrows-alt-v",
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function addBlockOption(option) {
|
||
|
strdata='data-id="'+option.id+'" data-code="'+option.code+'"';
|
||
|
|
||
|
html ='<div '+strdata+' id="optioncontainer'+option.code+'" class="col-md-12 optioncontainer">';
|
||
|
html+='<div class="card mb-3 mt-3">';
|
||
|
html+='<div class="card-header">';
|
||
|
html+='<i class="fas fa-arrows-alt-v ui-sortable-handle"></i> ';
|
||
|
html+='Question';
|
||
|
html+='<button '+strdata+' id="optionbtndel'+option.code+'" type="button" class="btn optiondel float-right" aria-hidden="true"><i class="fa fa-trash"></i></button>';
|
||
|
html+='</div>';
|
||
|
|
||
|
html+='<div class="card-body">';
|
||
|
|
||
|
html+='<div class="form-group">';
|
||
|
html+='<label class="control-label required">Code<span class="mandatory">*</span></label>';
|
||
|
html+='<input '+strdata+' id="optioncode'+option.code+'" name="optioncode'+option.code+'" disabled="disabled" class="form-control optioncode" value="'+option.code+'">';
|
||
|
html+='</div>';
|
||
|
|
||
|
html+='<div class="form-group">';
|
||
|
html+='<label class="control-label required">Intitulé de la question<span class="mandatory">*</span></label>';
|
||
|
html+='<input '+strdata+' id="optionname'+option.code+'" name="optionname'+option.code+'" class="form-control optionname" value="'+option.name+'">';
|
||
|
html+='</div>';
|
||
|
|
||
|
html+='<div class="form-group">';
|
||
|
html+='<label class="control-label required">Obligatoire<span class="mandatory">*</span></label>';
|
||
|
html+='<select '+strdata+' id="optionrequired'+option.code+'" name="optionrequired'+option.code+'" class="form-control optionrequired">';
|
||
|
html+='<option value="0">non</option>';
|
||
|
html+='<option value="1">oui</option>';
|
||
|
html+='</select>';
|
||
|
html+='</div>';
|
||
|
|
||
|
html+='<div class="form-group">';
|
||
|
html+='<label class="control-label required">Type de la question<span class="mandatory">*</span></label>';
|
||
|
html+='<select '+strdata+' id="optiontype'+option.code+'" name="optiontype'+option.code+'" class="form-control optiontype">';
|
||
|
html+='<option value="10">oui / non</option>';
|
||
|
html+='<option value="20">oui / non / peut-être</option>';
|
||
|
html+='<option value="30">oui / non / en partie</option>';
|
||
|
html+='<option value="40">niveau de satisfaction</option>';
|
||
|
html+='<option value="50">niveau de satisfaction avec commentaire</option>';
|
||
|
html+='<option value="60">note sur 5</option>';
|
||
|
html+='<option value="70">note sur 10</option>';
|
||
|
html+='<option value="80">note sur 20</option>';
|
||
|
html+='<option value="90">text court</option>';
|
||
|
html+='<option value="100">text long</option>';
|
||
|
html+='<option value="110">choix</option>';
|
||
|
html+='</select>';
|
||
|
html+='</div>';
|
||
|
|
||
|
html+='<div id="blockoptionparameters'+option.code+'"class="form-group">';
|
||
|
html+='<label class="control-label required">Liste de choix séparée par des ;<span class="mandatory">*</span></label>';
|
||
|
html+='<input '+strdata+' id="optionparameters'+option.code+'" name="optionparameters'+option.code+'" class="form-control optionparameters" value="'+option.parameters+'">';
|
||
|
html+='</div>';
|
||
|
|
||
|
html+='</div>';
|
||
|
html+='</div>';
|
||
|
html+='</div>';
|
||
|
|
||
|
$("#options").append(html);
|
||
|
if(option.required) option.required=1;
|
||
|
else option.required=0;
|
||
|
$('#optionrequired'+option.code).val(option.required);
|
||
|
$('#optiontype'+option.code).val(option.type);
|
||
|
if(option.type==110) $('#blockoptionparameters'+option.code).show();
|
||
|
else $('#blockoptionparameters'+option.code).hide();
|
||
|
$('#optionname'+option.code).focus();
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
function addBtnOption(){
|
||
|
html ='<div id="addoption" class="center" style="width:100%">';
|
||
|
html+='<div class="text-center">';
|
||
|
html+='<button type="button" class="btn btn-link" onClick="addOption()">';
|
||
|
html+='<i class="fa fa-plus fa-4x"></i>';
|
||
|
html+='<br>Ajouter une question';
|
||
|
html+='</button>';
|
||
|
html+='</div>';
|
||
|
html+='</div>';
|
||
|
$("#options").append(html);
|
||
|
}
|
||
|
|
||
|
|
||
|
function addOption() {
|
||
|
// On supprime le bouton adddate
|
||
|
$("#addoption").remove();
|
||
|
|
||
|
// boucler sur l'ensemble des block pour déterminer le prochain code et roworder libre
|
||
|
code=1;
|
||
|
roworder=1;
|
||
|
$(".optioncontainer").each(function() {
|
||
|
if($(this).data("code")>=code) code=$(this).data("code")+1;
|
||
|
if($(this).data("roworder")>=roworder) roworder=$(this).data("roworder")+1;
|
||
|
});
|
||
|
|
||
|
// Chaine vide
|
||
|
var option = JSON.parse('{"id":"","code":"'+code+'","roworder":"'+roworder+'", "name":"" , "required":1, "type":"10", "parameters":"" }');
|
||
|
|
||
|
// Construction d'un bloc de option vide
|
||
|
addBlockOption(option);
|
||
|
|
||
|
// On regen le bouton add option
|
||
|
addBtnOption();
|
||
|
}
|
||
|
|
||
|
$('#options').on('change', '.optiontype', function(event) {
|
||
|
code=$(this).attr("data-code");
|
||
|
type=$('#optiontype'+code).val();
|
||
|
|
||
|
if(type==110) $('#blockoptionparameters'+code).show();
|
||
|
else $('#blockoptionparameters'+code).hide();
|
||
|
});
|
||
|
|
||
|
$('#options').on('click', '.optiondel', function(event) {
|
||
|
code=$(this).attr("data-code");
|
||
|
$("#optioncontainer"+code).remove();
|
||
|
|
||
|
});
|
||
|
|
||
|
$('#mycontent').on('click', '.btnnextstep', function(event) {
|
||
|
// Construction du tableau des horaires en fusionnant les potentiels doublons
|
||
|
var tboptions=[];
|
||
|
roworder=0;
|
||
|
$(".optioncontainer").each(function() {
|
||
|
roworder=roworder+1;
|
||
|
|
||
|
id=$(this).data("id")
|
||
|
code=$(this).data("code");
|
||
|
name=$("#optionname"+code).val();
|
||
|
required=$("#optionrequired"+code).val();
|
||
|
type=$("#optiontype"+code).val();
|
||
|
parameters=$("#optionparameters"+code).val();
|
||
|
|
||
|
tboptions[roworder]=[];
|
||
|
tboptions[roworder]["id"]=id;
|
||
|
tboptions[roworder]["code"]=code;
|
||
|
tboptions[roworder]["roworder"]=roworder;
|
||
|
tboptions[roworder]["name"]=name;
|
||
|
tboptions[roworder]["required"]=required;
|
||
|
tboptions[roworder]["type"]=type;
|
||
|
tboptions[roworder]["parameters"]=parameters;
|
||
|
});
|
||
|
|
||
|
// On recalcul la chaine json
|
||
|
options="";
|
||
|
for (const [key, option] of Object.entries(tboptions)) {
|
||
|
if(options!="") options+=',';
|
||
|
if(options=="") options='[';
|
||
|
options+='{ "id":"'+option["id"]+'", "code":"'+option["code"]+'", "roworder":"'+option["roworder"]+'", "name":"'+option["name"]+'", "required":"'+option["required"]+'", "type":"'+option["type"]+'", "parameters":"'+option["parameters"]+'"}';
|
||
|
}
|
||
|
if(options!="") options+=']';
|
||
|
if(options=="") options="[]";
|
||
|
var ordered = JSON.parse(options);
|
||
|
|
||
|
// Valoriser le formulaire
|
||
|
$("#questoptions_jsonquestoptions").val(JSON.stringify(ordered));
|
||
|
|
||
|
//event.preventDefault();
|
||
|
});
|
||
|
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- ETAPE 03 = Guests ------------------------------------------------------------------------------------------------------------------------------------------ -->
|
||
|
{% if flow.getCurrentStepNumber() == 3 %}
|
||
|
|
||
|
|
||
|
$(document).ready(function() {
|
||
|
if ("{{ quest.private }}"=="1"){
|
||
|
$("#gueststools").show();
|
||
|
|
||
|
var tbmails = JSON.parse($("#questguests_jsonquestguests").val());
|
||
|
var toshow=false;
|
||
|
tbmails.forEach(function(mail) {
|
||
|
addGuest(mail);
|
||
|
toshow=true;
|
||
|
});
|
||
|
if(toshow) $("#guests").show();
|
||
|
}
|
||
|
else {
|
||
|
$("#gueststools").hide();
|
||
|
$("#guests").hide();
|
||
|
}
|
||
|
|
||
|
});
|
||
|
|
||
|
$('#questguests_user').on('select2:select', function (e) {
|
||
|
// récupérer l'id du user
|
||
|
id=$(this).val();
|
||
|
if(id) {
|
||
|
// Récupérer les infomations de l'utilisateur selectionné
|
||
|
$.ajax({
|
||
|
method: "POST",
|
||
|
url: "{{ path('app_user_info') }}",
|
||
|
data: "id="+id,
|
||
|
success: function(data, dataType)
|
||
|
{
|
||
|
addGuest(data.email)
|
||
|
},
|
||
|
});
|
||
|
|
||
|
$('#questguests_user').val(null).trigger('change');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
$('#questguests_group').on('select2:select', function (e) {
|
||
|
// récupérer l'id du group
|
||
|
id=$(this).val();
|
||
|
if(id) {
|
||
|
// Récupérer les infomations du groupe selectionné
|
||
|
$.ajax({
|
||
|
method: "POST",
|
||
|
url: "{{ path('app_group_info') }}",
|
||
|
data: "id="+id,
|
||
|
success: function(data, dataType)
|
||
|
{
|
||
|
users=data.users;
|
||
|
users.forEach(function(user) {
|
||
|
addGuest(user.email);
|
||
|
});
|
||
|
},
|
||
|
});
|
||
|
|
||
|
$('#questguests_group').val(null).trigger('change');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
function addGuest(email) {
|
||
|
if(!$('*[data-email="'+email+'"]').length) {
|
||
|
html ='';
|
||
|
html+='<div data-id="container-'+email+'" class="col-md-4">';
|
||
|
html+='<div class="form-group">';
|
||
|
html+='<input type="text" data-email="'+email+'" class="guest form-control" value="'+email+'">';
|
||
|
html+='<button onClick="delGuest(\''+email+'\')" type="button" class="btn guestdel" data-id="'+email+'" aria-hidden="true"><i class="fa fa-trash"></i></button>';
|
||
|
html+='</div>';
|
||
|
html+='</div>';
|
||
|
|
||
|
$("#guests .card-body .row").append(html);
|
||
|
$("#guests").show();
|
||
|
}
|
||
|
}
|
||
|
|
||
|
$( "#addGuestMail" ).click(function() {
|
||
|
lstmails=$("#guestmail").val();
|
||
|
tbmails =lstmails.split(",");
|
||
|
tbmails.forEach(function(mail) {
|
||
|
addGuest(mail);
|
||
|
});
|
||
|
});
|
||
|
|
||
|
function delGuest(id) {
|
||
|
$("[data-id='container-"+id+"']").remove();
|
||
|
}
|
||
|
|
||
|
$('#mycontent').on('click', '.btnnextstep', function(event) {
|
||
|
{% if quest.private %}
|
||
|
// Construction du tableau des horaires en fusionnant les potentiels doublons
|
||
|
var tbmails=[];
|
||
|
$(".guest").each(function() {
|
||
|
if($(this).val()!="") {
|
||
|
tbmails.push($(this).val());
|
||
|
}
|
||
|
});
|
||
|
tbmails.sort();
|
||
|
|
||
|
// Valoriser le formulaire
|
||
|
$("#questguests_jsonquestguests").val(JSON.stringify(tbmails));
|
||
|
{% endif %}
|
||
|
});
|
||
|
|
||
|
|
||
|
{% endif %}
|
||
|
|
||
|
<!-- ETAPE 04 = Récap ------------------------------------------------------------------------------------------------------------------------------------------- -->
|
||
|
|
||
|
{% if flow.getCurrentStepNumber() == 4 %}
|
||
|
$(document).ready(function() {
|
||
|
if ("{{ quest.private }}"=="1"){
|
||
|
var tbmails = JSON.parse($("#createQuest_jsonquestguests").val());
|
||
|
tbmails.forEach(function(mail,index) {
|
||
|
addRecapGuest(mail,index);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
var tboptions = JSON.parse($("#createQuest_jsonquestoptions").val());
|
||
|
|
||
|
html ='<h2>{{ quest.title }}</h2>';
|
||
|
html+='{{ quest.description|escape("js")}}';
|
||
|
$("#containeroptions").append(html);
|
||
|
tboptions.forEach(function(option,index) {
|
||
|
addRecapOption(option);
|
||
|
});
|
||
|
});
|
||
|
|
||
|
function addRecapGuest(mail,index) {
|
||
|
html ="";
|
||
|
if(index>0) html+="- ";
|
||
|
else html+="<br>LISTE DES INVITES<br>";
|
||
|
html+=mail+" ";
|
||
|
$("#containerguests").append(html);
|
||
|
}
|
||
|
|
||
|
function addRecapOption(option) {
|
||
|
html ="";
|
||
|
html+="<hr>";
|
||
|
html+="<strong>"+option.name;
|
||
|
if(option.required) html+=" *";
|
||
|
html+="</strong><br>";
|
||
|
|
||
|
switch(option.type) {
|
||
|
case "10":
|
||
|
html+='<select class="form-control">';
|
||
|
html+='<option disabled selected hidden><i>Veuillez sélectionner une valeur</i></option>';
|
||
|
html+='<option value="0">non</option>';
|
||
|
html+='<option value="1">oui</option>';
|
||
|
html+='</select>';
|
||
|
break;
|
||
|
case "20":
|
||
|
html+='<select class="form-control">';
|
||
|
html+='<option disabled selected hidden><i>Veuillez sélectionner une valeur</i></option>';
|
||
|
html+='<option value="0">non</option>';
|
||
|
html+='<option value="1">oui</option>';
|
||
|
html+='<option value="2">peut-être</option>';
|
||
|
html+='</select>';
|
||
|
break;
|
||
|
|
||
|
case "30":
|
||
|
html+='<select class="form-control">';
|
||
|
html+='<option disabled selected hidden><i>Veuillez sélectionner une valeur</i></option>';
|
||
|
html+='<option value="0">non</option>';
|
||
|
html+='<option value="1">oui</option>';
|
||
|
html+='<option value="2">en partie</option>';
|
||
|
html+='</select>';
|
||
|
break;
|
||
|
|
||
|
case "40":
|
||
|
html+='<select class="form-control">';
|
||
|
html+='<option disabled selected hidden><i>Veuillez sélectionner une valeur</i></option>';
|
||
|
html+='<option value="0">Très Satisfait</option>';
|
||
|
html+='<option value="1">Satisfait</option>';
|
||
|
html+='<option value="2">Peu Satisfait</option>';
|
||
|
html+='<option value="3">Insatisfait</option>';
|
||
|
html+='</select>';
|
||
|
break;
|
||
|
|
||
|
|
||
|
case "50":
|
||
|
html+='<select class="form-control">';
|
||
|
html+='<option disabled selected hidden><i>Veuillez sélectionner une valeur</i></option>';
|
||
|
html+='<option value="0">Très Satisfait</option>';
|
||
|
html+='<option value="1">Satisfait</option>';
|
||
|
html+='<option value="2">Peu Satisfait</option>';
|
||
|
html+='<option value="3">Insatisfait</option>';
|
||
|
html+='</select>';
|
||
|
html+='<textarea class="form-control" style="height:100px;"></textarea>';
|
||
|
break;
|
||
|
|
||
|
case "60":
|
||
|
html+='<i><small>note sur 5</small></i>';
|
||
|
html+='<input type="number" class="form-control" min="0" max="5">';
|
||
|
break;
|
||
|
|
||
|
case "70":
|
||
|
html+='<i><small>note sur 10</small></i>';
|
||
|
html+='<input type="number" class="form-control" min="0" max="10">';
|
||
|
break;
|
||
|
|
||
|
case "80":
|
||
|
html+='<i><small>note sur 20</small></i>';
|
||
|
html+='<input type="number" class="form-control" min="0" max="20">';
|
||
|
break;
|
||
|
|
||
|
case "90":
|
||
|
html+='<textarea class="form-control" style="height:100px;"></textarea>';
|
||
|
break;
|
||
|
|
||
|
case "100":
|
||
|
html+='<textarea class="form-control" style="height:300px;"></textarea>';
|
||
|
break;
|
||
|
|
||
|
case "110":
|
||
|
console.log(option.parameters);
|
||
|
tbparameters=option.parameters.split(';');
|
||
|
|
||
|
html+='<select class="form-control">';
|
||
|
html+='<option disabled selected hidden><i>Veuillez sélectionner une valeur</i></option>';
|
||
|
tbparameters.forEach(function(parameter,index) {
|
||
|
html+='<option value="'+parameter+'">'+parameter+'</option>';
|
||
|
});
|
||
|
break;
|
||
|
}
|
||
|
|
||
|
$("#containeroptions").append(html);
|
||
|
}
|
||
|
{% endif %}
|
||
|
|
||
|
{% endblock %}
|