From d50beeb4d71309912ea3c23125f40f45a7f1b090 Mon Sep 17 00:00:00 2001 From: Theal0 Date: Mon, 31 May 2021 14:19:43 +0200 Subject: [PATCH] =?UTF-8?q?Release=20v1.2=20Ajout=20de=20la=20documentatio?= =?UTF-8?q?n=20des=20fonctions=20avec=20JsDoc=20(En=20Markdown)=20Ajout=20?= =?UTF-8?q?de=20spinners=20de=20chargement=20Ajout=20de=20liens=20vers=20l?= =?UTF-8?q?es=20absences=20et=20le=20bulletin=20depuis=20le=20profil=20?= =?UTF-8?q?=C3=A9tudiant=20Affichage=20des=20groupes=20de=20TD=20sur=20le?= =?UTF-8?q?=20profil=20=C3=A9tudiant=20Reduction/Optimisation=20du=20nombr?= =?UTF-8?q?e=20de=20requetes=20Optimisations=20mineures?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit (TODO: Changements des logins en nom/prénom sur l'acceuil de la gestion du semestre) --- Documentation.md | 405 ++++++++++++++++++++++++ src/ScoDoc/Etudiant.js | 32 +- src/ScoDoc/GestionSemestre.js | 18 +- src/ScoDoc/GestionSemestre/Absences.js | 14 +- src/ScoDoc/GestionSemestre/Accueil.js | 21 +- src/ScoDoc/GestionSemestre/Bulletin.js | 15 +- src/ScoDoc/GestionSemestre/Etudiants.js | 38 ++- 7 files changed, 510 insertions(+), 33 deletions(-) create mode 100644 Documentation.md diff --git a/Documentation.md b/Documentation.md new file mode 100644 index 0000000..e4dca93 --- /dev/null +++ b/Documentation.md @@ -0,0 +1,405 @@ +# Classes + +## `/` + +
+
ChoixDept
+

Page de choix du département

+
+
Etudiant
+

Page d'information d'un étudiant'

+
+
GestionSemestre
+

Page de gestion du semestre

+
+
Login
+

Page de Login

+
+
Scolarite
+

Page de choix du semestre

+
+
ScoNavBar
+

Barre de navigation

+
+
SearchStudent
+

Module de recherche d'étudiant

+
+
+ +## `/GestionSemestre` + +
+
Absences
+

Page de gestion des absences

+
+
Accueil
+

Page d'accueil de la gestion du semestre

+
+
Bulletin
+

Page de présentation des bulletins étudiants

+
+
Etudiants
+

Page de présentation des étudiants inscrits au semestre

+
+
+ +## `/GestionSemestre/Absences` + +
+
JustAbs
+

Module de justification des absences

+
+
SaisieAbs
+

Module de saisie des absences

+
+
SupprAbs
+

Module de suppression des absences

+
+
+
+ +--- +# Functions + +
+
get(url) ⇒ Promise.<Response>
+

Lance une requête GET a l'URL donnée en paramètre et retourne une Promise.

+
+
getLogin(url, login, pass) ⇒ Promise.<Response>
+

Lance une requête GET a l'URL donnée en paramètre et retourne une Promise. +Dans ce cas particulier, on ajoute un header d'authentification.

+
+
getJson(url) ⇒ Promise.<{data: any}>
+

Lance une requête GET a l'URL donnée en paramètre et retourne les données JSON d'une Promise.

+
+
post(url, data) ⇒ Promise.<Response>
+

Lance une requête POST a l'URL donnée en paramètre et retourne une Promise.

+
+
+
+ +--- +## `/` + + + +## ChoixDept +Page de choix du département + +**Kind**: global class + + +### choixDept.getData() +Recupère la liste des départements depuis l'API + +**Kind**: instance method of [ChoixDept](#ChoixDept) + + +## Etudiant +Page d'information d'un étudiant' + +**Kind**: global class + + +### etudiant.getData() +Recupère les données de l'étudiant depuis l'API + +**Kind**: instance method of [Etudiant](#Etudiant) + + +## GestionSemestre +Page de gestion du semestre + +**Kind**: global class + + +### gestionSemestre.getData() +Recupère la liste des étudiants inscrits au semestre pour le Select depuis l'API + +**Kind**: instance method of [GestionSemestre](#GestionSemestre) + + +## Login +Page de Login + +**Kind**: global class + + +### login.checkCredentials(e) +Verifie la validité des identifiants depuis l'API + +**Kind**: instance method of [Login](#Login) + +| Param | Type | +| --- | --- | +| e | event | + + + +## Scolarite +Page de choix du semestre + +**Kind**: global class + + +### scolarite.getData() +Recupère la liste des semestres depuis l'API + +**Kind**: instance method of [Scolarite](#Scolarite) + + +## ScoNavBar +Barre de navigation + +**Kind**: global class + + +## SearchStudent +Module de recherche d'étudiant + +**Kind**: global class + +* [SearchStudent](#SearchStudent) + * [.searchStudent(search)](#SearchStudent+searchStudent) + * [.result()](#SearchStudent+result) ⇒ JSX.Element + + + +### searchStudent.searchStudent(search) +Lance une recherche de l'étudiant depuis l'API + +**Kind**: instance method of [SearchStudent](#SearchStudent) + +| Param | Type | Description | +| --- | --- | --- | +| search | String | Texte recherché | + + + +### searchStudent.result() ⇒ JSX.Element +Presentation du résultat + +**Kind**: instance method of [SearchStudent](#SearchStudent) +**Returns**: JSX.Element - - Resultat au format JSX +
+ +--- +## `/GestionSemestre` + + + +## Absences +Page de gestion des absences + +**Kind**: global class + +* [Absences](#Absences) + * [.openModal(key, data)](#Absences+openModal) + * [.getData()](#Absences+getData) + + + +### absences.openModal(key, data) +Gère l'ouverture des Modal + +**Kind**: instance method of [Absences](#Absences) + +| Param | Type | Description | +| --- | --- | --- | +| key | String | Correspond au type de modal [isOpen, isDelOpen, isJustOpen] | +| data | Object | Objet contenant les données à transmettre | + + + +### absences.getData() +Recupère les données d'absences depuis l'API + +**Kind**: instance method of [Absences](#Absences) + + +## Accueil +Page d'accueil de la gestion du semestre + +**Kind**: global class + + +### accueil.getData() +Recupère les données du semestre selectionné depuis l'API + +**Kind**: instance method of [Accueil](#Accueil) + + +## Bulletin +Page de présentation des bulletins étudiants + +**Kind**: global class + +* [Bulletin](#Bulletin) + * [.getData()](#Bulletin+getData) + * [.getPdf()](#Bulletin+getPdf) + + + +### bulletin.getData() +Recupère les données de bulletin depuis l'API + +**Kind**: instance method of [Bulletin](#Bulletin) + + +### bulletin.getPdf() +Recupère les données de bulletin en tant que "blob" pour un PDF depuis l'API + +**Kind**: instance method of [Bulletin](#Bulletin) + + +## Etudiants +Page de présentation des étudiants inscrits au semestre + +**Kind**: global class + + +### etudiants.getData() +Recupère la liste des étudiants inscrits au semestre depuis l'API + +**Kind**: instance method of [Etudiants](#Etudiants) +
+ +--- + +## `/GestionSemestre/Absences` + + + +## JustAbs +Module de justification des absences + +**Kind**: global class + +* [JustAbs](#JustAbs) + * [.onFormSubmit](#JustAbs+onFormSubmit) + * [.postData(data)](#JustAbs+postData) + + + +### justAbs.onFormSubmit +Gestion des données du formulaire + +**Kind**: instance property of [JustAbs](#JustAbs) + +| Param | Type | +| --- | --- | +| e | Event | + + + +### justAbs.postData(data) +Envoie une requête POST a l'API + +**Kind**: instance method of [JustAbs](#JustAbs) + +| Param | Type | Description | +| --- | --- | --- | +| data | String | Données à envoyer sous la forme param1=val1¶m2=val2... | + + + +## SaisieAbs +Module de saisie des absences + +**Kind**: global class + +* [SaisieAbs](#SaisieAbs) + * [.onFormSubmit](#SaisieAbs+onFormSubmit) + * [.postData(data)](#SaisieAbs+postData) + + + +### saisieAbs.onFormSubmit +Gestion des données du formulaire + +**Kind**: instance property of [SaisieAbs](#SaisieAbs) + +| Param | Type | +| --- | --- | +| e | Event | + + + +### saisieAbs.postData(data) +Envoie une requête POST a l'API + +**Kind**: instance method of [SaisieAbs](#SaisieAbs) + +| Param | Type | Description | +| --- | --- | --- | +| data | String | Données à envoyer sous la forme param1=val1¶m2=val2... | + + + +## SupprAbs +Module de suppression des absences + +**Kind**: global class + + +### supprAbs.postData(data) +Envoie une requête POST a l'API + +**Kind**: instance method of [SupprAbs](#SupprAbs) + +| Param | Type | Description | +| --- | --- | --- | +| data | String | Données à envoyer sous la forme param1=val1¶m2=val2... | +
+ +--- + +## Global + + + +## get(url) ⇒ Promise.<Response> +Lance une requête GET a l'URL donnée en paramètre et retourne une Promise. + +**Kind**: global function + +| Param | Type | Description | +| --- | --- | --- | +| url | String | URL de la requête | + + + +## getLogin(url, login, pass) ⇒ Promise.<Response> +Lance une requête GET a l'URL donnée en paramètre et retourne une Promise. Dans ce cas particulier, on ajoute un header d'authentification. + +**Kind**: global function + +| Param | Type | Description | +| --- | --- | --- | +| url | String | URL de la requête | +| login | String | Identifiant | +| pass | String | Mot de passe | + + + +## getJson(url) ⇒ Promise.<{data: any}> +Lance une requête GET a l'URL donnée en paramètre et retourne les données JSON d'une Promise. + +**Kind**: global function + +| Param | Type | Description | +| --- | --- | --- | +| url | String | URL de la requête | + + + +## post(url, data) ⇒ Promise.<Response> +Lance une requête POST a l'URL donnée en paramètre et retourne une Promise. + +**Kind**: global function + +| Param | Type | Description | +| --- | --- | --- | +| url | String | URL de la requête | +| data | String | Données de la requête au format "param1=val1¶m2=val2..." | + diff --git a/src/ScoDoc/Etudiant.js b/src/ScoDoc/Etudiant.js index 850427e..62416d7 100644 --- a/src/ScoDoc/Etudiant.js +++ b/src/ScoDoc/Etudiant.js @@ -1,7 +1,9 @@ import React, {Component} from "react"; +import {Link} from "react-router-dom"; import './Style.css' import ScoNavBar from "./ScoNavBar"; import {getJson} from "./Request"; +import {Button} from "react-bootstrap"; /** Page d'information d'un étudiant' */ class Etudiant extends Component { @@ -63,10 +65,10 @@ class Etudiant extends Component { this.state.etud.email !== "" || this.state.etud.emailperso !== "" ?

Contact

- {this.state.etud.telephone !== "" && Téléphone: {this.state.etud.telephone}}
- {this.state.etud.telephonemobile !== "" && Mobile: {this.state.etud.telephonemobile}}
- {this.state.etud.email !== "" && Mail étudiant: {this.state.etud.email}}
- {this.state.etud.emailperso !== "" && Mail personnel: {this.state.etud.emailperso}}
+ {this.state.etud.telephone !== "" && <>Téléphone: {this.state.etud.telephone}
} + {this.state.etud.telephonemobile !== "" && <>Mobile: {this.state.etud.telephonemobile}
} + {this.state.etud.email !== "" && <>Mail étudiant: {this.state.etud.email}
} + {this.state.etud.emailperso !== "" && <>Mail personnel: {this.state.etud.emailperso}
}
:
Aucun contact disponible
@@ -101,11 +103,29 @@ class Etudiant extends Component { {this.state.loaded === true &&

Formation actuelle

- {this.state.semestres.map((sem) => { + {this.state.semestres.map((sem, index) => { return (
{sem.titreannee}
- {sem.date_debut} - {sem.date_fin} + {sem.date_debut} - {sem.date_fin}
+ {this.state.etud.insemestre[index].groupes !== "" && this.state.etud.insemestre[index].groupes && + "Groupes: " + this.state.etud.insemestre[index].groupes + } +
Liens
+ + + + + +
) })} diff --git a/src/ScoDoc/GestionSemestre.js b/src/ScoDoc/GestionSemestre.js index 97c787d..ab2291c 100644 --- a/src/ScoDoc/GestionSemestre.js +++ b/src/ScoDoc/GestionSemestre.js @@ -16,11 +16,19 @@ class GestionSemestre extends Component { selectOptions: [], id: "", name: '', + defaulttab: "Accueil", + defaultsel: "" } } componentWillMount() { this.getData() + + if (this.props.location.tab) { + this.setState({defaulttab: this.props.location.tab, defaultsel: this.props.location.etudid, + id: this.props.location.etudid, name: this.state.selectOptions.find(option => option.value === this.state.id) + }) + } } /** @@ -32,6 +40,7 @@ class GestionSemestre extends Component { let BASE_URL = window.$api_url getJson(BASE_URL + dept + '/Scolarite/Notes/groups_view?with_codes=1&format=json&formsemestre_id=' + sem) .then(res => { + this.setState({students: res.data}) // Création d'une liste pour le select res.data.map((student) => { let joined = this.state.selectOptions.concat({label: student.nom_disp + " " + student.prenom, value: student.etudid}); @@ -53,23 +62,24 @@ class GestionSemestre extends Component { {/* Selection de l'étudiant pour les sous-composants */}
Choix de l'étudiant - option.value === this.state.defaultsel)} />
- + - + - +
diff --git a/src/ScoDoc/GestionSemestre/Absences.js b/src/ScoDoc/GestionSemestre/Absences.js index 72d2005..6579099 100644 --- a/src/ScoDoc/GestionSemestre/Absences.js +++ b/src/ScoDoc/GestionSemestre/Absences.js @@ -1,5 +1,5 @@ import React, {Component} from "react"; -import {Button, Col} from 'react-bootstrap' +import {Button, Spinner, Col} from 'react-bootstrap' import '../Style.css' import SaisieAbs from "./Absences/SaisieAbs"; import SupprAbs from "./Absences/SupprAbs"; @@ -22,13 +22,16 @@ class Absences extends Component { abs: [], absjust: [], // Données d'une absence selectionnée - data: {} + data: {}, + // En cours de recuperation de données + loading: false } } // Recuperation des données en cas de changement de props (dans notre cas, changement d'étudiant.e) componentDidUpdate(prevProps) { if (prevProps.id !== this.props.id) { + this.setState({loading: true}) this.getData(); } } @@ -62,7 +65,7 @@ class Absences extends Component { .then(res => this.setState({abs: res.data})); // Recuperation des absences justifiées getJson(BASE_URL + dept + "/Scolarite/Absences/ListeAbsEtud?format=json&absjust_only=1&etudid=" + this.props.id) - .then(res => this.setState({absjust: res.data})); + .then(res => this.setState({absjust: res.data, loading: false})); } } @@ -92,7 +95,10 @@ class Absences extends Component { 🗘 - {(this.state.abs.length === 0 && this.state.absjust.length === 0 && this.props.name !== "") && + {this.state.loading === true && + + } + {(this.state.abs.length + this.state.absjust.length === 0 && this.props.name !== "" && this.state.loading === false) &&
Aucune absence de l'étudiant.e
} {this.state.abs.map((abs) => { diff --git a/src/ScoDoc/GestionSemestre/Accueil.js b/src/ScoDoc/GestionSemestre/Accueil.js index 59caa93..1ee2aa4 100644 --- a/src/ScoDoc/GestionSemestre/Accueil.js +++ b/src/ScoDoc/GestionSemestre/Accueil.js @@ -1,6 +1,7 @@ import React, {Component} from "react"; import '../Style.css' import {getJson} from "../Request"; +import {Spinner} from "react-bootstrap"; /** Page d'accueil de la gestion du semestre */ class Accueil extends Component { @@ -8,10 +9,13 @@ class Accueil extends Component { super(props); this.state = { semestre: {}, + resp: [], + loading: true }; } componentWillMount() { + this.setState({loading: true}) this.getData() } @@ -24,16 +28,25 @@ class Accueil extends Component { let BASE_URL = window.$api_url getJson(BASE_URL + dept + '/Scolarite/Notes/formsemestre_list?format=json&formsemestre_id=' + sem) .then(res => { - this.setState({ semestre: res.data[0]}); + this.setState({ semestre: res.data[0], resp: res.data[0].responsables, loading: false}); }); } render() { return (
-

{this.state.semestre.titre}
- Semestre {this.state.semestre.semestre_id} en {this.state.semestre.modalite}
- (Responsable: {this.state.semestre.responsables})

+ {this.state.loading === false ? +

{this.state.semestre.titre}
+ Semestre {this.state.semestre.semestre_id} en {this.state.semestre.modalite}
+ {this.state.resp.length === 1 ? "Responsable: (" : "Responsables ("} + {this.state.resp.map((resp, index) => { + if (index !== this.state.resp.length-1) {return (resp + ", ")} + else {return (resp + ")")} + })} +

+ : + + }
) } diff --git a/src/ScoDoc/GestionSemestre/Bulletin.js b/src/ScoDoc/GestionSemestre/Bulletin.js index bc53641..aa0d372 100644 --- a/src/ScoDoc/GestionSemestre/Bulletin.js +++ b/src/ScoDoc/GestionSemestre/Bulletin.js @@ -1,5 +1,5 @@ import React, {Component} from "react"; -import {Table, Button, Dropdown} from "react-bootstrap" +import {Table, Button, Dropdown, Spinner} from "react-bootstrap" import '../Style.css' import {get, getJson} from "../Request"; @@ -10,7 +10,8 @@ class Bulletin extends Component { this.state = { bltn: {}, datue: {}, - loaded: false + loaded: false, + loading: false }; this.getData = this.getData.bind(this); } @@ -35,7 +36,7 @@ class Bulletin extends Component { } this.setState({datue: ls}, () => { // Marquage du bulletin comme "chargé" - this.setState({loaded: true}) + this.setState({loaded: true, loading: false}) }) }) }) @@ -46,8 +47,8 @@ class Bulletin extends Component { */ getPdf() { let BASE_URL = window.$api_url - let dept = window.location.href.split('/')[6] - let sem = window.location.href.split('/')[8] + let dept = window.location.href.split('/')[7] + let sem = window.location.href.split('/')[9] get(BASE_URL + dept + "/Scolarite/Notes/formsemestre_bulletinetud?formsemestre_id=" + sem + "&etudid=" + this.props.id + "&format=pdf&version=selectedevals") .then(res => res.blob()) @@ -60,6 +61,7 @@ class Bulletin extends Component { // Recuperation des données en cas de changement de props (dans notre cas, changement d'étudiant.e) componentDidUpdate(prevProps) { if (prevProps.id !== this.props.id) { + this.setState({loading: true}) this.getData(); } } @@ -75,6 +77,9 @@ class Bulletin extends Component {

Bulletins de notes

+ {this.state.loading === true && this.state.loaded === false && + + } {this.state.loaded === true &&
diff --git a/src/ScoDoc/GestionSemestre/Etudiants.js b/src/ScoDoc/GestionSemestre/Etudiants.js index 9647c1c..63ad610 100644 --- a/src/ScoDoc/GestionSemestre/Etudiants.js +++ b/src/ScoDoc/GestionSemestre/Etudiants.js @@ -3,6 +3,7 @@ import {LazyLoadImage} from 'react-lazy-load-image-component'; import '../Style.css' import {Link} from "react-router-dom"; import {getJson} from "../Request"; +import {Spinner} from "react-bootstrap"; /** Page de présentation des étudiants inscrits au semestre */ class Etudiants extends Component { @@ -15,7 +16,18 @@ class Etudiants extends Component { } componentWillMount() { - this.getData() + // this.getData() + } + + componentDidUpdate(prevProps) { + if (prevProps !== this.props) { + if (this.props.students.length) { + const dat = this.props.students.map((x,i) => { + return i % 2 === 0 ? this.props.students.slice(i, i+2) : null; + }).filter(x => x != null); + this.setState({ students: dat}); + } + } } /** @@ -40,30 +52,36 @@ class Etudiants extends Component {

Liste des étudiants

- {this.state.students.map((students) => { - // Creation du tableau de deux colonnes - return ( -
+ {this.state.students.length !== 0 ? + this.state.students.map((students) => { + // Creation du tableau de deux colonnes + return ( +
{students.map((etud, index) => { return (
{/* Recuperation de la photo de l'etudiant */} - {' '}
- {etud.nom_disp} {etud.prenom} + />{' '}
+ {etud.nom_disp} {etud.prenom}
) })}
- ) - })} + ) + }) + : +
+ +
+ }
)