This commit is contained in:
2025-07-27 16:22:54 +02:00
parent 4378f06c05
commit 8127d6e830
12 changed files with 1116 additions and 46 deletions

View File

@ -4,6 +4,7 @@
<style>
.card-body div {
display:flex;
align-items: center;
}
.card-body div label {
@ -16,7 +17,15 @@
{{ form_start(form) }}
{{ form_widget(form.submit) }}
<div class="d-flex justify-content-between align-items-center mb-3">
<div>
{{ form_widget(form.submit) }}
</div>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="expertSwitch">
<label class="form-check-label ms-2" for="expertSwitch">Mode Expert</label>
</div>
</div>
<div class="row">
{% for section in dicos %}
@ -39,12 +48,19 @@
{% block localscript %}
<script>
let isExpert=false;
function toggleExpertMode(isExpertMode) {
localStorage.setItem('expertMode', isExpertMode ? '1' : '0');
isExpert=isExpertMode;
refreshHideShow();
}
function moveToSection() {
$('[data-section]').each(function() {
inputLabel = $(this).parent();
section = $(this).data('section');
inputLabel.appendTo('#'+section);
console.log('Section trouvée:', section);
});
$('label.required').each(function () {
@ -55,6 +71,69 @@
});
}
function addResetButtons() {
$('input, select, textarea').each(function () {
const $input = $(this);
const defaultValue = $input.data('default');
// Créer le bouton seulement si une valeur par défaut existe
if (typeof defaultValue !== 'undefined') {
const $wrapper = $input.closest('div');
// Évite les doublons
if ($wrapper.find('.reset-btn').length === 0) {
const $resetBtn = $(`
<button type="button" class="btn btn-sm btn-secondary ms-2 reset-btn" title="Réinitialiser">
<i class="fas fa-rotate-left"></i>
</button>
`);
$resetBtn.on('click', function () {
if ($input.is(':checkbox')) {
$input.prop('checked', defaultValue == 1 || defaultValue === 'true');
} else {
$input.val(defaultValue).trigger('change');
}
updateResetButtonStyle($input, $resetBtn); // maj couleur après reset
});
$wrapper.append($resetBtn);
}
// Appliquer couleur initiale
const $resetBtn = $wrapper.find('.reset-btn');
updateResetButtonStyle($input, $resetBtn);
}
});
}
function updateResetButtonStyle($input, $btn) {
const currentVal = $input.is(':checkbox') ? $input.is(':checked') : $input.val();
const defaultVal = $input.data('default');
let isChanged = false;
if ($input.is(':checkbox')) {
isChanged = (defaultVal == '1' || defaultVal === true || defaultVal === 'true') !== $input.is(':checked');
} else {
isChanged = currentVal != defaultVal;
}
if (isChanged) {
$btn.removeClass('btn-secondary').addClass('btn-success');
} else {
$btn.removeClass('btn-success').addClass('btn-secondary');
}
}
function watchInputsForResetState() {
$('input[data-default], select[data-default], textarea[data-default]').on('input change', function () {
console.log("here");
const $input = $(this);
const $btn = $input.closest('div').find('.reset-btn');
updateResetButtonStyle($input, $btn);
});
}
function cardHideShow() {
$('.card-body').each(function () {
const $cardBody = $(this);
@ -68,49 +147,78 @@
});
}
function refreshHideShow() {
$('.slave').each(function() {
slave = $(this);
slaveId = slave.attr('id');
const isExpert = localStorage.getItem('expertMode') === '1';
// Déterminer si le champs est required
isrequired = $('label[for="' + slaveId + '"]').hasClass('required');
console.log(slaveId);
console.log(isrequired);
// Afficher / Masquer les slaves
$('.slave').each(function () {
const $slave = $(this);
const slaveConditions = $slave.data('slave'); // ex: "foo=1&&bar=SQL"
const isExpertField = $slave.data('expert');
const $wrapper = $slave.closest('div');
let toShow = true;
// Rechercher son maitre
masterArray = slave.data('slave').split("=");
master = $('[data-master="'+masterArray[0]+'"]')
// 1. Évaluer les conditions de dépendance
if (slaveConditions) {
const conditions = slaveConditions.split('&&');
// Déterminer si le slave doit etre afficher
toshow=false;
if(master.is(':visible')&&master.val()===masterArray[1]) {
toshow=true;
for (const cond of conditions) {
const [masterKey, expectedValue] = cond.split('=');
const $master = $('[data-master="' + masterKey + '"]');
if (!($master.length && $master.is(':visible') && $master.val() == expectedValue)) {
toShow = false;
break;
}
}
}
if(toshow) {
slave.parent().show();
}
else {
slave.parent().hide();
// 2. Appliquer l'affichage
if (toShow) {
$wrapper.show();
} else {
$wrapper.hide();
}
});
cardHideShow();
// Afficher / Masquer Mode expert
$('[data-expert]').each(function () {
const $el = $(this);
const isExpertField = $el.data('expert');
const $wrapper = $el.closest('div');
if (isExpertField && !isExpert) {
$wrapper.hide();
} else {
$wrapper.show();
}
});
cardHideShow();
}
$(document).ready(function() {
isExpert = localStorage.getItem('expertMode') === '1';
$('#expertSwitch').prop('checked', isExpert);
toggleExpertMode(isExpert);
$('#expertSwitch').on('change', function() {
toggleExpertMode(this.checked);
});
$('.master').on('change', function () {
console.log($(this).val());
refreshHideShow();
});
moveToSection();
moveToSection();
addResetButtons();
watchInputsForResetState();
refreshHideShow();
});
</script>
{% endblock %}