Skip to content
This repository was archived by the owner on Feb 19, 2019. It is now read-only.
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4,964 changes: 619 additions & 4,345 deletions frontend/package-lock.json

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
"material-ui": "^1.0.0-beta.35",
"material-ui-icons": "^1.0.0-beta.17",
"material-ui-pickers": "^1.0.0-rc.3",
"moment": "^2.21.0",
"prop-types": "^15.6.0",
"react": "^16.2.0",
"react-dom": "^16.2.0",
Expand Down
2 changes: 1 addition & 1 deletion frontend/public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<meta name="theme-color" content="#000000">
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<title>EBM Boilerplate</title>
<title>EBM SAGG</title>
</head>
<body>
<noscript>
Expand Down
4 changes: 2 additions & 2 deletions frontend/public/manifest.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"short_name": "EBM Boilerplate",
"name": "EBM Boilerplate",
"short_name": "EBM SAGG",
"name": "EBM SAGG",
"icons": [
{
"src": "favicon.ico",
Expand Down
4 changes: 3 additions & 1 deletion frontend/src/components/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import GlobalAppBar from './GlobalAppBar';
import TabBar from './TabBar'
import AttendanceSheetContent from './AttendanceSheetContent';
import GroupsContent from "./GroupsContent";
import MyCoursesContent from "./MyCoursesContent";

const styles = theme => ({
root: {
Expand Down Expand Up @@ -47,11 +48,12 @@ class App extends Component {


<Reboot/>
<GlobalAppBar appTitle="EBM Boilerplate" hasTabBarBelow/>
<GlobalAppBar appTitle="EBM SAGG" hasTabBarBelow/>
<TabBar onTabChange={this.handleTabChange} tabValue={this.state.tabSelected}/>
{/* You should work mainly in the Content component */}
{this.state.tabSelected === 0 ? <AttendanceSheetContent className={classes.content}/> : null}
{this.state.tabSelected === 1 ? <GroupsContent className={classes.content}/> : null}
{this.state.tabSelected === 2 ? <MyCoursesContent className={classes.content}/> : null}


</MuiThemeProvider>
Expand Down
169 changes: 169 additions & 0 deletions frontend/src/components/DetailCourse.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,169 @@
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import { withStyles } from 'material-ui/styles';
import List, { ListItem, ListItemText } from 'material-ui/List';
import Avatar from 'material-ui/Avatar';
import { Dialog, AppBar, Toolbar, IconButton, Typography, Divider } from 'material-ui';
import SchoolIcon from 'material-ui-icons/School';
import AssignmentIcon from 'material-ui-icons/Assignment';
import CloseIcon from 'material-ui-icons/Close';
import UpdateIcon from 'material-ui-icons/Update';
import PeopleIcon from 'material-ui-icons/People';
import lightBlue from 'material-ui/colors/lightBlue';
import moment from 'moment';
import { apiRoute, testTokenProf } from '../config/routes';


const styles = theme => ({
root: {
width: '100%',
backgroundColor: theme.palette.background.paper,
},
avatar: {
margin: 10,
},
blueAvatar: {
margin: 10,
cursor: 'pointer',
color: '#fff',
backgroundColor: lightBlue[500],
},
redAvatar: {
margin: 10,
cursor: 'pointer',
color: '#fff',
backgroundColor: '#F44336',
},
row: {
display: 'flex',
justifyContent: 'center',
},
});

class DetailCourses extends PureComponent {

static propTypes = {
className: PropTypes.string
};

static defaultProps = {
className: ''
};

state = {
open: false,
memberDetail: {}
}
handleClickOpen = (param, e) => {
this.setState({
open: true,
memberDetail: param
});
};

handleClose = () => {
this.setState({ open: false });
};

render() {
const {classes} = this.props;
return (
<div
style={{
marginTop: '10px'
}}
className={classes.root}>
<List>
<ListItem>
<Avatar>
<AssignmentIcon />
</Avatar>
<ListItemText primary="Nom du cours" secondary={this.props.cours.title} />
</ListItem>
<ListItem>
<Avatar>
<SchoolIcon />
</Avatar>
<ListItemText primary="Professeur responsable" secondary={this.props.cours.teacher} />
</ListItem>
<ListItem>
<Avatar>
<UpdateIcon />
</Avatar>
<ListItemText primary="Dates"
secondary={`le ${moment(this.props.cours.start_time).format('DD/MM')}
de ${moment(this.props.cours.start_time).format('HH:mm')} à
${moment(this.props.cours.end_time).format('HH:mm')} `} />
</ListItem>
<ListItem>
<Avatar>
<PeopleIcon />
</Avatar>
<ListItemText primary="Elèves" secondary="Liste des élèves associé à ce cours" />
</ListItem>

</List>
<div className={classes.row}>
{ this.props.cours.attendees ?
this.props.cours.attendees.map(e =>
// fetch(`${apiRoute.linkapp}/pictures/file/${e.username}`, {
// method: 'GET',
// headers : {
// 'Authorization': testTokenProf.access_token
// }
// })
// .then((response) => console.log(response) || response.json() )
// .then(data => {
// console.log(data);
// })
<Avatar
key={e._id}
className={e.ishere ? classes.blueAvatar : classes.redAvatar }
onClick={this.handleClickOpen.bind(this, e)}>
{ e.username ? e.username.substring(0,1).toUpperCase() : '' }
</Avatar>
)
: '' }
</div>
<Dialog
open={this.state.open}
onClose={this.handleClose}
>
<AppBar className={classes.appBar}>
<Toolbar>
<IconButton color="inherit" onClick={this.handleClose} aria-label="Close">
<CloseIcon />
</IconButton>
<Typography variant="title" color="inherit" className={classes.flex}>
{ this.state.memberDetail.firstname && this.state.memberDetail.lastname ?
`${this.state.memberDetail.firstname} ${this.state.memberDetail.lastname}` :
'' }
</Typography>
</Toolbar>
</AppBar>
<h3 style={{ textAlign: 'center'}}>
{ this.state.memberDetail.firstname && this.state.memberDetail.lastname ?
`${this.state.memberDetail.firstname} ${this.state.memberDetail.lastname}` :
'' }
</h3>
<List>
<ListItem button>
<ListItemText primary="Commentaire" secondary={ this.state.memberDetail.comments ? this.state.memberDetail.comments : 'Pas de commentaire' } />
</ListItem>
<Divider />
<p style={{
textAlign: 'center',
color: this.state.memberDetail.ishere ? lightBlue[500]: '#F44336'
}} >
{ this.state.memberDetail.ishere ?
'Présent à ce cours' : 'Absent à ce cours'
}
</p>
</List>
</Dialog>
</div>
);
}
}

export default withStyles(styles)(DetailCourses);
31 changes: 31 additions & 0 deletions frontend/src/components/MyCourses.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import React, {Component} from 'react';
import {withStyles} from 'material-ui';


const styles = theme => ({
root: {
width: "150px",
height: "150px",
border: "4px solid black",
borderRadius: "10px"
}


});

class Course extends Component {


render() {
const {classes} = this.props;


return (
<div style={classes.root}/>
);
}


}

export default withStyles(styles)(Course);
100 changes: 100 additions & 0 deletions frontend/src/components/MyCoursesContent.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,100 @@
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import Select from 'material-ui/Select'
import { MenuItem } from 'material-ui/Menu';
import { InputLabel, Typography } from 'material-ui';
import DetailCourse from './DetailCourse';
import { apiRoute, testTokenProf } from '../config/routes';


class promotionsContent extends PureComponent {

static propTypes = {
className: PropTypes.string
};

static defaultProps = {
className: ''
};

handlepromotionselect = event => {
console.log(event.target.value);
fetch(`${apiRoute.sagg}/promos/${event.target.value}/courses`, {
Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

c'est bien .sagg et pas local

method: 'GET',
headers : {
'Authorization': testTokenProf.access_token
}
})
.then((response) => console.log(response) || response.json() )
.then(data => {
this.setState({ selectedCourse: data.courses,
selectedPromo: this.state.promotions.find(e => e._id === event.target.value) })
})
};

componentDidMount() {
fetch(`${apiRoute.linkapp}/promos/listpromoofresponsable`, {
method: 'GET',
headers : {
'Authorization': testTokenProf.access_token
}
})
.then((response) => console.log(response) || response.json() )
.then(data => {
this.setState({ promotions: data.promotions })
})
}
constructor(props) {
super(props);
this.state = {
showButton: true,
showCourseForm: false,
showAttendanceSheet: false,
value: 1,
selectedCourse: false,
open: false,
promotions: []
};
}

render() {
return (
<div align="center">
<InputLabel htmlFor="promotions-simple">
<h3>{this.state.selectedPromo ? this.state.selectedPromo.nomPromo
: 'Veuillez sélectionner une promo'}
</h3>
</InputLabel>
<Select
onChange={this.handlepromotionselect}
value={this.state.selectedCourse._id || ''}
inputProps={{
name: 'selectedCourse',
id: 'promotions-simple',
}}
style={{
width: '75%',
textAlign: 'center'
}}
>
{ this.state.promotions ?
this.state.promotions.map(option =>
<MenuItem key={option._id}
value={option._id}>
{option.nomPromo}
</MenuItem>) : '' }
</Select>
{this.state.selectedCourse ?
this.state.selectedCourse.map(e =>
<DetailCourse
cours={e}
key={e._id}
/>
)
: '' }
</div>
)
}
}

export default promotionsContent;
Loading