Fakultas Ilmu Komputer UI

Commit 43727156 authored by Zamil Majdy's avatar Zamil Majdy
Browse files

Appearance tweaks :)

parent c0ab366c
......@@ -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{
......
......@@ -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}>
......
......@@ -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}>
......
......@@ -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>*/}
......
......@@ -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"
......
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 = {
......
......@@ -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>
......
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"/>
......
......@@ -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>
......
......@@ -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,
};
......
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
......
......@@ -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));
}));
};
......
......@@ -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() {
......
......@@ -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>
......
......@@ -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;
......
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>
......
......@@ -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();
......
Markdown is supported
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