Fakultas Ilmu Komputer UI

ApproveModal.jsx 3.82 KB
Newer Older
1
import React from 'react';
2
3
4
5
import { Modal, Button } from 'semantic-ui-react';
import Server from './../lib/Server';
import ConfirmationModal from './../components/ConfirmationModal';
import Applicant from './../components/Applicant';
6
7
8
9

export default class ApproveModal extends React.Component {
  static propTypes = {
    data: React.PropTypes.object.isRequired,
10
    updateStatus: React.PropTypes.func.isRequired,
11
12
13
14
15
16
17
  };

  constructor(props) {
    super(props);
    /* istanbul ignore next */
    this.state = {
      modalOpen: false,
18
19
      rejectLoading: false,
      acceptLoading: false,
20
21
    };
    this.handleOpen = this.handleOpen.bind(this);
22
23
    this.reject = this.reject.bind(this);
    this.accept = this.accept.bind(this);
24
25
    this.gotoStudentResume = this.gotoStudentResume.bind(this);
    this.gotoStudentTranscript = this.gotoStudentTranscript.bind(this);
26
27
  }

28
  handleOpen = () => this.setState({ modalOpen: true });
29
  handleClose = () => { this.readApplication(); this.setState({ modalOpen: false }); }
30
31
32
33
34
35
36

  readApplication = () => {
    const data = { status: Applicant.APPLICATION_STATUS.READ };
    return this.props.data.status === Applicant.APPLICATION_STATUS.NEW && Server.patch(`/applications/${this.props.data.id}/`, data).then((status) => {
      this.props.updateStatus(this.props.data.id, status.status);
    });
  };
37

38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
  rejectApplication = () => {
    const data = { status: Applicant.APPLICATION_STATUS.REJECTED };
    this.setState({ rejectLoading: true });
    Server.patch(`/applications/${this.props.data.id}/`, data).then((status) => {
      this.props.updateStatus(this.props.data.id, status.status);
    });
  };

  reject = () => {
    this.modal.open(
      'Tolak Lamaran?',
      'Apakah anda yakin untuk menolak lamaran ini?',
      'trash',
      this.rejectApplication,
    );
  };
54

55
56
57
58
59
60
61
62
  acceptApplication = () => {
    const data = { status: Applicant.APPLICATION_STATUS.ACCEPTED };
    this.setState({ acceptLoading: true });
    Server.patch(`/applications/${this.props.data.id}/`, data).then((status) => {
      this.props.updateStatus(this.props.data.id, status.status);
    });
  };

63
64
65
66
67
  gotoLink = (url) => {
    const win = window.open(url);
    win.focus();
  };

68
69
70
71
  gotoStudentResume = () => this.gotoLink(this.props.data.student.resume);

  gotoStudentTranscript = () => this.gotoLink(`/transcript/${this.props.data.id}`);

72
73
74
75
76
77
78
79
  accept = () => {
    this.modal.open(
      'Terima Lamaran?',
      'Apakah anda yakin untuk menerima lamaran ini?',
      'checkmark',
      this.acceptApplication,
    );
  };
80
81
82

  render = () => (
    <Modal
83
      trigger={<Button primary onClick={this.handleOpen} floated="right">Detail</Button>}
84
85
86
87
      closeIcon="close"
      open={this.state.modalOpen}
      onClose={this.handleClose}
    >
88
89
      <ConfirmationModal ref={(modal) => { this.modal = modal; }} />
      <Modal.Header>Data Lamaran</Modal.Header>
90
      <Modal.Content>
91
        <h4> Cover Letter </h4>
92
93
        { this.props.data.cover_letter ? this.props.data.cover_letter : 'Kosong' }
        <div style={{ float: 'right', textAlign: 'right' }}>
94
          {this.props.data.student.resume ? <a onClick={this.gotoStudentResume} href="#" >CV Pelamar </a> : ''}
95
          <br />
96
          {this.props.data.student.show_transcript ? <a onClick={this.gotoStudentTranscript} href="#" >Transkrip Pelamar</a> : ''}
97
          <br />
98
        </div>
99
100
      </Modal.Content>
      <Modal.Actions>
101
102
103
104
105
        <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 />
          <Button disabled={this.props.data.status === Applicant.APPLICATION_STATUS.ACCEPTED} loading={this.state.acceptLoading} color="green" onClick={this.accept}>Terima Lamaran</Button>
        </Button.Group>
106
107
108
109
110
      </Modal.Actions>
    </Modal>
    )
}