// import {UploadCsv } from '/imports/collections/students/UploadCsv'
  import _                                  from 'lodash';
  import { Meteor }                         from 'meteor/meteor';
  
  import React, { Component }               from 'react';
  import { Link,browserHistory }            from 'react-router';
  import { FormGroup,Panel,Table,
    ButtonToolbar,Modal,ControlLabel,HelpBlock,
    FormControl,Glyphicon,Button }          from 'react-bootstrap';
  // import { AddStudentForm }                 from './addStudentForm';
  import { FilesCollection } from 'meteor/ostrio:files';
  const Papa = this.Papa;
  // console.log(this);
  const style = {
    margin: 12,
  };
  function FieldGroup({ id, label, help, ...props }) {
    return (
      <FormGroup controlId={id}>
        <ControlLabel>{label}</ControlLabel>
        <FormControl {...props} />
        {help && <HelpBlock>{help}</HelpBlock>}
      </FormGroup>
    );
  }

  export class UploadCsvStaff extends Component {

    constructor(props) {
      super(props);
      this.state = {
        show: false
      };
      this.showModal = this.showModal.bind(this);
      this.hideModal = this.hideModal.bind(this);
      this.onUpdate = this.onUpdate.bind(this);
    };
  
      showModal() {
        this.setState({show: true});
      }
  
      hideModal() {
        this.setState({show: false});
      }
    onUpdate(key, value) {
      this.setState({[key]: value});
    };

    uploadStaffCsv(e){

      e.preventDefault();
      e.persist();
      var file = $('input[type="file"]').prop("files")[0];
      Papa.parse(file, {
        header: true,
      	complete: function(csvData) {
          console.log("csvData");
          console.log(csvData);
      		if(csvData){

            Meteor.call('staff.uploadCsv', csvData, function (error, result) {

              console.log("error");
              console.log(error);
              console.log("result");
              console.log(result);
             })
          }
      	}
      });
    }
  
    render() {
      console.log(this.props);
      return (
        <ButtonToolbar>
          <Button bsStyle="primary" onClick={this.showModal}>
            Upload CSV
          </Button>
          <Modal
            {...this.props}
            show={this.state.show}
            onHide={this.hideModal}
            dialogClassName="custom-modal"
          >
            <Modal.Header closeButton>

              <Modal.Title id="contained-modal-title-lg">Upload Csv</Modal.Title>

            </Modal.Header>
            <Modal.Body>

            <form onSubmit={ (e) => this.uploadStaffCsv(e) } >

            <FieldGroup
              id="formControlsFile"
              type="file"
              label="File"
              help="Upload you CSV here."
            />
            <Button type="submit" bsStyle="default">Upload File</Button>
            </form>
            </Modal.Body>
            <Modal.Footer>
              <Button onClick={this.hideModal}>Close</Button>
            </Modal.Footer>
          </Modal>
        </ButtonToolbar>
      );
    };
  
  };