91 lines
2.5 KiB
JavaScript
91 lines
2.5 KiB
JavaScript
import React from 'react';
|
|
|
|
const PROFICIENCY_NAMES = ['No Filter', 'Above 40%', 'Above 60%', 'Above 80%'];
|
|
|
|
// the proficiency filter component. this demonstrates how to integrate
|
|
// a React filter component with ag-Grid.
|
|
export default class ProficiencyFilter extends React.Component {
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
selected: PROFICIENCY_NAMES[0]
|
|
};
|
|
}
|
|
|
|
// called by agGrid
|
|
doesFilterPass(params) {
|
|
const value = this.props.valueGetter(params);
|
|
const valueAsNumber = parseFloat(value);
|
|
|
|
switch (this.state.selected) {
|
|
case PROFICIENCY_NAMES[1] :
|
|
return valueAsNumber >= 40;
|
|
case PROFICIENCY_NAMES[2] :
|
|
return valueAsNumber >= 60;
|
|
case PROFICIENCY_NAMES[3] :
|
|
return valueAsNumber >= 80;
|
|
default :
|
|
return true;
|
|
}
|
|
};
|
|
|
|
// called by agGrid
|
|
isFilterActive() {
|
|
return this.state.selected !== PROFICIENCY_NAMES[0];
|
|
};
|
|
|
|
onButtonPressed(name) {
|
|
const newState = {selected: name};
|
|
// set the state, and once it is done, then call filterChangedCallback
|
|
this.setState(newState, this.props.filterChangedCallback);
|
|
}
|
|
|
|
|
|
getModel() {
|
|
return ''
|
|
}
|
|
|
|
setModel(model) {
|
|
}
|
|
|
|
render() {
|
|
const rows = [];
|
|
PROFICIENCY_NAMES.forEach((name) => {
|
|
const selected = this.state.selected === name;
|
|
rows.push(
|
|
<div key={name}>
|
|
<label style={{paddingLeft: 4}}>
|
|
<input type="radio" checked={selected} name={Math.random()}
|
|
onChange={this.onButtonPressed.bind(this, name)}/>
|
|
{name}
|
|
</label>
|
|
</div>
|
|
);
|
|
});
|
|
|
|
return (
|
|
<div>
|
|
<div style={{
|
|
textAlign: 'center',
|
|
background: 'lightgray',
|
|
width: '100%',
|
|
display: 'block',
|
|
borderBottom: '1px solid grey'
|
|
}}>
|
|
<b>Custom Proficiency Filter</b>
|
|
</div>
|
|
{rows}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// these are other method that agGrid calls that we
|
|
// could of implemented, but they are optional and
|
|
// we have no use for them in this particular filter.
|
|
//getApi() {}
|
|
//afterGuiAttached(params) {}
|
|
//onNewRowsLoaded() {}
|
|
//onAnyFilterChanged() {}
|
|
}
|