dut
/
sid
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Modification design tableaux

This commit is contained in:
xdrm-brackets 2015-11-02 12:20:01 +01:00
parent 149f8db043
commit f746ba1672
7 changed files with 242 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
css/global.css
View File

@ -30,34 +30,28 @@
/* STYLE "BASIC" DES TABLEAUX */ /* STYLE "BASIC" DES TABLEAUX */
table.basic{ table.basic{
/* position */ /* position */
/*width: calc( 100% - 2*1em );*/ width: 100%;
margin: 2em 1em; margin-bottom: 1em;
/* border */ /* border */
border-radius: 5px; border-radius: 5px;
border-spacing: 0; border-spacing: 0;
box-shadow: 0 0 4px #e3e3e3; /*box-shadow: 0 0 4px #e3e3e3;*/
} }
/* affichage du corps si tête activée */
table.basic thead + tbody td{ display: none; }
table.basic thead + tbody td.more{ display: block; }
table.basic thead.active + tbody td{ display: table-cell; }
table.basic tr td, table.basic tr td,
table.basic tr th, table.basic tr th,
#DRAGNDROP td, #DRAGNDROP td,
#DRAGNDROP th{ #DRAGNDROP th{
/* position */ /* position */
padding: 1em 1.5em; padding: 1.5em 1.5em;
width: 25%;
/* border */ /* border */
border-width: 1px 1px 0 0; /*border-width: 1px 0 0 0;*/
border-style: solid; /*border-style: solid;*/
border-color: #e0e1e3; /*border-color: #e0e1e3;*/
/* backgroud */ /* backgroud */
background-color: #fff; background-color: #fff;
@ -76,64 +70,24 @@ table.basic tr th,
cursor: default; cursor: default;
} }
/* la ligne "Voir plus" */ /* titre aligné à gauche */
table.basic tr td.more{ table.basic th{ text-align: left; }
/* background */
background: #f7f8fc url(../src/more.svg) right 1em center no-repeat;
background-size: auto 1.5em;
/* foreground */ /* <thead> sans background */
color: #b7b7b7; table.basic thead tr th{ background-color: transparent; }
text-align: right;
padding-right: 3em;
/* extra */ table.basic:nth-child(4n+0) tr td:first-child{ border-left: 10px solid #e63c54; }
cursor: pointer; table.basic:nth-child(4n+1) tr td:first-child{ border-left: 10px solid #3c73e6; }
} table.basic:nth-child(4n+2) tr td:first-child{ border-left: 10px solid #e6983c; }
table.basic:nth-child(4n+3) tr td:first-child{ border-left: 10px solid #2dcc70; }
table.basic tr td.more:before{ content: 'Voir plus'; }
table.basic thead.active + tbody tr td.more:before{ content: 'Voir moins'; }
/* on cache "voir plus" quand le tableau est déroulé */
table.basic thead.active + td.more{ display: none; }
/* différence avec <thead> */
table.basic tr th{ background-color: #f7f8fc; font-size: 1.05em; }
table.basic tr th:first-letter{ text-transform: uppercase; }
/* on ajoute les rebords pour ceux à gauche */
table.basic tr td:first-child,
table.basic tr th:first-child{ border-left-width: 1px; }
/* on ajoute les rebords pour ceux en bas */
table.basic tr:last-child td { border-bottom-width: 1px; }
/* angle haut gauche */
table.basic tr:first-child th:first-child{ border-radius: 5px 0 0 0; }
/* angle haut droit */
table.basic tr:first-child th:last-child { border-radius: 0 5px 0 0; }
/* angle bas gauche */
table.basic tr:last-child td:first-child { border-radius: 0 0 0 5px; }
/* angle bas droit */
table.basic tr:last-child td:last-child { border-radius: 0 0 5px 0; }
/* @hover */ /* @hover */
table.basic tr:hover td:not(.more){ table.basic tr:hover td{ color: #fff; }
background-color: #2dcc70;
color: #fff;
}
table.basic:nth-child(4n+0) tr:hover td{ background-color: rgba(230, 60, 84, 1); }
table.basic:nth-child(4n+0) thead th{ color: #e63c54; } table.basic:nth-child(4n+1) tr:hover td{ background-color: rgba(60, 115, 230, 1); }
table.basic:nth-child(4n+0) tr:hover td:not(.more) { background-color: #e63c54; } table.basic:nth-child(4n+2) tr:hover td{ background-color: rgba(230, 152, 60, 1); }
table.basic:nth-child(4n+1) thead th{ color: #3c73e6; } table.basic:nth-child(4n+3) tr:hover td{ background-color: rgba(45, 204, 112, 1); }
table.basic:nth-child(4n+1) tr:hover td:not(.more) { background-color: #3c73e6; }
table.basic:nth-child(4n+2) thead th{ color: #e6983c; }
table.basic:nth-child(4n+2) tr:hover td:not(.more) { background-color: #e6983c; }
table.basic:nth-child(4n+3) thead th{ color: #2dcc70; }
table.basic:nth-child(4n+3) tr:hover td:not(.more) { background-color: #2dcc70; }

163
css/global2.css Executable file
View File

@ -0,0 +1,163 @@
.no-select{
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
-o-user-select: none;
}
.hidden{ display: none !important; }
/**********************/
/*** TABLEAU .BASIC ***/
/**********************/
/* STYLE "BASIC" DES TABLEAUX */
table.basic{
/* position */
/*width: calc( 100% - 2*1em );*/
margin: 2em 1em;
/* border */
border-radius: 5px;
border-spacing: 0;
box-shadow: 0 0 4px #e3e3e3;
}
/* affichage du corps si tête activée */
table.basic thead + tbody td{ display: none; }
table.basic thead + tbody td.more{ display: block; }
table.basic thead.active + tbody td{ display: table-cell; }
table.basic tr td,
table.basic tr th,
#DRAGNDROP td,
#DRAGNDROP th{
/* position */
padding: 1em 1.5em;
/* border */
border-width: 1px 1px 0 0;
border-style: solid;
border-color: #e0e1e3;
/* backgroud */
background-color: #fff;
/* foreground */
color: #4e4e4e;
/* animation */
transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
/* extra */
cursor: default;
}
/* la ligne "Voir plus" */
table.basic tr td.more{
/* background */
background: #f7f8fc url(../src/more.svg) right 1em center no-repeat;
background-size: auto 1.5em;
/* foreground */
color: #b7b7b7;
text-align: right;
padding-right: 3em;
/* extra */
cursor: pointer;
}
table.basic tr td.more:before{ content: 'Voir plus'; }
table.basic thead.active + tbody tr td.more:before{ content: 'Voir moins'; }
/* on cache "voir plus" quand le tableau est déroulé */
table.basic thead.active + td.more{ display: none; }
/* différence avec <thead> */
table.basic tr th{ background-color: #f7f8fc; font-size: 1.05em; }
table.basic tr th:first-letter{ text-transform: uppercase; }
/* on ajoute les rebords pour ceux à gauche */
table.basic tr td:first-child,
table.basic tr th:first-child{ border-left-width: 1px; }
/* on ajoute les rebords pour ceux en bas */
table.basic tr:last-child td { border-bottom-width: 1px; }
/* angle haut gauche */
table.basic tr:first-child th:first-child{ border-radius: 5px 0 0 0; }
/* angle haut droit */
table.basic tr:first-child th:last-child { border-radius: 0 5px 0 0; }
/* angle bas gauche */
table.basic tr:last-child td:first-child { border-radius: 0 0 0 5px; }
/* angle bas droit */
table.basic tr:last-child td:last-child { border-radius: 0 0 5px 0; }
/* @hover */
table.basic tr:hover td:not(.more){
background-color: #2dcc70;
color: #fff;
}
table.basic:nth-child(4n+0) thead th{ color: #e63c54; }
table.basic:nth-child(4n+0) tr:hover td:not(.more) { background-color: #e63c54; }
table.basic:nth-child(4n+1) thead th{ color: #3c73e6; }
table.basic:nth-child(4n+1) tr:hover td:not(.more) { background-color: #3c73e6; }
table.basic:nth-child(4n+2) thead th{ color: #e6983c; }
table.basic:nth-child(4n+2) tr:hover td:not(.more) { background-color: #e6983c; }
table.basic:nth-child(4n+3) thead th{ color: #2dcc70; }
table.basic:nth-child(4n+3) tr:hover td:not(.more) { background-color: #2dcc70; }
/******************/
/*** PARAGRAPHS ***/
/******************/
#CONTAINER section > p{
/* position */
padding: 1em;
margin: 1em;
/* border */
border-radius: 3px;
border: 1px solid #ddd;
/* background */
background-color: #fff;
}
#CONTAINER section > p:hover{
box-shadow: 1px 1px 3px #ddd;
}

69
page/groups.php
View File

@ -35,37 +35,33 @@ require_once __ROOT__.'/manager/groups.php';
if( $answer->request == 'success' ){ // si pas d'erreur if( $answer->request == 'success' ){ // si pas d'erreur
////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////
echo "<table class='basic'><thead><tr>";
echo '<th>Identifiant</td>';
echo '<th>Prenom</td>';
echo '<th>Nom</td>';
echo '<th>Groupe</td>';
echo '</tr></thead></table>';
foreach($answer->grouplist as $group){ // pour chaque groupe foreach($answer->grouplist as $group){ // pour chaque groupe
if( count($group->userlist) > 0 ){ // s'il y a des utilisateurs if( count($group->userlist) > 0 ){ // s'il y a des utilisateurs
echo "<table class='basic'>"; echo "<table class='basic'>";
echo '<thead>';
echo '<tr>';
echo '<th colspan=5>Groupe <span>'.$group->nom.'</span></th>';
echo '</tr>';
echo '</thead>';
echo '<tbody>'; echo '<tbody>';
// pour chaque utilisateur // pour chaque utilisateur
foreach($group->userlist as $user){ foreach($group->userlist as $user){
echo '<tr>'; echo '<tr>';
echo "<td>".$user['identifiant'].'</td>';
foreach($user as $key=>$value) echo '<td>'.$user['prenom'].'</td>';
if( $key == 'identifiant' ) echo '<td>'.$user['nom'].'</td>';
echo "<td class='hidden'>".$value.'</td>'; echo '<td>Groupe <span>'.$group->nom.'</span></td>';
elseif( $key == 'prenom' || $key == 'nom' )
echo '<td>'.$value.'</td>';
echo '</tr>'; echo '</tr>';
} }
echo '<tr><td colspan=5 class=more></td></tr>'; // echo '<tr><td colspan=5 class=more></td></tr>';
echo '</tbody>'; echo '</tbody>';
@ -119,22 +115,24 @@ if( $_SESSION['identifiant'] != null && $_SESSION['droits'] == 'student' ){ // s
if( $answer->request == 'success' ){ // si on a bien récupéré les membres du groupe if( $answer->request == 'success' ){ // si on a bien récupéré les membres du groupe
//////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////
echo "<table class='basic'>";
echo "<thead class='active'><tr>"; echo "<table class='basic'><thead>";
echo '<th colspan=5>Groupe <span>'.$monGroupe.'</span></th>'; echo '<tr>';
echo '</tr></thead>'; echo '<th colspan=5>';
echo 'Groupe '.$group->nom;
echo '</th>';
echo '</tr>';
echo '</thead></table>';
echo '<tbody>'; echo "<table class='basic'><tbody>";
// pour chaque utilisateur // pour chaque utilisateur
foreach($answer->userlist as $user){ foreach($answer->userlist as $user){
echo '<tr>'; echo '<tr>';
foreach($user as $key=>$value) echo "<td>".$user['identifiant'].'</td>';
if( $key == 'identifiant' ) echo '<td>'.$user['prenom'].'</td>';
echo "<td class='hidden'>".$value.'</td>'; echo '<td>'.$user['nom'].'</td>';
elseif( $key == 'prenom' || $key == 'nom' ) echo '<td>Groupe <span>'.$group->nom.'</span></td>';
echo '<td>'.$value.'</td>';
echo '</tr>'; echo '</tr>';
} }
@ -177,6 +175,7 @@ if( $_SESSION['identifiant'] != null && $_SESSION['droits'] == 'admin' ){ // si
if( $answer->request == 'success' ){ // si pas d'erreur if( $answer->request == 'success' ){ // si pas d'erreur
////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////
foreach($answer->grouplist as $group){ // pour chaque groupe foreach($answer->grouplist as $group){ // pour chaque groupe
if( count($group->userlist) > 0 ){ // s'il y a des utilisateurs if( count($group->userlist) > 0 ){ // s'il y a des utilisateurs
@ -185,7 +184,10 @@ if( $_SESSION['identifiant'] != null && $_SESSION['droits'] == 'admin' ){ // si
echo '<thead>'; echo '<thead>';
echo '<tr>'; echo '<tr>';
echo '<th colspan=5>Groupe <span>'.$group->nom.'</span></th>'; echo '<th colspan=5>';
echo 'Groupe '.$group->nom;
echo "<span style='font-weight:normal;padding-left:1em; font-size: .8em;'>(glisser-déposer étudiant pour le déplacer)</span>";
echo '</th>';
echo '</tr>'; echo '</tr>';
echo '</thead>'; echo '</thead>';
@ -196,18 +198,15 @@ if( $_SESSION['identifiant'] != null && $_SESSION['droits'] == 'admin' ){ // si
// pour chaque utilisateur // pour chaque utilisateur
foreach($group->userlist as $user){ foreach($group->userlist as $user){
echo '<tr>'; echo '<tr>';
echo "<td>".$user['identifiant'].'</td>';
foreach($user as $key=>$value) echo '<td>'.$user['prenom'].'</td>';
if( $key == 'identifiant' ) echo '<td>'.$user['nom'].'</td>';
echo "<td class='hidden'>".$value.'</td>'; echo '<td><strong><span>'.$group->nom.'</span></strong></td>';
elseif( $key == 'prenom' || $key == 'nom' )
echo '<td>'.$value.'</td>';
echo '</tr>'; echo '</tr>';
} }
echo '<tr><td colspan=5 class=more></td></tr>'; // echo '<tr><td colspan=5 class=more></td></tr>';
echo '</tbody>'; echo '</tbody>';

12
test.php
View File

@ -1,6 +1,18 @@
<?php define('__ROOT__', dirname(__FILE__) ); <?php define('__ROOT__', dirname(__FILE__) );
require_once __ROOT__.'/manager/security.php'; require_once __ROOT__.'/manager/security.php';
/***************/
/*** A FAIRE ***/
/***************
[ ] Lors du déplacement par drag'n'drop, déplacer l'élève au bon endroit (classé alphabétiquement)
[ ] Refaire le design des tableaux en utilisant xdoc/flat_table_design.jpg
/***************/
/***************/
/***************/
/*** CRÉATION D'UTILISATEUR ***/ /*** CRÉATION D'UTILISATEUR ***/
// require('manager/user.php'); // require('manager/user.php');

BIN
xdoc/flat_table_design.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

2
xdoc/requêtes_sql_types.sql
View File

@ -64,7 +64,7 @@
* + valeur (18) => 18 * + valeur (18) => 18
* + base (20) => /20 * + base (20) => /20
* *
* [ETUDIANT] membre d'un [GROUPE] associé à un [SEMESTRE] = appartenance_groupe [id_etudiant, id_groupe, id_semestre] * [ETUDIANT] membre d'un [GROUPE] associé à un [SEMESTRE] = appartenance [id_etudiant, id_groupe, id_semestre]
* *
* [UE] contient des [MODULES] en fonction du [SEMESTRE] = programme [id_semestre, id_ue, id_module] * [UE] contient des [MODULES] en fonction du [SEMESTRE] = programme [id_semestre, id_ue, id_module]
* *