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 | 3x | import React, {Component} from 'react';
import PropTypes from 'prop-types';
import mapValues from 'lodash/mapValues';
import {Select} from 'antd';
import isUndefined from 'lodash/isUndefined';
const Option = Select.Option;
import {injectIntl} from 'react-intl';
import {FilterPlugin, Label} from './share';
@injectIntl
export default class SelectFilter extends Component {
static propTypes = {
onChange: PropTypes.func,
name: PropTypes.string,
options: PropTypes.array,
label: PropTypes.string,
intl: PropTypes.object,
};
constructor(props) {
super(props);
this.state = {
condition: {}
}
this.onSelect = this.onSelect.bind(this);
}
static defaultProps = {
options: []
}
onSelect(val) {
const {condition} = this.state;
const {onChange, options} = this.props;
if (isUndefined(val)) {
this.setState({
condition: {}
});
return onChange(mapValues(condition, () => undefined));
}
// {_eq: 1} => {$eq: 1}
const selectedCondition = options[val].condition;
onChange({
...mapValues(condition, () => undefined),
...selectedCondition
});
this.setState({
condition: selectedCondition
});
}
render() {
const {label, options, intl} = this.props;
const placeholder = intl.formatMessage({id: 'query.filter.select.placeholder'});
return (
<FilterPlugin>
<Label>{label}</Label>
<Select
style={{width: '100%'}}
placeholder={placeholder}
onChange={(val) => this.onSelect(val)}
allowClear
>
{options.map((cond, i) => (
<Option value={i} key={i}>
{cond.text}
</Option>
))}
</Select>
</FilterPlugin>
);
}
}
|