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
76
77
78
79
80
81
82
83
84
85
86
|
import React from 'react';
import PropTypes from 'prop-types';
import css from 'ba-styles/Table.scss';
import { TableCell, Input, TextField } from '@material-ui/core';
class EditableCell extends React.Component {
handleUpdate(event) {
event.persist();
this.props.updateRow(event, this.props.branch);
}
render() {
const {
cellData,
edited,
inputType
} = this.props;
switch (inputType) {
case 'text':
return (
<TableCell padding="none">
<Input
placeholder={cellData.type}
name={cellData.type}
className={css.crudInput}
id={cellData.id.toString()}
value={cellData.value}
onChange={(event) => this.handleUpdate(event)}
disabled={!edited}
margin="none"
inputProps={{
'aria-label': 'Description',
}}
/>
</TableCell>
);
case 'number':
return (
<TableCell padding="none">
<TextField
id={cellData.id.toString()}
name={cellData.type}
className={css.crudInput}
value={cellData.value}
onChange={(event) => this.handleUpdate(event)}
type="number"
InputLabelProps={{
shrink: true,
}}
margin="none"
disabled={!edited}
/>
</TableCell>
);
default:
return (
<TableCell padding="none">
<Input
placeholder={cellData.type}
name={cellData.type}
className={css.crudInput}
id={cellData.id.toString()}
value={cellData.value}
onChange={(event) => this.handleUpdate(event)}
disabled={!edited}
margin="none"
inputProps={{
'aria-label': 'Description',
}}
/>
</TableCell>
);
}
}
}
EditableCell.propTypes = {
inputType: PropTypes.string.isRequired,
cellData: PropTypes.object.isRequired,
updateRow: PropTypes.func.isRequired,
edited: PropTypes.bool.isRequired,
branch: PropTypes.string.isRequired,
};
export default EditableCell;
|
