diff --git a/client/views/grade/FeedbackBlock.jsx b/client/views/grade/FeedbackBlock.jsx index 4d831ac7e333e37c354616e392837f164d7f2aee..c59bcb3b8ffaad946d007b8745a05b7d27b4ab18 100644 --- a/client/views/grade/FeedbackBlock.jsx +++ b/client/views/grade/FeedbackBlock.jsx @@ -3,7 +3,8 @@ import React from 'react'; class FeedbackBlock extends React.Component { state = { - hover: false + hover: false, + checked: false } leave = () => { this.setState({ @@ -20,14 +21,22 @@ class FeedbackBlock extends React.Component { console.log('mounting! ' + this.props.feedback.id) } + toggle = () => { + if (!this.state.hover) { + this.setState({ + checked: !this.state.checked + }) + } + } + render() { const score = this.props.feedback.score; return ( - <a className="panel-block is-active" onClick={() => !this.state.hover && console.log('a click')} > + <a className="panel-block is-active" onClick={this.toggle} > <span className="panel-icon"> - <i className={"fa fa-" + (this.props.checked ? "check-square-o" : "square-o")}></i> + <i className={"fa fa-" + (this.state.checked ? "check-square-o" : "square-o")}></i> </span> <span style={{ width: '80%' }}> {this.props.feedback.name} diff --git a/client/views/grade/FeedbackPanel.jsx b/client/views/grade/FeedbackPanel.jsx index 8351b4da5cece630e80152ace93da78a03aaa20d..e42123dd7a6a73aee38dc1fc6648b9a56ca8ef0e 100644 --- a/client/views/grade/FeedbackPanel.jsx +++ b/client/views/grade/FeedbackPanel.jsx @@ -49,7 +49,7 @@ class FeedbackPanel extends React.Component { Feedback </p> {this.state.feedback.map((feedback, i) => - <FeedbackBlock key={i} index={i} feedback={feedback} checked={true} onClick={this.props.editFeedback} /> + <FeedbackBlock key={i} index={i} feedback={feedback} checked={false} onClick={this.props.editFeedback} /> )} <div className="panel-block is-hidden-mobile"> <button className="button is-link is-outlined is-fullwidth" onClick={this.props.toggleEdit}>