add vote button and slider

This commit is contained in:
Barry Gitarts 2018-06-27 14:40:45 -04:00
parent 70e5c77d91
commit e99d9b5560
2 changed files with 38 additions and 14 deletions

View File

@ -1,22 +1,45 @@
import React, { Fragment } from 'react';
import React, { Fragment, PureComponent } from 'react';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import CardActions from '@material-ui/core/CardActions';
import Button from '@material-ui/core/Button';
import Typography from '@material-ui/core/Typography';
import Slider from '@material-ui/lab/Slider';
import Tooltip from '@material-ui/core/Tooltip';
const Poll = ({ _question, _totalCensus, _voters }) => (
<Card>
<CardContent>
<Typography variant="headline">Proposal: {_question}</Typography>
<Typography variant="subheading" color="textSecondary">
Total SNT Voted: {_totalCensus}
</Typography>
<Typography variant="subheading" color="textSecondary">
Number of voters: {_voters}
</Typography>
</CardContent>
</Card>
)
class Poll extends PureComponent {
state = {
value: 0,
};
handleChange = (event, value) => {
this.setState({ value });
};
render(){
const { _question, _totalCensus, _voters } = this.props;
const { value } = this.state;
return (
<Card>
<CardContent>
<Typography variant="headline">Proposal: {_question}</Typography>
<Typography variant="subheading" color="textSecondary">
Total SNT Voted: {_totalCensus}
</Typography>
<Typography variant="subheading" color="textSecondary">
Number of voters: {_voters}
</Typography>
</CardContent>
<Tooltip id="tooltip-icon" placement="top" title={`${value} SNT`}>
<CardActions>
<Slider value={value} min={0} max={6} step={1} onChange={this.handleChange} />
<Button variant="contained" color="primary">Vote</Button>
</CardActions>
</Tooltip>
</Card>
)
}
}
const PollsList = ({ rawPolls }) => (
<Fragment>

View File

@ -19,6 +19,7 @@
"dependencies": {
"@material-ui/core": "^1.3.0",
"@material-ui/icons": "^1.1.0",
"@material-ui/lab": "^1.0.0-alpha.5",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-stage-2": "^6.24.1",
"bignumber.js": "^5.0.0",