Showing
5 changed files
with
64 additions
and
7 deletions
1 | -[{"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\index.js":"1","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\reportWebVitals.js":"2","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\App.js":"3","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\components\\Student.js":"4"},{"size":500,"mtime":499162500000,"results":"5","hashOfConfig":"6"},{"size":362,"mtime":499162500000,"results":"7","hashOfConfig":"6"},{"size":1279,"mtime":1607355610693,"results":"8","hashOfConfig":"6"},{"size":1669,"mtime":1607355555245,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},"16rehmo",{"filePath":"13","messages":"14","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},{"filePath":"15","messages":"16","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"17","messages":"18","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\index.js",[],["19","20"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\reportWebVitals.js",[],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\App.js",["21"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\components\\Student.js",[],{"ruleId":"22","replacedBy":"23"},{"ruleId":"24","replacedBy":"25"},{"ruleId":"26","severity":1,"message":"27","line":1,"column":27,"nodeType":"28","messageId":"29","endLine":1,"endColumn":37},"no-native-reassign",["30"],"no-negated-in-lhs",["31"],"no-unused-vars","'components' is defined but never used.","Identifier","unusedVar","no-global-assign","no-unsafe-negation"] | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
1 | +[{"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\index.js":"1","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\reportWebVitals.js":"2","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\App.js":"3","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\components\\Student.js":"4"},{"size":500,"mtime":499162500000,"results":"5","hashOfConfig":"6"},{"size":362,"mtime":499162500000,"results":"7","hashOfConfig":"6"},{"size":2429,"mtime":1607364268881,"results":"8","hashOfConfig":"6"},{"size":2433,"mtime":1607363898200,"results":"9","hashOfConfig":"6"},{"filePath":"10","messages":"11","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},"16rehmo",{"filePath":"13","messages":"14","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"12"},{"filePath":"15","messages":"16","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"17","messages":"18","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"19","usedDeprecatedRules":"12"},"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\index.js",[],["20","21"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\reportWebVitals.js",[],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\App.js",["22","23"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\src\\components\\Student.js",["24","25","26"],"import React from 'react';\r\nimport TableRow from '@material-ui/core/TableRow';\r\nimport TableCell from '@material-ui/core/TableCell';\r\n\r\nclass Student extends React.Component{\r\n render(){\r\n return(\r\n <TableRow>\r\n <TableCell> {this.props.st_Code} </TableCell>\r\n <TableCell> {this.props.st_Name} </TableCell>\r\n <TableCell> {this.props.st_Id} </TableCell>\r\n <TableCell> {this.props.st_Major} </TableCell>\r\n <TableCell> {this.props.st_Midscore} </TableCell>\r\n <TableCell> {this.props.st_Finalscore} </TableCell>\r\n <TableCell> {this.props.st_Assignscore} </TableCell>\r\n <TableCell> {this.props.st_Attendscore} </TableCell>\r\n <TableCell> {this.props.st_Score} </TableCell>\r\n\r\n </TableRow>\r\n \r\n /*<div>\r\n \r\n <Searchscores st_Midscore={this.props.st_Midscore} \r\n st_Finalscore = {this.props.st_Finalscore}\r\n st_Assignscore = {this.props.st_Assignscore}\r\n st_Attendscore = {this.props.st_Attendscore}/>\r\n\r\n <Searchscore st_Score={this.props.st_Score}/>\r\n\r\n <Searchothers st_Midscore={this.props.st_Midscore} \r\n st_Finalscore = {this.props.st_Finalscore}\r\n st_Assignscore = {this.props.st_Assignscore}\r\n st_Attendscore = {this.props.st_Attendscore}\r\n st_Score = {this.props.st_Score}/>\r\n\r\n </div>*/\r\n\r\n )\r\n }\r\n}\r\n\r\nclass Searchscores extends React.Component{\r\n render(){\r\n return(\r\n <div>\r\n\r\n <p>{this.props.st_Midscore}</p>\r\n <p>{this.props.st_Finalscore}</p>\r\n <p>{this.props.st_Assignscore}</p>\r\n <p>{this.props.st_Attendscore}</p>\r\n\r\n </div> \r\n )\r\n }\r\n}\r\n\r\n\r\nclass Searchscore extends React.Component{\r\n render(){\r\n return(\r\n <div>\r\n <p>{this.props.st_Score}</p>\r\n </div> \r\n )\r\n }\r\n}\r\n\r\nclass Searchothers extends React.Component{\r\n render(){\r\n return(\r\n <div>\r\n <p>{this.props.st_Midscore}</p>\r\n <p>{this.props.st_Finalscore}</p>\r\n <p>{this.props.st_Assignscore}</p>\r\n <p>{this.props.st_Attendscore}</p>\r\n <p>{this.props.st_Score}</p>\r\n </div> \r\n )\r\n }\r\n}\r\n\r\nexport default Student;",{"ruleId":"27","replacedBy":"28"},{"ruleId":"29","replacedBy":"30"},{"ruleId":"31","severity":1,"message":"32","line":1,"column":27,"nodeType":"33","messageId":"34","endLine":1,"endColumn":37},{"ruleId":"31","severity":1,"message":"35","line":8,"column":8,"nodeType":"33","messageId":"34","endLine":8,"endColumn":16},{"ruleId":"31","severity":1,"message":"36","line":42,"column":7,"nodeType":"33","messageId":"34","endLine":42,"endColumn":19},{"ruleId":"31","severity":1,"message":"37","line":58,"column":7,"nodeType":"33","messageId":"34","endLine":58,"endColumn":18},{"ruleId":"31","severity":1,"message":"38","line":68,"column":7,"nodeType":"33","messageId":"34","endLine":68,"endColumn":19},"no-native-reassign",["39"],"no-negated-in-lhs",["40"],"no-unused-vars","'components' is defined but never used.","Identifier","unusedVar","'TableRow' is defined but never used.","'Searchscores' is defined but never used.","'Searchscore' is defined but never used.","'Searchothers' is defined but never used.","no-global-assign","no-unsafe-negation"] | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
This diff is collapsed. Click to expand it.
... | @@ -3,6 +3,7 @@ | ... | @@ -3,6 +3,7 @@ |
3 | "version": "0.1.0", | 3 | "version": "0.1.0", |
4 | "private": true, | 4 | "private": true, |
5 | "dependencies": { | 5 | "dependencies": { |
6 | + "@material-ui/core": "^4.11.2", | ||
6 | "@testing-library/jest-dom": "^5.11.6", | 7 | "@testing-library/jest-dom": "^5.11.6", |
7 | "@testing-library/react": "^11.2.2", | 8 | "@testing-library/react": "^11.2.2", |
8 | "@testing-library/user-event": "^12.5.0", | 9 | "@testing-library/user-event": "^12.5.0", | ... | ... |
1 | import React, {Component, components} from 'react'; | 1 | import React, {Component, components} from 'react'; |
2 | -import './App.css'; | ||
3 | import Student from './components/Student'; | 2 | import Student from './components/Student'; |
3 | +import './App.css'; | ||
4 | +import Paper from '@material-ui/core/Paper' | ||
5 | +import Table from '@material-ui/core/Table' | ||
6 | +import TableHead from '@material-ui/core/TableHead' | ||
7 | +import TableBody from '@material-ui/core/TableBody' | ||
8 | +import TableRow from '@material-ui/core/TableRow' | ||
9 | +import TableCell from '@material-ui/core/TableCell' | ||
10 | +import {withStyles} from '@material-ui/core/styles'; | ||
11 | + | ||
12 | +const styles = theme => ({ | ||
13 | + root: { | ||
14 | + width: '100%', | ||
15 | + marginTop: theme.spacing.unit * 3, | ||
16 | + overflowX: "auto" | ||
17 | + }, | ||
18 | + table: { | ||
19 | + minWidth:1000 | ||
20 | + } | ||
21 | +}) | ||
4 | 22 | ||
5 | const students = [ | 23 | const students = [ |
6 | { | 24 | { |
... | @@ -28,8 +46,26 @@ const students = [ | ... | @@ -28,8 +46,26 @@ const students = [ |
28 | 46 | ||
29 | class App extends Component{ | 47 | class App extends Component{ |
30 | render(){ | 48 | render(){ |
49 | + | ||
50 | + const {classes}= this.props; | ||
51 | + | ||
31 | return ( | 52 | return ( |
32 | - <div> | 53 | + <Paper className={classes.root}> |
54 | + <Table className={classes.table}> | ||
55 | + | ||
56 | + <TableHead> | ||
57 | + <TableCell>코드번호</TableCell> | ||
58 | + <TableCell>이름</TableCell> | ||
59 | + <TableCell>학번</TableCell> | ||
60 | + <TableCell>전공</TableCell> | ||
61 | + <TableCell>중간</TableCell> | ||
62 | + <TableCell>기말</TableCell> | ||
63 | + <TableCell>과제</TableCell> | ||
64 | + <TableCell>출석</TableCell> | ||
65 | + <TableCell>학점</TableCell> | ||
66 | + </TableHead> | ||
67 | + | ||
68 | + <TableBody> | ||
33 | { | 69 | { |
34 | students.map(c=>{ | 70 | students.map(c=>{ |
35 | return ( | 71 | return ( |
... | @@ -48,10 +84,14 @@ class App extends Component{ | ... | @@ -48,10 +84,14 @@ class App extends Component{ |
48 | ); | 84 | ); |
49 | }) | 85 | }) |
50 | } | 86 | } |
51 | - </div> | 87 | + </TableBody> |
88 | + | ||
89 | + </Table> | ||
90 | + | ||
91 | + </Paper> | ||
52 | 92 | ||
53 | ); | 93 | ); |
54 | } | 94 | } |
55 | } | 95 | } |
56 | 96 | ||
57 | -export default App; | 97 | +export default withStyles(styles)(App); | ... | ... |
1 | import React from 'react'; | 1 | import React from 'react'; |
2 | +import TableRow from '@material-ui/core/TableRow'; | ||
3 | +import TableCell from '@material-ui/core/TableCell'; | ||
2 | 4 | ||
3 | class Student extends React.Component{ | 5 | class Student extends React.Component{ |
4 | render(){ | 6 | render(){ |
5 | return( | 7 | return( |
6 | - <div> | 8 | + <TableRow> |
9 | + <TableCell> {this.props.st_Code} </TableCell> | ||
10 | + <TableCell> {this.props.st_Name} </TableCell> | ||
11 | + <TableCell> {this.props.st_Id} </TableCell> | ||
12 | + <TableCell> {this.props.st_Major} </TableCell> | ||
13 | + <TableCell> {this.props.st_Midscore} </TableCell> | ||
14 | + <TableCell> {this.props.st_Finalscore} </TableCell> | ||
15 | + <TableCell> {this.props.st_Assignscore} </TableCell> | ||
16 | + <TableCell> {this.props.st_Attendscore} </TableCell> | ||
17 | + <TableCell> {this.props.st_Score} </TableCell> | ||
18 | + | ||
19 | + </TableRow> | ||
20 | + | ||
21 | + /*<div> | ||
7 | 22 | ||
8 | <Searchscores st_Midscore={this.props.st_Midscore} | 23 | <Searchscores st_Midscore={this.props.st_Midscore} |
9 | st_Finalscore = {this.props.st_Finalscore} | 24 | st_Finalscore = {this.props.st_Finalscore} |
... | @@ -18,7 +33,8 @@ class Student extends React.Component{ | ... | @@ -18,7 +33,8 @@ class Student extends React.Component{ |
18 | st_Attendscore = {this.props.st_Attendscore} | 33 | st_Attendscore = {this.props.st_Attendscore} |
19 | st_Score = {this.props.st_Score}/> | 34 | st_Score = {this.props.st_Score}/> |
20 | 35 | ||
21 | - </div> | 36 | + </div>*/ |
37 | + | ||
22 | ) | 38 | ) |
23 | } | 39 | } |
24 | } | 40 | } | ... | ... |
-
Please register or login to post a comment