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 {
    constructor(props) {
        super(props);
        this.state = {
            semestre: {},
            resp: [],
            loading: true
        };
    }

    componentWillMount() {
        this.setState({loading: true})
        this.getData()
    }

    /**
     * Recupère les données du semestre selectionné depuis l'API
     */
    getData() {
        let dept = window.location.href.split('/')[7]
        let sem = window.location.href.split('/')[9]
        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], resp: res.data[0].responsables, loading: false});
            });
    }

    render() {
        return (
            <div className="wrapper">
                {this.state.loading === false ?
                    <h1 id="pageTitle">{this.state.semestre.titre}<br/>
                        Semestre {this.state.semestre.semestre_id} en {this.state.semestre.modalite}<br/>
                        {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 + ")")}
                        })}
                    </h1>
                :
                    <Spinner animation="border"/>
                }
            </div>
        )
    }
}

export default Accueil