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 Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent'; import CardContent from '@material-ui/core/CardContent';
import CardActions from '@material-ui/core/CardActions';
import Button from '@material-ui/core/Button'; import Button from '@material-ui/core/Button';
import Typography from '@material-ui/core/Typography'; 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 }) => ( class Poll extends PureComponent {
<Card> state = {
<CardContent> value: 0,
<Typography variant="headline">Proposal: {_question}</Typography> };
<Typography variant="subheading" color="textSecondary">
Total SNT Voted: {_totalCensus} handleChange = (event, value) => {
</Typography> this.setState({ value });
<Typography variant="subheading" color="textSecondary"> };
Number of voters: {_voters}
</Typography> render(){
</CardContent> const { _question, _totalCensus, _voters } = this.props;
</Card> 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 }) => ( const PollsList = ({ rawPolls }) => (
<Fragment> <Fragment>

View File

@ -19,6 +19,7 @@
"dependencies": { "dependencies": {
"@material-ui/core": "^1.3.0", "@material-ui/core": "^1.3.0",
"@material-ui/icons": "^1.1.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-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-stage-2": "^6.24.1", "babel-preset-stage-2": "^6.24.1",
"bignumber.js": "^5.0.0", "bignumber.js": "^5.0.0",