Select Git revision
TraineeTableRow.js 4.42 KiB
import React, { Component } from 'react';
import {
Comment,
Table,
Icon,
Popup,
Grid,
Button,
Form,
} from 'semantic-ui-react';
import { connect } from 'react-redux';
import { visitorChange } from '../../actions/statistics';
import { writeNote, clearWrite, postNote, deleteNote } from '../../actions/notes';
import CommentModal from './CommentModal'
class TraineeTableRow extends Component {
constructor(props) {
super(props);
this.state = {
note: '',
}
}
handleWrite = (e) => {
this.setState({ ...this.state, note: e.target.value });
}
clearWrite = () => {
this.setState({ ...this.state, note: '' });
}
render() {
const { trainee, edit, selectedEvent, notes } = this.props;
const isVisitor = selectedEvent.visitors.includes(trainee.id);
const isAbsent = selectedEvent.absent.includes(trainee.id);
return (
<Table.Row key={trainee.id}>
<Table.Cell>
{trainee.full_name}
</Table.Cell>
{!edit ?
<Table.Cell textAlign='center'>
{
isVisitor ?
<Icon color='green' name='checkmark' />
:
isAbsent ?
<Icon color='orange' name='minus' />
:
<Icon color='red' name='cancel' />
}
</Table.Cell>
:
<Table.Cell textAlign='center'>
<Button
compact
icon={<Icon color='green' name='checkmark' />}
color={isVisitor ? 'blue' : 'lightgrey'}
onClick={() => this.props.visitorChange({ id: trainee.id, value: 'Visitor' })}
/>
<Button
compact
icon={<Icon color='orange' name='minus' />}
color={isAbsent ? 'blue' : 'lightgrey'}
onClick={() => this.props.visitorChange({ id: trainee.id, value: 'Absent' })}
/>
<Button
compact
icon={<Icon color='red' name='cancel' />}
color={!isVisitor && !isAbsent ? 'blue' : 'lightgrey'}