Fakultas Ilmu Komputer UI

ApproveModal.jsx 4.57 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
30
31
32
33
34
35
36
37
38
39
40
41
  componentWillUpdate() {
    this.fixBody();
  }

  componentDidUpdate() {
    this.fixBody();
  }

  fixBody = () => {
    const anotherModal = document.getElementsByClassName('ui page modals').length;
    if (anotherModal > 0) document.body.classList.add('scrolling', 'dimmable', 'dimmed');
  };

42
  handleOpen = () => this.setState({ modalOpen: true });
43
  handleClose = () => { this.readApplication(); this.setState({ modalOpen: false }); }
44
45
46
47
48
49
50

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

52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
  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,
    );
  };
68

69
70
71
72
73
74
75
76
  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);
    });
  };

77
78
79
80
81
  gotoLink = (url) => {
    const win = window.open(url);
    win.focus();
  };

82
83
84
85
  gotoStudentResume = () => this.gotoLink(this.props.data.student.resume);

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

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

88
89
90
91
92
93
94
95
  accept = () => {
    this.modal.open(
      'Terima Lamaran?',
      'Apakah anda yakin untuk menerima lamaran ini?',
      'checkmark',
      this.acceptApplication,
    );
  };
96
97
98

  render = () => (
    <Modal
99
      trigger={<Button primary onClick={this.handleOpen} floated="right">Detail</Button>}
100
101
102
103
      closeIcon="close"
      open={this.state.modalOpen}
      onClose={this.handleClose}
    >
104
105
      <ConfirmationModal ref={(modal) => { this.modal = modal; }} />
      <Modal.Header>Data Lamaran</Modal.Header>
106
      <Modal.Content>
107
        <h4> Cover Letter </h4>
108
109
110
111
112
113
114
115
116
117
118
119
120
        <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>
121
        </div>
122
123
      </Modal.Content>
      <Modal.Actions>
124
125
126
        <Button color="facebook" onClick={this.gotoStudentProfile} floated="left" >
          <Icon name="user outline" /> Lihat Profil
        </Button>
127
128
129
130
131
        <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>
132
133
134
135
136
      </Modal.Actions>
    </Modal>
    )
}