App.js
2.37 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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
import React, {Component, components} from 'react';
import Student from './components/Student';
import './App.css';
import Paper from '@material-ui/core/Paper'
import Table from '@material-ui/core/Table'
import TableHead from '@material-ui/core/TableHead'
import TableBody from '@material-ui/core/TableBody'
import TableRow from '@material-ui/core/TableRow'
import TableCell from '@material-ui/core/TableCell'
import {withStyles} from '@material-ui/core/styles';
const styles = theme => ({
root: {
width: '100%',
marginTop: theme.spacing.unit * 3,
overflowX: "auto"
},
table: {
minWidth:1000
}
})
const students = [
{
'st_Code': 6666,
'st_Name': '육현진',
'st_Id': 2018102210,
'st_Major':'컴퓨터공학과',
'st_Midscore': 100,
'st_Finalscore': 100,
'st_Assignscore': 100,
'st_Attendscore': 100,
'st_Score':'A+'
},
{
'st_Code': 1111,
'st_Name': '김창동',
'st_Id': 2020021120,
'st_Major':'컴퓨터공학과',
'st_Midscore': 79,
'st_Finalscore': 85,
'st_Assignscore': 100,
'st_Attendscore': 90,
'st_Score':'A0'
}]
class App extends Component{
render(){
const {classes}= this.props;
return (
<Paper className={classes.root}>
<Table className={classes.table}>
<TableHead>
<TableCell>코드번호</TableCell>
<TableCell>이름</TableCell>
<TableCell>학번</TableCell>
<TableCell>전공</TableCell>
<TableCell>중간</TableCell>
<TableCell>기말</TableCell>
<TableCell>과제</TableCell>
<TableCell>출석</TableCell>
<TableCell>학점</TableCell>
</TableHead>
<TableBody>
{
students.map(c=>{
return (
<Student
key={c.st_Code}
st_Code={c.st_Code}
st_Name={c.st_Name}
st_Id={c.st_Id}
st_Major={c.st_Major}
st_Midscore={c.st_Midscore}
st_Finalscore={c.st_Finalscore}
st_Assignscore={c.st_Assignscore}
st_Attendscore={c.st_Attendscore}
st_Score={c.st_Score}
/>
);
})
}
</TableBody>
</Table>
</Paper>
);
}
}
export default withStyles(styles)(App);