ScoDocMobile/src/ScoDoc/Etudiant.js

144 lines
7.0 KiB
JavaScript

import React, {Component} from "react";
import './Style.css'
import ScoNavBar from "./ScoNavBar";
class Etudiant extends Component {
constructor(props) {
super(props);
this.state = {
// Données de l'étudiant
etud: {},
// Formation actuelle de l'étudiant
formation: [],
// Semestres correspondant a la formation de l'étudiant
semestres: [],
loaded: false
};
}
componentWillMount() {
let dept = window.location.href.split('/')[6]
let etudid = window.location.href.split('/')[9]
let BASE_URL = window.$api_url
fetch(BASE_URL + dept + '/Scolarite/Notes/etud_info?format=json&etudid=' + etudid, {
method: 'GET',
verify: false,
credentials: 'include',
})
.then(response =>
// Traitement des données JSON
response.json().then(data => ({
data: data,
status: response.status
})
).then(res => {
this.setState({ etud: res.data })
this.setState({ formation: res.data.insemestre })
// Recuperation des données de semestres pour la formation d'un étudiant
res.data.insemestre.map((sem, index) => {
fetch(BASE_URL + dept + '/Scolarite/Notes/formsemestre_list?format=json&formsemestre_id=' + sem.formsemestre_id, {
method: 'GET',
verify: false,
credentials: 'include',
})
.then(response =>
response.json().then(data => ({
// Traitement des données JSON
data: data,
status: response.status
}))
).then(res => {
let joined = this.state.semestres.concat(res.data[0]);
this.setState({ semestres: joined, loaded: true })
})
})
})
);
}
render() {
return(
<div>
<ScoNavBar/>
<div className="wrapper">
<div id="wrapDept">
<h1>{this.state.etud.nomprenom}</h1>
<img
alt={`${this.state.etud.nomprenom}`}
src={`/ScoDoc/${window.location.href.split('/')[6]}/Scolarite/Notes/${this.state.etud.photo_url}`}
width="102"
height="128"
className="d-inline-block align-top"
/>{' '}
<div id="wrapDept" className="col-sm">
<h3>Informations personnelles</h3>
{this.state.etud.telephone !== "" || this.state.etud.telephonemobile !== "" ||
this.state.etud.email !== "" || this.state.etud.emailperso !== "" ?
<div className="col-sm">
<h4>Contact</h4>
{this.state.etud.telephone !== "" && <a href={'tel:' + this.state.etud.telephone}>Téléphone: {this.state.etud.telephone}</a>}<br/>
{this.state.etud.telephonemobile !== "" && <a href={'tel:' + this.state.etud.telephonemobile}>Mobile: {this.state.etud.telephonemobile}</a>}<br/>
{this.state.etud.email !== "" && <a href={'mailto:' + this.state.etud.email}>Mail étudiant: {this.state.etud.email}</a>}<br/>
{this.state.etud.emailperso !== "" && <a href={'mailto:' + this.state.etud.emailperso}>Mail personnel: {this.state.etud.emailperso}</a>}<br/>
</div>
:
<div className="col-sm">Aucun contact disponible</div>
}
{this.state.etud.domicile !== "" || this.state.etud.codepostaldomicile !== "" ||
this.state.etud.villedomicile !== "" ?
<div className="col-sm">
<h4>Lieu de résidence</h4>
Domicile: {this.state.etud.domicile} -
{" " + this.state.etud.codepostaldomicile} {this.state.etud.villedomicile}<br/>
</div>
:
<div className="col-sm">Aucune information de résidence disponible</div>
}
</div>
<div id="wrapDept" className="col-sm">
{this.state.etud.bac !== "" || this.state.etud.specialite !== "" ?
<div className="col-sm">
<h4>Parcours</h4>
Bac {this.state.etud.bac} {this.state.etud.specialite}
{this.state.etud.nomlycee !== "" || this.state.etud.codepostallycee !== "" ||
this.state.etud.villelycee !== "" ?
<div>
{" " + this.state.etud.nomlycee} ({this.state.etud.codepostallycee} {this.state.etud.villelycee})<br/>
</div>
: null}
</div>
: null}
{this.state.loaded === true &&
<div className="col-sm">
<h4>Formation actuelle</h4>
{this.state.semestres.map((sem, index) => {
return (
<div>
<b>{sem.titreannee}</b><br/>
{sem.date_debut} - {sem.date_fin}
</div>
)
})}
</div>
}
</div>
{/* TODO: Lien vers la gestion des absences
<div id="wrapDept" className="col-sm">
<Link to="">
<div className="col-sm">
Gestion des absences
</div>
</Link>
</div>
*/}
</div>
</div>
</div>
)
}
}
export default Etudiant