diff --git a/client/src/App.css b/client/src/App.css index 11c7d39e6b9df1665f7239490500dd3668b48ba9..da618687a037f6192539995c45b56493243cacc5 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -74,7 +74,7 @@ body { } #logpng { - width: 50%; + width: 100%; height: 6em; object-fit: cover; } diff --git a/client/src/App.js b/client/src/App.js index 3acc99125253c98da5ed7d2414cb0ded1879d011..b7484978cb03e70964244887cb59f800615d2218 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useEffect } from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import './App.css'; import Home from './pages/Home'; @@ -8,9 +8,13 @@ import EditPage from './pages/EditPage'; import PrivateRoute from './utils/PrivateRoutes'; import PageNotFound from './components/PageNotFound'; import Footer from './components/Footer'; +import { checkCookies } from './utils/CheckDB'; function App() { + useEffect(() => { + localStorage.setItem('login', false) + }, [checkCookies()]) return ( diff --git a/client/src/Utils/Auth.js b/client/src/Utils/Auth.js index 666433410afec1d94eef82ecb9d239f80f8d3989..5a1315f088d296a17db5084ed0f3613aaf9cd78d 100644 --- a/client/src/Utils/Auth.js +++ b/client/src/Utils/Auth.js @@ -1,57 +1,33 @@ import axios from 'axios'; -import { checkCookies } from './CheckDB'; - -export function handleLogin({ userId, role, name, tel, email }) { - localStorage.setItem('id', userId) - localStorage.setItem('role', role) - localStorage.setItem('name', name) - localStorage.setItem('tel', tel) - localStorage.setItem('email', email) +import { callUserInfo, checkCookies } from './CheckDB'; + +export function haveLogined() { + callUserInfo().then((res) => { + if (res && checkCookies()) { + return true + } + else { + console.log('object') + console.log(res) + } + }) } -export async function handleLogout() { - localStorage.clear() - await axios.get('/api/auth/logout') - window.location.href = '/' +export function isOauth(value) { + const TFoauth = value + return TFoauth; } export function isLogined() { - const userId = checkCookies() - if (userId) { - return userId - } else { + const whetherlogin = localStorage.getItem('login') + if (whetherlogin === 'false') { return false } -} - -export function isAdmin() { - const role = localStorage.getItem('role') - if (role === 'admin') { + else { return true - } else { - return false } } - -export function isOauth(value) { - const TFoauth = value - return TFoauth; -} - -// export async function doeCode() { -// const response = await axios.get('http://175.125.254.72:8090/api/data/loccode') - -// // console.log('res::', response.data.locCodes) - -// const resData = response.data.locCodes -// const doe = resData.DOE -// // console.log('dd', doe) //object -// // console.log('dd::', doe[doe.length-1]) -// // console.log('values::', Object.values(doe)) -// const doeValue = Object.values(doe) -// // console.log('@@@11', doeValue[0]['code_doe'], typeof(doeValue[0]['code_doe'])) -// // console.log('@@@22', doeValue[0]['name_doe'], typeof(doeValue[0]['name_doe'])) - -// return doeValue -// } \ No newline at end of file +export function logout() { + localStorage.setItem('login', false) +} \ No newline at end of file diff --git a/client/src/components/LocCodeChange.js b/client/src/components/LocCodeChange.js index 3113ee1634bf39f7a6c3aa80116fc968a2b941c1..6a78f80a89965262b2a39e7c8532649190e74a0a 100644 --- a/client/src/components/LocCodeChange.js +++ b/client/src/components/LocCodeChange.js @@ -38,97 +38,93 @@ function LocCodeChange() { borderColor: 'rgba(195, 195, 195, 0.753)', } - const [does, setDoes] = useState([]) - const [sggs, setSggs] = useState([]) - const [emds, setEmds] = useState([]) - const [sggsArray, setSggsArray] = useState([]) - const [emdsArray, setEmdsArray] = useState([]) + const [does, setDoes] = useState([]) // DOE + const [sggs, setSggs] = useState([]) // SGG + const [emds, setEmds] = useState([]) // EMD + const [sggsArray, setSggsArray] = useState([]) // DOE 와 SGG 내의 code_doe 같을 때 => sgg 값 + const [emdsArray, setEmdsArray] = useState([]) // SGG 과 EMD 내의 code_sgg && DOE 와 EMD 내의 code_doe => emd 값 const doeSelect = document.getElementById('select-doe') const sggSelect = document.getElementById('select-sgg') const emdSelect = document.getElementById('select-emd') - const saveCodeEmd = localStorage.getItem('code_emd') - - async function handleClickLoc() { - if (doeSelect.options[doeSelect.selectedIndex].text !== '도' && sggSelect.options[sggSelect.selectedIndex].text !== '시군구' && emdSelect.options[emdSelect.selectedIndex].text !== '읍면동') { - - await axios.post('/api/edit-profile', { loc_code: saveCodeEmd }) - .then(function (response) { - console.log('loc', response); - }) - callUserInfo().then((res) => { - console.log('11', res[0]) - }) + // Local code 받아오기 + useEffect(() => { + async function getLocCode() { + const res = await axios.get("/api/data/loccode") + const local_codes = res.data.contents.loc_code - localStorage.setItem('code_doe', doeSelect.value) - localStorage.setItem('name_doe', doeSelect.options[doeSelect.selectedIndex].text) - localStorage.setItem('code_sgg', sggSelect.value) - localStorage.setItem('name_sgg', sggSelect.options[sggSelect.selectedIndex].text) - localStorage.setItem('code_emd', emdSelect.value) - localStorage.setItem('name_emd', emdSelect.options[emdSelect.selectedIndex].text) - - // if (localStorage.getItem('name_emd')) { - // Swal.fire({ - // title: '변경되었습니다.', - // text: '축하드립니다!👏', - // icon: 'success', - // customClass: 'swal-wide', - // confirmButtonText: '확인', - // }).then((res) => { - // if (res.isConfirmed) { - // window.location.reload() - // } - // else { - // window.location.reload() - // } - // }) - // } + setDoes(local_codes.DOE) + setSggs(local_codes.SGG) + setEmds(local_codes.EMD) } - // else { - // Swal.fire({ - // title: '실패', - // text: '전부 선택해주세요', - // icon: 'error', - // customClass: 'swal-wide', - // confirmButtonText: '확인' - // }) - // } - - } - - async function getLocCode() { - const res = await axios.get("/api/data/loccode") - const local_codes = res.data.locCodes - - setDoes(local_codes.DOE) - setSggs(local_codes.SGG) - setEmds(local_codes.EMD) - } - - useEffect(() => { getLocCode() }, []) - function selectLocal() { sggs.map(function (sggvalue) { - if (doeSelect.value == sggvalue['code_doe']) { + if (Number(doeSelect.value) === sggvalue['code_doe']) { setSggsArray(sggvalue['sgg']) } }) emds.map(function (emdvalue) { - if (sggSelect.value == emdvalue['code_sgg'] && doeSelect.value == emdvalue['code_doe']) { + if ((Number(sggSelect.value) === emdvalue['code_sgg']) + && (Number(doeSelect.value) === emdvalue['code_doe'])) { setEmdsArray(emdvalue['emd']) } - else { - return false - } }) } + async function handleSubmit(event) { + event.preventDefault() + if (doeSelect.options[doeSelect.selectedIndex].text !== '도' + && sggSelect.options[sggSelect.selectedIndex].text !== '시군구' + && emdSelect.options[emdSelect.selectedIndex].text !== '읍면동') { + + const saveCodeEmd = emdSelect.value + console.log(saveCodeEmd) + + await axios.post('/api/edit-profile', { loc_code: saveCodeEmd }) // loccal code 수정 + + callUserInfo().then((res) => { + console.log('loc_code', res[0].loc_code) + if (res[0].loc_code) { + Swal.fire({ + title: '변경되었습니다.', + text: '축하드립니다!👏', + icon: 'success', + customClass: 'swal-wide', + confirmButtonText: '확인', + }).then((res) => { + if (res.isConfirmed) { + window.location.reload() + } + else { + window.location.reload() + } + }) + } + }) + + + } + else { + Swal.fire({ + title: '실패', + text: '전부 선택해주세요', + icon: 'error', + customClass: 'swal-wide', + confirmButtonText: '확인' + }) + } + + } + + + + return ( @@ -141,13 +137,13 @@ function LocCodeChange() {
-
+ - + - + { does.map((doevalue) => ( @@ -160,7 +156,7 @@ function LocCodeChange() { - + { sggsArray.map((sggvalue) => ( @@ -173,7 +169,7 @@ function LocCodeChange() { - + { emdsArray.map((emdvalue) => ( @@ -186,14 +182,12 @@ function LocCodeChange() { +
- - - diff --git a/client/src/components/LoginComp.js b/client/src/components/LoginComp.js index 92fde202af60aec1d05a0fe12a290a0f23a914be..b08b265bc6d93e78932e7c73fbfa5d3f6ed3c44f 100644 --- a/client/src/components/LoginComp.js +++ b/client/src/components/LoginComp.js @@ -28,34 +28,21 @@ function LoginComp() { color: 'black' } - const [emailSentAlert, setEmailSentAlert] = useState(false) const [alertShow, setAlertShow] = useState(false) - const [emailAddress, setEmailAddress] = useState('') - function CheckEmailSend() { - localStorage.setItem('login_email_Address', emailAddress) - const emailIs = localStorage.getItem('login_email_Address').split('@')[1] - if (emailIs) { - setAlertShow(true) - setEmailSentAlert(false) - } - else { - setAlertShow(true) - setEmailSentAlert(true) - } - } + const [mailSend, setMailSend] = useState(false) function addressUrl() { - const afterAt = localStorage.getItem('login_email_Address').split('@')[1] + const afterAt = emailAddress.split('@')[1] if (afterAt == ('naver.com' || 'gmail.com' || 'daum.net')) { const newLink = 'https://www.' + afterAt; window.open(newLink); } - if (afterAt == 'korea.ac.kr' ) { + if (afterAt == 'korea.ac.kr') { window.open('https://www.gmail.com'); } - else { + else { window.open(); } } @@ -64,12 +51,13 @@ function LoginComp() { setEmailAddress(event.target.value) } - console.log(emailAddress) - async function handleSubmit(event) { event.preventDefault(); const res = await axios.post("/api/login", { email: emailAddress }) - console.log(res) + console.log('mail_sending : ', res.data.contents.mail_sending) + setMailSend(res.data.contents.mail_sending) + setAlertShow(true) + localStorage.setItem('login', true) } @@ -85,7 +73,7 @@ function LoginComp() {
- {!emailSentAlert ? + {mailSend ? 😍 이메일 전송이 완료 되었습니다. @@ -107,13 +95,10 @@ function LoginComp() {
- - - + + - diff --git a/client/src/components/MainLayer.js b/client/src/components/MainLayer.js index 66edd435819a56845e4bfad729d23ef122730e9b..dd15e82a291168af216367d0a75bd842dc353427 100644 --- a/client/src/components/MainLayer.js +++ b/client/src/components/MainLayer.js @@ -1,12 +1,11 @@ -import React, { useEffect, useState } from 'react' +import React from 'react' import { Button, Image, Row, ButtonGroup, Form, Col } from 'react-bootstrap'; import { Link } from 'react-router-dom'; import '../App.css' import UserInfo from './UserInfo'; import { kakaoLogout } from '../utils/Oauth'; -import axios from 'axios'; -import { callUserInfo, deleteCookie } from '../utils/CheckDB'; -import { checkCookies } from '../utils/CheckDB'; +import UsingAircon from './UsingAircon'; +import { isLogined } from '../utils/Auth'; function MainLayer() { @@ -36,42 +35,9 @@ function MainLayer() { } - const [airUsing, setAirUsing] = useState(false) - - useEffect(() => { - callUserInfo().then((res) => { - if (res !== []) { - console.log(res[0]) - } - else { - console.log(res) - } - }) - }, []) - - - async function airChange() { - setAirUsing(!airUsing) - - await axios.post('/api/edit-profile', { using_aircon: !airUsing }) - .then(function (response) { - console.log('res', response); - callUserInfo().then((res) => { - if (res !== []) { - console.log(res[0]) - } - else { - console.log(res) - } - }) - }) - .catch(function (error) { - console.log('err', error); - }); - } - return ( + @@ -83,26 +49,16 @@ function MainLayer() { - {checkCookies() && -
- - + {isLogined() && + } - {checkCookies() ? + {isLogined() ? //true : @@ -114,7 +70,7 @@ function MainLayer() { } - {!checkCookies() && + {!isLogined() && diff --git a/client/src/components/UserInfo.js b/client/src/components/UserInfo.js index 189f4efd158800d19136118789d92f7858659875..9db28e077f97c18fb7e60b86327d248f9f73b001 100644 --- a/client/src/components/UserInfo.js +++ b/client/src/components/UserInfo.js @@ -4,10 +4,13 @@ import '../App.css' import { Link } from 'react-router-dom'; import { callUserInfo, checkCookies } from '../utils/CheckDB'; import axios from 'axios'; +import { isLogined } from '../utils/Auth'; function UserInfo() { + const islogin = localStorage.getItem('login') + const cardstyled = { margin: 'auto', padding: '1em 0.5em 1em 0.5em', @@ -17,56 +20,38 @@ function UserInfo() { borderWidth: '3px', borderRadius: '20px', borderColor: 'rgba(195, 195, 195, 0.753)', - color: 'rgb(110, 189, 142)', - - } + const btnstyled2 = { background: 'white', margin: 'auto', borderWidth: '2px', - // padding: '0', fontSize: '0.7em', color: 'rgb(110, 189, 142)', borderColor: 'rgba(195, 195, 195, 0.753)', - // borderRadius: '20px', width: '50%' } - const localname_doe = localStorage.getItem('name_doe') - const localname_sgg = localStorage.getItem('name_sgg') - const localname_emd = localStorage.getItem('name_emd') - const localcode_emd = localStorage.getItem('code_emd') - const [userNick, setUserNick] = useState('') const [createdTime, setCreatedTime] = useState('') - - useEffect(() => { callUserInfo().then((res) => { - if (res !== []) { + if (isLogined()) { setUserNick(res[0]['nick_name']) const dateStr = res[0]['created_at'].split('T')[0].split('-') - console.log(dateStr) const now = new Date(); const year = now.getFullYear(); // 년 const month = now.getMonth() + 1; // 월 0부터 시작 const day = now.getDate(); // 일 - const stDate = new Date(dateStr[0], dateStr[1], dateStr[2]) - console.log(stDate) - - const endDate = new Date(year, month, day) - console.log(endDate) + const stDate = new Date(dateStr[0], dateStr[1], dateStr[2]) // 가입 날짜 + const endDate = new Date(year, month, day) // 현재 시간 const btMs = endDate.getTime() - stDate.getTime() // 주어진 날짜 사이의 경과 시간 (밀리 초) - console.log(btMs / 1000) - - const btDay = btMs / (1000 * 60 * 60 * 24) - console.log(btDay) + const btDay = btMs / (1000 * 60 * 60 * 24) // 초 -> 일 setCreatedTime(btDay) } @@ -74,6 +59,39 @@ function UserInfo() { console.log('Not Logined') } }) + }, [checkCookies()]) + + + const codeInit = { + code_doe: '', + code_sgg: '', + code_emd: '' + } + const [codeValue, setCodeValue] = useState(codeInit) + + useEffect(() => { + + // user-info 에서 loc_code + callUserInfo().then((res) => { + if (isLogined()) { + console.log(res[0].loc_code) + const newCode = res[0].loc_code + const newdoe = String(newCode).substring(0, 2) + const newsgg = String(newCode).substring(0, 5) + const newemd = String(newCode).substring(0,) + + async function CompareCode() { + await axios.get('/api/data/loccode').then((response) => { + console.log(response.data.contents.loc_code) + }) + } + CompareCode() + + } + else { + console.log(res) + } + }) }, []) return ( @@ -81,7 +99,7 @@ function UserInfo() { - {checkCookies() ? + {isLogined() ?

{`${userNick}`}

@@ -98,14 +116,15 @@ function UserInfo() {
- {localname_emd ? + {isLogined() ?

- + ???????? + {/* {`${localname_doe}`}
{`${localname_sgg}`}
- {`${localname_emd}`} + {`${localname_emd}`} */}

:

@@ -113,7 +132,7 @@ function UserInfo() {

} - {checkCookies() && + {isLogined() && } - {checkCookies() && + {isLogined() &&
@@ -129,7 +148,7 @@ function UserInfo() {

환경을 향한 노력

-

+

{createdTime}일차

diff --git a/client/src/components/UsingAircon.js b/client/src/components/UsingAircon.js new file mode 100644 index 0000000000000000000000000000000000000000..2d5a87d73460aa664c282c18632dd065a4c44cc4 --- /dev/null +++ b/client/src/components/UsingAircon.js @@ -0,0 +1,54 @@ +import axios from "axios"; +import React, { useEffect, useState } from "react"; +import { Form } from "react-bootstrap"; +import { callUserInfo } from "../utils/CheckDB"; +import { isLogined } from './../utils/Auth'; + +function UsingAircon() { + + const [airUsing, setAirUsing] = useState(false) + + useEffect(() => { + callUserInfo().then((res) => { + if (isLogined()) { + setAirUsing(res[0].using_aircon) + } + else { + console.log(res) + } + }) + }, []) + + async function airChange() { + setAirUsing(!airUsing) + await axios.post('/api/edit-profile', { using_aircon: !airUsing }) + .then( + callUserInfo().then((res) => { + if (isLogined()) { + console.log('using_aircon :', res[0].using_aircon) + } + else { + console.log(res) + } + }) + ) + .catch(function (error) { + console.log('err', error); + }); + } + + return ( +
+ + + ) +} + +export default UsingAircon; \ No newline at end of file diff --git a/client/src/pages/Home.js b/client/src/pages/Home.js index 3e36fd5f4a242149f35036374e4efb52f5bdd301..79529e93d5d1c8ce0934b6851c382c55d9c38887 100644 --- a/client/src/pages/Home.js +++ b/client/src/pages/Home.js @@ -8,8 +8,6 @@ import ChartLine from '../components/ChartLine'; import ChartDoughnut from '../components/ChartDoughnut'; import Donation from '../components/Donation'; - - function Home() { const constyled = { display: 'flex',