Toggle navigation
Toggle navigation
This project
Loading...
Sign in
2020-2-capstone-design2
/
2017110269
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
MinsoftK
2020-12-13 23:38:31 +0900
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
28bcfa5aadbd516652b6f30e008ef60468dfe8b0
28bcfa5a
1 parent
4851294a
기초파일 생성
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
295 additions
and
19 deletions
minsung/src/App.js
minsung/src/Container/Html.js
minsung/src/Container/index.js
minsung/src/App.js
View file @
28bcfa5
import
logo
from
'./logo.svg'
;
import
'./App.css'
;
import
React
,{
useState
,
useEffect
}
from
'react'
;
import
{
Route
,
Redirect
,
withRouter
,
Switch
}
from
'react-router-dom'
;
import
{
Home
,
Html
,
Mathcha
,
Tikz
,
Login
}
from
'./Container'
;
import
{
isauth
}
from
'./Container/Login'
;
//import {ConnectedRouter} from 'connected-react-router';
const
authentication
=
()
=>
{}
function
App
()
{
return
(
<
div
className
=
"App"
>
<
header
className
=
"App-header"
>
<
img
src
=
{
logo
}
className
=
"App-logo"
alt
=
"logo"
/>
<
p
>
Edit
<
code
>
src
/
App
.
js
<
/code> and save to reload
.
<
/p
>
<
a
className
=
"App-link"
href
=
"https://reactjs.org"
target
=
"_blank"
rel
=
"noopener noreferrer"
>
Learn
React
<
/a
>
<
/header
>
<
div
>
<
Switch
>
<
Route
exact
path
=
"/"
component
=
{
Login
}
/
>
<
Route
path
=
"/Home"
component
=
{
Home
}
/
>
<
/Switch
>
<
/div
>
);
}
export
default
App
;
//history를 쓰는 경우는 Link
export
default
withRouter
(
App
)
;
...
...
minsung/src/Container/Html.js
0 → 100644
View file @
28bcfa5
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Modal
,
Upload
,
message
,
Form
,
InputNumber
,
Button
,
Select
,
Row
,
Col
}
from
'antd'
;
import
{
InboxOutlined
,
LockOutlined
,
SaveTwoTone
}
from
'@ant-design/icons'
;
import
{
saveFileAndQno
}
from
'lib/api/html'
;
import
{
checkQno
}
from
'../lib/api/html'
;
const
{
Option
}
=
Select
;
//파일 업로드
//업로드 폼에서의 로직
const
fetchSaveData
=
async
(
data
)
=>
{
try
{
console
.
log
(
data
);
const
result
=
await
saveFileAndQno
(
data
);
if
(
result
.
status
===
200
){
return
result
.
data
;
}
}
catch
(
e
){
console
.
log
(
e
);
message
.
warn
(
e
.
message
);
}
}
const
fetchCheckQno
=
async
(
qno
)
=>
{
try
{
const
result
=
await
checkQno
(
qno
);
if
(
result
.
status
===
200
){
console
.
log
(
result
);
message
.
info
(
"사용 가능한 문항 번호 입니다."
);
return
true
;
}
else
{
message
.
info
(
"존재 하지 않는 문항 번호 입니다."
);
return
false
;
}
}
catch
(
e
){
console
.
log
(
e
);
message
.
info
(
"존재 하지 않는 문항 번호 입니다."
);
return
false
;
}
}
const
Html
=
({
visible
,
onCancel
,
callback
})
=>
{
const
[
fields
,
setFields
]
=
useState
([]);
const
[
qno
,
setQno
]
=
useState
(
null
);
const
[
upload
,
setUpload
]
=
useState
(
false
);
const
[
fileList
,
setFileList
]
=
useState
([]);
const
[
qnoCheck
,
setQnoCheck
]
=
useState
(
false
);
const
changeNumber
=
(
value
)
=>
{
setQno
(
value
);
setFields
([...
fields
,
{
name
:[
'qno'
],
value
:
value
}]);
};
useEffect
(()
=>
{
if
(
!
visible
){
let
initFields
=
[
{
name
:[
'qno'
],
value
:
null
},
{
name
:[
'typeSol'
],
value
:
null
},
{
name
:[
'typeQue'
],
value
:
null
},
{
name
:[
'creator'
],
value
:
null
},
];
setQno
(
null
);
setFields
(
initFields
);
setFileList
([]);
}
},[
visible
]);
const
props
=
{
multiple
:
false
,
//data: { qno: qno },
accept
:
'.html'
,
onRemove
:
file
=>
{
const
index
=
fileList
.
indexOf
(
file
);
const
newFileList
=
fileList
.
slice
();
newFileList
.
splice
(
index
,
1
);
return
{
fileList
:
newFileList
,
};
},
beforeUpload
:
file
=>
{
console
.
log
(
file
);
if
(
file
.
name
.
indexOf
(
'.html'
)
>
0
)
{
setFileList
([
file
]);
}
else
{
setFileList
([]);
message
.
info
(
"Html 형식의 파일이 아닙니다."
);
}
return
false
;
},
};
const
onOk
=
()
=>
{
setUpload
(
true
)
};
const
normFile
=
e
=>
{
console
.
log
(
'Upload event:'
,
e
);
if
(
Array
.
isArray
(
e
))
{
return
e
;
}
return
e
&&
e
.
fileList
;
};
const
onClickQno
=
async
(
e
)
=>
{
e
.
preventDefault
();
//번호가 호출 성공시 setQnoCheck(true);
if
(
qno
){
const
_checkQno
=
await
fetchCheckQno
(
qno
);
setQnoCheck
(
_checkQno
);
}
};
const
onFinish
=
async
values
=>
{
console
.
log
(
qnoCheck
);
if
(
!
qnoCheck
){
message
.
warning
(
"문제 번호를 확인해 주세요."
)
return
;
}
else
{
const
creator
=
sessionStorage
.
getItem
(
'id'
);
console
.
log
(
'Received values of form: '
,
values
);
const
formData
=
new
FormData
();
formData
.
append
(
'qno'
,
values
.
qno
);
formData
.
append
(
'typeSol'
,
values
.
typeSol
);
formData
.
append
(
'typeQue'
,
values
.
typeQue
);
formData
.
append
(
'html'
,
values
.
html
[
0
]);
formData
.
append
(
'creator'
,
creator
);
const
result
=
await
fetchSaveData
(
formData
);
console
.
log
(
result
);
if
(
result
){
message
.
info
(
result
.
message
);
let
initFields
=
[
{
name
:[
'qno'
],
value
:
null
},
{
name
:[
'typeSol'
],
value
:
null
},
{
name
:[
'typeQue'
],
value
:
null
},
{
name
:[
'creator'
],
value
:
null
},
];
setQno
(
null
);
setFields
(
initFields
);
setFileList
([]);
onCancel
();
callback
({
status
:
'SAVE_OK'
});
}
else
{
callback
({
status
:
'SAVE_FAIL'
})
}
}
};
const
onChangeTypeSol
=
(
value
)
=>
{
console
.
log
(
value
);
setFields
([...
fields
,
{
name
:[
'typeSol'
],
value
:
value
}]);
}
const
onChangeTypeQue
=
(
value
)
=>
{
console
.
log
(
value
);
setFields
([...
fields
,
{
name
:[
'typeQue'
],
value
:
value
}])
}
const
formItemLayout
=
{
labelCol
:
{
span
:
6
},
wrapperCol
:
{
span
:
14
},
};
return
(
<
Modal
placement
=
{
'bottom'
}
closable
=
{
true
}
height
=
{
'75%'
}
visible
=
{
visible
}
okText
=
{
'저장'
}
cancelText
=
{
'이전'
}
onCancel
=
{
onCancel
}
footer
=
{
null
}
>
<
Form
name
=
"validate_other"
{...
formItemLayout
}
onFinish
=
{
onFinish
}
fields
=
{[{
name
:[
'html'
],
value
:
fileList
},...
fields
]}
>
<
Form
.
Item
name
=
"qno"
label
=
"문제 번호"
rules
=
{[
{
required
:
true
,
message
:
'저장할 html의 문항번호를 입력해 주세요.'
,
},
]}
>
<
Row
>
<
Col
>
<
InputNumber
min
=
{
0
}
max
=
{
10000
}
value
=
{
qno
}
onChange
=
{
changeNumber
}
>
<
/InputNumber
>
<
/Col
>
<
Col
>
<
Button
onClick
=
{
onClickQno
}
>
번호
확인
<
/Button
>
<
/Col
>
<
/Row
>
<
/Form.Item
>
<
Form
.
Item
name
=
"typeSol"
label
=
"문제 타입"
rules
=
{[
{
required
:
true
,
message
:
'저장할 html의 문제 타입을 선택해 주세요.'
,
},
]}
>
<
Select
onChange
=
{
onChangeTypeSol
}
>
<
Option
value
=
"오지선다형"
>
오지선다형
<
/Option
>
<
Option
value
=
"단답형"
>
단답형
<
/Option
>
<
Option
value
=
"계산식"
>
계산식
<
/Option
>
<
/Select
>
<
/Form.Item
>
<
Form
.
Item
name
=
"typeQue"
label
=
"문제/풀이 구분"
rules
=
{[
{
required
:
true
,
message
:
'저장할 html의 문제/풀이 구분을 선택해 주세요.'
,
},
]}
>
<
Select
onChange
=
{
onChangeTypeQue
}
>
<
Option
value
=
"문제"
>
문제
<
/Option
>
<
Option
value
=
"풀이"
>
풀이
<
/Option
>
<
/Select
>
<
/Form.Item
>
<
Form
.
Item
label
=
"파일 업로드"
>
<
Form
.
Item
name
=
"html"
valuePropName
=
"fileList"
getValueFromEvent
=
{
normFile
}
noStyle
rules
=
{[
{
required
:
true
,
message
:
'파일을 드래그하거나 선택해 주세요.'
,
},
]}
>
<
Upload
.
Dragger
name
=
"files"
{...
props
}
>
<
p
className
=
"ant-upload-drag-icon"
>
<
InboxOutlined
/>
<
/p
>
<
p
className
=
"ant-upload-text"
>
Click
or
drag
file
to
this
area
to
upload
<
/p
>
<
p
className
=
"ant-upload-hint"
>
Support
for
a
single
or
bulk
upload
.
<
/p
>
<
/Upload.Dragger
>
<
/Form.Item
>
<
/Form.Item
>
<
Form
.
Item
style
=
{{
alignContent
:
'middle'
}}
wrapperCol
=
{{
span
:
12
,
offset
:
6
}}
>
<
Button
type
=
"primary"
htmlType
=
"submit"
>
저장
<
/Button
>
<
/Form.Item
>
<
/Form
>
<
/Modal
>
);
};
export
default
Html
;
minsung/src/Container/index.js
0 → 100644
View file @
28bcfa5
export
{
default
as
Home
}
from
'./Home'
;
export
{
default
as
Html
}
from
'./Html'
;
export
{
default
as
Mathcha
}
from
'./Mathcha'
;
export
{
default
as
Tikz
}
from
'./Tikz'
;
export
{
default
as
Login
}
from
'./Login'
;
Please
register
or
login
to post a comment