60 lines
1.5 KiB
JavaScript
60 lines
1.5 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import {Form} from "semantic-ui-react";
|
|
|
|
import { uploadDoorLockData } from "../../../store/actions";
|
|
|
|
class FileUpload extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this.state = {
|
|
file: null,
|
|
};
|
|
|
|
this.onFileChange = this.onFileChange.bind(this);
|
|
this.onUploadClick = this.onUploadClick.bind(this);
|
|
}
|
|
|
|
onFileChange(event) {
|
|
const file = event.target.files[0];
|
|
this.setState({file});
|
|
};
|
|
|
|
onUploadClick() {
|
|
const { uploadDoorLockData } = this.props;
|
|
const { file } = this.state;
|
|
|
|
if (file) {
|
|
uploadDoorLockData(file);
|
|
}
|
|
};
|
|
|
|
render() {
|
|
const { pending } = this.props;
|
|
return (
|
|
<div>
|
|
<Form.Input
|
|
fluid
|
|
required
|
|
label="Select DLock file"
|
|
type="file"
|
|
accept=".csv"
|
|
onChange={this.onFileChange}
|
|
/>
|
|
<Form.Button onClick={this.onUploadClick} disabled={pending} >Upload</Form.Button>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
const mapStateToProps = (state) => ({
|
|
pending: state.doorLockData.pending,
|
|
});
|
|
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
uploadDoorLockData: (doorLockDataFile) => uploadDoorLockData(dispatch, doorLockDataFile)
|
|
});
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(FileUpload);
|