Fakultas Ilmu Komputer UI

ModalPendaftaran.jsx 2.19 KB
Newer Older
sirinbaisa's avatar
sirinbaisa committed
1
2
3
4
5
6
import React from 'react';
import { Modal, Button, Icon, TextArea, Form } from 'semantic-ui-react';
import ModalAlert from './ModalAlert';

export default class ModalPendaftaran extends React.Component {
  static propTypes = {
7
8
9
    data: React.PropTypes.object.isRequired,
    id: React.PropTypes.number.isRequired,
    buttonTitle: React.PropTypes.string.isRequired,
10
  };
sirinbaisa's avatar
sirinbaisa committed
11

12
13
  static successResponse = 'Pendaftaran anda berhasil direkam. Harap menunggu kabar selanjutnya dari pihak yang terkait\n';
  static failedResponse = 'Maaf pendaftaran yang anda lakukan gagal. Harap ulangi pendaftaran atau hubungi administrator\n';
sirinbaisa's avatar
sirinbaisa committed
14

15
16
17
18
19
20
21
22
23
24
  constructor(props) {
    super(props);
    /* istanbul ignore next */
    this.state = {
      modalOpen: false,
      responseHeader: 'Menghubungkan ke Server',
      responseText: 'Terima kasih sudah mendaftar!',
      coverLetter: '',
    };
    this.handleChange = this.handleChange.bind(this);
25
    this.handleOpen = this.handleOpen.bind(this);
26
27
28
  }

  handleChange(event) {
29
    this.setState({ coverLetter: event.target.value });
30
31
32
33
34
  }

  handleOpen() {
    this.setState({ modalOpen: true });
  }
sirinbaisa's avatar
sirinbaisa committed
35
36
37
38
39
40
41

  handleClose = () => this.setState({
    modalOpen: false,
  });

  render = () => (
    <Modal
sirinbaisa's avatar
sirinbaisa committed
42

43
      trigger={<Button onClick={this.handleOpen} floated="right">{this.props.buttonTitle}</Button>}
sirinbaisa's avatar
sirinbaisa committed
44
45
46
47
48
      closeIcon="close"
      open={this.state.modalOpen}
      onClose={this.handleClose}
    >

49
      <Modal.Header>{this.props.data.header}</Modal.Header>
50
51
52

      <Modal.Content>

sirinbaisa's avatar
sirinbaisa committed
53
54
        <Modal.Description>
          <Modal.Header> <h3> Deskripsi Lowongan </h3></Modal.Header>
55
          {this.props.data.description}
sirinbaisa's avatar
sirinbaisa committed
56

57
58
59
60
61
        </Modal.Description>

          <div className="coverLetter">

            <div className="linkCV">
sirinbaisa's avatar
sirinbaisa committed
62
63
64
65
            <a> your latest CV </a>
          </div>

            <h5> Write your Cover Letter </h5>
66
            <Form >
67
              <TextArea placeholder="Tell us more" size='big' onChange={this.handleChange}/>
sirinbaisa's avatar
sirinbaisa committed
68
            </Form>
69

sirinbaisa's avatar
sirinbaisa committed
70
71
72
73
          </div>

      </Modal.Content>
      <Modal.Actions>
74
        <ModalAlert
75
          id={this.props.id}
76
          onChangeValue={this.handleClose}
77
          coverLetter={this.state.coverLetter}
78
        />
sirinbaisa's avatar
sirinbaisa committed
79
80
81
82
83
      </Modal.Actions>
    </Modal>
    )
}