doe sgg emd

client/src/App.css

@@ -5,6 +5,10 @@ body {
 
 }
 
+.form-check-input:checked {
+  background-color: #04AB70 !important;
+}
+
 #btnlink {
   color: white !important;
   text-decoration: none !important;
@@ -36,6 +40,7 @@ body {
   padding: 0.5em;
 }
 
+
 .form-group .form-control {
   border-radius: 40px;
 }

client/src/Utils/PrivateRoutes.js

@@ -17,18 +17,3 @@ function PrivateRoute({ path, children }) {
     }
 }
 export default PrivateRoute
-
-// Swal.fire({
-        //     title: '권한이 없습니다.',
-        //     text: ' 로그인을 진행해주세요',
-        //     icon: 'warning',
-        //     confirmButtonText: '확인',
-        // })
-        //     .then((res) => {
-        //         if (res.isConfirmed) {
-        //             window.location.replace('/')
-        //         }
-        //         else {
-        //             window.location.replace('/')
-        //         }
-        //     })
\ No newline at end of file

client/src/Utils/SendEmail.js

-// const { smtpTransport } = require('./config/email');
-// const nodemailer = require('nodemailer');
-
-// /* min ~ max까지 랜덤으로 숫자를 생성하는 함수 */
-// var generateRandom = function (min, max) {
-//     var ranNum = Math.floor(Math.random() * (max - min + 1)) + min;
-//     return ranNum;
-// }
-
-// // transporter 생성
-// let transporter = nodemailer.createTransport({
-
-//     // host: "mail.회사.계정.입력" *** mail. <-요게 핵심이었다!
-//     host: "mail.abc.co.kr",
-
-//     // 보안 무시
-//     port: 587,
-
-//     // 회사 도메인 내 계정 및 비밀번호
-//     auth: {
-//         user: "myid@abc.co.kr",
-//         pass: "mypassword",
-//     },
-
-//     // 서명받지 않은 사이트의 요청도 받겠다.
-//     tls: {
-//         rejectUnauthorized: false
-//     }
-// });
-
-// // 메일 관련 옵션
-// let mailOptions = {
-//     // 발송 메일 주소 (위에서 작성한 회사 계정 아이디)
-//     from: "myid@abc.co.kr",
-
-//     // 수신 메일 주소
-//     to: "receiverid@domain.com",
-
-//     // 제목
-//     subject: "인증 메일입니다.",
-
-//     // 인증 URL
-//     html: `<p>아래의 링크를 클릭하시면 인증이 완료됩니다.</p>
-//     <a href='http://localhost:3000/auth?etc'>인증하기</a>`,
-// };
-
-// // 메일 보내기
-// transporter.sendMail(mailOptions, function (err, info) {
-//     if (err) {
-//         // 메일 보내기 에러 발생 시, 콘솔 찍어보기
-//         console.log("메일보내기 에러쓰");
-//         console.log(err);
-//     } else {
-//         // 성공했다!
-//         console.log("Email sent: " + info.response);
-//     }
-// });
-
-// // export const auth = {
-// //     SendEmail: async (req, res) => {
-// //         const number = generateRandom(111111, 999999)
-
-// //         const { sendEmail } = req.body;
-
-// //         const mailOptions = {
-// //             from: "정욱이네러버덕",
-// //             to: sendEmail,
-// //             subject: "[러버덕]인증 관련 이메일 입니다",
-// //             text: "오른쪽 숫자 6자리를 입력해주세요 : " + number
-// //         };
-
-// //         const result = await smtpTransport.sendMail(mailOptions, (error, responses) => {
-// //             if (error) {
-// //                 return res.status(statusCode.OK).send(util.fail(statusCode.BAD_REQUEST, responseMsg.AUTH_EMAIL_FAIL))
-// //             } else {
-// //                 /* 클라이언트에게 인증 번호를 보내서 사용자가 맞게 입력하는지 확인! */
-// //                 return res.status(statusCode.OK).send(util.success(statusCode.OK, responseMsg.AUTH_EMAIL_SUCCESS, {
-// //                     number: number
-// //                 }))
-// //             }
-// //             smtpTransport.close();
-// //         });
-// //     }
-// // }
\ No newline at end of file

client/src/components/EueSuggest.js

-import React from 'react'
-import { Row, Card } from 'react-bootstrap';
+import React, { useEffect } from 'react'
+import { Row, Card, Col } from 'react-bootstrap';
 
 function EueSuggest() {
+
     const cardstyled = {
         margin: 'auto',
         padding: '1em',
@@ -13,18 +14,22 @@ function EueSuggest() {
         borderColor: 'rgb(110, 189, 142)',
         color: '#04AB70'
     }
+    const airUsing = localStorage.getItem('using-aircondition')
+
 
     return (
-            <Row className='text-center w-100 my-2'>
-                <Card style={cardstyled}>
-                    <Card.Title>
-                        EUE 제안
-                    </Card.Title>
-                    <Card.Text>
-                        "에어컨을 줄이시면 더 효율적입니다."
-                    </Card.Text>
-                </Card>
-            </Row>
+        <Row className='text-center w-100 my-2'>
+            <Card style={cardstyled}>
+
+                <Card.Title>
+                    EUE 제안
+                </Card.Title>
+                <Card.Text>
+                    "에어컨을 줄이시면 더 효율적입니다."
+                </Card.Text>
+                
+            </Card>
+        </Row>
     )
 }
 

client/src/components/LocCodeChange.js

 import React, { useEffect, useState } from 'react'
 import '../App.css'
-import { Form, Button, Row, Col, Card, DropdownButton, Dropdown, ButtonGroup, Collapse, Fade } from 'react-bootstrap';
+import { Form, Button, Row, Col, Card } from 'react-bootstrap';
 import axios from 'axios';
 import Swal from 'sweetalert2'
 
@@ -45,11 +45,6 @@ function LocCodeChange() {
     const sggSelect = document.getElementById('select-sgg')
     const emdSelect = document.getElementById('select-emd')
 
-
-    // console.log(doeSelect.options[doeSelect.selectedIndex].text)
-    // console.log(sggSelect.options[sggSelect.selectedIndex].text)
-    // console.log(emdSelect.options[emdSelect.selectedIndex].text)
-
     function handleClickLoc() {
         if (doeSelect.options[doeSelect.selectedIndex].text !== '도' && sggSelect.options[sggSelect.selectedIndex].text !== '시군구' && emdSelect.options[emdSelect.selectedIndex].text !== '읍면동') {
             localStorage.setItem('code_doe', doeSelect.value)
@@ -88,9 +83,6 @@ function LocCodeChange() {
 
     }
 
-
-
-
     async function getLocCode() {
         const res = await axios.get("http://localhost:4500/api/data/loccode")
         const local_codes = res.data.locCodes
@@ -119,6 +111,7 @@ function LocCodeChange() {
     }
 
 
+
     return (
         <Row className='text-center w-100 my-2'>
             <Card style={cardstyled}>
@@ -129,8 +122,7 @@ function LocCodeChange() {
                     Please select a your region
                 </Card.Subtitle>
                 <hr />
-                <Card.Text>
-
+                <Card.Text className='m-0'>
                     <Form style={inboxstyled}>
                         <Row md={12} xs={12} className='m-auto w-100 d-flex justify-content-center' style={{ padding: '0', display: 'flex', justifyContent: 'center', width: '100%' }}>
                             <Form.Group className='m-auto w-100' style={btnstyled2}>
@@ -175,15 +167,17 @@ function LocCodeChange() {
                                         </Form.Control>
                                     </Col>
                                 </Row>
-                                <Button
-                                    variant='light' style={btnstyled2} onClick={handleClickLoc}>
-                                    확인
-                                </Button>
                             </Form.Group>
                         </Row>
                     </Form>
-
                 </Card.Text>
+                <Row className='d-flex justify-content-center'>
+                    <Button
+                        variant='light' style={btnstyled2} onClick={handleClickLoc}>
+                        확인
+                    </Button>
+                </Row>
+
             </Card>
 
         </Row>

client/src/components/LoginComp.js

@@ -26,24 +26,30 @@ function LoginComp() {
         padding: '10px'
     }
 
-    const [emailSent, setEmailSent] = useState(false)
-    const [alertShow, setAlertShow] = useState(true)
+    const [emailSentAlert, setEmailSentAlert] = useState(false)
+    const [alertShow, setAlertShow] = useState(false)
 
-    function CheckEmailSend() {
-        setEmailSent(!emailSent)
+    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)
+        }
     }
 
     function addressUrl() {
-        localStorage.setItem('Email-Address', emailAddress)
-        const afterAt = localStorage.getItem('Email-Address').split('@')[1]
-        console.log(afterAt)
+        const afterAt = localStorage.getItem('login_email_Address').split('@')[1]
         const newLink = 'https://www.' + afterAt;
         window.open(newLink);
     }
 
-    const [emailAddress, setEmailAddress] = useState('')
-
     function handleChange(event) {
         setEmailAddress(event.target.value)
         console.log(emailAddress)
@@ -61,7 +67,7 @@ function LoginComp() {
                 <hr />
                 <Card.Text>
                     <Row className='m-auto d-flex justify-content-center' style={{ width: '80%' }}>
-                        {!emailSent ?
+                        {!emailSentAlert ?
                             <Alert show={alertShow} variant={'success'}>
                                 <Col>
                                     😍 이메일 전송이 완료 되었습니다.
@@ -80,18 +86,15 @@ function LoginComp() {
                                 </Alert.Link>
                             </Alert>
                         }
-                        <Button onClick={() => setAlertShow(true)}>보여주고</Button>
-                        <Button onClick={() => setAlertShow(false)}>안보여주고</Button>
                     </Row>
+
                     <Form style={inboxstyled}>
                         <Form.Group controlId="formBasicEmail">
                             <Form.Control type="email" placeholder="Email" onChange={handleChange} />
                         </Form.Group>
-                        <Button variant='light' id='formbtn' onClick={CheckEmailSend}> 
-                        
+                        <Button variant='light' className='mt-3' id='formbtn' onClick={CheckEmailSend}>
                             LOGIN
                         </Button>
-
                     </Form>
 
                     <Row className='d-flex align-items-center m-2'>

client/src/components/MainLayer.js

-import React from 'react'
-import { Button, Image, Row, ButtonGroup, } from 'react-bootstrap';
+import React, { useEffect, useState } from 'react'
+import { Button, Image, Row, ButtonGroup, Form, Col } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 import '../App.css'
-import LocalCode from '../components/LocalCode';
+import UserInfo from './UserInfo';
 import { kakaoLogout } from '../utils/Oauth';
 
 
@@ -36,9 +36,15 @@ function MainLayer() {
 
     const logined = localStorage.getItem('nickname')
 
+    const [airUsing, setAirUsing] = useState(false)
+
+    function aircondiCheck() {
+        setAirUsing(!airUsing)
+        localStorage.setItem('using-aircondition', !airUsing);
+    }
+
     return (
-        <>
-        
+        <Col>
             <Row className='d-flex align-items-center m-auto w-100'>
                 <Link to='/' className=' m-auto'>
                     <Image src='/images/EUE11.jpg' alt='EUE' style={boxstyled} />
@@ -46,8 +52,18 @@ function MainLayer() {
             </Row>
 
             <Row className='m-auto d-flex justify-content-center w-100'>
-                <LocalCode />
+                <UserInfo />
             </Row>
+            <Form
+                key='checkbox' className="d-flex  justify-content-center w-100" style={{ flexDirection: 'row-reverse' }}>
+                <Form.Check
+                    type='switch'
+                    id='aircondition-checkbox'
+                    label='에어컨 사용중'
+                    onChange={aircondiCheck}
+                />
+            </Form>
+
             <Row className='d-flex justify-content-center align-items-center my-2 mx-auto w-100'>
                 <ButtonGroup vertical className='m-auto' style={{ width: '100%', flexDirection: 'column' }}>
                     {logined ?
@@ -76,7 +92,7 @@ function MainLayer() {
             <Row className='m-auto justify-content-center w-100' id='contour'>
                 |
             </Row>
-        </>
+        </Col>
     );
 }
 

client/src/components/SignupComp.js

@@ -27,16 +27,40 @@ function SignupComp() {
     }
 
     const initValues = {
-        email: '',
-        name: ''
+        name: '',
+        email: ''
     }
 
     const [formValues, setFormValues] = useState(initValues)
     const [validated, setValidated] = useState(false)
 
+    const [emailSubm, setEmailSubm] = useState(false)
+
+    const [userExist, setUserExist] = useState(false)
+    const [alertShow, setAlertShow] = useState(false)
+
     function handleChange(event) {
         const { name, value } = event.target
         setFormValues({ ...formValues, [name]: value })
+        console.log('???', formValues)
+    }
+
+    function CheckUserExist() {
+        localStorage.setItem('signup_username', formValues.name)
+        localStorage.setItem('signup_email_Address', formValues.email)
+
+        const signUser = localStorage.getItem('signup_username')
+        const signEmail = localStorage.getItem('signup_email_Address').split('@')[1]
+
+        if (signEmail && signUser) {
+            setAlertShow(true)
+            setUserExist(!userExist)
+        }
+        else
+            if (!signEmail) {
+                setAlertShow(false)
+                // setUserExist(true)
+            }
     }
 
     function handleSubmit(event) {
@@ -55,7 +79,6 @@ function SignupComp() {
         // setFormError(validate(formValues))
         // setIsSubmit(true)
     }
-    const [emailSubm, setEmailSubm] = useState(false)
 
     function handleClickSubm() {
         // setEmailSubm(true);
@@ -66,12 +89,6 @@ function SignupComp() {
     }
 
 
-    const [userExist, setUserExist] = useState(false)
-    const [alertShow, setAlertShow] = useState(true)
-
-    function CheckUserExist() {
-        setUserExist(!userExist)
-    }
 
 
     return (
@@ -106,13 +123,11 @@ function SignupComp() {
                                 </Alert.Link>
                             </Alert>
                         }
-                        <Button onClick={() => setAlertShow(true)}>보여주고</Button>
-                        <Button onClick={() => setAlertShow(false)}>안보여주고</Button>
                     </Row>
 
                     <Form style={inboxstyled}
                         onSubmit={handleSubmit}>
-                        <Form.Group controlId="userEmail">
+                        <Form.Group controlId="username">
                             <Row className='m-auto mb-1 d-flex justify-content-center'>
                                 <Form.Control
                                     type="text"
@@ -138,8 +153,8 @@ function SignupComp() {
                             </Row>
                         </Form.Group>
 
-                        <Button variant='light' className='mt-2' id='formbtn' onClick={CheckUserExist}>
-                        {/* type="submit" */}
+                        <Button variant='light' className='mt-3' id='formbtn' onClick={CheckUserExist}>
+                            {/* type="submit" */}
                             Sign Up
                         </Button>
                     </Form>

client/src/components/LocalCode.js → client/src/components/UserInfo.js

 import React, { useState } from 'react'
 import { Row, Card, Button, Col, Modal } from 'react-bootstrap';
-// import db from "../db/index"
 import '../App.css'
 import { Link } from 'react-router-dom';
 
 
-function LocalCode() {
+function UserInfo() {
 
     const nickname = localStorage.getItem('nickname')
     const localname_doe = localStorage.getItem('name_doe')
@@ -21,20 +20,25 @@ function LocalCode() {
         borderWidth: '3px',
         borderRadius: '20px',
         borderColor: 'rgba(195, 195, 195, 0.753)',
-        color: 'rgb(110, 189, 142)'
+        // color: '#04AB70'
+        color: 'rgb(110, 189, 142)',
+
+
     }
     const btnstyled2 = {
         background: 'white',
         margin: 'auto',
         borderWidth: '2px',
-        fontSize: '0.5em',
+        // padding: '0',
+        fontSize: '0.7em',
         color: 'rgb(110, 189, 142)',
         borderColor: 'rgba(195, 195, 195, 0.753)',
-        borderRadius: '20px',
+        // borderRadius: '20px',
+        width: '50%'
     }
 
     return (
-        <>
+        <Row>
             <Col className='text-center pt-3 pb-2 px-0'>
                 <Card style={cardstyled} id='localName'>
                     <Card.Title>
@@ -46,7 +50,7 @@ function LocalCode() {
                             </>
                         }, 환영합니다.
                     </Card.Title>
-                    <Row style={{ alignItems: 'center', margin: 'auto', whiteSpace: 'nowrap', justifyContent: 'center' }}>
+                    <Row style={{ alignItems: 'center', margin: 'auto', justifyContent: 'center' }}>
                         <Card.Subtitle>
                             {localname_emd ?
                                 `${localname_doe} ${localname_sgg} ${localname_emd}`
@@ -57,19 +61,20 @@ function LocalCode() {
                             }
                         </Card.Subtitle>
                         {nickname &&
-                            <Button variant='light' className='ml-1 m-auto' style={btnstyled2}>
-                                <Link to='/local_code' style={{ textDecoration: 'none', color: 'rgb(110, 189, 142)' }}>
+                            <Button variant='light' className='m-auto d-flex' style={btnstyled2}>
+                                <Link to='/local_code' className='w-100' style={{ textDecoration: 'none', color: 'rgb(110, 189, 142)' }}>
                                     변경
                                 </Link>
                             </Button>
                         }
                     </Row>
+                    <hr />
 
                     환경을 향한 노력 <br />
                     <strong>OOO 일 째</strong>
                 </Card>
             </Col>
-        </>
+        </Row>
     )
 }
-export default LocalCode;
+export default UserInfo;
\ No newline at end of file

client/src/pages/Home.js

@@ -50,15 +50,11 @@ function Home() {
                 </Col>
 
                 <Col md={6} style={col2sty}>
-
-                    <Row style={constyled} className='d-flex mb-2 w-100'>
-
                         {/* <TimeNow /> */}
                         <EueSuggest />
                         <ChartLine />
                         <ChartDoughnut />
                         <Footer />
-                    </Row>
                 </Col>
             </Row>
         </Container>

client/src/pages/LocalCodePage.js

@@ -37,10 +37,7 @@ function SignupPage() {
                 </Col>
 
                 <Col md={6} style={col2sty}>
-
-                    <Row style={constyled} className='d-flex mb-2 w-100'>
                         <LocCodeChange />
-                    </Row>
                 </Col>
             </Row>
         </Container>

client/src/pages/LoginPage.js

@@ -38,9 +38,7 @@ function SignupPage() {
 
                 <Col md={6} style={col2sty}>
 
-                    <Row style={constyled} className='d-flex mb-2 w-100'>
                         <LoginComp />
-                    </Row>
                 </Col>
             </Row>
         </Container>

client/src/pages/SignupPage.js

@@ -37,10 +37,7 @@ function SignupPage() {
                 </Col>
 
                 <Col md={6} style={col2sty}>
-
-                    <Row style={constyled} className='d-flex mb-2 w-100'>
-                        <SignupComp />
-                    </Row>
+                    <SignupComp />
                 </Col>
             </Row>
         </Container>