Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Julien Jerphanion
Rex Dri
Commits
a42accc9
Commit
a42accc9
authored
Sep 07, 2018
by
Florent Chehab
Browse files
Filter merged with map and search
parent
4264ef36
Changes
6
Show whitespace changes
Inline
Side-by-side
frontend/src/components/App.js
View file @
a42accc9
...
@@ -14,7 +14,7 @@ import Chip from '@material-ui/core/Chip';
...
@@ -14,7 +14,7 @@ import Chip from '@material-ui/core/Chip';
import
Avatar
from
'
@material-ui/core/Avatar
'
;
import
Avatar
from
'
@material-ui/core/Avatar
'
;
import
ChevronLeftIcon
from
'
@material-ui/icons/ChevronLeft
'
;
import
ChevronLeftIcon
from
'
@material-ui/icons/ChevronLeft
'
;
import
SchoolIcon
from
'
@material-ui/icons/School
'
;
import
SchoolIcon
from
'
@material-ui/icons/School
'
;
import
{
mainListItems
,
secondaryListItems
}
from
'
./template/listItems
'
;
import
{
mainListItems
,
secondaryListItems
,
thirdListItems
}
from
'
./template/listItems
'
;
import
{
connect
}
from
"
react-redux
"
;
import
{
connect
}
from
"
react-redux
"
;
import
MyComponent
from
'
./MyComponent
'
import
MyComponent
from
'
./MyComponent
'
...
@@ -34,7 +34,6 @@ import {
...
@@ -34,7 +34,6 @@ import {
import
PageMap
from
'
./pages/PageMap
'
;
import
PageMap
from
'
./pages/PageMap
'
;
import
PageHome
from
'
./pages/PageHome
'
;
import
PageHome
from
'
./pages/PageHome
'
;
import
PageUniversity
from
'
./pages/PageUniversity
'
;
import
PageUniversity
from
'
./pages/PageUniversity
'
;
import
PageFilter
from
'
./pages/PageFilter
'
;
import
PageSearch
from
'
./pages/PageSearch
'
;
import
PageSearch
from
'
./pages/PageSearch
'
;
import
PageSettings
from
'
./pages/PageSettings
'
;
import
PageSettings
from
'
./pages/PageSettings
'
;
...
@@ -161,6 +160,8 @@ class App extends MyComponent {
...
@@ -161,6 +160,8 @@ class App extends MyComponent {
<
List
>
{
mainListItems
}
<
/List
>
<
List
>
{
mainListItems
}
<
/List
>
<
Divider
/>
<
Divider
/>
<
List
>
{
secondaryListItems
}
<
/List
>
<
List
>
{
secondaryListItems
}
<
/List
>
<
Divider
/>
<
List
>
{
thirdListItems
}
<
/List
>
<
/Drawer
>
<
/Drawer
>
<
main
className
=
{
classNames
(
classes
.
content
,
classes
.
noPaddingTop
)}
>
<
main
className
=
{
classNames
(
classes
.
content
,
classes
.
noPaddingTop
)}
>
...
@@ -168,7 +169,6 @@ class App extends MyComponent {
...
@@ -168,7 +169,6 @@ class App extends MyComponent {
<
Route
path
=
"
/app/
"
exact
=
{
true
}
component
=
{
PageHome
}
/
>
<
Route
path
=
"
/app/
"
exact
=
{
true
}
component
=
{
PageHome
}
/
>
<
Route
path
=
"
/app/search
"
component
=
{
PageSearch
}
/
>
<
Route
path
=
"
/app/search
"
component
=
{
PageSearch
}
/
>
<
Route
path
=
"
/app/map
"
component
=
{
PageMap
}
/
>
<
Route
path
=
"
/app/map
"
component
=
{
PageMap
}
/
>
<
Route
path
=
"
/app/filter
"
component
=
{
PageFilter
}
/
>
<
Route
path
=
"
/app/settings
"
component
=
{
PageSettings
}
/
>
<
Route
path
=
"
/app/settings
"
component
=
{
PageSettings
}
/
>
<
Route
<
Route
exact
exact
...
...
frontend/src/components/filter/Filter.js
View file @
a42accc9
...
@@ -5,6 +5,13 @@ import MyComponent from '../MyComponent'
...
@@ -5,6 +5,13 @@ import MyComponent from '../MyComponent'
import
{
connect
}
from
"
react-redux
"
;
import
{
connect
}
from
"
react-redux
"
;
import
_
from
'
underscore
'
;
import
_
from
'
underscore
'
;
import
{
saveSelectedUniversities
,
saveFilterConfig
}
from
'
../../actions/filter
'
;
import
{
saveSelectedUniversities
,
saveFilterConfig
}
from
'
../../actions/filter
'
;
import
ExpansionPanel
from
'
@material-ui/core/ExpansionPanel
'
;
import
ExpansionPanelSummary
from
'
@material-ui/core/ExpansionPanelSummary
'
;
import
ExpansionPanelDetails
from
'
@material-ui/core/ExpansionPanelDetails
'
;
import
ExpandMoreIcon
from
'
@material-ui/icons/ExpandMore
'
;
import
Typography
from
'
@material-ui/core/Typography
'
;
import
{
withStyles
}
from
'
@material-ui/core/styles
'
;
import
{
import
{
universitiesFetchData
,
universitiesFetchData
,
...
@@ -13,25 +20,24 @@ import {
...
@@ -13,25 +20,24 @@ import {
countriesFetchData
countriesFetchData
}
from
'
../../generated/actions
'
;
}
from
'
../../generated/actions
'
;
const
styles
=
theme
=>
({
root
:
{
width
:
'
100%
'
,
},
heading
:
{
fontSize
:
theme
.
typography
.
pxToRem
(
15
),
fontWeight
:
theme
.
typography
.
fontWeightRegular
,
},
});
class
Filter
extends
MyComponent
{
class
Filter
extends
MyComponent
{
saveContriesFilterConfig
(
state
)
{
saveContriesFilterConfig
(
state
)
{
this
.
props
.
saveConfig
({
contriesFilter
:
state
})
this
.
props
.
saveConfig
({
contriesFilter
:
state
})
}
}
// getUnivFromCampus(campus) {
// const { universities } = this.props;
// return universities[campus.univ]
// }
// getCountryFromUniversity(univ) {
// const { countries } = this.props;
// return countries[univ.country]
// }
// getCountryFromCampus(campus) {
// const univ = this.getUnivFromCampus(campus);
// return this.getCountryFromUniversity(univ);
// }
getCountriesWhereThereAreUniversities
()
{
getCountriesWhereThereAreUniversities
()
{
const
{
mainCampuses
}
=
this
.
getAllFetchedData
();
const
{
mainCampuses
}
=
this
.
getAllFetchedData
();
...
@@ -62,14 +68,21 @@ class Filter extends MyComponent {
...
@@ -62,14 +68,21 @@ class Filter extends MyComponent {
myRender
()
{
myRender
()
{
const
options
=
_
.
map
(
this
.
getCountriesWhereThereAreUniversities
(),
const
options
=
_
.
map
(
this
.
getCountriesWhereThereAreUniversities
(),
(
c
)
=>
{
return
{
id
:
c
.
iso_alpha2_code
,
label
:
c
.
name
}
})
(
c
)
=>
{
return
{
id
:
c
.
iso_alpha2_code
,
label
:
c
.
name
}
})
const
{
classes
}
=
this
.
props
;
return
(
return
(
<
ExpansionPanel
>
<
ExpansionPanelSummary
expandIcon
=
{
<
ExpandMoreIcon
/>
}
>
<
Typography
className
=
{
classes
.
heading
}
>
Appliquer
des
filtres
<
/Typography
>
<
/ExpansionPanelSummary
>
<
ExpansionPanelDetails
>
<
DownshiftMultiple
<
DownshiftMultiple
options
=
{
options
}
options
=
{
options
}
onChange
=
{(
selection
)
=>
this
.
updateSelectedUniversities
(
selection
)}
onChange
=
{(
selection
)
=>
this
.
updateSelectedUniversities
(
selection
)}
onComponentUnmount
=
{(
state
)
=>
this
.
saveContriesFilterConfig
(
state
)}
onComponentUnmount
=
{(
state
)
=>
this
.
saveContriesFilterConfig
(
state
)}
config
=
{
this
.
props
.
contriesFilterConfig
}
config
=
{
this
.
props
.
contriesFilterConfig
}
/
>
/
>
<
/ExpansionPanelDetails
>
<
/ExpansionPanel
>
);
);
}
}
}
}
...
@@ -100,4 +113,4 @@ const mapDispatchToProps = (dispatch) => {
...
@@ -100,4 +113,4 @@ const mapDispatchToProps = (dispatch) => {
};
};
export
default
connect
(
mapStateToProps
,
mapDispatchToProps
)(
Filter
);
export
default
connect
(
mapStateToProps
,
mapDispatchToProps
)(
withStyles
(
styles
)(
Filter
)
)
;
frontend/src/components/pages/PageFilter.js
deleted
100644 → 0
View file @
4264ef36
import
React
from
'
react
'
;
import
PropTypes
from
'
prop-types
'
;
import
{
withStyles
}
from
'
@material-ui/core/styles
'
;
import
Grid
from
'
@material-ui/core/Grid
'
;
import
Typography
from
'
@material-ui/core/Typography
'
;
import
Filter
from
'
../filter/Filter
'
;
import
Paper
from
'
@material-ui/core/Paper
'
;
const
styles
=
theme
=>
({
myPaper
:
{
padding
:
16
}
});
class
PageFilter
extends
React
.
Component
{
render
()
{
const
{
classes
}
=
this
.
props
;
return
(
<
Paper
className
=
{
classes
.
myPaper
}
>
<
Grid
container
spacing
=
{
24
}
>
<
Grid
item
xs
=
{
11
}
>
<
Typography
variant
=
"
display1
"
gutterBottom
>
Filtrer
<
/Typography
>
<
/Grid
>
{
/* <Grid item xs={1}>
<UnivMapReloadButton />
</Grid> */
}
<
/Grid
>
<
Filter
/>
<
/Paper
>
);
}
}
PageFilter
.
propTypes
=
{
classes
:
PropTypes
.
object
.
isRequired
,
};
export
default
withStyles
(
styles
)(
PageFilter
);
frontend/src/components/pages/PageMap.js
View file @
a42accc9
...
@@ -6,6 +6,7 @@ import Typography from '@material-ui/core/Typography';
...
@@ -6,6 +6,7 @@ import Typography from '@material-ui/core/Typography';
import
UnivMap
from
'
../map/UnivMap
'
;
import
UnivMap
from
'
../map/UnivMap
'
;
import
UnivMapReloadButton
from
'
../map/UnivMapReloadButton
'
;
import
UnivMapReloadButton
from
'
../map/UnivMapReloadButton
'
;
import
Paper
from
'
@material-ui/core/Paper
'
;
import
Paper
from
'
@material-ui/core/Paper
'
;
import
Filter
from
'
../filter/Filter
'
;
const
styles
=
theme
=>
({
const
styles
=
theme
=>
({
myPaper
:
{
myPaper
:
{
...
@@ -28,6 +29,7 @@ class PageMap extends React.Component {
...
@@ -28,6 +29,7 @@ class PageMap extends React.Component {
<
UnivMapReloadButton
/>
<
UnivMapReloadButton
/>
<
/Grid
>
<
/Grid
>
<
/Grid
>
<
/Grid
>
<
Filter
/>
<
UnivMap
/>
<
UnivMap
/>
<
/Paper
>
<
/Paper
>
);
);
...
...
frontend/src/components/pages/PageSearch.js
View file @
a42accc9
...
@@ -5,6 +5,7 @@ import Grid from '@material-ui/core/Grid';
...
@@ -5,6 +5,7 @@ import Grid from '@material-ui/core/Grid';
import
Typography
from
'
@material-ui/core/Typography
'
;
import
Typography
from
'
@material-ui/core/Typography
'
;
import
Search
from
'
../search/Search
'
;
import
Search
from
'
../search/Search
'
;
import
Paper
from
'
@material-ui/core/Paper
'
;
import
Paper
from
'
@material-ui/core/Paper
'
;
import
Filter
from
'
../filter/Filter
'
;
const
styles
=
theme
=>
({
const
styles
=
theme
=>
({
myPaper
:
{
myPaper
:
{
...
@@ -23,10 +24,8 @@ class PageSearch extends React.Component {
...
@@ -23,10 +24,8 @@ class PageSearch extends React.Component {
Recherche
d
'
une université
Recherche
d
'
une université
</Typography>
</Typography>
</Grid>
</Grid>
{/* <Grid item xs={1}>
<UnivMapReloadButton />
</Grid> */}
</Grid>
</Grid>
<Filter />
<Search />
<Search />
</Paper>
</Paper>
);
);
...
...
frontend/src/components/template/listItems.js
View file @
a42accc9
...
@@ -2,11 +2,9 @@ import React from 'react';
...
@@ -2,11 +2,9 @@ import React from 'react';
import
ListItem
from
'
@material-ui/core/ListItem
'
;
import
ListItem
from
'
@material-ui/core/ListItem
'
;
import
ListItemIcon
from
'
@material-ui/core/ListItemIcon
'
;
import
ListItemIcon
from
'
@material-ui/core/ListItemIcon
'
;
import
ListItemText
from
'
@material-ui/core/ListItemText
'
;
import
ListItemText
from
'
@material-ui/core/ListItemText
'
;
import
ListSubheader
from
'
@material-ui/core/ListSubheader
'
;
import
MapIcon
from
'
@material-ui/icons/Map
'
;
import
MapIcon
from
'
@material-ui/icons/Map
'
;
import
LocationCityIcon
from
'
@material-ui/icons/LocationCity
'
;
import
LocationCityIcon
from
'
@material-ui/icons/LocationCity
'
;
import
PeopleIcon
from
'
@material-ui/icons/People
'
;
import
PersonIcon
from
'
@material-ui/icons/Person
'
;
import
BarChartIcon
from
'
@material-ui/icons/BarChart
'
;
import
HomeIcon
from
'
@material-ui/icons/Home
'
;
import
HomeIcon
from
'
@material-ui/icons/Home
'
;
import
SearchIcon
from
'
@material-ui/icons/Search
'
;
import
SearchIcon
from
'
@material-ui/icons/Search
'
;
import
FilterIcon
from
'
@material-ui/icons/FilterList
'
;
import
FilterIcon
from
'
@material-ui/icons/FilterList
'
;
...
@@ -44,15 +42,6 @@ export const mainListItems = (
...
@@ -44,15 +42,6 @@ export const mainListItems = (
<
/ListItem
>
<
/ListItem
>
<
/NavLink
>
<
/NavLink
>
<
NavLink
to
=
{
'
/app/filter/
'
}
>
<
ListItem
button
>
<
ListItemIcon
>
<
FilterIcon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
Filtrer
"
/>
<
/ListItem
>
<
/NavLink
>
<
NavLink
to
=
{
'
/app/university/undefined
'
}
>
<
NavLink
to
=
{
'
/app/university/undefined
'
}
>
<
ListItem
button
>
<
ListItem
button
>
<
ListItemIcon
>
<
ListItemIcon
>
...
@@ -62,51 +51,37 @@ export const mainListItems = (
...
@@ -62,51 +51,37 @@ export const mainListItems = (
<
/ListItem
>
<
/ListItem
>
<
/NavLink
>
<
/NavLink
>
<
NavLink
to
=
{
'
/app/settings/
'
}
>
<
ListItem
button
>
<
ListItemIcon
>
<
SettingsIcon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
Paramètres
"
/>
<
/ListItem
>
<
/NavLink
>
<
ListItem
button
>
<
ListItemIcon
>
<
PeopleIcon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
????
"
/>
<
/ListItem
>
<
ListItem
button
>
<
ListItemIcon
>
<
BarChartIcon
/>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
???
"
/>
<
/ListItem
>
<
/div
>
<
/div
>
);
);
export
const
secondaryListItems
=
(
export
const
secondaryListItems
=
(
<
div
>
<
div
>
<
ListSubheader
inset
>
Mes
listes
<
/ListSubheader
>
<
ListItem
button
>
<
ListItem
button
>
<
ListItemIcon
>
<
ListItemIcon
>
<
AssignmentIcon
/>
<
AssignmentIcon
/>
<
/ListItemIcon
>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
L
iste
1
"
/>
<
ListItemText
primary
=
"
Mes l
iste
s
"
/>
<
/ListItem
>
<
/ListItem
>
<
ListItem
button
>
<
ListItem
button
>
<
ListItemIcon
>
<
ListItemIcon
>
<
Assignment
Icon
/>
<
Person
Icon
/>
<
/ListItemIcon
>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
Liste 2
"
/>
<
ListItemText
primary
=
"
Informations
"
/>
<
/ListItem
>
<
/ListItem
>
<
/div
>
);
export
const
thirdListItems
=
(
<
div
>
<
NavLink
to
=
{
'
/app/settings/
'
}
>
<
ListItem
button
>
<
ListItem
button
>
<
ListItemIcon
>
<
ListItemIcon
>
<
Assignment
Icon
/>
<
Settings
Icon
/>
<
/ListItemIcon
>
<
/ListItemIcon
>
<
ListItemText
primary
=
"
Liste 3
"
/>
<
ListItemText
primary
=
"
Paramètres
"
/>
<
/ListItem
>
<
/ListItem
>
<
/NavLink
>
<
/div
>
<
/div
>
);
);
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment