Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 | 4x 4x 6x 6x 3x 3x 2x 1x 1x 1x 11x 11x 4x 4x | /* Copyright © 2005-2017 Kuali, Inc. - All Rights Reserved
* You may use and modify this code under the terms of the Kuali, Inc.
* Pre-Release License Agreement. You may not distribute it.
*
* You should have received a copy of the Kuali, Inc. Pre-Release License
* Agreement with this file. If not, please write to license@kuali.co.
*/
import Icon from '@kuali/kuali-ui/lib/icons'
import { isEmpty } from 'lodash'
import PropTypes from 'prop-types'
import { RaisedButton } from '@kuali/kuali-ui'
import ReactDropzone from 'react-dropzone'
import Snackbar from 'react-md/lib/Snackbars'
import React, { Component } from 'react'
const style = {
border: '1px dotted #999',
borderRadius: 0,
fontSize: 20,
fontWeight: 'normal',
textAlign: 'center',
width: '100%',
height: 142,
position: 'relative',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
padding: '20px 40px'
}
const activeStyle = {
backgroundColor: '#1ef'
}
export default class Dropzone extends Component {
constructor () {
super()
this.state = {
errors: []
}
}
onDrop = files => {
files.forEach(file => {
if (file) {
if (file.size > (this.props.maxFileSize || 30 * 1000 * 1000)) {
this.setState({
errors: [
...this.state.errors,
`${file.name} exceeds the file size limit of 30mb`
]
})
} else {
this.props.onChange({
fileName: file.name,
contentType: file.type,
fileSize: file.size,
newFileAttachmentFile: file
})
}
}
})
}
clearErrors = () => {
this.setState({ errors: [] })
}
render () {
const { details, multiple } = this.props
return (
<div>
<ReactDropzone
style={style}
activeStyle={activeStyle}
disablePreview
multiple={multiple}
onDrop={this.onDrop}
>
<Icon name='attach_file' />
<span style={{ margin: '0 30px 0 30px' }}>
{details.dropzoneText}
</span>
<RaisedButton label={details.buttonText}>
<Icon name='add' variant='success' />
</RaisedButton>
</ReactDropzone>
{!isEmpty(this.state.errors) && (
<Snackbar
toasts={[{ text: this.state.errors }]}
onDismiss={this.clearErrors}
style={{ backgroundColor: 'red', zIndex: 999999 }}
/>
)}
</div>
)
}
}
Dropzone.propTypes = {
onChange: PropTypes.func.isRequired,
details: PropTypes.object.isRequired,
multiple: PropTypes.bool.isRequired
}
Dropzone.defaultProps = {
multiple: false
}
|