Tasks.jsx
2.59 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
/*!
=========================================================
* Light Bootstrap Dashboard React - v1.3.0
=========================================================
* Product Page: https://www.creative-tim.com/product/light-bootstrap-dashboard-react
* Copyright 2019 Creative Tim (https://www.creative-tim.com)
* Licensed under MIT (https://github.com/creativetimofficial/light-bootstrap-dashboard-react/blob/master/LICENSE.md)
* Coded by Creative Tim
=========================================================
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
*/
import React, { Component } from "react";
import { Tooltip, OverlayTrigger } from "react-bootstrap";
import Checkbox from "components/CustomCheckbox/CustomCheckbox.jsx";
import Button from "components/CustomButton/CustomButton.jsx";
export class Tasks extends Component {
handleCheckbox = event => {
const target = event.target;
console.log(event.target);
this.setState({
[target.name]: target.checked
});
};
render() {
const edit = <Tooltip id="edit_tooltip">Edit Task</Tooltip>;
const remove = <Tooltip id="remove_tooltip">Remove</Tooltip>;
const tasks_title = [
'Sign contract for "What are conference organizers afraid of?"',
"Lines From Great Russian Literature? Or E-mails From My Boss?",
"Flooded: One year later, assessing what was lost and what was found when a ravaging rain swept through metro Detroi",
"Create 4 Invisible User Experiences you Never Knew About",
'Read "Following makes Medium better"',
"Unfollow 5 enemies from twitter"
];
var tasks = [];
var number;
for (var i = 0; i < tasks_title.length; i++) {
number = "checkbox" + i;
tasks.push(
<tr key={i}>
<td>
<Checkbox
number={number}
isChecked={i === 1 || i === 2 ? true : false}
/>
</td>
<td>{tasks_title[i]}</td>
<td className="td-actions text-right">
<OverlayTrigger placement="top" overlay={edit}>
<Button bsStyle="info" simple type="button" bsSize="xs">
<i className="fa fa-edit" />
</Button>
</OverlayTrigger>
<OverlayTrigger placement="top" overlay={remove}>
<Button bsStyle="danger" simple type="button" bsSize="xs">
<i className="fa fa-times" />
</Button>
</OverlayTrigger>
</td>
</tr>
);
}
return <tbody>{tasks}</tbody>;
}
}
export default Tasks;