Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
S
sp21-cs242-assignment2
Manage
Activity
Members
Labels
Plan
Issues
Issue boards
Milestones
Wiki
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Releases
Package Registry
Model registry
Operate
Environments
Terraform modules
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
zshan2
sp21-cs242-assignment2
Commits
73b0405e
Commit
73b0405e
authored
4 years ago
by
zshan2
Browse files
Options
Downloads
Patches
Plain Diff
small fixing
parent
d8e2853e
No related branches found
No related tags found
No related merge requests found
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
web/app/src/App.js
+32
-32
32 additions, 32 deletions
web/app/src/App.js
web/app/src/Components/ElementDisplay.js
+23
-6
23 additions, 6 deletions
web/app/src/Components/ElementDisplay.js
with
55 additions
and
38 deletions
web/app/src/App.js
+
32
−
32
View file @
73b0405e
...
...
@@ -49,6 +49,36 @@ function App() {
const
axios
=
require
(
'
axios
'
).
default
;
var
center
=
{
display
:
'
flex
'
,
justifyContent
:
'
center
'
,
alignItems
:
'
center
'
}
/** Function used to hide the input form */
function
hideForm
()
{
setFormState
(
'
hide
'
)
}
/** Function used to show bookData input form */
function
changeFormStateBook
()
{
setRenderState
(
false
)
if
(
formState
===
'
hide
'
)
{
setFormState
(
'
showBook
'
)
}
else
{
setFormState
(
'
hide
'
)
}
}
/** Function used to show authorData input form */
function
changeFormStateAuthor
()
{
setRenderState
(
false
)
if
(
formState
===
'
hide
'
)
{
setFormState
(
'
showAuthor
'
)
}
else
{
setFormState
(
'
hide
'
)
}
}
/** Function used to set Dialog visible, which is called when a response is received */
function
showDialog
()
{
setDialogState
(
true
)
}
/** Function used in GET Requests */
function
get
()
{
axios
.
get
(
'
http://127.0.0.1:5000/api/
'
+
queryStr
)
...
...
@@ -58,9 +88,9 @@ function App() {
showDialog
()
document
.
getElementById
(
'
dialog
'
).
value
=
response
.
status
+
"
:
\n
"
+
response
.
statusText
if
(
queryStr
.
includes
(
'
book
'
))
{
setDataState
(
response
.
data
[
'
books
'
]
[
0
]
)
setDataState
(
response
.
data
[
'
books
'
])
}
else
{
setDataState
(
response
.
data
[
'
authors
'
]
[
0
]
)
setDataState
(
response
.
data
[
'
authors
'
])
}
setRenderState
(
true
)
})
...
...
@@ -108,36 +138,6 @@ function App() {
setDataState
(
authorData
)
return
authorData
}
/** Function used to hide the input form */
function
hideForm
()
{
setFormState
(
'
hide
'
)
}
/** Function used to show bookData input form */
function
changeFormStateBook
()
{
setRenderState
(
false
)
if
(
formState
===
'
hide
'
)
{
setFormState
(
'
showBook
'
)
}
else
{
setFormState
(
'
hide
'
)
}
}
/** Function used to show authorData input form */
function
changeFormStateAuthor
()
{
setRenderState
(
false
)
if
(
formState
===
'
hide
'
)
{
setFormState
(
'
showAuthor
'
)
}
else
{
setFormState
(
'
hide
'
)
}
}
/** Function used to set Dialog visible, which is called when a response is received */
function
showDialog
()
{
setDialogState
(
true
)
}
/** Function used in PUT requests */
function
put
()
{
...
...
This diff is collapsed.
Click to expand it.
web/app/src/Components/ElementDisplay.js
+
23
−
6
View file @
73b0405e
...
...
@@ -3,18 +3,35 @@ import MUIDataTable from "mui-datatables";
/** MUI dataTable component, used for rendering received response */
const
ElementDisplay
=
(
props
)
=>
{
var
fields
=
Object
.
keys
(
props
.
data
)
var
values
=
Object
.
values
(
props
.
data
)
console
.
log
(
Object
.
values
(
props
.
data
))
console
.
log
(
Object
.
keys
(
props
.
data
))
var
list
=
props
.
data
if
(
list
.
length
<=
0
)
{
return
(
<
MUIDataTable
title
=
{
"
Data Table
"
}
data
=
{[]}
columns
=
{[
'
Fields
'
,
'
Values
'
]}
options
=
{{}}
/
>
)
}
var
fields
=
Object
.
keys
(
list
[
0
])
var
values
=
[]
for
(
var
key
in
list
){
if
(
list
.
hasOwnProperty
(
key
))
{
values
.
push
(
Object
.
values
(
list
[
key
]))
}
}
console
.
log
(
fields
)
console
.
log
(
values
)
console
.
log
(
list
)
const
columns
=
fields
const
data
=
[
values
]
const
data
=
values
const
options
=
{
'
responsive
'
:
'
vertical
'
}
return
(
<
MUIDataTable
title
=
{
"
GET
Data
"
}
title
=
{
"
Data
Table
"
}
data
=
{
data
}
columns
=
{
columns
}
options
=
{
options
}
...
...
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment