Skip to content

GitLab

Commit 060d5f35 authored by Spark's avatar Spark
Browse files

login logout chartjs

parent a3f2f757
Hide whitespace changes
Inline Side-by-side
client/src/App.js
View file @ 060d5f35
......@@ -20,10 +20,6 @@ function App() {
if (isLs === null) {
localStorage.setItem('login', false)
}
if (isLs === false || isLs === null) {
localStorage.setItem('local-code', '3743011')
}
}
return (
......
client/src/components/ChartDoughnut.js deleted 100644 → 0
View file @ a3f2f757
import React from 'react'
import { Row, Card } from 'react-bootstrap';
import { Doughnut } from 'react-chartjs-2'
function ChartDoughnut() {
const cardstyled = {
margin: 'auto',
padding: '1em',
display: 'flex',
justifyContent: 'center',
width: '100%',
borderWidth: '3px',
borderRadius: '20px',
borderColor: 'rgb(110, 189, 142)',
color: '#04AB70'
}
const options = {
legend: {
display: true, // label 보이기 여부
},
scales: {
yAxes: [{
ticks: {
min: 0, // y축 스케일에 대한 최소값 설정
stepSize: 1, // y축 그리드 한 칸당 수치
}
}]
},
// false : 사용자 정의 크기에 따라 그래프 크기가 결정됨.
// true : 크기가 알아서 결정됨.
maintainAspectRatio: false
}
const data = {
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
datasets: [
{
label: '온도',
fill: false,
lineTension: 0.1,
backgroundColor: 'rgba(75,192,192,0.4)',
borderColor: 'rgba(75,192,192,1)',
borderCapStyle: 'butt',
borderDash: [2,10], //점선
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: 'rgba(75,192,192,1)',
pointBackgroundColor: '#fff',
pointBorderWidth: 1,
pointHoverRadius: 5,
pointHoverBackgroundColor: 'rgba(75,192,192,1)',
pointHoverBorderColor: 'rgba(220,220,220,1)',
pointHoverBorderWidth: 2,
pointRadius: 1,
pointHitRadius: 10,
data: [-10, -2, 13, 18, 22, 25, 31, 28, 25, 18, 6, -8]
}
]
};
return (
<>
<Row className='text-center w-100 my-2'>
<Card style={cardstyled}>
<Doughnut
data={data}
options={options}
height={300}
/>
</Card>
</Row>
</>
)
}
export default ChartDoughnut;
\ No newline at end of file
client/src/components/ChartHumidity.js
View file @ 060d5f35
......@@ -13,14 +13,23 @@ function ChartHumidity() {
useEffect(() => {
if (isLogined()) {
callUserInfo().then((res) => {
const outs = axios.get(routesClient.outsideLoc + res['loc_code'])
console.log('>>', outs)
})
axios.get(routesClient.userWeather, { withCredentials: true })
.then((res) => {
console.log('humi', res.data.contents.weather_in)
const userWeather = res.data.contents.weather_in
const Array = []
const Array2 = []
for (let i = 0; i < userWeather.length; i++) {
Array.push(userWeather[i].humi)
Array2.push(userWeather[i].collected_at.split('T')[1].split('.')[0])
}
setHumi(Array)
setNewLabel(Array2)
})
}
else {
const locDefault = localStorage.getItem('local-code')
axios.get(routesClient.outsideLoc + locDefault)
axios.get(routesClient.outsideLoc + `3743011`)
.then((res) => {
const outWeather = res.data.contents.weather_out
const Array = []
......
client/src/components/ChartPressure.js
View file @ 060d5f35
......@@ -13,14 +13,23 @@ function ChartPressure() {
useEffect(() => {
if (isLogined()) {
callUserInfo().then((res) => {
const outs = axios.get(routesClient.outsideLoc + res['loc_code'])
console.log('>>', outs)
})
axios.get(routesClient.userWeather, { withCredentials: true })
.then((res) => {
console.log('press', res.data.contents)
const userWeather = res.data.contents.weather_in
const Array = []
const Array2 = []
for (let i = 0; i < userWeather.length; i++) {
Array.push(userWeather[i].press)
Array2.push(userWeather[i].collected_at.split('T')[1].split('.')[0])
}
setPress(Array)
setNewLabel(Array2)
})
}
else {
const locDefault = localStorage.getItem('local-code')
axios.get(routesClient.outsideLoc + locDefault)
axios.get(routesClient.outsideLoc + `3743011`)
.then((res) => {
const outWeather = res.data.contents.weather_out
const Array = []
......
client/src/components/ChartTemp.js
View file @ 060d5f35
......@@ -13,13 +13,26 @@ function ChartTemp() {
useEffect(() => {
if (isLogined()) {
callUserInfo().then((res) => {
const outs = axios.get(routesClient.outsideLoc + res["loc_code"]);
console.log(">>", outs);
});
axios.get(routesClient.userWeather, { withCredentials: true })
.then((res) => {
console.log('temp', res.data.contents)
const userWeather = res.data.contents.weather_in
const userWeatherPredict = res.data.contents.weather_predict
const Array = []
const Array2 = []
for (let i = 3; i < 9; i++) {
Array.push(userWeather[i].temp)
Array2.push(userWeather[i].collected_at.split('T')[1].split('.')[0])
}
for (let j = 0; j < 3; j++) {
Array.push(userWeatherPredict[j].temp)
Array2.push(userWeatherPredict[j].collected_at.split('T')[1].split('.')[0])
}
setTemp(Array)
setNewLabel(Array2)
})
} else {
const locDefault = localStorage.getItem("local-code");
axios.get(routesClient.outsideLoc + locDefault).then((res) => {
axios.get(routesClient.outsideLoc + `3743011`).then((res) => {
const outWeather = res.data.contents.weather_out;
const Array = [];
const Array2 = [];
......
client/src/components/ChartWindSpeed.js
View file @ 060d5f35
......@@ -13,14 +13,22 @@ function ChartWindSpeed() {
useEffect(() => {
if (isLogined()) {
callUserInfo().then((res) => {
const outs = axios.get(routesClient.outsideLoc + res['loc_code'])
console.log('>>', outs)
})
axios.get(routesClient.userWeather, { withCredentials: true })
.then((res) => {
console.log('windsp', res.data.contents)
const userWeather = res.data.contents.weather_in
const Array = []
const Array2 = []
for (let i = 0; i < userWeather.length; i++) {
Array.push(userWeather[i].wind_speed)
Array2.push(userWeather[i].collected_at.split('T')[1].split('.')[0])
}
setWindSpd(Array)
setNewLabel(Array2)
})
}
else {
const locDefault = localStorage.getItem('local-code')
axios.get(routesClient.outsideLoc + locDefault)
axios.get(routesClient.outsideLoc + `3743011`)
.then((res) => {
const outWeather = res.data.contents.weather_out
const Array = []
......
client/src/pages/GetLocFirst.js
View file @ 060d5f35
......@@ -4,7 +4,6 @@ import MainLayer from '../components/MainLayer';
import '../App.css'
import EueSuggest from '../components/EueSuggest';
import ChartTemp from '../components/ChartTemp';
import ChartDoughnut from '../components/ChartDoughnut';
import Donation from '../components/Donation';
import LocCodeChange from '../components/LocCodeChange';
import { callUserInfo } from '../utils/CheckDB';
......@@ -67,7 +66,6 @@ function GetLocFirst() {
<Col md={6} style={col2sty}>
<EueSuggest />
<ChartTemp />
<ChartDoughnut />
<Donation />
</Col>
......
client/src/pages/Home.js
View file @ 060d5f35
......@@ -5,7 +5,6 @@ import '../App.css'
import EueSuggest from '../components/EueSuggest';
import Donation from '../components/Donation';
import ChartTabs from '../components/ChartTabs';
import ChartDoughnut from '../components/ChartDoughnut';
function Home() {
const constyled = {
......@@ -44,7 +43,6 @@ function Home() {
<Col md={6} style={col2sty}>
<EueSuggest />
<ChartTabs />
<ChartDoughnut />
<Donation />
</Col>
</Row>
......
client/src/routesClient.js
View file @ 060d5f35
......@@ -8,6 +8,8 @@ export const routesClient = {
usingAircon : '/api/toggle-aircon',
logout: '/api/logout',
userinfo : '/api/user-info',
userWeather : 'api/data/user'
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment