From 4372715671a1de5ee056f7a773035723474a905d Mon Sep 17 00:00:00 2001
From: Zamil Majdy <z.majdy1996@gmail.com>
Date: Thu, 1 Jun 2017 15:34:07 +0700
Subject: [PATCH] Appearance tweaks :)
---
assets/css/custom.css | 24 ++++++-------
assets/js/ApplicantPage.jsx | 2 +-
assets/js/CompanyPage.jsx | 4 +--
assets/js/CompanyProfile.jsx | 8 ++---
assets/js/CreateVacancy.jsx | 1 +
assets/js/Dashboard.jsx | 2 --
assets/js/ProfilePage.jsx | 2 +-
assets/js/VacancyPage.jsx | 6 ++--
assets/js/components/ApplicantList.jsx | 2 +-
assets/js/components/ApplyModal.jsx | 2 +-
assets/js/components/CompanyList.jsx | 13 ++++++-
assets/js/components/CompanyRegisterModal.jsx | 3 +-
assets/js/components/Pagination.jsx | 1 +
assets/js/components/TopMenu.jsx | 21 +++++++-----
assets/js/components/Vacancy.jsx | 20 +++++------
assets/js/components/VacancyList.jsx | 34 ++++++++++++-------
assets/js/index.jsx | 3 --
17 files changed, 84 insertions(+), 64 deletions(-)
diff --git a/assets/css/custom.css b/assets/css/custom.css
index 5f145954..a260c817 100755
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -176,11 +176,11 @@ card .formRegis{
line-height: 30%;
}
-.biodata-company h4{
+.biodataCompany h4{
color: grey;
}
-.button-profile{
+.buttonProfile{
margin-top:30px;
}
@@ -223,51 +223,51 @@ card .formRegis{
margin-right:5%;
}
-.ui.segment.segment-profile-company{
+.ui.segment.segmentProfileCompany{
margin-left: 10%;
margin-right: 10%;
padding: 5%;
}
-.ui.segment.profile-form-company{
+.ui.segment.profileFormCompany{
margin-top:4%;
margin-left: 10%;
margin-right: 10%;
padding-bottom:3%;
}
-.company-profile{
+.companyProfile{
padding-bottom:5%;
}
-.ui.segment.vacancyList-company{
+.ui.segment.vacancyListCompany{
margin-left: 10%;
margin-right: 10%;
}
.ui.segment.paginationCompany{
- margin: 2% 7% 60px;
+ margin: 2% 7%;
}
.admin-bar{
margin: 0;
- padding: 0 10px 0 0;
+ padding: 10px;
width: 100%;
text-align: right;
background-color: #304D8A;
color: white;
}
-.dropdown-applicant{
+.dropdownApplicant{
margin-left:7%;
margin-top:2%;
margin-bottom: 0;
}
-.button-administrasi{
- margin-left:7%;
+.administrationButtons {
+ margin-left:7%;
margin-top:2%;
- margin-bottom: 0;
+ margin-bottom: 2%;
}
.ui.segment.transkrip{
diff --git a/assets/js/ApplicantPage.jsx b/assets/js/ApplicantPage.jsx
index f0e05957..bbdbcb40 100644
--- a/assets/js/ApplicantPage.jsx
+++ b/assets/js/ApplicantPage.jsx
@@ -62,7 +62,7 @@ export default class ApplicantPage extends React.Component {
const company = this.props.user.data.company;
return (
<div>
- <div className="dropdown-applicant">
+ <div className="dropdownApplicant">
<Dropdown placeholder="Semua Lowongan" search selection options={this.state.urls} onChange={this.handleChange} />
</div>
<Tabs selected={0}>
diff --git a/assets/js/CompanyPage.jsx b/assets/js/CompanyPage.jsx
index 8f009669..79042cbc 100644
--- a/assets/js/CompanyPage.jsx
+++ b/assets/js/CompanyPage.jsx
@@ -12,14 +12,12 @@ export default class CompanyPage extends React.Component {
};
handleClick = () => window.open('/admin/');
- handleVacancy = () => window.open('/lowongan');
render() {
return (
<div>
- <div className="button-administrasi">
+ <div className="administrationButtons">
<Button onClick={this.handleClick} icon="dashboard" labelPosition="left" color="facebook" content="Buka Menu Administrasi" />
- <Button onClick={this.handleVacancy} icon="dashboard" labelPosition="left" color="facebook" content="Halaman Verifikasi Lowongan" />
</div>
<Tabs selected={0}>
diff --git a/assets/js/CompanyProfile.jsx b/assets/js/CompanyProfile.jsx
index 5f8838e3..01d1f334 100644
--- a/assets/js/CompanyProfile.jsx
+++ b/assets/js/CompanyProfile.jsx
@@ -13,20 +13,20 @@ export default class CompanyProfile extends React.Component {
const data = TopMenu.getInfo(this.props.user);
console.log(data);
return (
- <div className="company-profile">
- <Segment className="segment-profile-company" >
+ <div className="companyProfile">
+ <Segment className="segmentProfileCompany" >
<Header as="h2" icon textAlign="center">
<Image src={data.logo || defaultLogo} size="small" shape="circular" />
</Header>
<Container textAlign="center" className="profile-biodata">
- <div className="biodata-company">
+ <div className="biodataCompany">
<h2>{ data.name }</h2>
<h3>{ data.address }t</h3>
<p>{ data.description }</p>
</div>
</Container>
</Segment>
- {/* <Segment className="profile-form-company">*/}
+ {/* <Segment className="profileFormCompany">*/}
{/* <Header as="h3" textAlign="center">*/}
{/* <Icon name="edit" />*/}
{/* <Header.Content>*/}
diff --git a/assets/js/CreateVacancy.jsx b/assets/js/CreateVacancy.jsx
index dfcb2489..98c4cc5c 100644
--- a/assets/js/CreateVacancy.jsx
+++ b/assets/js/CreateVacancy.jsx
@@ -102,6 +102,7 @@ export default class CreateVacancy extends React.Component {
{ !this.state.loading &&
<CKEditor value={this.state.description} onChange={this.handleEditor} /> }
<script>CKEDITOR.replace( 'description' );</script>
+ <br />
<Form.Group widths="equal">
<Form.Field
className="open-time-field"
diff --git a/assets/js/Dashboard.jsx b/assets/js/Dashboard.jsx
index 2b0c69dc..3687e103 100755
--- a/assets/js/Dashboard.jsx
+++ b/assets/js/Dashboard.jsx
@@ -1,7 +1,5 @@
import React from 'react';
import TopMenu from './components/TopMenu';
-import Server from './lib/Server';
-import Footer from './components/Footer';
export default class Dashboard extends React.Component {
static propTypes = {
diff --git a/assets/js/ProfilePage.jsx b/assets/js/ProfilePage.jsx
index 61758862..55dc5eee 100644
--- a/assets/js/ProfilePage.jsx
+++ b/assets/js/ProfilePage.jsx
@@ -234,7 +234,7 @@ export default class ProfilePage extends React.Component {
</div>
<Container textAlign="center">
- <div className="button-profile">
+ <div className="buttonProfile">
<Button onClick={this.gotoStudentResume} primary size="small">Resume</Button>
</div>
<div>
diff --git a/assets/js/VacancyPage.jsx b/assets/js/VacancyPage.jsx
index b2ef0663..7db25216 100644
--- a/assets/js/VacancyPage.jsx
+++ b/assets/js/VacancyPage.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Segment, Item, Button } from 'semantic-ui-react';
+import { Segment, Button } from 'semantic-ui-react';
import { Link } from 'react-router';
import Tabs from './components/Tabs';
import Pane from './components/Pane';
@@ -94,7 +94,7 @@ export default class VacancyPage extends React.Component {
userId={this.state.id}
/>
}
- error="Anda belum diverifikasi. Harap hubungi admin"
+ error="Akun anda belum terverifikasi. Harap hubungi pihak administrasi"
/>
</Segment>
);
@@ -157,7 +157,7 @@ export default class VacancyPage extends React.Component {
render() {
return (
<div className="applicant">
- <div className="button-administrasi">
+ <div className="administrationButtons" style={{ display: 'inline-block' }}>
{ this.companyHeader() }
{(this.props.user.role === 'admin' || this.props.user.role === 'supervisor') &&
<Button as={Link} to="/rekap" icon="dashboard" labelPosition="left" color="facebook" content="Rekap Pendaftaran"/>
diff --git a/assets/js/components/ApplicantList.jsx b/assets/js/components/ApplicantList.jsx
index 04ec65b1..7dd3a3a8 100644
--- a/assets/js/components/ApplicantList.jsx
+++ b/assets/js/components/ApplicantList.jsx
@@ -38,7 +38,7 @@ export default class ApplicantList extends React.Component {
<Item className="applicantItems">
<Grid.Row>
<Container textAlign="center">
- <p>Tidak ada pelamar<br /></p>
+ <p>Tidak ada pelamar</p><br />
</Container>
</Grid.Row>
</Item>
diff --git a/assets/js/components/ApplyModal.jsx b/assets/js/components/ApplyModal.jsx
index 0fb1af11..7b9a8fa7 100644
--- a/assets/js/components/ApplyModal.jsx
+++ b/assets/js/components/ApplyModal.jsx
@@ -8,7 +8,7 @@ export default class ApplyModal extends React.Component {
data: React.PropTypes.object.isRequired,
active: React.PropTypes.bool.isRequired,
buttonTitle: React.PropTypes.string.isRequired,
- resume: React.PropTypes.string.isRequired,
+ resume: React.PropTypes.string,
studentId: React.PropTypes.number.isRequired,
updateStatus: React.PropTypes.func.isRequired,
};
diff --git a/assets/js/components/CompanyList.jsx b/assets/js/components/CompanyList.jsx
index fe99956b..a543bfe6 100644
--- a/assets/js/components/CompanyList.jsx
+++ b/assets/js/components/CompanyList.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Item, Grid } from 'semantic-ui-react';
+import { Item, Grid, Container } from 'semantic-ui-react';
import Company from '../components/Company';
export default class CompanyList extends React.Component {
@@ -34,6 +34,17 @@ export default class CompanyList extends React.Component {
}
generateCompanies() {
+ if (this.state.companies.length === 0) {
+ return (
+ <Item className="vacancyItems">
+ <Grid.Row>
+ <Container textAlign="center">
+ <p>Tidak ada</p><br />
+ </Container>
+ </Grid.Row>
+ </Item>
+ );
+ }
return this.state.companies.map(company =>
(company.status === this.props.status || Company.COMPANY_STATUS.ALL === this.props.status) &&
(<Company
diff --git a/assets/js/components/CompanyRegisterModal.jsx b/assets/js/components/CompanyRegisterModal.jsx
index 450c3cd2..1851c9ac 100644
--- a/assets/js/components/CompanyRegisterModal.jsx
+++ b/assets/js/components/CompanyRegisterModal.jsx
@@ -4,6 +4,7 @@ import { Modal, Button, Form, Input, TextArea, Header, Icon } from 'semantic-ui-
import ModalAlert from './../components/ModalAlert';
import Server from './../lib/Server';
import Storage from './../lib/Storage';
+import Dumper from './../lib/Dumper';
export default class CompanyRegisterModal extends React.Component {
@@ -46,7 +47,7 @@ export default class CompanyRegisterModal extends React.Component {
browserHistory.push('/home');
}, error => error.then((r) => {
this.setState({ loading: false });
- this.modalAlert.open('Gagal Membuat Akun', r.error);
+ this.modalAlert.open('Gagal Membuat Akun', Dumper.dump(r));
}));
};
diff --git a/assets/js/components/Pagination.jsx b/assets/js/components/Pagination.jsx
index 5fad6a06..d2a50ae2 100644
--- a/assets/js/components/Pagination.jsx
+++ b/assets/js/components/Pagination.jsx
@@ -59,6 +59,7 @@ export default class Pagination extends React.Component {
this.setState({ first, last });
}, error => error.then((r) => {
this.modalAlert.open(this.props.error, r.detail);
+ this.setState({ loading: false });
}));
refresh() {
diff --git a/assets/js/components/TopMenu.jsx b/assets/js/components/TopMenu.jsx
index 19691fc8..de531388 100644
--- a/assets/js/components/TopMenu.jsx
+++ b/assets/js/components/TopMenu.jsx
@@ -35,7 +35,7 @@ export default class TopMenu extends React.Component {
constructor(props) {
super(props);
/* istanbul ignore next */
- this.state = { activeItem: 'Beranda' };
+ this.state = { activeItem: 'Beranda', logoutLoading: false };
this.logout = this.logout.bind(this);
this.logoutCompany = this.logoutCompany.bind(this);
}
@@ -44,10 +44,11 @@ export default class TopMenu extends React.Component {
logout = (e) => {
e.preventDefault();
+ this.setState({ logoutLoading: true });
Server.get('/api-auth/logout/?next=/', true).then(() => {
Storage.clear();
browserHistory.push('/login');
- });
+ }, () => this.setState({ logoutLoading: false }));
};
logoutCompany = /* istanbul ignore next */ (e) => {
@@ -65,27 +66,29 @@ export default class TopMenu extends React.Component {
<div>
{ this.props.user.data.is_staff && this.props.user.data.company && (
<div className="admin-bar">
- <br/>
<p>
Anda login sebagai perusahaan:
<b> {this.props.user.data.company.name}</b> (#{this.props.user.data.company.id}).
Untuk kembali menjadi admin, klik <a href="#" onClick={this.logoutCompany}> link ini</a>
</p>
- <br/>
</div>
)}
<Menu color="blue" pointing secondary>
<Image as="a" size="small" src="/assets/img/logo.png" href="/" />
<Menu.Menu position="right">
+ { !this.props.user.data.is_staff &&
<Menu.Item as={Link} to="/home" name="Beranda" active={activeItem === 'Beranda'} onClick={this.handleItemClick} />
- { this.props.user.role === 'student' &&
- <Menu.Item as={Link} to="/profil" name="Profil" active={activeItem === 'Profil'} onClick={this.handleItemClick} />
}
+ { this.props.user.role === 'student' &&
+ <Menu.Item as={Link} to="/profil" name="Profil" active={activeItem === 'Profil'} onClick={this.handleItemClick} /> }
+ { this.props.user.data.is_staff &&
+ <Menu.Item as={Link} to="/perusahaan" name="Perusahaan" active={activeItem === 'Perusahaan' || activeItem === 'Beranda'} onClick={this.handleItemClick} /> }
+ { this.props.user.data.is_staff &&
+ <Menu.Item as={Link} to="/lowongan" name="Lowongan" active={activeItem === 'Lowongan'} onClick={this.handleItemClick} /> }
<Menu.Item>
<Popup
trigger={<Image
- as={Link} to="/profil" src={(this.props.user.role === 'company' ? data.logo : data.photo) || defaultPicture} avatar
- onClick={this.handleItemClick}
+ src={(this.props.user.role === 'company' ? data.logo : data.photo) || defaultPicture} avatar
/>}
flowing
hoverable
@@ -94,7 +97,7 @@ export default class TopMenu extends React.Component {
header={data.name}
description={data.user.email}
/>
- <Button as={Link} onClick={this.logout} name="logout" color="blue" size="tiny">Keluar</Button>
+ <Button as={Link} onClick={this.logout} loading={this.state.logoutLoading} name="logout" color="blue" size="tiny">Keluar</Button>
</Popup>
diff --git a/assets/js/components/Vacancy.jsx b/assets/js/components/Vacancy.jsx
index 23b5f62b..94b38fab 100644
--- a/assets/js/components/Vacancy.jsx
+++ b/assets/js/components/Vacancy.jsx
@@ -22,7 +22,7 @@ export default class Vacancy extends React.Component {
status: 0,
};
- static APPLICATION_STATUS_TEXT = ['Dikirim', 'Dibaca', 'Dibaca', 'Ditolak', 'Diterima'];
+ static APPLICATION_STATUS_TEXT = ['Dikirim', 'Dibaca', 'Ditandai', 'Ditolak', 'Diterima'];
static APPLICATION_STATUS = {
NEW: 0,
@@ -37,7 +37,7 @@ export default class Vacancy extends React.Component {
/* istanbul ignore next */
this.state = {
bookmarked: this.props.bookmarked,
- registeredStatus: this.props.status ? 'registered' : 'new',
+ registeredStatus: this.props.status,
deleteLoading: false,
};
moment.locale('id');
@@ -58,13 +58,13 @@ export default class Vacancy extends React.Component {
this.state.bookmarked = 1 - this.state.bookmarked;
}
- updateStatus = (registeredStatus = 'registered') => this.setState({ registeredStatus });
+ updateStatus = (registeredStatus = null) => this.setState({ registeredStatus });
removeVacancyApplication() {
this.setState({ deleteLoading: true });
Server.delete(`/students/${this.props.user.data.student.id}/applied-vacancies/${this.props.data.id}/`).then(() => {
this.modalAlert.open('Pendaftaran Berhasil Dibatalkan', 'Pendaftaran anda berhasil dihapus dari sistem\n');
- this.setState({ registeredStatus: 'new', deleteLoading: false });
+ this.setState({ registeredStatus: null, deleteLoading: false });
}, () => {
this.modalAlert.open('Permintaan Gagal', 'Maaf permintaan anda gagal diproses sistem. Harap ulangi pendaftaran atau hubungi administrator\n');
this.setState({ deleteLoading: false });
@@ -84,7 +84,7 @@ export default class Vacancy extends React.Component {
const applyModal = (
<ApplyModal
updateStatus={this.updateStatus}
- active={this.state.registeredStatus === 'new'}
+ active={this.state.registeredStatus === null}
data={{
header: this.props.data.name,
description: this.props.data.description,
@@ -98,15 +98,15 @@ export default class Vacancy extends React.Component {
const cancelButton = <Button loading={this.state.deleteLoading} floated="right" color="red" onClick={this.openConfirmationModal}>Batal</Button>;
const rejectedButton =
- <Button floated="right" color="red" disabled>{Vacancy.APPLICATION_STATUS_TEXT[this.props.status]}</Button>;
+ <Button floated="right" color="red" disabled>{Vacancy.APPLICATION_STATUS_TEXT[this.state.registeredStatus]}</Button>;
const acceptedButton =
- <Button floated="right" color="blue" disabled>{Vacancy.APPLICATION_STATUS_TEXT[this.props.status]}</Button>;
+ <Button floated="right" color="blue" disabled>{Vacancy.APPLICATION_STATUS_TEXT[this.state.registeredStatus]}</Button>;
- if (this.props.status == null) {
+ if (this.state.registeredStatus == null) {
return applyModal;
- } else if (this.props.status === Vacancy.APPLICATION_STATUS.REJECTED) {
+ } else if (this.state.registeredStatus === Vacancy.APPLICATION_STATUS.REJECTED) {
return rejectedButton;
- } else if (this.props.status === Vacancy.APPLICATION_STATUS.ACCEPTED) {
+ } else if (this.state.registeredStatus === Vacancy.APPLICATION_STATUS.ACCEPTED) {
return acceptedButton;
}
return cancelButton;
diff --git a/assets/js/components/VacancyList.jsx b/assets/js/components/VacancyList.jsx
index 865a841d..56efd84c 100644
--- a/assets/js/components/VacancyList.jsx
+++ b/assets/js/components/VacancyList.jsx
@@ -1,6 +1,5 @@
import React from 'react';
-import { Item, Button, Grid } from 'semantic-ui-react';
-import { Link } from 'react-router';
+import { Item, Grid, Container } from 'semantic-ui-react';
import Vacancy from './Vacancy';
import CompanyVacancy from './CompanyVacancy';
import AdminVacancy from './AdminVacancy';
@@ -50,6 +49,17 @@ export default class VacancyList extends React.Component {
}));
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') {
return this.state.vacancies.map(vacancy =>
(
@@ -63,17 +73,17 @@ export default class VacancyList extends React.Component {
/>
),
);
- } else if ((this.props.user.role === 'admin' && this.props.user.data.company != null)
+ } else if ((this.props.user.role === 'admin' && this.props.user.data.company != null)
|| this.props.user.role === 'company') {
return this.state.vacancies.map(vacancy => (
- <Item.Group key={vacancy.id} relaxed style={{ width: '100%' }}>
- <CompanyVacancy
- key={vacancy.id}
- data={vacancy}
- deleteCallback={() => this.deleteVacancy(vacancy.id)}
- />
- </Item.Group>
- ),
+ <Item.Group key={vacancy.id} relaxed style={{ width: '100%' }}>
+ <CompanyVacancy
+ key={vacancy.id}
+ data={vacancy}
+ deleteCallback={() => this.deleteVacancy(vacancy.id)}
+ />
+ </Item.Group>
+ ),
);
}
@@ -88,7 +98,7 @@ export default class VacancyList extends React.Component {
render = () => (
<div>
- <Grid container columns="eleven" doubling>
+ <Grid container columns="eleven" doubling style={{ display: 'block' }}>
<Item.Group relaxed style={{ width: '100%' }}>
{ this.generateVacancies() }
</Item.Group>
diff --git a/assets/js/index.jsx b/assets/js/index.jsx
index 991f5207..26a4c287 100644
--- a/assets/js/index.jsx
+++ b/assets/js/index.jsx
@@ -78,9 +78,6 @@ export default class App extends React.Component {
} else if (App.getRole() === 'company') {
replace({ pathname: '/lowongan' });
cb();
- } else if (App.getRole() === 'company') {
- replace({ pathname: '/lowongan' });
- cb();
} else if (App.getRole() === 'admin') {
replace({ pathname: '/perusahaan' });
cb();
--
GitLab