61 lines
1.4 KiB
JavaScript
61 lines
1.4 KiB
JavaScript
import React, { Component } from 'react'
|
|
import { Dropdown } from 'semantic-ui-react'
|
|
import './CreateNodule.css'
|
|
|
|
import Tables from '../../Models/Tables'
|
|
|
|
class TableSelect extends Component {
|
|
constructor () {
|
|
super()
|
|
this.tables = new Tables()
|
|
this.state = {
|
|
selectedTablesLabels: [],
|
|
tables: this.tables.getCollectionProps()
|
|
}
|
|
document.addEventListener('updateTables', this.updateTableList)
|
|
}
|
|
|
|
clearTablesSelected = () => {
|
|
this.setState({ selectedTablesLabels: [] })
|
|
}
|
|
|
|
getSelectedTableLabels = () => this.state.selectedTablesLabels
|
|
|
|
toggleSelect = (event, element) => {
|
|
this.setState({ selectedTablesLabels: element.value })
|
|
this.props.onChange(element.value)
|
|
}
|
|
|
|
updateTableList = () => {
|
|
this.setState({tables: this.tables.getCollectionProps()})
|
|
}
|
|
|
|
renderTableDropdownOptions = () => {
|
|
const { tables } = this.state
|
|
const options = tables.map(t => {
|
|
return {key: t.label, value: t.label, text: t.label}
|
|
})
|
|
return options
|
|
}
|
|
|
|
render = () => {
|
|
return (
|
|
<div className='TableSelect'>
|
|
<Dropdown
|
|
clearable
|
|
placeholder='Included Tables'
|
|
header='Included Tables'
|
|
fluid
|
|
multiple
|
|
search
|
|
selection
|
|
options={this.renderTableDropdownOptions()}
|
|
onChange={this.toggleSelect}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default TableSelect
|