Fakultas Ilmu Komputer UI

Commit 366417b0 authored by Zamil Majdy's avatar Zamil Majdy
Browse files

[#140654507] #13 Enable js logic for register company

parent cd2d0c4a
import React from 'react';
import { Button, Checkbox, Form, Input, TextArea, Grid, Divider, Header, Icon, Card } from 'semantic-ui-react';
export default class companyRegister extends React.Component {
render = () => (
<div className="register">
<div className="registerForm">
<Card fluid >
<Card.Content>
<form encType="multipart/form-data" action="">
<Header as='h2' icon textAlign='center'>
<Icon name='signup' circular />
<Header.Content>
Register
</Header.Content>
</Header>
<Form.Field required>
<label>Email</label>
<Input type="text" id="email" icon='user' iconPosition='left' placeholder="email" required />
</Form.Field>
<Form.Field required>
<label>Password</label>
<Input type='password' id="password" icon='key' iconPosition='left' placeholder="password" required />
</Form.Field>
<Form.Field required>
<label>Konfirmasi Password</label>
<Input type='password' icon="key" iconPosition="left" placeholder='password' required />
</Form.Field>
<Form.Field required>
<label>Nama Perusahaan</label>
<Input placeholder='Nama Perusahaan' required />
</Form.Field>
<Form.Field required>
<label>Logo</label>
<Input type="File"
icon={{ name: 'attach', circular: true, link: true }}
placeholder='attach logo'
required
/>
</Form.Field>
<Form.Field required>
<label>Deskripsi</label>
<TextArea placeholder='Tell us more' required/>
</Form.Field>
<Form.Field required>
<label>Alamat</label>
<Input placeholder='Alamat' required />
</Form.Field>
<Form.Field required>
<label>Kota</label>
<Input placeholder='Kota' required />
</Form.Field>
<Form.Field required>
<label>Provinsi</label>
<Input placeholder='Provinsi' required />
</Form.Field >
<Button type='submit' floated='right' color='blue'>Submit</Button>
</form>
</Card.Content>
</Card>
</div>
</div>
)
}
...@@ -5,8 +5,8 @@ import { Segment } from 'semantic-ui-react'; ...@@ -5,8 +5,8 @@ import { Segment } from 'semantic-ui-react';
import Dashboard from './Dashboard'; import Dashboard from './Dashboard';
import Login from './Login'; import Login from './Login';
import VacancyPage from './VacancyPage'; import VacancyPage from './VacancyPage';
import CompanyRegister from './CompanyRegister';
import Server from './lib/Server'; import Server from './lib/Server';
import Storage from './lib/Storage';
export const Profile = () => ( export const Profile = () => (
<Segment> <Segment>
...@@ -28,15 +28,17 @@ export default class App extends React.Component { ...@@ -28,15 +28,17 @@ export default class App extends React.Component {
Server.isLoggedIn() || replace({ pathname: '/login' }) Server.isLoggedIn() || replace({ pathname: '/login' })
); );
handleHome= (nextState, replace) => ( handleHome= (nextState, replace) => {
Server.isLoggedIn() ? replace({ pathname: '/lowongan' }) : replace({ pathname: '/login' }) if (Server.isLoggedIn()) {
); Storage.get('user-data').student ? replace({pathname: '/lowongan'}) : replace({pathname: '/profile'});
} else {
replace({ pathname: '/login' });
}
};
render = () => ( render = () => (
<Router history={browserHistory}> <Router history={browserHistory}>
<Route path="/login" component={Login} /> <Route path="/login" component={Login} />
<Route path="/register" component={CompanyRegister} />
<Route component={Dashboard} onEnter={this.handleAuth}> <Route component={Dashboard} onEnter={this.handleAuth}>
<Route path="/" component={Profile} /> <Route path="/" component={Profile} />
<Route path="/profile" component={Profile} /> <Route path="/profile" component={Profile} />
......
import React from 'react'; import React from 'react';
import { Grid, Segment, Button, Header, Icon, Modal, Form, Input, TextArea, Card} from 'semantic-ui-react'; import { Grid, Segment, Card } from 'semantic-ui-react';
import LoginForm from './components/LoginForm'; import LoginForm from './components/LoginForm';
import RegisterModal from './components/RegisterModal';
export default class Login extends React.Component { export default class Login extends React.Component {
...@@ -18,100 +19,35 @@ export default class Login extends React.Component { ...@@ -18,100 +19,35 @@ export default class Login extends React.Component {
render = () => ( render = () => (
<div className="halamanLogin"> <div className="halamanLogin">
<Grid columns={2} relaxed> <Grid columns={2} relaxed>
<Grid.Column> <Grid.Column>
<Segment basic> <Segment basic>
<LoginForm type="company" header="Company Login" imgSrc="logo.png" imgSize="small" /> <LoginForm type="company" header="Company Login" imgSrc="logo.png" imgSize="small" />
{this.props.children} {this.props.children}
</Segment >
</Segment >
<div className="register"> <div className="register">
<Card> <Card>
<Card.Content> <Card.Content>
<Card.Header> <Card.Header>
New to us ? New to us ?
</Card.Header> </Card.Header>
<RegisterModal /> <RegisterModal />
</Card.Content> </Card.Content>
</Card> </Card>
</div> </div>
</Grid.Column> </Grid.Column>
<Grid.Column> <Grid.Column>
<Segment basic> <Segment basic>
<LoginForm type="sso-ui" header="SSO Login" imgSrc="UI.png" imgSize="tiny" /> <LoginForm type="sso-ui" header="SSO Login" imgSrc="UI.png" imgSize="tiny" />
{this.props.children} {this.props.children}
</Segment> </Segment>
</Grid.Column> </Grid.Column>
</Grid> </Grid>
</div> </div>
) )
} }
const RegisterModal = () => (
<Modal trigger={<Button primary floated="right">Register Here!</Button>} closeIcon='close'>
<Header icon='archive' content='Register for More Benefits' />
<Modal.Content>
<Form>
<Header as='h2' icon textAlign='center'>
<Icon name='signup' circular />
<Header.Content>
Register
</Header.Content>
</Header>
<Form.Field required>
<label>Email</label>
<Input type="text" id="email" icon='user' iconPosition='left' placeholder="email" required />
</Form.Field>
<Form.Field required>
<label>Password</label>
<Input type='password' id="password" icon='key' iconPosition='left' placeholder="password" required />
</Form.Field>
<Form.Field required>
<label>Konfirmasi Password</label>
<Input type='password' icon="key" iconPosition="left" placeholder='password' required />
</Form.Field>
<Form.Field required>
<label>Nama Perusahaan</label>
<Input placeholder='Nama Perusahaan' required />
</Form.Field>
<Form.Field required>
<label>Logo</label>
<Input
icon={{ name: 'attach', circular: true, link: true }}
placeholder='attach logo'
required
type="File"
/>
</Form.Field>
<Form.Field required>
<label>Deskripsi</label>
<TextArea placeholder='Tell us more' required/>
</Form.Field>
<Form.Field required>
<label>Alamat</label>
<Input placeholder='Alamat' required />
</Form.Field>
<Form.Field required>
<label>Kota</label>
<Input placeholder='Kota' required />
</Form.Field>
<Form.Field required>
<label>Provinsi</label>
<Input placeholder='Provinsi' required />
</Form.Field >
<Button type='submit' floated='right' color='blue'>Submit</Button>
</Form>
</Modal.Content>
<Modal.Actions>
</Modal.Actions>
</Modal>
)
...@@ -24,21 +24,19 @@ export default class VacancyPage extends React.Component { ...@@ -24,21 +24,19 @@ export default class VacancyPage extends React.Component {
const student = Storage.get('user-data').student; const student = Storage.get('user-data').student;
return ( return (
<div className="halamanLowongan"> <div className="halamanLowongan">
<Tabs selected={0}> <Tabs selected={0}>
<Pane label="Semua Lowongan" > <Pane label="Semua Lowongan" >
<VacancyList key={1} url="/vacancies/" /> <VacancyList key={1} url="/vacancies/" />
</Pane> </Pane>
<Pane label="Lamaran saya" > <Pane label="Lamaran saya" >
<VacancyList key={2} url={`/students/${student.id}/applied-vacancies/`} /> <VacancyList key={2} url={`/students/${student.id}/applied-vacancies/`} />
</Pane> </Pane>
<Pane label="Lamaran Ditandai" > <Pane label="Lamaran Ditandai" >
<VacancyList key={3} url={`/students/${student.id}/bookmarked-vacancies/`} /> <VacancyList key={3} url={`/students/${student.id}/bookmarked-vacancies/`} />
</Pane> </Pane>
</Tabs> </Tabs>
</div>
</div>
); );
} }
} }
import React from 'react';
import { Modal, Button, Form, Input, TextArea, Header, Icon } from 'semantic-ui-react';
import Server from './../lib/Server';
export default class RegisterModal extends React.Component {
constructor(props) {
super(props);
/* istanbul ignore next */
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChange = (e) => {
this.setState({ [e.target.name]: e.target.value });
};
handleSubmit = (e) => {
e.preventDefault();
const form = new FormData();
Object.keys(this.state).map(k => form.append(k, this.state[k]));
const data = {
'X-CSRFToken': Server.getCookie('csrftoken'),
mode: 'no-cors',
method: 'POST',
body: form,
credentials: 'same-origin',
};
fetch('/api/register/', data)
.then(r => r.json())
.then((res) => {
alert(res);
});
};
render = () => (
<Modal trigger={<Button primary floated="right">Register Here!</Button>} closeIcon="close">
<Header icon="archive" content="Register for More Benefits" />
<Modal.Content>
<Form onSubmit={this.handleSubmit}>
<Header as="h2" icon textAlign="center">
<Icon name="signup" circular />
<Header.Content>
Register
</Header.Content>
</Header>
<Form.Field required>
<label htmlFor="email">Email</label>
<Input onChange={this.handleChange} type="text" name="email" icon="user" iconPosition="left" placeholder="email" required />
</Form.Field>
<Form.Field required>
<label htmlFor="password">Password</label>
<Input onChange={this.handleChange} type="password" name="password" icon="key" iconPosition="left" placeholder="password" required />
</Form.Field>
<Form.Field required>
<label htmlFor="password-confirm">Konfirmasi Password</label>
<Input onChange={this.handleChange} type="password" name="password-confirm" icon="key" iconPosition="left" placeholder="password" required />
</Form.Field>
<Form.Field required>
<label htmlFor="name">Nama Perusahaan</label>
<Input onChange={this.handleChange} placeholder="Nama Perusahaan" name="name" required />
</Form.Field>
<Form.Field required>
<label htmlFor="logo">Logo</label>
<Input
onChange={this.handleChange}
name="logo"
icon={{ name: 'attach', circular: true, link: true }}
placeholder="attach logo"
type="File"
required
/>
</Form.Field>
<Form.Field required>
<label htmlFor="description">Deskripsi</label>
<TextArea onChange={this.handleChange} placeholder="Tell us more" name="description" required />
</Form.Field>
<Form.Field required>
<label htmlFor="address">Alamat</label>
<Input onChange={this.handleChange} placeholder="Alamat" name="address" required />
</Form.Field>
<Button type="submit" floated="right" color="blue">Submit</Button>
</Form>
</Modal.Content>
<Modal.Actions />
</Modal>
)
}
...@@ -37,15 +37,18 @@ export default class Server { ...@@ -37,15 +37,18 @@ export default class Server {
/* istanbul ignore next */ /* istanbul ignore next */
const promise = request.then((response) => { const promise = request.then((response) => {
// Logger.log("[Server] Calling", url, response);
if (response.status < 200 || response.status > 399) {
throw response;
}
if (response.status === 204) { if (response.status === 204) {
return response; return response;
} }
const contentType = response.headers.get("content-type"); const contentType = response.headers.get('content-type');
return contentType && contentType.indexOf("application/json") !== -1 ? response.json() : response.text(); const result = contentType && contentType.indexOf('application/json') !== -1 ? response.json() : response.text();
if (response.status < 200 || response.status > 399) {
throw result;
}
else {
return result;
}
}); });
/* istanbul ignore next */ /* istanbul ignore next */
......
...@@ -46,6 +46,7 @@ class LoginSerializer(serializers.HyperlinkedModelSerializer): ...@@ -46,6 +46,7 @@ class LoginSerializer(serializers.HyperlinkedModelSerializer):
model = User model = User
fields = ('url', 'username', 'email', 'is_staff', 'company', 'supervisor', 'student') fields = ('url', 'username', 'email', 'is_staff', 'company', 'supervisor', 'student')
class RegisterSerializer(serializers.HyperlinkedModelSerializer): class RegisterSerializer(serializers.HyperlinkedModelSerializer):
company = CompanySerializer() company = CompanySerializer()
......
import requests import requests
from django.contrib.auth import authenticate, login from django.contrib.auth import authenticate, login
from django.contrib.auth.models import User from django.contrib.auth.models import User
from django.http import HttpResponseBadRequest
from django.http import HttpResponseNotAllowed
from rest_framework import viewsets, status from rest_framework import viewsets, status
from rest_framework.decorators import list_route from rest_framework.decorators import list_route
from rest_framework.parsers import FormParser,MultiPartParser
from rest_framework.permissions import AllowAny from rest_framework.permissions import AllowAny
from rest_framework.permissions import IsAdminUser, IsAuthenticated from rest_framework.permissions import IsAdminUser, IsAuthenticated
from rest_framework.response import Response from rest_framework.response import Response
from rest_framework.parsers import FormParser,MultiPartParser from rest_framework.status import HTTP_400_BAD_REQUEST, HTTP_409_CONFLICT
from core.lib.permissions import IsAdminOrStudent, IsAdminOrSelfOrReadOnly, IsAdminOrCompany, IsAdminOrSupervisor from core.lib.permissions import IsAdminOrStudent, IsAdminOrSelfOrReadOnly, IsAdminOrCompany, IsAdminOrSupervisor
from core.models.accounts import Student, Company, Supervisor from core.models.accounts import Student, Company, Supervisor
...@@ -172,33 +175,29 @@ class CompanyRegisterViewSet(viewsets.GenericViewSet): ...@@ -172,33 +175,29 @@ class CompanyRegisterViewSet(viewsets.GenericViewSet):
required: false required: false
type: string type: string
""" """
username = request.data.get('username') data = {}
password = request.data.get('password') for attr in ['password', 'email', 'name', 'description', 'logo', 'address']:
email = request.data.get('email') data[attr] = request.data.get(attr)
company_name = request.data.get('name') if data[attr] is None:
description = request.data.get('description') return Response({'error': attr+' is required'}, status=HTTP_400_BAD_REQUEST)
logo = request.data.get('logo')
address = request.data.get('address') user, created = User.objects.get_or_create(
username=data['email'],
if username is not None and password is not None and email is not None and company_name is not None and description is not None: email=data['email'],
user, created = User.objects.get_or_create( first_name=data['name'],
username=username, last_name=""
email=email, )
first_name=company_name, if created:
last_name="" user.set_password(data['password'])
company = Company.objects.create(
user=user,
description=data['description'],
logo=data['logo'],
address=data['address']
) )
if created: user.save()
user.set_password(password) company.save()
company = Company.objects.create( serializer = self.serializer_class(user, context={'request': request})
user=user, return Response(serializer.data, status=status.HTTP_201_CREATED)
description=description, else:
logo=logo, return Response({'error': 'Company with email '+data['email']+' already exist'}, status=HTTP_409_CONFLICT)
address=address
)
user.save()
company.save()
serializer = RegisterSerializer(user, context={'request': request})
return Response(serializer.data, status=status.HTTP_201_CREATED)
return Response(status=status.HTTP_409_CONFLICT)
return Response(status=status.HTTP_400_BAD_REQUEST)
\ No newline at end of file
...@@ -15,6 +15,7 @@ module.exports = { ...@@ -15,6 +15,7 @@ module.exports = {
plugins: [ plugins: [
new webpack.HotModuleReplacementPlugin(), new webpack.HotModuleReplacementPlugin(),
new BundleTracker({ filename: './webpack-stats.json' }), new BundleTracker({ filename: './webpack-stats.json' }),
new webpack.OldWatchingPlugin(),
], ],
module: { module: {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment