diff --git a/package.json b/package.json
index 5d4da3637a8a8ab81752cd793f77542ec1f82262..b058ad52d0439fac1ea5b67a30e3f1c0cdb43bd2 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "kszkepzes-frontend",
"version": "0.1.0",
- "proxy": "http://127.0.0.1:8000",
+ "proxy": "http://127.0.0.1:8000/",
"private": true,
"dependencies": {
"axios": "^0.17.1",
diff --git a/src/actions/auth.js b/src/actions/auth.js
index ba8f7d9db5bafbf3509856bb16d95aa31eee127d..30b176a967fa847546eed68669c80cb0ef88ce2b 100644
--- a/src/actions/auth.js
+++ b/src/actions/auth.js
@@ -1,5 +1,7 @@
+// TODO: Separate actions
+
import ax from 'axios';
-import { GET_USERDATA, PROFILE_CHANGE, GROUP_CHANGE, LOGOUT } from './types';
+import { GET_USERDATA, PROFILE_CHANGE, GROUP_CHANGE, LOGOUT, GET_NEWS } from './types';
const axios = ax.create({
xsrfCookieName: 'csrftoken',
@@ -21,6 +23,16 @@ export const getUserData = () => (
}
);
+export const getNews = () => (
+ async (dispatch) => {
+ const news = await axios.get('/api/v1/news');
+ dispatch({
+ type: GET_NEWS,
+ payload: news,
+ });
+ }
+);
+
export const textChange = ({ target: { name, value } }) => (
(dispatch) => {
dispatch({ type: PROFILE_CHANGE, payload: value, target: name });
diff --git a/src/actions/types.js b/src/actions/types.js
index af56763f7a340fd50dc8bed5a6c5e5e31c2fdb86..f6891993f91473e63639fbcf6456ea863cdec3be 100644
--- a/src/actions/types.js
+++ b/src/actions/types.js
@@ -1,4 +1,7 @@
export const GET_USERDATA = 'get_userdata';
+export const GET_NEWS = 'get_news';
+
export const PROFILE_CHANGE = 'profile_change';
export const GROUP_CHANGE = 'group_change';
+
export const LOGOUT = 'logout';
diff --git a/src/components/Header.js b/src/components/Header.js
index d8abfc4f0303acae7d30f1e700e05a4f29b5f74f..ebdd23e9d6c281f611a13ee8ad48b6326e7a570f 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -15,18 +15,12 @@ import KSZKlogo from './images/kszk_logo.svg';
const FixedMenu = ({ user }) => (
<Menu fixed='top' size='large' pointing>
<Container>
- <Menu.Item as={NavLink} to='/home'>
- FĹoldal
- </Menu.Item>
- <Menu.Item as={NavLink} to='/circles'>
- KĂśreink
- </Menu.Item>
- <Menu.Item as={NavLink} to='/trainers'>
- KĂŠpzĹk
- </Menu.Item>
- <Menu.Item as={NavLink} to='/schedule'>
- Ătemterv
- </Menu.Item>
+ <Menu.Item as={NavLink} to='/home'>FĹoldal</Menu.Item>
+ <Menu.Item as={NavLink} to='/news'>HĂrek</Menu.Item>
+ <Menu.Item as={NavLink} to='/circles'>KĂśreink</Menu.Item>
+ <Menu.Item as={NavLink} to='/trainers'>KĂŠpzĹk</Menu.Item>
+ <Menu.Item as={NavLink} to='/schedule'>Ătemterv</Menu.Item>
+
<Menu.Menu position='right'>
<Menu.Item className='item'>
{
@@ -85,15 +79,11 @@ class Header extends Component {
/>
FĹoldal
</Menu.Item>
- <Menu.Item as={NavLink} to='/circles'>
- KĂśreink
- </Menu.Item>
- <Menu.Item as={NavLink} to='/trainers'>
- KĂŠpzĹk
- </Menu.Item>
- <Menu.Item as={NavLink} to='/schedule'>
- Ătemterv
- </Menu.Item>
+ <Menu.Item as={NavLink} to='/news'>HĂrek</Menu.Item>
+ <Menu.Item as={NavLink} to='/circles'>KĂśreink</Menu.Item>
+ <Menu.Item as={NavLink} to='/trainers'>KĂŠpzĹk</Menu.Item>
+ <Menu.Item as={NavLink} to='/schedule'>Ătemterv</Menu.Item>
+
<Menu.Item position='right'>
{
this.props.user.id ?
@@ -102,9 +92,7 @@ class Header extends Component {
<Button onClick={() => this.props.logout()} icon='sign out' />
</Button.Group>
:
- <Button as='a' href='/api/v1/login/authsch/' inverted>
- BejelentkezĂŠs
- </Button>
+ <Button as='a' href='/api/v1/login/authsch/' inverted>BejelentkezĂŠs</Button>
}
</Menu.Item>
</Menu>
diff --git a/src/components/Main.js b/src/components/Main.js
index dfc391debf8dde4eaf090c7708f0656275ebc57e..cd91904eb824332ee0e9305c8f581540b1c9241a 100644
--- a/src/components/Main.js
+++ b/src/components/Main.js
@@ -1,5 +1,6 @@
import React from 'react';
import { Switch, Route, Redirect, withRouter } from 'react-router-dom';
+
import Home from './pages/Home';
import Trainers from './pages/Trainers';
import Schedule from './pages/Schedule';
@@ -7,11 +8,13 @@ import NotFound from './pages/NotFound';
import Profile from './pages/Profile';
import Statistics from './pages/Statistics';
import Circles from './pages/Circles';
+import News from './pages/News';
const Main = () => (
<Switch>
<Redirect exact from='/' to='/home' />
<Route exact path='/home' component={Home} />
+ <Route path='/news' component={News} />
<Route path='/trainers' component={Trainers} />
<Route path='/schedule' component={Schedule} />
<Route path='/profile' component={withRouter(Profile)} />
diff --git a/src/components/pages/Home.css b/src/components/pages/Home.css
index 727ae7b87d942d04b884fd3916d4cb361bb7bedf..05a7b5d8795907394e63418e9a72a1f0d92ef126 100644
--- a/src/components/pages/Home.css
+++ b/src/components/pages/Home.css
@@ -7,6 +7,6 @@
width: 100%;
top: 0px;
-webkit-text-fill-color: white;
- -webkit-text-stroke-color: black;
+ -webkit-text-stroke-color: #888888;
-webkit-text-stroke-width: 0.75px;
}
diff --git a/src/components/pages/Home.js b/src/components/pages/Home.js
index d3237acb0749a6398976417515b9c165659b2be2..262b165e19f91d2c7d1c8681bed209852d57b2df 100644
--- a/src/components/pages/Home.js
+++ b/src/components/pages/Home.js
@@ -10,6 +10,7 @@ import {
} from 'semantic-ui-react';
import { connect } from 'react-redux';
import Slider from 'react-slick';
+import { Link } from 'react-router-dom';
import './Home.css';
import KSZKbiglogo from '../images/kszk_big_logo.png';
@@ -103,7 +104,8 @@ class Home extends Component {
{
this.props.user.id ?
<Button
- href='/profile'
+ as={Link}
+ to='/profile'
primary
size='huge'
style={{
@@ -112,7 +114,7 @@ class Home extends Component {
marginBottom: '1vw',
}}
>
- Profilom
+ JelentkezĂŠs
<Icon name='right arrow' />
</Button>
:
diff --git a/src/components/pages/News.js b/src/components/pages/News.js
new file mode 100644
index 0000000000000000000000000000000000000000..98ec6369dab3b8bc9d335b10a2fdcc60e82a08ae
--- /dev/null
+++ b/src/components/pages/News.js
@@ -0,0 +1,59 @@
+import React, { Component } from 'react';
+import { Container, Header, Segment, Divider } from 'semantic-ui-react';
+import { connect } from 'react-redux';
+
+import { getNews } from '../../actions';
+
+class News extends Component {
+
+ componentWillMount() {
+ this.props.getNews();
+ }
+
+ render_news() {
+ const news = this.props.news;
+ console.log(news);
+
+ return news.map( (item, index) => (
+ <div key={index}>
+ { index > 0 ? <Divider /> : ''}
+ <Header as='h3' style={{ fontSize: '2em' }}>{item.title}</Header>
+ <p style={{ fontSize: '1.33em' }}>{item.text}</p>
+ </div>
+ ));
+
+ }
+
+ render() {
+ return (
+ <div>
+ <Segment inverted textAlign='center' vertical>
+ <Container>
+ <Header
+ as='h1'
+ content='HĂrek'
+ inverted
+ style={{
+ fontSize: '3em',
+ fontWeight: 'normal',
+ marginBottom: 0,
+ marginTop: '0.5em',
+ }}
+ />
+ </Container>
+ </Segment>
+
+ <Segment style={{ padding: '8em 0em' }} vertical>
+ <Container text>
+ {this.render_news()}
+ </Container>
+ </Segment>
+ </div>
+ );
+ }
+}
+
+
+const mapStateToProps = ({ news }) => ({ news });
+
+export default connect(mapStateToProps, { getNews })(News);
diff --git a/src/components/pages/Profile.js b/src/components/pages/Profile.js
index 0389ad99bbfb410b655d4bec1cf93a469e8317cc..17a77df316b2935c071e53b1b9177d97441a986e 100644
--- a/src/components/pages/Profile.js
+++ b/src/components/pages/Profile.js
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import { Container, Segment, Form, Dropdown, Divider } from 'semantic-ui-react';
+import { Container, Segment, Form, Dropdown, Divider, Header } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { textChange, submitRegistration, groupChange } from '../../actions';
@@ -23,56 +23,64 @@ class Profile extends Component {
nick, groups, motivation, signed, id,
} = this.props;
return (
- <div>
- <Segment textAlign='center' vertical>
- <Container>
- <Form>
- <Divider horizontal>BecenĂŠv</Divider>
- <Form.Input
- fluid
- name='nick'
- onChange={e => this.props.textChange(e)}
- placeholder='BecenĂŠv'
- value={nick}
- />
- <Divider horizontal>MotivĂĄciĂłs levĂŠl</Divider>
- <Form.TextArea
- rows={10}
- name='motivation'
- onChange={e => this.props.textChange(e)}
- placeholder='MiĂŠrt szeretnĂŠk jelentkezni...'
- value={motivation}
- />
- <Divider horizontal>Ărdekelt KĂśrĂśk</Divider>
- <Dropdown
- fluid
- multiple
- selection
- placeholder='DevTeam, ...'
- onChange={(_, v) => this.props.groupChange(v.value)}
- options={options}
- defaultValue={groups}
- />
- <br />
- <Form.Checkbox
- name='signed'
- label='SzeretnĂŠk jelentkezni a KSZK-ba'
- onChange={(_, v) =>
- this.props.textChange({ target: { name: v.name, value: v.checked } })
- }
- checked={signed}
- />
- <Form.Button
- onClick={() => this.props.submitRegistration({
- nick, motivation, signed, groups, id,
- })}
- >
- MentĂŠs
- </Form.Button>
- </Form>
- </Container>
+ <Container
+ style={{
+ marginBottom: '0.5em',
+ marginTop: '0.5em',
+ }}
+ >
+ <Divider horizontal>
+ <Header as='h2' content='Profil (JelentkezĂŠs)' />
+ </Divider>
+ <Segment textAlign='center'>
+ <Form>
+ <Divider horizontal>BecenĂŠv</Divider>
+ <Form.Input
+ fluid
+ name='nick'
+ onChange={e => this.props.textChange(e)}
+ placeholder='BecenĂŠv'
+ value={nick}
+ />
+
+ <Divider horizontal>MotivĂĄciĂłs levĂŠl</Divider>
+ <Form.TextArea
+ rows={10}
+ name='motivation'
+ onChange={e => this.props.textChange(e)}
+ placeholder='MiĂŠrt szeretnĂŠk jelentkezni...'
+ value={motivation}
+ />
+
+ <Divider horizontal>Ărdekelt KĂśrĂśk</Divider>
+ <Dropdown
+ fluid
+ multiple
+ selection
+ placeholder='DevTeam, ...'
+ onChange={(_, v) => this.props.groupChange(v.value)}
+ options={options}
+ defaultValue={groups}
+ />
+ <br />
+ <Form.Checkbox
+ name='signed'
+ label='SzeretnĂŠk jelentkezni a KSZK-ba'
+ onChange={(_, v) =>
+ this.props.textChange({ target: { name: v.name, value: v.checked } })
+ }
+ checked={signed}
+ />
+ <Form.Button
+ onClick={() => this.props.submitRegistration({
+ nick, motivation, signed, groups, id,
+ })}
+ >
+ MentĂŠs
+ </Form.Button>
+ </Form>
</Segment>
- </div>
+ </Container>
);
}
}
diff --git a/src/reducers/NewsReducer.js b/src/reducers/NewsReducer.js
new file mode 100644
index 0000000000000000000000000000000000000000..a1f1497ded94643758880ed039b202ea417d0d64
--- /dev/null
+++ b/src/reducers/NewsReducer.js
@@ -0,0 +1,12 @@
+import { GET_NEWS } from '../actions/types';
+
+const INITIAL_STATE = [];
+
+export default (state = INITIAL_STATE, action) => {
+ switch (action.type) {
+ case GET_NEWS:
+ return [ ...state, ...action.payload.data ];
+ default:
+ return state;
+ }
+};
diff --git a/src/reducers/index.js b/src/reducers/index.js
index 4efaaedff82e2b3d46a25e5b9bea99a57e6faf02..8fa74b2a23a02498d8b8bc2761cb63e34c4d9e8c 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -1,8 +1,10 @@
import { combineReducers } from 'redux';
import UserReducer from './UserReducer';
+import NewsReducer from './NewsReducer';
const rootReducer = combineReducers({
user: UserReducer,
+ news: NewsReducer,
});
export default rootReducer;