Fakultas Ilmu Komputer UI

Commit 9aaede83 authored by Zamil Majdy's avatar Zamil Majdy
Browse files

[#140652771] [#21] [Green] Add delete vacancy implementation

parent 8d29ad34
......@@ -8,9 +8,11 @@ const defaultImage = 'http://semantic-ui.com/images/wireframe/image.png';
export default class CompanyVacancy extends React.Component {
static propTypes = {
data: React.PropTypes.object.isRequired,
deleteCallback: React.PropTypes.func.isRequired,
deleteCallback: React.PropTypes.func,
};
static defaultProps = { deleteCallback: () => {} };
constructor(props) {
super(props);
moment.locale('id');
......@@ -37,7 +39,7 @@ export default class CompanyVacancy extends React.Component {
<Button color="blue" floated="right" as={Link} to={this.getLink}>
Ubah <Icon name="right chevron" />
</Button>
<Button loading={this.state.deleteLoading} color="red" floated="right" onClick={() => { this.setState({ deleteLoading : true }); this.props.deleteCallback(); }} >
<Button loading={this.state.deleteLoading} color="red" floated="right" onClick={() => { this.setState({ deleteLoading: true }); this.props.deleteCallback(); }} >
Hapus <Icon name="delete" />
</Button>
</Grid.Column>
......
......@@ -22,7 +22,7 @@ export default class LoginForm extends React.Component {
constructor(props) {
super(props);
/* istanbul ignore next */
this.state = { username: '', password: '', errorFlag: false };
this.state = { username: '', password: '', errorFlag: false, loading: false };
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
......@@ -38,12 +38,12 @@ export default class LoginForm extends React.Component {
username: this.state.username,
password: this.state.password,
};
this.setState({ loading: true });
Server.post('/login/', data).then((response) => {
Storage.set('user-data', response);
browserHistory.push('/home');
}, () => {
this.setState({ errorFlag: true });
this.setState({ errorFlag: true, loading: false });
});
}
......@@ -51,33 +51,33 @@ export default class LoginForm extends React.Component {
<div className="formLogin" >
<Segment.Group>
<Segment>
<Image src={`./assets/img/${this.props.imgSrc}`} size={this.props.imgSize} verticalAlign="middle" /> <span>{ this.props.header }</span>
</Segment>
<Segment.Group>
<Segment>
<Image src={`./assets/img/${this.props.imgSrc}`} size={this.props.imgSize} verticalAlign="middle" /> <span>{ this.props.header }</span>
</Segment>
<Segment inverted className='header' >
<Form onSubmit={e => this.handleSubmit(e)} error={this.state.errorFlag}>
<Form.Group widths="equal">
<Form.Field>
<label htmlFor="id"> Username </label>
<Input type="text" id="username" icon="user" iconPosition="left" placeholder="username" onChange={e => this.handleChange(e, 'username')} required />
</Form.Field>
</Form.Group>
<Form.Group widths="equal">
<Form.Field>
<label htmlFor="password"> Password </label>
<Input type="password" id="password" icon="key" iconPosition="left" placeholder="password" onChange={e => this.handleChange(e, 'password')} required />
</Form.Field>
</Form.Group>
<Button type="submit" fluid color="blue">Login</Button>
<Message
error
content="Login gagal: username atau password salah."
/>
</Form>
</Segment>
</Segment.Group>
<Segment inverted className="header" >
<Form loading={this.state.loading} onSubmit={e => this.handleSubmit(e)} error={this.state.errorFlag}>
<Form.Group widths="equal">
<Form.Field>
<label htmlFor="id"> Username </label>
<Input type="text" id="username" icon="user" iconPosition="left" placeholder="username" onChange={e => this.handleChange(e, 'username')} required />
</Form.Field>
</Form.Group>
<Form.Group widths="equal">
<Form.Field>
<label htmlFor="password"> Password </label>
<Input type="password" id="password" icon="key" iconPosition="left" placeholder="password" onChange={e => this.handleChange(e, 'password')} required />
</Form.Field>
</Form.Group>
<Button type="submit" fluid color="blue">Login</Button>
<Message
error
content="Login gagal: username atau password salah."
/>
</Form>
</Segment>
</Segment.Group>
</div>
)
}
......@@ -4,6 +4,7 @@ import { Link } from 'react-router';
import Vacancy from './Vacancy';
import CompanyVacancy from './CompanyVacancy';
import Server from '../lib/Server';
import ModalAlert from '../components/ModalAlert';
export default class VacancyList extends React.Component {
......@@ -49,6 +50,15 @@ export default class VacancyList extends React.Component {
});
}
deleteVacancy = id => Server.delete(`/vacancies/${id}/`, this.state).then(() => {
this.modalAlert.open('Hapus Lowongan', 'Lowongan berhasil dihapus');
const newVacancies = [];
this.state.vacancies.map(vacancy => vacancy.id !== id && newVacancies.push(vacancy));
this.setState({ vacancies: newVacancies });
}, error => error.then((r) => {
this.modalAlert.open('Gagal Menghapus Lowongan', r.error);
}));
generateVacancies() {
if (this.props.type === 'student') {
return this.state.vacancies.map(vacancy =>
......@@ -63,19 +73,20 @@ export default class VacancyList extends React.Component {
);
}
return this.state.vacancies.map(vacancy =>
(
<CompanyVacancy key={vacancy.id} data={vacancy} />
),
return this.state.vacancies.map(vacancy => (<CompanyVacancy
key={vacancy.id}
data={vacancy}
deleteCallback={() => this.deleteVacancy(vacancy.id)}
/>),
);
}
companyHeader() {
if (this.props.type === 'company') {
return (
<Grid style={{ padding: '10px' }}>
<Button fluid size="mini" icon="eye" labelPosition="left" color="facebook" content="Lihat Semua Pendaftar" />
<Button fluid size="mini" as={Link} to="/buat-lowongan" icon="add" labelPosition="left" content="Tambah Lowongan Baru" color="teal" />
<Grid textAlign="center">
<Button size="tiny" icon="eye" labelPosition="left" color="facebook" content="Lihat Semua Pendaftar" />
<Button size="tiny" as={Link} to="/buat-lowongan" icon="add" labelPosition="left" content="Tambah Lowongan Baru" color="teal" />
</Grid>
);
}
......@@ -85,14 +96,13 @@ export default class VacancyList extends React.Component {
render = () => (
<Segment>
<Grid container columns="eleven" doubling>
{ this.companyHeader() }
<ModalAlert ref={(modal) => { this.modalAlert = modal; }} />
<Grid container columns="eleven" doubling>
{ this.companyHeader() }
<Item.Group relaxed style={{ width: '100%' }}>
{ this.generateVacancies() }
</Item.Group>
</Grid>
</Grid>
</Segment>
);
}
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