maher/stat_partner
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Collapse

Browse Source
This commit is contained in:
maher
2026-01-03 16:02:34 +01:00
parent c7b5685f35
commit 1d2b4fbb6b
11 changed files with 817 additions and 446 deletions
Download Patch File Download Diff File Expand all files Collapse all files

525
templates/investigation/add-index.html.twig
View File

@@ -2,8 +2,6 @@
{% block title %}Enquête{% endblock %}
{% block content %}
{% set prototypeHtml %}
@@ -11,24 +9,29 @@
{% endset %}
<style>
.save-question {
position: fixed; right: 80px; top: 65%; width:215px;
position: fixed;
right: 80px;
top: 65%;
width: 215px;
}
.add-question {
position: fixed; right: 80px; top: 73%;
position: fixed;
right: 80px;
top: 73%;
}
.investigation-ready {
position: fixed; right: 80px; top: 81%; width:215px;
position: fixed;
right: 80px;
top: 81%;
width: 215px;
}
</style>
<!-- az-header -->
<div class="az-content">
<div class="container">
<div class="az-content-body d-flex flex-column">
<div class="az-content-breadcrumb">
<span>Enquête</span>
@@ -39,7 +42,6 @@
<div class="az-content-label mg-b-5"></div>
<p class="mg-b-20">Créer une nouvelle enquête</p>
{{ form_start(form) }}
<div class="tab-vertical mb-3" id="investigation-information">
<ul class="nav nav-tabs" id="myTab3" role="tablist">
@@ -88,298 +90,255 @@
</div>
<div id="questions-collection" data-prototype="{{ prototypeHtml|e('html_attr') }}" data-index="{{ form|length }}">
{% for formQuestion in form.questions %}
<div class="question-item">
<div class="row">
<div class="col-md-8">
<div class="card border-left border-primary">
<div class="card-body">
<div class="form-group row">
<div class="col-md-3">
<h5 class="card-title mb-5 question-number">Question N: {{ loop.index }}</h5>
</div>
<div class="col-md-3 offset-2">
<button type="button" class="btn btn-outline-secondary rounded-pill mb-3">
<i class="fa fa-eye"></i>Afficher
</button>
</div>
<div class="col-md-2 offset-2">
<button type="button" class="btn btn-danger remove-question mb-3 float-right">
<i class="fa fa-trash"></i>
</button>
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.title.vars.id }}">{{ form_label(formQuestion.title) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.title, {'attr': {'class': 'form-control', 'placeholder': 'Visible que pour la createur du question' }}) }}
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.name_en.vars.id }}">{{ form_label(formQuestion.name_en) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.name_en, {'attr': {'class': 'form-control', 'placeholder': 'Visible pour les participants' }}) }}
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.name_fr.vars.id }}">{{ form_label(formQuestion.name_fr) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.name_fr, {'attr': {'class': 'form-control', 'placeholder': 'Visible pour les participants' }}) }}
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.name_ar.vars.id }}">{{ form_label(formQuestion.name_ar) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.name_ar, {'attr': {'class': 'form-control', 'placeholder': 'Visible pour les participants' }}) }}
</div>
</div>
<div class="row mt-5">
<div class="col-md-6">
<div class="form-group col-sm-10">
<label for="{{ formQuestion.amount.vars.id }}">{{ form_label(formQuestion.amount) }}</label>
{{ form_widget(formQuestion.amount, {'attr': {'class': 'form-control' }}) }}
</div>
</div>
<div class="col-md-6">
<div class="form-group col-sm-10">
<label for="{{ formQuestion.max_participant.vars.id }}">{{ form_label(formQuestion.max_participant) }}</label>
{{ form_widget(formQuestion.max_participant, {'attr': {'class': 'form-control' }}) }}
</div>
</div>
</div>
<h4 class="card-title mt-4">Modalité</h4>
<div class="row mt-3">
<div class="col-md-6">
<div class="form-group ">
<label>{{ form_label(formQuestion.type_modality) }}</label>
{{ form_widget(formQuestion.type_modality, {'attr': {'class': 'form-control form-control-sm mb-3"' }}) }}
</div>
</div>
<div class="col-md-6 mt-4">
<div class="form-group">
{% for key,child in formQuestion.choice %}
<div class="custom-control-inline">
{{ form_widget(child) }}
</div>
{% endfor %}
</div>
</div>
</div>
{% set prototype %}
<div class="modality-item border rounded p-3 mt-3 mb-3">
{# EN #}
<div class="input-group mb-3">
<span class="input-group-text">EN</span>
{{ form_widget(formQuestion.modalitys.vars.prototype.name_en, {
attr: {
class: 'form-control',
placeholder: 'Nom (EN)'
}
}) }}
</div>
{{ form_errors(formQuestion.modalitys.vars.prototype.name_en) }}
{# FR #}
<div class="input-group mb-3">
<span class="input-group-text">FR</span>
{{ form_widget(formQuestion.modalitys.vars.prototype.name_fr, {
attr: {
class: 'form-control',
placeholder: 'Nom (FR)'
}
}) }}
</div>
{{ form_errors(formQuestion.modalitys.vars.prototype.name_fr) }}
{# AR #}
<div class="input-group mb-3">
<span class="input-group-text">AR</span>
{{ form_widget(formQuestion.modalitys.vars.prototype.name_ar, {
attr: {
class: 'form-control',
placeholder: 'الاسم (AR)',
dir: 'rtl'
}
}) }}
</div>
{{ form_errors(formQuestion.modalitys.vars.prototype.name_ar) }}
</div>
{% endset %}
{# modalities #}
<div class="row mt-4">
<div class="col-md-8">
<div id="modalities" data-prototype="{{ prototype|e('html_attr') }}">
{% for modality in formQuestion.modalitys %}
<div class="modality-item border rounded p-3 mb-3">
<div class="input-group mb-3">
<span class="input-group-text">EN</span>
{{ form_widget(modality.name_en, {
attr: { class: 'form-control', placeholder: 'Nom (EN)' }
}) }}
</div>
{{ form_errors(modality.name_en) }}
<div class="input-group mb-3">
<span class="input-group-text">FR</span>
{{ form_widget(modality.name_fr, {
attr: { class: 'form-control', placeholder: 'Nom (FR)' }
}) }}
</div>
{{ form_errors(modality.name_fr) }}
<div class="input-group mb-3">
<span class="input-group-text">AR</span>
{{ form_widget(modality.name_ar, {
attr: {
class: 'form-control',
placeholder: 'الاسم (AR)',
dir: 'rtl'
}
}) }}
</div>
{{ form_errors(modality.name_ar) }}
<button type="button" class="remove-modality btn btn-danger btn-sm"> Supprimer </button>
</div>
{% endfor %}
{% for formQuestion in form.questions %}
<div class="question-item">
<div class="row">
<div class="col-md-8">
<div id="accordion">
<div class="card border-top border-primary">
<div class="card-header" id="heading-{{ loop.index }}" data-toggle="collapse" data-target="#collapse-{{ loop.index }}" aria-expanded="true" aria-controls="collapse-{{ loop.index }}">
<div class="d-flex align-items-center">
<div style="flex: 1;">
<h5 class="card-title mb-1">Question N: {{ loop.index }}</h5>
<p class="card-text mb-1">{{ formQuestion.title.vars.value }}</p>
</div>
<i class="fas fa-chevron-down arrow"></i>
</div>
</div>
<div id="collapse-{{ loop.index }}" class="collapse {% if app.request.attributes.get('_route') == 'app_investigation_add' %} show {% endif %}" aria-labelledby="heading-{{ loop.index }}" data-parent="#accordion">
<div class="collapse-content">
<div class="card-body">
<div class="form-group row">
<div class="col-md-3">
<button type="button" class="btn btn-outline-secondary rounded-pill mb-3">
<i class="fa fa-eye"></i> Afficher
</button>
</div>
<div class="col-md-2 offset-7">
<button type="button" class="btn btn-danger remove-question mb-3 float-right">
<i class="fa fa-trash"></i>
</button>
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.title.vars.id }}">{{ form_label(formQuestion.title) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.title, {'attr': {'class': 'form-control', 'placeholder': 'Visible que pour la createur du question' }}) }}
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.name_en.vars.id }}">{{ form_label(formQuestion.name_en) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.name_en, {'attr': {'class': 'form-control', 'placeholder': 'Visible pour les participants' }}) }}
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.name_fr.vars.id }}">{{ form_label(formQuestion.name_fr) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.name_fr, {'attr': {'class': 'form-control', 'placeholder': 'Visible pour les participants' }}) }}
</div>
</div>
<div class="form-group row">
<label class="control-label col-sm-2 align-self-center mb-0" for="{{ formQuestion.name_ar.vars.id }}">{{ form_label(formQuestion.name_ar) }}:</label>
<div class="col-sm-8">
{{ form_widget(formQuestion.name_ar, {'attr': {'class': 'form-control', 'placeholder': 'Visible pour les participants' }}) }}
</div>
</div>
<div class="row mt-5">
<div class="col-md-6">
<div class="form-group col-sm-10">
<label for="{{ formQuestion.amount.vars.id }}">{{ form_label(formQuestion.amount) }}</label>
{{ form_widget(formQuestion.amount, {'attr': {'class': 'form-control' }}) }}
</div>
</div>
<div class="col-md-6">
<div class="form-group col-sm-10">
<label for="{{ formQuestion.max_participant.vars.id }}">{{ form_label(formQuestion.max_participant) }}</label>
{{ form_widget(formQuestion.max_participant, {'attr': {'class': 'form-control' }}) }}
</div>
</div>
</div>
<div class="col-md-4">
<button type="button" id="add-modality" class="btn btn-primary">Ajouter une modalité</button>
<h4 class="card-title mt-4">Modalité</h4>
<div class="row mt-3">
<div class="col-md-6">
<div class="form-group ">
<label>{{ form_label(formQuestion.type_modality) }}</label>
{{ form_widget(formQuestion.type_modality, {'attr': {'class': 'form-control form-control-sm mb-3' }}) }}
</div>
</div>
<div class="col-md-6 mt-4">
<div class="form-group">
{% for key, child in formQuestion.choice %}
<div class="custom-control-inline">
{{ form_widget(child) }}
</div>
{% endfor %}
</div>
</div>
</div>
{% set prototype %}
<div class="modality-item border rounded p-3 mt-3 mb-3">
<div class="input-group mb-3">
<span class="input-group-text">EN</span>
{{ form_widget(formQuestion.modalitys.vars.prototype.name_en, {
attr: { class: 'form-control', placeholder: 'Nom (EN)' }
}) }}
</div>
{{ form_errors(formQuestion.modalitys.vars.prototype.name_en) }}
<div class="input-group mb-3">
<span class="input-group-text">FR</span>
{{ form_widget(formQuestion.modalitys.vars.prototype.name_fr, {
attr: { class: 'form-control', placeholder: 'Nom (FR)' }
}) }}
</div>
{{ form_errors(formQuestion.modalitys.vars.prototype.name_fr) }}
<div class="input-group mb-3">
<span class="input-group-text">AR</span>
{{ form_widget(formQuestion.modalitys.vars.prototype.name_ar, {
attr: { class: 'form-control', placeholder: 'الاسم (AR)', dir: 'rtl' }
}) }}
</div>
{{ form_errors(formQuestion.modalitys.vars.prototype.name_ar) }}
</div>
{% endset %}
<div class="row mt-4">
<div class="col-md-8">
<div class="modalities-container" data-prototype="{{ prototype|e('html_attr') }}">
{% for modality in formQuestion.modalitys %}
<div class="modality-item border rounded p-3 mb-3">
<div class="input-group mb-3">
<span class="input-group-text">EN</span>
{{ form_widget(modality.name_en, {
attr: { class: 'form-control', placeholder: 'Nom (EN)' }
}) }}
</div>
{{ form_errors(modality.name_en) }}
<div class="input-group mb-3">
<span class="input-group-text">FR</span>
{{ form_widget(modality.name_fr, {
attr: { class: 'form-control', placeholder: 'Nom (FR)' }
}) }}
</div>
{{ form_errors(modality.name_fr) }}
<div class="input-group mb-3">
<span class="input-group-text">AR</span>
{{ form_widget(modality.name_ar, {
attr: { class: 'form-control', placeholder: 'الاسم (AR)', dir: 'rtl' }
}) }}
</div>
{{ form_errors(modality.name_ar) }}
<button type="button" class="remove-modality btn btn-danger btn-sm"> Supprimer </button>
</div>
{% endfor %}
</div>
</div>
<div class="col-md-4">
<button type="button" class="btn btn-primary add-modality">Ajouter une modalité</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3"></div>
</div>
</div>
<div class="col-md-3"></div>
</div>
{% endfor %}
</div>
{% endfor %}
</div>
<button type="button" class="btn btn-info rounded-pill add-question">
<i class="typcn typcn-folder"></i>
Ajouter un autre question
</button>
{{ form_row(form.save, {'attr': {'class': 'btn btn-success rounded-pill save-question' }}) }}
{{ form_end(form) }}
{% if app.request.attributes.get('_route') == 'app_investigation_edit' %}
<a href="{{ path('app_investigation_ready', {id: investigation.id}) }}" class="btn btn-secondary rounded-pill investigation-ready">
Enquête Prête
</a>
{% endif %}
<button type="button" class="btn btn-info rounded-pill add-question">
<i class="typcn typcn-folder"></i>
Ajouter un autre question
</button>
{{ form_row(form.save, {'attr': {'class': 'btn btn-success rounded-pill save-question' }}) }}
{{ form_end(form) }}
{% if app.request.attributes.get('_route') == 'app_investigation_edit' %}
<a href="{{ path('app_investigation_ready', {id: investigation.id}) }}" class="btn btn-secondary rounded-pill investigation-ready">
Enquête Prête
</a>
{% endif %}
</div>
</div>
</div>
{% block javascripts %}
<script type="text/javascript">
$(document).ready(function() {
var $collection = $('#questions-collection');
var $addButton = $('.add-question');
// Compter les questions existantes
$collection.data('index', $collection.find('.question-item').length);
$addButton.on('click', function() {
var index = $collection.data('index');
<script type="text/javascript">
$(document).ready(function() {
var $collection = $('#questions-collection');
var $addButton = $('.add-question');
var prototype = $collection.data('prototype');
$collection.data('index', $collection.find('.question-item').length);
var newForm = prototype.replace(/__name__/g, index);
var $newElement = $('<div class="row question-item"></div>');
$newElement.append(newForm);
$collection.append($newElement);
// Mettre à jour l'index
$collection.data('index', index + 1);
// Afficher les boutons supprimer
$('.remove-question').show();
updateIndexes();
$("html, body").animate({
scrollTop: $(window).scrollTop() + 700
}, 400);
});
// Suppression des questions
$collection.on('click', '.remove-question', function() {
console.log($('.question-item').length);
if ($('.question-item').length > 1) {
$(this).closest('.question-item').remove();
console.log($(this).closest('.question-item').remove());
updateIndexes();
$addButton.on('click', function() {
var index = $collection.data('index');
var prototype = $collection.data('prototype');
var newForm = prototype.replace(/__name__/g, index + 1);
var $newElement = $('<div class="row question-item"></div>');
// Cacher le bouton supprimer s'il ne reste qu'une question
if ($('.question-item').length === 1) {
$('.remove-question').hide();
}
}
});
function updateIndexes() {
$('.question-item').each(function(index) {
$(this).find('h5').text('Question N: ' + (index + 1));
$newElement.append(newForm);
$collection.append($newElement);
$collection.data('index', index + 1);
$('.remove-question').show();
updateIndexes();
$("html, body").animate({
scrollTop: $(window).scrollTop() + 700
}, 400);
});
}
//modalities add-modality
const container = document.getElementById('modalities');
const addButton = document.getElementById('add-modality');
let index = container.children.length;
addButton.addEventListener('click', () => {
const prototype = container.dataset.prototype;
const html = prototype.replace(/__name__/g, index);
index++;
const div = document.createElement('div');
div.classList.add('modality-item');
div.innerHTML = html +
'<button type="button" class="remove-modality btn btn-danger">Supprimer</button>';
container.appendChild(div);
});
container.addEventListener('click', (e) => {
if (e.target.classList.contains('remove-modality')) {
e.target.closest('.modality-item').remove();
$collection.on('click', '.remove-question', function() {
if ($('.question-item').length > 1) {
$(this).closest('.question-item').remove();
updateIndexes();
if ($('.question-item').length === 1) {
$('.remove-question').hide();
}
}
});
function updateIndexes() {
$('.question-item').each(function(index) {
$(this).find('h5').text('Question N: ' + (index + 1));
});
}
$(document).on('click', '.add-modality', function() {
var $container = $(this).closest('.row').find('.modalities-container');
var index = $container.find('.modality-item').length;
var prototype = $container.data('prototype');
var newForm = prototype.replace(/__name__/g, index);
var $newElement = $('<div class="modality-item border rounded p-3 mb-3"></div>').append(newForm);
if (!$newElement.find('.remove-modality').length) {
$newElement.append('<button type="button" class="remove-modality btn btn-danger btn-sm mt-2">Supprimer</button>');
}
$container.append($newElement);
});
$(document).on('click', '.remove-modality', function() {
$(this).closest('.modality-item').remove();
});
});
</script>
{% endblock %}
});
</script>
{% endblock %}
{% endblock %}
{% endblock %}