Fakultas Ilmu Komputer UI

Commit 6c40a193 authored by Fadhlan Hazmi's avatar Fadhlan Hazmi
Browse files

1606834604 - #172

parent 3b38109a
......@@ -38,13 +38,7 @@ export default class VacancyPage extends React.Component {
this.state = {
vacancies: [],
id: VacancyPage.getId(this.props.user),
sort: '',
sortBy: [
{ key: 'ASC', text: 'Ascending', value: 'ASC' },
{ key: 'DESC', text: 'Descending', value: 'DESC' },
],
};
this.handleChange = this.handleChange.bind(this);
console.log('vacancy');
Storage.set('menu-active-state', 'Beranda');
......@@ -63,7 +57,6 @@ export default class VacancyPage extends React.Component {
user={this.props.user}
key={1}
userId={this.state.id}
sort={this.state.sort}
/>
}
/>
......@@ -207,23 +200,10 @@ export default class VacancyPage extends React.Component {
return '';
}
handleChange = (e, data) => {
this.setState({ sort: data.value });
};
render() {
console.log(this.props.user);
return (
<div className="applicant">
<Container textAlign="right">
<Dropdown
placeholder="Urutkan Berdasarkan"
className="dropdownApplicant"
selection
options={this.state.sortBy}
onChange={this.handleChange}
/>
</Container>
<br />
{this.props.user.role === 'student' || (
<div
......
......@@ -41,14 +41,6 @@ describe('VacancyPage', () => {
expect(vacancyPage).to.exist;
});
it('renders sort feature without problem', () => {
const vacancyPage = ReactTestUtils.renderIntoDocument(
<VacancyPage user={errorUser} />);
vacancyPage.handleChange({}, { value: 'ASC' });
expect(vacancyPage).to.exist;
expect(vacancyPage.state.sort).to.equals('ASC');
});
it('sets top menu active item according to page', () => {
ReactTestUtils.renderIntoDocument(<VacancyPage user={studentUser} />);
const topmenu = ReactTestUtils.renderIntoDocument(
......
......@@ -372,6 +372,17 @@ describe('VacancyList', () => {
expect(vacancyList).to.exist;
});
it('sorts without problem for student user', () => {
const vacancyList = ReactTestUtils.renderIntoDocument(
<VacancyList items={newResponse} userId={3} user={studentUser} />,
);
vacancyList.state.vacancies = newResponse;
vacancyList.state.sort = 'NAME-ASC';
expect(vacancyList.generateVacancies()).to.exist;
vacancyList.state.sort = 'NAME-DESC';
expect(vacancyList.generateVacancies()).to.exist;
});
it('renders without problem for company', () => {
const vacancyList = ReactTestUtils.renderIntoDocument(
<VacancyList items={newResponse} userId={1} user={companyUser} />,
......
......@@ -12,7 +12,6 @@ export default class VacancyList extends React.Component {
user: PropTypes.object.isRequired,
userId: PropTypes.number.isRequired,
items: PropTypes.array,
sort: PropTypes.string.isRequired,
};
static defaultProps = {
......@@ -41,6 +40,11 @@ export default class VacancyList extends React.Component {
{ key: 1, text: 'Masih Menerima', value: 1 },
{ key: 2, text: 'Sudah Tutup', value: 2 },
],
sort: '',
sortBy: [
{ key: 'NAME-ASC', text: 'Nama (Ascending)', value: 'NAME-ASC' },
{ key: 'NAME-DESC', text: 'Nama (Descending)', value: 'NAME-DESC' },
],
};
this.generateVacancies = this.generateVacancies.bind(this);
this.updateStatus = this.updateStatus.bind(this);
......@@ -48,6 +52,7 @@ export default class VacancyList extends React.Component {
this.handleChangeVacancyStateFilter = this.handleChangeVacancyStateFilter.bind(
this,
);
this.handleChangeSortVacancy = this.handleChangeSortVacancy.bind(this);
}
updateStatus(id, status) {
......@@ -119,6 +124,21 @@ export default class VacancyList extends React.Component {
return filteredVacancies;
};
sortVacancies = (vacancies) => {
switch (this.state.sort) {
case 'NAME-ASC':
return vacancies.sort((vac1, vac2) => {
return vac1.props.data.name.localeCompare(vac2.props.data.name);
});
case 'NAME-DESC':
return vacancies.sort((vac1, vac2) => {
return vac2.props.data.name.localeCompare(vac1.props.data.name);
});
default:
return vacancies;
}
};
handleChangeSalaryFilter = (e, data) => {
this.setState({ salaryFilter: data.value });
};
......@@ -127,19 +147,11 @@ export default class VacancyList extends React.Component {
this.setState({ vacancyStateFilter: data.value });
};
handleChangeSortVacancy = (e, data) => {
this.setState({ sort: data.value });
};
generateVacancies() {
if (this.state.vacancies.length === 0) {
return (
<Item className="vacancyItems">
<Grid.Row>
<Container textAlign="center">
<p>Tidak ada</p>
<br />
</Container>
</Grid.Row>
</Item>
);
}
if (this.props.user.role === 'student') {
let vacancies = this.state.vacancies.map((vacancy) => (
<Vacancy
......@@ -152,17 +164,21 @@ export default class VacancyList extends React.Component {
salary={this.props.salary}
/>
));
if (this.props.sort === 'ASC') {
return vacancies.sort((vac1, vac2) => {
return vac1.props.data.name.localeCompare(vac2.props.data.name);
});
} else if (this.props.sort === 'DESC') {
return vacancies.sort((vac1, vac2) => {
return vac2.props.data.name.localeCompare(vac1.props.data.name);
});
}
vacancies = this.sortVacancies(vacancies);
vacancies = this.filterVacanciesBasedOnSalary(vacancies);
vacancies = this.filterVacanciesBasedOnVacancyStatus(vacancies);
if (vacancies.length === 0) {
return (
<Item className="vacancyItems">
<Grid.Row>
<Container textAlign="center">
<p>Tidak ada</p>
<br />
</Container>
</Grid.Row>
</Item>
);
}
return vacancies;
} else if (
(this.props.user.role === 'admin' &&
......@@ -205,6 +221,13 @@ export default class VacancyList extends React.Component {
options={this.state.vacancyStateFilterBy}
onChange={this.handleChangeVacancyStateFilter}
/>
<Dropdown
placeholder="Urutkan Berdasarkan"
className="dropdownApplicant"
selection
options={this.state.sortBy}
onChange={this.handleChangeSortVacancy}
/>
<Grid container columns="eleven" doubling style={{ display: 'block' }}>
<Item.Group relaxed style={{ width: '100%' }}>
{this.generateVacancies()}
......
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