Toggle navigation
Toggle navigation
This project
Loading...
Sign in
권주희
/
howsTheAir
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
1
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
권주희
2020-06-20 20:19:51 +0900
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
0d6b86292de1ccdc7cddecc0884760529283debb
0d6b8629
1 parent
dfdd01d4
display the route air condition result
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
126 additions
and
2 deletions
backend/routes/airCondition.js
frontend/src/home.js
backend/routes/airCondition.js
View file @
0d6b862
...
...
@@ -58,7 +58,7 @@ const getPosition = (lat, lon) => {
console
.
log
(
error
.
response
);
});
};
/* GET airCondition listing. */
/* GET
route
airCondition listing. */
router
.
get
(
"/route"
,
async
function
(
req
,
res
,
next
)
{
console
.
log
(
"출발지:"
,
req
.
query
.
departure
);
console
.
log
(
"도착지:"
,
req
.
query
.
arrival
);
...
...
frontend/src/home.js
View file @
0d6b862
...
...
@@ -11,7 +11,9 @@ import good from "./gradeIcon/smile.png";
import
bad
from
"./gradeIcon/angry.png"
;
import
veryBad
from
"./gradeIcon/devil.png"
;
import
next
from
"./gradeIcon/next.png"
;
import
start
from
"./gradeIcon/start.png"
;
import
finish
from
"./gradeIcon/finish.png"
;
import
loading
from
"./gradeIcon/loading.gif"
;
/* global kakao */
export
default
class
Home
extends
Component
{
...
...
@@ -403,6 +405,128 @@ export default class Home extends Component {
);
}
let
routeAirCondition
=
null
;
let
tempRouteAirCondition
=
[];
if
(
this
.
state
.
buttonClicked
!=
null
)
{
routeAirCondition
=
<
img
src
=
{
loading
}
width
=
"300px"
heigth
=
"300px"
/>
;
}
if
(
this
.
state
.
routeInformation
!=
null
)
{
for
(
let
i
=
0
;
i
<
this
.
state
.
routeInformation
.
length
-
1
;
i
++
)
{
tempRouteAirCondition
.
push
(
this
.
state
.
routeInformation
[
i
]);
}
let
pm10ImageArray
=
new
Array
();
let
pm25ImageArray
=
new
Array
();
for
(
let
i
=
0
;
i
<
this
.
state
.
routeInformation
.
length
;
i
++
)
{
let
pm10Image
=
null
;
let
pm25Image
=
null
;
switch
(
this
.
state
.
routeInformation
[
i
][
"airCondition"
].
pm10Grade
)
{
case
"1"
:
pm10Image
=
<
img
src
=
{
veryGood
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
case
"2"
:
pm10Image
=
<
img
src
=
{
good
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
case
"3"
:
pm10Image
=
<
img
src
=
{
bad
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
case
"4"
:
pm10Image
=
<
img
src
=
{
veryBad
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
default
:
pm10Image
=
null
;
}
switch
(
this
.
state
.
routeInformation
[
i
][
"airCondition"
].
pm25Grade
)
{
case
"1"
:
pm25Image
=
<
img
src
=
{
veryGood
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
case
"2"
:
pm25Image
=
<
img
src
=
{
good
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
case
"3"
:
pm25Image
=
<
img
src
=
{
bad
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
case
"4"
:
pm25Image
=
<
img
src
=
{
veryBad
}
width
=
"50px"
heigth
=
"100px"
/>
;
break
;
default
:
pm25Image
=
null
;
}
pm10ImageArray
[
i
]
=
pm10Image
;
pm25ImageArray
[
i
]
=
pm25Image
;
}
routeAirCondition
=
(
<
table
>
<
thead
>
<
tr
>
<
th
>
<
br
/>
경로별
미세먼지
정보
<
/th
>
<
/tr
>
<
/thead
>
<
tbody
>
<
tr
>
<
td
>
<
img
src
=
{
start
}
width
=
"50px"
heigth
=
"30px"
/>
<
br
/>
<
h6
>
{
this
.
state
.
departureTitle
}
<
br
/>
미세먼지
등급
<
br
/>
{
pm10ImageArray
[
this
.
state
.
routeInformation
.
length
-
1
]}
<
br
/>
미세먼지
지수
:{
" "
}
{
this
.
state
.
routeInformation
[
this
.
state
.
routeInformation
.
length
-
1
][
"airCondition"
].
pm10Value
}
<
br
/>
<
/h6
>
<
/td
>
{
tempRouteAirCondition
.
map
((
listValue
,
index
)
=>
{
if
(
index
!=
tempRouteAirCondition
.
length
-
1
)
{
return
(
<
td
key
=
{
index
}
>
<
img
src
=
{
next
}
width
=
"40px"
heigth
=
"25px"
/>
<
h6
>
{
listValue
.
instruction
}
<
br
/>
소요시간
:
{
listValue
.
duration
}
<
br
/>
미세먼지
등급
<
br
/>
{
pm10ImageArray
[
index
]}
<
br
/>
미세먼지
지수
:
<
br
/>
{
listValue
.
airCondition
.
pm10Value
}
<
br
/>
<
/h6
>
<
/td
>
);
}
else
{
return
(
<
td
key
=
{
index
}
>
<
img
src
=
{
finish
}
width
=
"50px"
heigth
=
"30px"
/>
<
br
/>
<
h6
>
{
listValue
.
instruction
}
<
br
/>
소요시간
:
{
listValue
.
duration
}
<
br
/>
미세먼지
등급
<
br
/>
{
pm10ImageArray
[
index
]}
<
br
/>
미세먼지
지수
:
{
listValue
.
airCondition
.
pm10Value
}
<
br
/>
<
/h6
>
<
/td
>
);
}
})}
<
/tr
>
<
/tbody
>
<
/table
>
);
}
return
(
<
section
id
=
"home"
>
...
...
Please
register
or
login
to post a comment