cleo/ScoDoc-PE
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases Wiki Activity

Amélioration front éditeur partitions

Browse Source
This commit is contained in:
Emmanuel Viennet 2023-02-22 14:27:11 +01:00
parent c8801f6ee0
commit 1f2b108c18
5 changed files with 103 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
app/static/css/partition_editor.css
View File

@ -19,20 +19,6 @@ html {
} }
} }
.message_curtom {
position: fixed;
bottom: 100%;
left: 50%;
z-index: 10;
padding: 20px;
border-radius: 0 0 10px 10px;
background: #90c;
color: #FFF;
font-size: 24px;
animation: message 3s;
transform: translate(-50%, 0);
}
@keyframes message { @keyframes message {
20%, 20%,
@ -79,7 +65,7 @@ main {
margin-right: 16px; margin-right: 16px;
padding: 8px; padding: 8px;
border-radius: 12px; border-radius: 12px;
background: #424242; background: #717171;
} }
main h2 { main h2 {
@ -93,7 +79,7 @@ main h3 {
} }
section { section {
background: #fff; background: #dbccb8;
padding: 8px; padding: 8px;
border-radius: 8px; border-radius: 8px;
} }
@ -275,16 +261,19 @@ body.editionActivated .filtres>div>div>div>div {
width: fit-content; width: fit-content;
} }
#zonePartitions h3{ #zonePartitions h3 {
display: flex; display: flex;
} }
#zonePartitions h3 .onoff{
#zonePartitions h3 .onoff {
margin-left: auto; margin-left: auto;
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
font-size: 16px; font-size: 16px;
padding-left: 8px;
padding-right: 2px;
} }
#zonePartitions .filtres { #zonePartitions .filtres {
@ -316,7 +305,7 @@ body.editionActivated .filtres>div>div>div>div {
display: block; display: block;
} }
#zonePartitions .filtres .config label{ #zonePartitions .filtres .config label {
display: block; display: block;
background: #ddd; background: #ddd;
border-radius: 4px; border-radius: 4px;
@ -356,34 +345,37 @@ body:not(.editionActivated) .filtres .groupes>div:active {
box-shadow: 0 0 0 #000 !important; box-shadow: 0 0 0 #000 !important;
transform: translateY(2px); transform: translateY(2px);
} }
body.editionActivated .filtres [data-idgroupe=aucun]{
body.editionActivated .filtres [data-idgroupe=aucun] {
display: none; display: none;
} }
body.editionActivated .filtres .nonEditable .move{ body.editionActivated .filtres .nonEditable .move {
display: initial; display: initial;
} }
.filtres .unselect { /* .filtres .unselect {
background: rgba(0, 153, 204, 0.5) !important; background: rgba(0, 153, 204, 0.5) !important;
} } */
/*****************************/ /*****************************/
/* Zone Etudiants */ /* Zone Etudiants */
/*****************************/ /*****************************/
#zoneChoix>.autoAffectation{ #zoneChoix>.autoAffectation {
background: #3c3c3c; background: #c9c9c9;
color: #fff; color: #141414;
padding: 4px 8px; padding: 4px 8px;
margin-bottom: 16px; margin-bottom: 16px;
border-radius: 4px; border-radius: 4px;
} }
#zoneChoix>.autoAffectation>select{
#zoneChoix>.autoAffectation>select {
border: none; border: none;
padding: 4px; padding: 4px;
border-radius: 4px; border-radius: 4px;
} }
#zoneChoix>.autoAffectation>.affectationGo{
#zoneChoix>.autoAffectation>.affectationGo {
display: inline-block; display: inline-block;
background: #0c9; background: #0c9;
padding: 8px 16px; padding: 8px 16px;
@ -396,6 +388,7 @@ body.editionActivated .filtres .nonEditable .move{
margin-bottom: 4px; margin-bottom: 4px;
width: fit-content; width: fit-content;
} }
#zoneChoix .etudiants>div { #zoneChoix .etudiants>div {
background: #FFF; background: #FFF;
border: 1px solid #aaa; border: 1px solid #aaa;
@ -411,14 +404,17 @@ body.editionActivated .filtres .nonEditable .move{
#zoneChoix .etudiants .nom { #zoneChoix .etudiants .nom {
flex: 1; flex: 1;
} }
#zoneChoix a { #zoneChoix a {
color: #000; color: #000;
text-decoration: none; text-decoration: none;
} }
#zoneChoix a:hover{
#zoneChoix a:hover {
text-decoration: underline; text-decoration: underline;
color: #09c; color: #09c;
} }
#zoneChoix .small { #zoneChoix .small {
color: #444; color: #444;
font-size: 8px; font-size: 8px;
@ -461,8 +457,8 @@ body.editionActivated .filtres .nonEditable .move{
} }
#zoneChoix .etudiants .partition input:checked:not([value=aucun])+span { #zoneChoix .etudiants .partition input:checked:not([value=aucun])+span {
background: #c09; background: rgb(165, 6, 59);
border-color: #c09; border-color: rgb(165, 6, 59);
color: #fff; color: #fff;
} }
@ -475,7 +471,8 @@ body.editionActivated .filtres .nonEditable .move{
section:not(#zonePartitions) .hide { section:not(#zonePartitions) .hide {
display: none !important; display: none !important;
} }
#zonePartitions .hide{
#zonePartitions .hide {
opacity: 0.4; opacity: 0.4;
} }
@ -550,6 +547,10 @@ h3 {
} }
#zoneGroupes [data-idgroupe=aucun] { #zoneGroupes [data-idgroupe=aucun] {
background: #3c3c3c !important; background: #453f3b !important;
color: #fff; color: #fff;
} }
#zoneGroupes .groupe[data-idgroupe=aucun]>div:nth-child(1) {
color: red;
}

42
app/static/css/scodoc.css
View File

@ -166,6 +166,20 @@ div.head_message {
color: green; color: green;
} }
.message_curtom {
position: fixed;
bottom: 100%;
left: 50%;
z-index: 10;
padding: 20px;
border-radius: 0 0 10px 10px;
background: rgb(247, 253, 67);
color: #2c1b1b;
font-size: 24px;
animation: message 3s;
transform: translate(-50%, 0);
}
div.passwd_warn { div.passwd_warn {
font-weight: bold; font-weight: bold;
@ -4005,6 +4019,30 @@ table.dataTable td.group {
text-align: left; text-align: left;
} }
/* ------------- BOUTONS style radio ------------ */
#zonePartitions button.dt-button {
display: inline-flex;
align-items: center;
justify-content: space-evenly;
margin: 0 4px;
border-radius: 5px;
cursor: pointer;
padding-top: 2px;
padding-bottom: 2px;
border: 2px solid lightgrey;
transition: all 0.3s ease;
font-size: 18px;
color: white;
border-color: #0069d9;
background: #0069d9;
}
#zonePartitions button.dt-button.unselect {
color: #707070;
background: #fff;
}
/* ------------- Nouveau tableau recap ------------ */ /* ------------- Nouveau tableau recap ------------ */
div.table_recap { div.table_recap {
margin-top: 6px; margin-top: 6px;
@ -4015,8 +4053,10 @@ div.table_recap {
font-weight: bold; font-weight: bold;
} }
.table_recap .but_off { .button.but_off,
button.unselect {
background-color: lightgray; background-color: lightgray;
font-weight: normal;
} }
.table_recap button.but_on:hover:not(.disabled), .table_recap button.but_on:hover:not(.disabled),

28
app/static/js/scodoc.js
View File

@ -68,28 +68,18 @@ $(function () {
}); });
// Affiche un message transitoire // Affiche un message transitoire
function sco_message(msg, color) { function sco_message(msg) {
if (color === undefined) { var div = document.createElement("div");
color = "green"; div.className = "message_curtom";
} div.innerHTML = msg;
$('#sco_msg').html(msg).show(); document.querySelector("body").appendChild(div);
if (color) { setTimeout(() => {
$('#sco_msg').css('color', color); div.remove();
} }, 3000);
setTimeout(
function () {
$('#sco_msg').fadeOut(
'slow',
function () {
$('#sco_msg').html('');
}
);
},
3000 // <-- duree affichage en milliseconds
);
} }
function get_query_args() { function get_query_args() {
var s = window.location.search; // eg "?x=1&y=2" var s = window.location.search; // eg "?x=1&y=2"
var vars = {}; var vars = {};

29
app/templates/scolar/partition_editor.j2
View File

@ -21,7 +21,7 @@
</section> </section>
<section id="zoneChoix"> <section id="zoneChoix">
<h2>Etudiants</h2> <h2>Étudiants</h2>
<div class="autoAffectation"> <div class="autoAffectation">
Affecter automatiquement les étudiants du groupe<br> Affecter automatiquement les étudiants du groupe<br>
<select name="affectationFrom" id="affectationFrom"></select> <select name="affectationFrom" id="affectationFrom"></select>
@ -178,9 +178,9 @@
<!-- Groupes --> <!-- Groupes -->
<div class=groupes> <div class=groupes>
<div data-idgroupe=aucun> <button class="dt-button" data-idgroupe=aucun>
Non affectés Non affectés
</div> </button>
<div class="editing ajoutGroupe">+</div> <div class="editing ajoutGroupe">+</div>
</div> </div>
@ -210,7 +210,8 @@
} }
function templateFiltres_groupe(groupe) { function templateFiltres_groupe(groupe) {
let div = document.createElement("div"); let div = document.createElement("button");
div.classList.add("dt-button");
div.dataset.idgroupe = groupe.id; div.dataset.idgroupe = groupe.id;
div.innerHTML = ` div.innerHTML = `
<span class="editing move">||</span> <span class="editing move">||</span>
@ -456,7 +457,7 @@
.then(r => { return r.json() }) .then(r => { return r.json() })
.then(r => { .then(r => {
if (r.message == "invalid partition_name" || r.message == "invalid group_name") { if (r.message == "invalid partition_name" || r.message == "invalid group_name") {
message("Le nom " + name + " existe déjà"); sco_message("Le nom " + name + " existe déjà");
div.remove(); div.remove();
return; return;
} }
@ -537,7 +538,7 @@
.then(r => { return r.json() }) .then(r => { return r.json() })
.then(r => { .then(r => {
if (r.message == "invalid partition_name" || r.message == "invalid group_name") { if (r.message == "invalid partition_name" || r.message == "invalid group_name") {
message("Le nom " + name + " existe déjà"); sco_message("Le nom " + name + " existe déjà");
return; return;
} }
@ -828,23 +829,9 @@
return response.text(); return response.text();
}) })
.then(function(txt) { .then(function(txt) {
message(txt); sco_message(txt);
}); });
} }
/*************************/
/* Message */
/*************************/
function message(msg) {
var div = document.createElement("div");
div.className = "message_curtom";
div.innerHTML = msg;
document.querySelector("body").appendChild(div);
setTimeout(() => {
div.remove();
}, 3000);
}
</script> </script>

2
app/views/scolar.py
View File

@ -910,7 +910,7 @@ def partition_editor(formsemestre_id: int):
"js/partition_editor.js", "js/partition_editor.js",
], ],
page_title=f"Partitions de {formsemestre.titre_annee()}", page_title=f"Partitions de {formsemestre.titre_annee()}",
init_datatables=False, init_datatables=True,
), ),
f"""<h2> f"""<h2>
</h2> </h2>