Fakultas Ilmu Komputer UI

ApproveModal.jsx 4.27 KB
Newer Older
1
import React from 'react';
2
import { Modal, Button, Icon, Segment } from 'semantic-ui-react';
3
4
5
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
    this.gotoStudentProfile = this.gotoStudentProfile.bind(this);
25
26
    this.gotoStudentResume = this.gotoStudentResume.bind(this);
    this.gotoStudentTranscript = this.gotoStudentTranscript.bind(this);
27
28
  }

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

  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);
    });
  };
38

39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
  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,
    );
  };
55

56
57
58
59
60
61
62
63
  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);
    });
  };

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

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

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

73
74
  gotoStudentProfile = () => this.gotoLink(`/mahasiswa/${this.props.data.student.id}`);

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

  render = () => (
    <Modal
86
      trigger={<Button primary onClick={this.handleOpen} floated="right">Detail</Button>}
87
88
89
90
      closeIcon="close"
      open={this.state.modalOpen}
      onClose={this.handleClose}
    >
91
92
      <ConfirmationModal ref={(modal) => { this.modal = modal; }} />
      <Modal.Header>Data Lamaran</Modal.Header>
93
      <Modal.Content>
94
        <h4> Cover Letter </h4>
95
96
97
98
99
100
101
102
103
104
105
106
107
        <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>
108
        </div>
109
110
      </Modal.Content>
      <Modal.Actions>
111
112
113
        <Button color="facebook" onClick={this.gotoStudentProfile} floated="left" >
          <Icon name="user outline" /> Lihat Profil
        </Button>
114
115
116
117
118
        <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>
119
120
121
122
123
      </Modal.Actions>
    </Modal>
    )
}