From 29b412b45af1c514b5948f418b5662086b3360e3 Mon Sep 17 00:00:00 2001
From: "M. Reza Qorib" <rezaqorib96@gmail.com>
Date: Mon, 22 May 2017 22:32:32 +0700
Subject: [PATCH] #144502159] [Refactor] #45 refactor ApplyModal so that the
user can be warned if they haven't update their profile, refactor ProfilePage
to fix the refresh and field issue, and refactor ApproveModal to add
applicant profile button in the modal
---
assets/js/ProfilePage.jsx | 37 ++++++++++++++++++---------
assets/js/components/ApplyModal.jsx | 14 +++++++---
assets/js/components/ApproveModal.jsx | 27 ++++++++++++++-----
3 files changed, 56 insertions(+), 22 deletions(-)
diff --git a/assets/js/ProfilePage.jsx b/assets/js/ProfilePage.jsx
index fb1fe596..be46addf 100644
--- a/assets/js/ProfilePage.jsx
+++ b/assets/js/ProfilePage.jsx
@@ -1,6 +1,7 @@
import React from 'react';
import { Segment, Image, Header, Icon, Checkbox, Container, Button, Form } from 'semantic-ui-react';
import Server from './lib/Server';
+import Storage from './lib/Storage';
import ModalAlert from './components/ModalAlert';
export default class ProfilePage extends React.Component {
@@ -35,12 +36,14 @@ export default class ProfilePage extends React.Component {
show_transcript: '',
},
bagikanTranskrip: '',
+ refresh: 1,
};
this.getProfile = this.getProfile.bind(this);
this.handleChange = this.handleChange.bind(this);
this.handleCheckbox = this.handleCheckbox.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.handleFile = this.handleFile.bind(this);
+ this.gotoLink = this.gotoLink.bind(this);
this.getProfile();
}
@@ -60,10 +63,16 @@ export default class ProfilePage extends React.Component {
phone_number: data.phone_number,
photo: data.photo,
show_transcript: data.show_transcript,
- bagikanTranskrip: (data.show_transcript ? 'Ya' : 'Tidak'),
+ bagikanTranskrip: data.show_transcript,
+ refresh: this.state.refresh + 1,
});
+ if (this.props.route.own) {
+ const newSession = this.props.user.data;
+ newSession.student = data;
+ Storage.set('user-data', newSession);
+ window.scrollTo(0, 0);
+ }
}, error => error.then(() => {
- // this.modalAlert.open('Gagal Mengambil ', r.error);
this.state.name = 'Gagal mendapatkan informasi';
}));
}
@@ -78,9 +87,9 @@ export default class ProfilePage extends React.Component {
}
});
Server.submit(`/profiles/students/${this.state.id}/`, submitForm, 'PATCH').then(() => {
- this.modalAlert.open('Profil berhasil diperbaharui', 'Silakan periksa kembali profil anda' );
+ this.modalAlert.open('Profil berhasil diperbaharui', 'Silakan periksa kembali profil anda', this.getProfile);
}, error => error.then((r) => {
- this.modalAlert.open('Pembaharuan profil gagal', r.error);
+ this.modalAlert.open('Pembaharuan profil gagal', r.detail);
}));
};
@@ -103,6 +112,11 @@ export default class ProfilePage extends React.Component {
this.setState({ form, show_transcript: d.checked });
};
+ gotoLink = (url) => {
+ const win = window.open(url);
+ win.focus();
+ };
+
updateForm(show) {
if (show) {
return (
@@ -114,7 +128,7 @@ export default class ProfilePage extends React.Component {
</Header.Content>
</Header>
<ModalAlert ref={(modal) => { this.modalAlert = modal; }} />
- <Form size="small" onSubmit={this.handleSubmit}>
+ <Form ref={(input) => { this.form = input; }} key={this.state.refresh} size="small" onSubmit={this.handleSubmit}>
<Form.Field>
<label htmlFor="photo">Profile Picture</label>
<input onChange={this.handleFile} placeholder="Profile Photo.jpg" name="photo" type="File" />
@@ -134,7 +148,7 @@ export default class ProfilePage extends React.Component {
<Form.Field>
<Checkbox
onChange={this.handleCheckbox}
- checked={ this.state.show_transcript ? true : false }
+ checked={!!this.state.show_transcript}
label="Ijinkan perusahaan tempat saya mendaftar untuk melihat transkrip akademik saya"
name="show_transcript"
/>
@@ -165,19 +179,18 @@ export default class ProfilePage extends React.Component {
<h5> { this.state.cityOfBirth}, { this.state.dateOfBirth } </h5>
</div>
<div className="button-profile">
- <a href={this.state.resume ? this.state.resume : '#'} ><Button primary size="small">Resume</Button></a>
- { this.state.show_transcript &&
- <Button primary size="small">Transkrip</Button>
- }
+ <a target="_blank" rel="noopener noreferrer" href={this.state.resume ? this.state.resume : '#'} >
+ <Button primary size="small">Resume</Button>
+ </a>
</div>
<div>
- Bagikan Transkrip: <b>{ this.state.bagikanTranskrip }</b>
+ <br />
+ Bagikan Transkrip: <b>{ this.state.bagikanTranskrip ? 'Ya' : 'Tidak'}</b>
</div>
</Container>
</Segment >
{ this.updateForm(this.props.route.own) }
</div>
-
);
}
}
diff --git a/assets/js/components/ApplyModal.jsx b/assets/js/components/ApplyModal.jsx
index 6a830a86..25646639 100644
--- a/assets/js/components/ApplyModal.jsx
+++ b/assets/js/components/ApplyModal.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Icon, Modal, Button, TextArea, Form } from 'semantic-ui-react';
+import { Icon, Modal, Button, TextArea, Form, Message } from 'semantic-ui-react';
import ModalAlert from './../components/ModalAlert';
import Server from './../lib/Server';
@@ -68,7 +68,15 @@ export default class ApplyModal extends React.Component {
<div className="coverLetter">
<br />
<div className="linkCV">
- <a href={this.props.resume} target="_blank" rel="noopener noreferrer"> Klik untuk lihat CV terakhirmu</a>
+ { this.props.resume ? (<a href={this.props.resume} target="_blank" rel="noopener noreferrer"> Klik untuk lihat CV terakhirmu</a>)
+ : (
+ <Message
+ error
+ icon="warning sign"
+ header="CV Tidak Ditemukan"
+ content="Anda belum mengunggah CV. Harap ubah profil anda terlebih dahulu pada halaman Profil."
+ />)
+ }
</div>
<br />
<div>
@@ -82,7 +90,7 @@ export default class ApplyModal extends React.Component {
</Modal.Content>
<Modal.Actions>
- <Button loading={this.state.load} color="blue" disabled={!this.props.active} onClick={this.handleApply}>
+ <Button loading={this.state.load} color="blue" disabled={!this.props.active || this.props.resume == null} onClick={this.handleApply}>
{ this.props.active ? 'Daftar' : 'Sudah Terdaftar' } <Icon name="right chevron" />
</Button>
</Modal.Actions>
diff --git a/assets/js/components/ApproveModal.jsx b/assets/js/components/ApproveModal.jsx
index 132083a6..fa04bed2 100644
--- a/assets/js/components/ApproveModal.jsx
+++ b/assets/js/components/ApproveModal.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Modal, Button } from 'semantic-ui-react';
+import { Modal, Button, Icon, Segment } from 'semantic-ui-react';
import Server from './../lib/Server';
import ConfirmationModal from './../components/ConfirmationModal';
import Applicant from './../components/Applicant';
@@ -21,6 +21,7 @@ export default class ApproveModal extends React.Component {
this.handleOpen = this.handleOpen.bind(this);
this.reject = this.reject.bind(this);
this.accept = this.accept.bind(this);
+ this.gotoStudentProfile = this.gotoStudentProfile.bind(this);
this.gotoStudentResume = this.gotoStudentResume.bind(this);
this.gotoStudentTranscript = this.gotoStudentTranscript.bind(this);
}
@@ -69,6 +70,8 @@ export default class ApproveModal extends React.Component {
gotoStudentTranscript = () => this.gotoLink(`/transcript/${this.props.data.id}`);
+ gotoStudentProfile = () => this.gotoLink(`/mahasiswa/${this.props.data.student.id}`);
+
accept = () => {
this.modal.open(
'Terima Lamaran?',
@@ -89,15 +92,25 @@ export default class ApproveModal extends React.Component {
<Modal.Header>Data Lamaran</Modal.Header>
<Modal.Content>
<h4> Cover Letter </h4>
- { this.props.data.cover_letter ? this.props.data.cover_letter : 'Kosong' }
- <div style={{ float: 'right', textAlign: 'right' }}>
- {this.props.data.student.resume ? <a onClick={this.gotoStudentResume} href="#" >CV Pelamar </a> : ''}
- <br />
- {this.props.data.student.show_transcript ? <a onClick={this.gotoStudentTranscript} href="#" >Transkrip Pelamar</a> : ''}
- <br />
+ <Segment>
+ <p>
+ { this.props.data.cover_letter ? this.props.data.cover_letter : 'Kosong' }
+ </p>
+ </Segment>
+ <br />
+ <div>
+ <b>
+ {this.props.data.student.resume ? <a onClick={this.gotoStudentResume} href="#" >CV Pelamar </a> : 'Pelamar tidak memiliki CV'}
+ <br />
+ {this.props.data.student.show_transcript ? <a onClick={this.gotoStudentTranscript} href="#" >Transkrip Pelamar</a> : 'Pelamar tidak mengijinkan transktip dilihat'}
+ <br />
+ </b>
</div>
</Modal.Content>
<Modal.Actions>
+ <Button color="facebook" onClick={this.gotoStudentProfile} floated="left" >
+ <Icon name="user outline" /> Lihat Profil
+ </Button>
<Button.Group>
<Button disabled={this.props.data.status === Applicant.APPLICATION_STATUS.REJECTED} loading={this.state.rejectLoading} color="red" onClick={this.reject}>Tolak Lamaran</Button>
<Button.Or />
--
GitLab