육현진

material UI design

1 -[{"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\index.js":"1","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\App.js":"2","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\reportWebVitals.js":"3","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\Student.js":"4","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentAdd.js":"5","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentDelete.js":"6"},{"size":500,"mtime":499162500000,"results":"7","hashOfConfig":"8"},{"size":3923,"mtime":1607450260952,"results":"9","hashOfConfig":"8"},{"size":362,"mtime":499162500000,"results":"10","hashOfConfig":"8"},{"size":2602,"mtime":1607450773121,"results":"11","hashOfConfig":"8"},{"size":3467,"mtime":1607448276867,"results":"12","hashOfConfig":"8"},{"size":439,"mtime":1607450769585,"results":"13","hashOfConfig":"8"},{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"16"},"15hdric",{"filePath":"17","messages":"18","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"19","messages":"20","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"16"},{"filePath":"21","messages":"22","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"23","messages":"24","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"25","messages":"26","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\index.js",[],["27","28"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\App.js",["29","30","31"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\reportWebVitals.js",[],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\Student.js",["32","33","34"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentAdd.js",[],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentDelete.js",[],{"ruleId":"35","replacedBy":"36"},{"ruleId":"37","replacedBy":"38"},{"ruleId":"39","severity":1,"message":"40","line":1,"column":27,"nodeType":"41","messageId":"42","endLine":1,"endColumn":37},{"ruleId":"39","severity":1,"message":"43","line":12,"column":8,"nodeType":"41","messageId":"42","endLine":12,"endColumn":24},{"ruleId":"39","severity":1,"message":"44","line":29,"column":7,"nodeType":"41","messageId":"42","endLine":29,"endColumn":15},{"ruleId":"39","severity":1,"message":"45","line":43,"column":7,"nodeType":"41","messageId":"42","endLine":43,"endColumn":19},{"ruleId":"39","severity":1,"message":"46","line":59,"column":7,"nodeType":"41","messageId":"42","endLine":59,"endColumn":18},{"ruleId":"39","severity":1,"message":"47","line":69,"column":7,"nodeType":"41","messageId":"42","endLine":69,"endColumn":19},"no-native-reassign",["48"],"no-negated-in-lhs",["49"],"no-unused-vars","'components' is defined but never used.","Identifier","unusedVar","'curcularProgress' is defined but never used.","'students' is assigned a value 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
1 +[{"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\index.js":"1","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\App.js":"2","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\reportWebVitals.js":"3","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\Student.js":"4","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentAdd.js":"5","C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentDelete.js":"6"},{"size":500,"mtime":499162500000,"results":"7","hashOfConfig":"8"},{"size":3923,"mtime":1607450260952,"results":"9","hashOfConfig":"8"},{"size":362,"mtime":499162500000,"results":"10","hashOfConfig":"8"},{"size":2602,"mtime":1607450773121,"results":"11","hashOfConfig":"8"},{"size":6867,"mtime":1607455316983,"results":"12","hashOfConfig":"8"},{"size":2169,"mtime":1607455318372,"results":"13","hashOfConfig":"8"},{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"16"},"15hdric",{"filePath":"17","messages":"18","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"19","messages":"20","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"16"},{"filePath":"21","messages":"22","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"23","messages":"24","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"25","messages":"26","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\index.js",[],["27","28"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\App.js",["29","30","31"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\reportWebVitals.js",[],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\Student.js",["32","33","34"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentAdd.js",["35","36","37"],"C:\\Users\\sally\\Desktop\\3-1\\DBproject\\project\\client\\src\\components\\StudentDelete.js",["38"],{"ruleId":"39","replacedBy":"40"},{"ruleId":"41","replacedBy":"42"},{"ruleId":"43","severity":1,"message":"44","line":1,"column":27,"nodeType":"45","messageId":"46","endLine":1,"endColumn":37},{"ruleId":"43","severity":1,"message":"47","line":12,"column":8,"nodeType":"45","messageId":"46","endLine":12,"endColumn":24},{"ruleId":"43","severity":1,"message":"48","line":29,"column":7,"nodeType":"45","messageId":"46","endLine":29,"endColumn":15},{"ruleId":"43","severity":1,"message":"49","line":43,"column":7,"nodeType":"45","messageId":"46","endLine":43,"endColumn":19},{"ruleId":"43","severity":1,"message":"50","line":59,"column":7,"nodeType":"45","messageId":"46","endLine":59,"endColumn":18},{"ruleId":"43","severity":1,"message":"51","line":69,"column":7,"nodeType":"45","messageId":"46","endLine":69,"endColumn":19},{"ruleId":"43","severity":1,"message":"52","line":13,"column":7,"nodeType":"45","messageId":"46","endLine":13,"endColumn":12},{"ruleId":"43","severity":1,"message":"53","line":24,"column":7,"nodeType":"45","messageId":"46","endLine":24,"endColumn":14},{"ruleId":"43","severity":1,"message":"54","line":122,"column":15,"nodeType":"45","messageId":"46","endLine":122,"endColumn":22},{"ruleId":"43","severity":1,"message":"52","line":11,"column":7,"nodeType":"45","messageId":"46","endLine":11,"endColumn":12},"no-native-reassign",["55"],"no-negated-in-lhs",["56"],"no-unused-vars","'components' is defined but never used.","Identifier","unusedVar","'curcularProgress' is defined but never used.","'students' is assigned a value but never used.","'Searchscores' is defined but never used.","'Searchscore' is defined but never used.","'Searchothers' is defined but never used.","'theme' is assigned a value but never used.","'primary' is assigned a value but never used.","'classes' is assigned a value but never used.","no-global-assign","no-unsafe-negation"]
...\ No newline at end of file ...\ No newline at end of file
......
1 import React from 'react'; 1 import React from 'react';
2 import {post} from 'axios'; 2 import {post} from 'axios';
3 +import Dialog from '@material-ui/core/Dialog';
4 +import DialogActions from '@material-ui/core/DialogActions';
5 +import DialogTitle from '@material-ui/core/DialogTitle';
6 +import DialogContent from '@material-ui/core/DialogContent';
7 +import Textfield from '@material-ui/core/TextField';
8 +import Button from '@material-ui/core/Button';
9 +import{withStyles}from '@material-ui/core/styles';
10 +import { createMuiTheme } from '@material-ui/core/styles';
11 +import {blue, pink} from '@material-ui/core/colors';
12 +
13 +const theme = createMuiTheme({
14 + palette: {
15 + primary: {
16 + main: blue[100],
17 + },
18 + secondary: {
19 + main: pink[100],
20 + },
21 + },
22 +});
23 +
24 +const primary = blue[100]; //#bbdefb
25 +
26 +const styles = theme=>({
27 + hidden:{
28 + display:'none'
29 + }
30 +
31 +});
32 +
3 class StudentAdd extends React.Component{ 33 class StudentAdd extends React.Component{
4 34
5 constructor(props){ 35 constructor(props){
...@@ -13,7 +43,8 @@ class StudentAdd extends React.Component{ ...@@ -13,7 +43,8 @@ class StudentAdd extends React.Component{
13 st_Finalscore:'', 43 st_Finalscore:'',
14 st_Assignscore:'', 44 st_Assignscore:'',
15 st_Attendscore:'', 45 st_Attendscore:'',
16 - st_Score:'' 46 + st_Score:'',
47 + open:false
17 } 48 }
18 } 49 }
19 50
...@@ -33,7 +64,8 @@ class StudentAdd extends React.Component{ ...@@ -33,7 +64,8 @@ class StudentAdd extends React.Component{
33 st_Finalscore:'', 64 st_Finalscore:'',
34 st_Assignscore:'', 65 st_Assignscore:'',
35 st_Attendscore:'', 66 st_Attendscore:'',
36 - st_Score:'' 67 + st_Score:'',
68 + open: false
37 }) 69 })
38 70
39 } 71 }
...@@ -65,8 +97,54 @@ class StudentAdd extends React.Component{ ...@@ -65,8 +97,54 @@ class StudentAdd extends React.Component{
65 return post(url, formData, config); 97 return post(url, formData, config);
66 } 98 }
67 99
100 + handleClickOpen = () => {
101 + this.setState({
102 + open:true
103 + });
104 + }
105 +
106 + handleClose = () => {
107 + this.setState({
108 + st_Code:'',
109 + st_Name:'',
110 + st_Id:'',
111 + st_Major:'',
112 + st_Midscore:'',
113 + st_Finalscore:'',
114 + st_Assignscore:'',
115 + st_Attendscore:'',
116 + st_Score:'',
117 + open: false
118 + })
119 + }
120 +
68 render(){ 121 render(){
122 + const{classes}=this.props;
69 return( 123 return(
124 + <div>
125 + <Button variant="contained" color="primary" onClick={this.handleClickOpen}>
126 + 학생 추가하기
127 + </Button>
128 + <Dialog open={this.state.open} onClose={this.handleClose}>
129 + <DialogTitle>학생 추가</DialogTitle>
130 + <DialogContent>
131 + <Textfield label="코드 번호" type="text" name="st_Code" value={this.state.st_Code} onChange={this.handleValueChange}/><br/>
132 + <Textfield label="이름" name="st_Name" value={this.state.st_Name} onChange={this.handleValueChange}/><br/>
133 + <Textfield label="학번" name="st_Id" value={this.state.st_Id} onChange={this.handleValueChange}/><br/>
134 + <Textfield label="전공" name="st_Major" value={this.state.st_Major} onChange={this.handleValueChange}/><br/>
135 + <Textfield label="중간 점수" name="st_Midscore" value={this.state.st_Midscore} onChange={this.handleValueChange}/><br/>
136 + <Textfield label="기말 점수" name="st_Finalscore" value={this.state.st_Finalscore} onChange={this.handleValueChange}/><br/>
137 + <Textfield label="과제 점수" name="st_Assignscore" value={this.state.st_Assignscore} onChange={this.handleValueChange}/><br/>
138 + <Textfield label="출석 점수" name="st_Attendscore" value={this.state.st_Attendscore} onChange={this.handleValueChange}/><br/>
139 + <Textfield label="학점" name="st_Score" value={this.state.st_Score} onChange={this.handleValueChange}/><br/>
140 + </DialogContent>
141 + <DialogActions>
142 + <Button varient="contained" color="primary" onClick={this.handleFormSubmit}>추가</Button>
143 + <Button varient="outlined" color="primary" onClick={this.handleClose}>닫기</Button>
144 + </DialogActions>
145 + </Dialog>
146 + </div>
147 + /*
70 <form onSubmit={this.handleFormSubmit}> 148 <form onSubmit={this.handleFormSubmit}>
71 <h1>학생 추가</h1> 149 <h1>학생 추가</h1>
72 코드 번호 : <input type="text" name="st_Code" value={this.state.st_Code} onChange={this.handleValueChange}/><br/> 150 코드 번호 : <input type="text" name="st_Code" value={this.state.st_Code} onChange={this.handleValueChange}/><br/>
...@@ -81,8 +159,9 @@ class StudentAdd extends React.Component{ ...@@ -81,8 +159,9 @@ class StudentAdd extends React.Component{
81 <button type="submit">추가하기</button> 159 <button type="submit">추가하기</button>
82 160
83 </form> 161 </form>
162 + */
84 ) 163 )
85 } 164 }
86 } 165 }
87 166
88 -export default StudentAdd;
...\ No newline at end of file ...\ No newline at end of file
167 +export default withStyles(styles)(StudentAdd);
...\ No newline at end of file ...\ No newline at end of file
......
1 import React from 'react'; 1 import React from 'react';
2 +import Dialog from '@material-ui/core/Dialog';
3 +import DialogActions from '@material-ui/core/DialogActions';
4 +import DialogTitle from '@material-ui/core/DialogTitle';
5 +import DialogContent from '@material-ui/core/DialogContent';
6 +import Button from '@material-ui/core/Button';
7 +import Typography from '@material-ui/core/Typography';
8 +import { createMuiTheme } from '@material-ui/core/styles';
9 +import {blue, pink} from '@material-ui/core/colors';
10 +
11 +const theme = createMuiTheme({
12 + palette: {
13 + primary: {
14 + main: blue[100],
15 + },
16 + secondary: {
17 + main: pink[100],
18 + },
19 + },
20 +});
21 +
2 class StudentDelete extends React.Component{ 22 class StudentDelete extends React.Component{
3 23
24 + constructor(props){
25 + super(props);
26 + this.state = {
27 + open: false
28 + }
29 + }
30 +
31 + handleClickOpen = () => {
32 + this.setState({
33 + open:true
34 + });
35 + }
36 +
37 + handleClose = () => {
38 + this.setState({
39 + open: false
40 + })
41 + }
42 +
4 deleteStudent(st_Code){ 43 deleteStudent(st_Code){
5 const url='/api/students/'+st_Code; 44 const url='/api/students/'+st_Code;
6 fetch(url,{ 45 fetch(url,{
...@@ -10,8 +49,26 @@ class StudentDelete extends React.Component{ ...@@ -10,8 +49,26 @@ class StudentDelete extends React.Component{
10 } 49 }
11 50
12 render(){ 51 render(){
52 +
13 return( 53 return(
14 - <button onClick={(e)=>{this.deleteStudent(this.props.st_Code)}}>삭제</button> 54 + <div>
55 + <Button variant="contained" color="secondary" onClick={this.handleClickOpen}>삭제</Button>
56 + <Dialog open={this.state.open} onClose={this.handleClose}>
57 + <DialogTitle onClose={this.handleClose}>
58 + 삭제 경고
59 + </DialogTitle>
60 + <DialogContent>
61 + <Typography gutterBottom>
62 + 선택한 학생의 정보가 삭제됩니다!
63 + </Typography>
64 + </DialogContent>
65 + <DialogActions>
66 + <Button variant="contained" color="secondary" onClick={(e)=>{this.deleteStudent(this.props.st_Code)}}>삭제</Button>
67 + <Button variant="outlined" color="secondary" onClick={this.handleClose}>닫기</Button>
68 + </DialogActions>
69 + </Dialog>
70 + </div>
71 +
15 ) 72 )
16 } 73 }
17 } 74 }
......