Tables recap: front: boutons vis cols
This commit is contained in:
parent
27d7a36556
commit
cd1efba06a
@ -3992,6 +3992,29 @@ div.table_recap {
|
|||||||
margin-top: 6px;
|
margin-top: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.table_recap .but_on {
|
||||||
|
background-color: rgb(177, 238, 162);
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_recap .but_off {
|
||||||
|
background-color: lightgray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_recap button.but_on:hover:not(.disabled),
|
||||||
|
.table_recap div.but_on:hover:not(.disabled),
|
||||||
|
.table_recap a.but_on:hover:not(.disabled),
|
||||||
|
.table_recap input.but_on:hover:not(.disabled) {
|
||||||
|
background: linear-gradient(to bottom, lightgray 0%, rgb(51, 255, 0) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_recap button.but_off:hover:not(.disabled),
|
||||||
|
.table_recap div.but_off:hover:not(.disabled),
|
||||||
|
.table_recap a.but_off:hover:not(.disabled),
|
||||||
|
.table_recap input.but_off:hover:not(.disabled) {
|
||||||
|
background: linear-gradient(to bottom, rgb(51, 255, 0) 0%, lightgray 100%);
|
||||||
|
}
|
||||||
|
|
||||||
div.table_recap table.table_recap {
|
div.table_recap table.table_recap {
|
||||||
width: auto;
|
width: auto;
|
||||||
/* font-family: Consolas, monaco, monospace; */
|
/* font-family: Consolas, monaco, monospace; */
|
||||||
|
@ -32,146 +32,141 @@ $(function () {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Les colonnes visibles étant mémorisées, il faut initialiser les titres des boutons
|
// Les colonnes visibles sont mémorisées, il faut initialiser l'état des boutons
|
||||||
function update_buttons_labels(dt) {
|
function update_buttons_labels(dt) {
|
||||||
console.log("update_buttons_labels");
|
// chaque bouton controle une classe stockée dans le data-group du span
|
||||||
dt.buttons('toggle_ident:name').text(dt.columns(".identite_detail").visible()[0] ? "Nom seul" : "Civ/Nom/Prénom");
|
document.querySelectorAll("button.dt-button").forEach(but => {
|
||||||
dt.buttons('toggle_partitions:name').text(dt.columns(".partition_aux").visible()[0] ? "Cacher les groupes" : "Montrer groupes");
|
let g_span = but.querySelector("span > span");
|
||||||
if (!$('table.table_recap').hasClass("table_jury_but")) {
|
if (g_span) {
|
||||||
// Bouton "rangs groupes", sauf pour table jury BUT
|
let group = g_span.dataset["group"];
|
||||||
dt.buttons('toggle_partitions_rangs:name').text(dt.columns(".partition_rangs").visible()[0] ? "Cacher rangs groupes" : "Rangs groupes");
|
if (group) {
|
||||||
dt.buttons('toggle_admission:name').text(dt.columns(".admission").visible()[0] ? "Cacher infos admission" : "Montrer infos admission");
|
// si le group (= la 1ere col.) est visible, but_on
|
||||||
} else {
|
if (dt.columns("." + group).visible()[0]) {
|
||||||
// table jury BUT: avec ou sans codes enregistrés
|
but.classList.add("but_on");
|
||||||
dt.buttons('toggle_recorded_code:name').text(dt.columns(".recorded_code").visible()[0] ? "Cacher codes jury" : "Code jury enregistrés");
|
but.classList.remove("but_off");
|
||||||
}
|
} else {
|
||||||
|
but.classList.add("but_off");
|
||||||
// Boutons non visibles en mode jury:
|
but.classList.remove("but_on");
|
||||||
if (!$('table.table_recap').hasClass("jury")) {
|
}
|
||||||
// Ces boutons dépendent du mode BUT ou classique:
|
}
|
||||||
if ($('table.table_recap').hasClass("apc")) {
|
|
||||||
dt.buttons('toggle_res:name').text(dt.columns(".col_res").visible()[0] ? "Cacher les ressources" : "Montrer les ressources");
|
|
||||||
dt.buttons('toggle_sae:name').text(dt.columns(".col_sae").visible()[0] ? "Cacher les SAÉs" : "Montrer les SAÉs");
|
|
||||||
} else {
|
|
||||||
dt.buttons('toggle_mod:name').text(dt.columns(".col_mod:not(.col_empty)").visible()[0] ? "Cacher les modules" : "Montrer les modules");
|
|
||||||
}
|
}
|
||||||
dt.buttons('toggle_col_empty:name').text(dt.columns(".col_empty").visible()[0] ? "Cacher mod. vides" : "Montrer mod. vides");
|
});
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Changement visibilité groupes colonnes (boutons)
|
||||||
|
function toggle_col_but_visibility(e, dt, node, config) {
|
||||||
|
let group = node.children()[0].firstChild.dataset.group;
|
||||||
|
toggle_col_group_visibility(dt, group, node.hasClass("but_on"));
|
||||||
|
}
|
||||||
|
function toggle_col_ident_visibility(e, dt, node, config) {
|
||||||
|
let onoff = node.hasClass("but_on");
|
||||||
|
toggle_col_group_visibility(dt, "identite_detail", onoff);
|
||||||
|
toggle_col_group_visibility(dt, "identite_court", !onoff);
|
||||||
|
}
|
||||||
|
function toggle_col_ressources_visibility(e, dt, node, config) {
|
||||||
|
let onoff = node.hasClass("but_on");
|
||||||
|
toggle_col_group_visibility(dt, "col_res", onoff);
|
||||||
|
toggle_col_group_visibility(dt, "col_ue_bonus", onoff);
|
||||||
|
toggle_col_group_visibility(dt, "col_malus", onoff);
|
||||||
|
}
|
||||||
|
function toggle_col_group_visibility(dt, group, onoff) {
|
||||||
|
if (onoff) {
|
||||||
|
dt.columns('.' + group).visible(false);
|
||||||
|
} else {
|
||||||
|
dt.columns('.' + group).visible(true);
|
||||||
|
}
|
||||||
|
update_buttons_labels(dt);
|
||||||
|
}
|
||||||
|
// Definition des boutons au dessus de la table:
|
||||||
let buttons = [
|
let buttons = [
|
||||||
{
|
{
|
||||||
name: "toggle_ident",
|
extend: 'copyHtml5',
|
||||||
text: "Civ/Nom/Prénom",
|
text: 'Copier',
|
||||||
|
exportOptions: { orthogonal: 'export' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
extend: 'excelHtml5',
|
||||||
|
// footer: true, // ne fonctionne pas ?
|
||||||
|
exportOptions: { orthogonal: 'export' },
|
||||||
|
title: document.querySelector('table.table_recap').dataset.filename
|
||||||
|
},
|
||||||
|
{
|
||||||
|
// force affichage de toutes les colonnes
|
||||||
|
text: '<a title="Afficher toutes les colonnes">✴</a>',
|
||||||
action: function (e, dt, node, config) {
|
action: function (e, dt, node, config) {
|
||||||
let visible = dt.columns(".identite_detail").visible()[0];
|
dt.columns().visible(true);
|
||||||
dt.columns(".identite_detail").visible(!visible);
|
|
||||||
dt.columns(".identite_court").visible(visible);
|
|
||||||
update_buttons_labels(dt);
|
update_buttons_labels(dt);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "toggle_partitions",
|
text: '<a title="Rétablir l\'affichage par défaut">➗</a>',
|
||||||
text: "Montrer groupes",
|
|
||||||
action: function (e, dt, node, config) {
|
action: function (e, dt, node, config) {
|
||||||
let visible = dt.columns(".partition_aux").visible()[0];
|
localStorage.clear();
|
||||||
dt.columns(".partition_aux").visible(!visible);
|
console.log("cleared localStorage");
|
||||||
update_buttons_labels(dt);
|
location.reload();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
];
|
{
|
||||||
// Bouton "rangs groupes", sauf pour table jury BUT
|
text: '<span data-group="identite_detail">Civilité</span>',
|
||||||
if (!$('table.table_recap').hasClass("table_jury_but")) {
|
action: toggle_col_ident_visibility,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '<span data-group="partition_aux">Groupes</span>',
|
||||||
|
action: toggle_col_but_visibility,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '<span data-group="partition_rangs">Rg</span>',
|
||||||
|
action: toggle_col_but_visibility,
|
||||||
|
},
|
||||||
|
]; // fin des boutons communs à toutes les tables recap
|
||||||
|
|
||||||
|
if ($('table.table_recap').hasClass("jury")) {
|
||||||
|
// table jury: avec ou sans codes enregistrés
|
||||||
buttons.push(
|
buttons.push(
|
||||||
{
|
{
|
||||||
name: "toggle_partitions_rangs",
|
text: '<span data-group="recorded_code">Code jurys</span>',
|
||||||
text: "Rangs groupes",
|
action: toggle_col_but_visibility,
|
||||||
action: function (e, dt, node, config) {
|
|
||||||
let rangs_visible = dt.columns(".partition_rangs").visible()[0];
|
|
||||||
dt.columns(".partition_rangs").visible(!rangs_visible);
|
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
// table jury BUT: avec ou sans codes enregistrés
|
// BOUTONS SPECIFIQUES A LA TABLE RECAP NON JURY
|
||||||
buttons.push(
|
|
||||||
{
|
|
||||||
name: "toggle_recorded_code",
|
|
||||||
text: "Code jury enregistrés",
|
|
||||||
action: function (e, dt, node, config) {
|
|
||||||
let visible = dt.columns(".recorded_code").visible()[0];
|
|
||||||
dt.columns(".recorded_code").visible(!visible);
|
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!$('table.table_recap').hasClass("jury")) {
|
|
||||||
buttons.push(
|
buttons.push(
|
||||||
$('table.table_recap').hasClass("apc") ?
|
$('table.table_recap').hasClass("apc") ?
|
||||||
{
|
{
|
||||||
name: "toggle_res",
|
text: '<span data-group="col_res">Ressources</span>',
|
||||||
text: "Visibilité ressources",
|
action: toggle_col_ressources_visibility,
|
||||||
action: function (e, dt, node, config) {
|
|
||||||
let visible = dt.columns(".col_res").visible()[0];
|
|
||||||
dt.columns(".col_res").visible(!visible);
|
|
||||||
dt.columns(".col_ue_bonus").visible(!visible);
|
|
||||||
dt.columns(".col_malus").visible(!visible);
|
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
|
||||||
} : {
|
} : {
|
||||||
name: "toggle_mod",
|
name: "toggle_mod",
|
||||||
text: "Cacher les modules",
|
text: "Cacher les modules",
|
||||||
action: function (e, dt, node, config) {
|
action: function (e, dt, node, config) {
|
||||||
let visible = dt.columns(".col_mod:not(.col_empty)").visible()[0];
|
let onoff = node.hasClass("but_on");
|
||||||
dt.columns(".col_mod:not(.col_empty)").visible(!visible);
|
toggle_col_group_visibility(dt, "col_mod:not(.col_empty)", onoff);
|
||||||
dt.columns(".col_ue_bonus").visible(!visible);
|
toggle_col_group_visibility(dt, "col_ue_bonus", onoff);
|
||||||
dt.columns(".col_malus").visible(!visible);
|
toggle_col_group_visibility(dt, "col_malus", onoff);
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
if ($('table.table_recap').hasClass("apc")) {
|
if ($('table.table_recap').hasClass("apc")) {
|
||||||
buttons.push({
|
buttons.push({
|
||||||
name: "toggle_sae",
|
text: '<span data-group="col_sae">SAÉs</span>',
|
||||||
text: "Visibilité SAÉs",
|
action: toggle_col_but_visibility,
|
||||||
action: function (e, dt, node, config) {
|
});
|
||||||
let visible = dt.columns(".col_sae").visible()[0];
|
|
||||||
dt.columns(".col_sae").visible(!visible);
|
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
buttons.push({
|
buttons.push({ // modules vides
|
||||||
name: "toggle_col_empty",
|
text: '<span data-group="col_empty">Vides</span>',
|
||||||
text: "Visibilité mod. vides",
|
action: toggle_col_but_visibility,
|
||||||
action: function (e, dt, node, config) {
|
|
||||||
let visible = dt.columns(".col_empty").visible()[0];
|
|
||||||
dt.columns(".col_empty").visible(!visible);
|
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
// Boutons admission, sauf pour table jury BUT
|
|
||||||
if (!$('table.table_recap').hasClass("table_jury_but")) {
|
|
||||||
buttons.push({
|
|
||||||
name: "toggle_admission",
|
|
||||||
text: "Montrer infos admission",
|
|
||||||
action: function (e, dt, node, config) {
|
|
||||||
let visible = dt.columns(".admission").visible()[0];
|
|
||||||
dt.columns(".admission").visible(!visible);
|
|
||||||
update_buttons_labels(dt);
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
// Boutons admission (pas en jury)
|
||||||
buttons.push({
|
if (!$('table.table_recap').hasClass("jury")) {
|
||||||
name: "reset_table_display",
|
buttons.push(
|
||||||
text: "Rétablir affichage par défaut",
|
{
|
||||||
action: function (e, dt, node, config) {
|
text: '<span data-group="admission">Admission</span>',
|
||||||
localStorage.clear();
|
action: toggle_col_but_visibility,
|
||||||
location.reload();
|
}
|
||||||
|
);
|
||||||
}
|
}
|
||||||
});
|
}
|
||||||
|
|
||||||
|
// ------------- LA TABLE ---------
|
||||||
try {
|
try {
|
||||||
let table = $('table.table_recap').DataTable(
|
let table = $('table.table_recap').DataTable(
|
||||||
{
|
{
|
||||||
@ -217,25 +212,7 @@ $(function () {
|
|||||||
|
|
||||||
],
|
],
|
||||||
dom: 'Bfrtip',
|
dom: 'Bfrtip',
|
||||||
buttons: [
|
buttons: buttons,
|
||||||
{
|
|
||||||
extend: 'copyHtml5',
|
|
||||||
text: 'Copier',
|
|
||||||
exportOptions: { orthogonal: 'export' }
|
|
||||||
},
|
|
||||||
{
|
|
||||||
extend: 'excelHtml5',
|
|
||||||
// footer: true, // ne fonctionne pas ?
|
|
||||||
exportOptions: { orthogonal: 'export' },
|
|
||||||
title: document.querySelector('table.table_recap').dataset.filename
|
|
||||||
},
|
|
||||||
{
|
|
||||||
extend: 'collection',
|
|
||||||
text: 'Colonnes affichées',
|
|
||||||
autoClose: true,
|
|
||||||
buttons: buttons,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
"drawCallback": function (settings) {
|
"drawCallback": function (settings) {
|
||||||
// permet de conserver l'ordre de tri des colonnes
|
// permet de conserver l'ordre de tri des colonnes
|
||||||
let order_info = JSON.stringify($('table.table_recap').DataTable().order());
|
let order_info = JSON.stringify($('table.table_recap').DataTable().order());
|
||||||
|
@ -82,6 +82,7 @@ class TableRecap(tb.Table):
|
|||||||
if res.formsemestre.etuds_inscriptions: # table non vide
|
if res.formsemestre.etuds_inscriptions: # table non vide
|
||||||
# Fixe l'ordre des groupes de colonnes communs:
|
# Fixe l'ordre des groupes de colonnes communs:
|
||||||
groups = [
|
groups = [
|
||||||
|
"etud_codes",
|
||||||
"rang",
|
"rang",
|
||||||
"identite_court",
|
"identite_court",
|
||||||
"identite_detail",
|
"identite_detail",
|
||||||
|
Loading…
Reference in New Issue
Block a user