Commit 55693856 authored by 한규민's avatar 한규민
Browse files

마이페이지

parent 87029678
import axios from "axios"; import axios from "axios";
import { baseUrl } from "../utils/baseUrl.js"; import { baseUrl } from "../utils/baseUrl.js";
import config from "../utils/clientConfig.js";
const getUser = async () => { const getUser = async () => {
const url = `${baseUrl}/api/auth/user` const url = `${baseUrl}/api/auth/user`
...@@ -38,8 +37,13 @@ const confirmMbnum = async (id, token) => { ...@@ -38,8 +37,13 @@ const confirmMbnum = async (id, token) => {
return data return data
} }
const getNickName = async (id) => { const profile = async (formData) => {
const url = `${baseUrl}/api/auth/nickname/${id}` const url = `${baseUrl}/api/auth/profile`
const { data } = await axios.post(url, formData)
return data
}
const getMember = async (id) => {
const url = `${baseUrl}/api/auth/member`
const { data } = await axios.get(url) const { data } = await axios.get(url)
return data return data
} }
...@@ -62,7 +66,8 @@ const authApi = { ...@@ -62,7 +66,8 @@ const authApi = {
signup, signup,
compareId, compareId,
confirmMbnum, confirmMbnum,
getNickName, profile,
getMember,
comparePw, comparePw,
modifyUser, modifyUser,
}; };
......
import styles from "./my-info.module.scss"; import styles from "./my-info.module.scss";
import { useAuth } from "../../context/auth_context";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import authApi from "../../apis/auth.api"; import authApi from "../../apis/auth.api";
import catchErrors from "../../utils/catchErrors.js"; import catchErrors from "../../utils/catchErrors.js";
const MyInfo = () => { const MyInfo = () => {
const { user } = useAuth();
const [userNickName, setUserNickName] = useState("사용자"); const [userNickName, setUserNickName] = useState("사용자");
const [img, setImg] = useState("");
const [profile, setProfile] = useState("");
// 사용자 이름 가져오는 함수 // 사용자 이름 가져오는 함수
const getNickName = async (id) => { const getMember = async () => {
const nickname = await authApi.getNickName(id); const member = await authApi.getMember();
setUserNickName(nickname); setUserNickName(member.nickname);
setProfile(member.img);
} }
const [page, setPage] = useState(true);
//현재 비밀번호 state //현재 비밀번호 state
const [presentPw, setPresentPw] = useState(""); const [presentPw, setPresentPw] = useState("");
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [style, setStyle] = useState("visually-hidden-focusable");
//변경할 데이터 입력받는 state //변경할 데이터 입력받는 state
const [userRe, setUserRe] = useState({ const [userRe, setUserRe] = useState({
...@@ -39,7 +40,7 @@ const MyInfo = () => { ...@@ -39,7 +40,7 @@ const MyInfo = () => {
}) })
useEffect(() => { useEffect(() => {
getNickName(user.id); getMember();
}, []) }, [])
const handlePwOnChange = (e) => { const handlePwOnChange = (e) => {
...@@ -65,6 +66,24 @@ const MyInfo = () => { ...@@ -65,6 +66,24 @@ const MyInfo = () => {
handleOnSummitVerify(e); handleOnSummitVerify(e);
} }
} }
const handleOnChange = (e) => {
setImg(e.target.files[0]);
}
const handleOnSummitForm = async (e) => {
e.preventDefault();
try {
setError("")
const formData = new FormData();
formData.append("image", img);
const image = await authApi.profile(formData);
console.log(image.img);
setProfile(image.img);
} catch (error) {
catchErrors(error, setError);
}
}
//기존 비밀번호 확인 //기존 비밀번호 확인
const handleOnSummitVerify = async (e) => { const handleOnSummitVerify = async (e) => {
e.preventDefault(); e.preventDefault();
...@@ -74,9 +93,8 @@ const MyInfo = () => { ...@@ -74,9 +93,8 @@ const MyInfo = () => {
const pw = presentPw; const pw = presentPw;
const confirmPw = await authApi.comparePw(pw); const confirmPw = await authApi.comparePw(pw);
if (confirmPw) { if (confirmPw) {
setStyle(""); setPage(false);
} else { } else {
setStyle("visually-hidden-focusable");
alert("비밀번호가 일치하지 않습니다."); alert("비밀번호가 일치하지 않습니다.");
} }
} catch (error) { } catch (error) {
...@@ -103,46 +121,45 @@ const MyInfo = () => { ...@@ -103,46 +121,45 @@ const MyInfo = () => {
} }
} }
//유효성 검사 //유효성 검사
const validation = async () => { const validation = () => {
try {//별명 유효성 검사 //별명 유효성 검사
vaildationData((userRe.userNickName.length === 0), false, "errorNickName"); vaildationData((userRe.userNickName.length === 0), false, "errorNickName");
// 휴대폰 유효성 검사 // 휴대폰 유효성 검사
vaildationData(userRe.userMbnum.length, 11, "errorMbnum"); vaildationData(userRe.userMbnum.length, 11, "errorMbnum");
// 비밀번호 유효성 검사 // 비밀번호 유효성 검사
vaildationIdPw(userRe.userPassword.length, 8, "errorPassword"); vaildationIdPw(userRe.userPassword.length, 8, "errorPassword");
// 비밀번호 확인 유효성 검사 // 비밀번호 확인 유효성 검사
vaildationData(userRe.userPassword, userRe.userRePassword, "errorRePassword"); vaildationData(userRe.userPassword, userRe.userRePassword, "errorRePassword");
// 최종 유효성 검사 // 최종 유효성 검사
if ((Object.values(errorMsg).some((element) => (element)) === false)) { if ((Object.values(errorMsg).some((element) => (element)) === false)) {
return true return true
} else { } else {
throw new Error("유효하지 않은 데이터입니다."); return false
}
} catch (error) {
catchErrors(error, setError);
} }
} }
const handleOnSummit = async (e) => { const handleOnSummit = async (e) => {
e.preventDefault(); e.preventDefault();
try { try {
setError(() => ("")); setError(() => (""));
//처리가 될때까지 버튼(가입하기)이 안눌리게 지정 //처리가 될때까지 버튼(가입하기)이 안눌리게 지정
setLoading(() => (true)); setLoading(() => (true));
console.log("userRe : " + userRe.userEmail); console.log("userRe : " + userRe.userEmail);
//유효성 검사 //유효성 검사
const vaild = validation(); let valid = validation();
if (vaild) { console.log("valid :" + valid);
if (valid) {
const userData = userRe; const userData = userRe;
console.log(userData); console.log(userData);
//서버로 전송 //서버로 전송
const process = await authApi.modifyUser(userData); const process = await authApi.modifyUser(userData);
console.log("process : " + process); console.log("process : " + process);
alert("회원정보 수정 완료"); alert("회원정보 수정 완료");
} valid = false;
} else { throw new Error("유효하지 않은 데이터입니다.") }
} catch (error) { } catch (error) {
//에러전송 //에러전송
catchErrors(error, setError); catchErrors(error, setError);
...@@ -151,111 +168,125 @@ const MyInfo = () => { ...@@ -151,111 +168,125 @@ const MyInfo = () => {
} }
} }
const handleOnClick = (e) => {
e.preventDefault();
setPage(true);
}
return ( return (
<> <>
{/* 마이페이지 창 */} {/* 마이페이지 창 */}
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<span className={styles.title}>마이페이지</span> <span className={styles.title}>마이페이지</span>
<div className="d-flex flex justify-content-center"> <div className="d-flex justify-content-around">
<img src="https://search.pstatic.net/sunny/?src=https%3A%2F%2Fi.pinimg.com%2Foriginals%2F1e%2F1c%2F2e%2F1e1c2e4e07f5c440c3adad38bcd6f854.jpg&type=a340" <div className={`${styles.box} me-5`}>
className="img-fluid px-5 rounded-circle" /> <p className={`${styles.hoverTxt}`}>프로필 변경</p>
{/* <button type="submit"></button> */} <img src={`/upload/${profile}`} className={`figure-img img-fluid rounded-circle ${styles.profile}`} role="button" data-bs-toggle="modal" data-bs-target="#staticBackdrop" />
<div className="d-flex flex-column py-4 justify-content-around"> </div>
<span className={`${styles.userName}`}>{`${userNickName}`} 반갑습니다!</span> <div className="d-flex flex-column py-4 justify-content-around">
<button className={`rounded my-3 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} data-bs-toggle="modal" href="#verifyPassword" >회원정보 수정</button> <span className={`${styles.userName}`}>{`${userNickName}`} 반갑습니다!</span>
<button className={`rounded my-3 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} data-bs-toggle="modal" href="#verifyPassword" >회원정보 수정</button>
</div>
</div> </div>
</div> </div>
</div>
{/* 기존 비밀번호 확인 모달창 */} <div className="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div className="modal fade" id="verifyPassword" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true" aria-labelledby="verifyPasswordLabel" tabindex="-1"> <div className="modal-dialog modal-dialog-centered">
<div className="modal-dialog modal-dialog-centered"> <form className="modal-content" onSubmit={handleOnSummitForm}>
<form className="modal-content" onSubmit={handleOnSummitVerify}> <div className="modal-header">
<div className="modal-header"> <h5 className="modal-title" id="staticBackdropLabel">프로필변경</h5>
<h5 className="modal-title" id="verifyPasswordLabel">기존 비밀번호 확인</h5> <button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div clasNames="modal-body">
<div className="d-flex flex-column ">
<div className="d-flex justify-content-around align-items-center my-4">
<label className={styles.signupLabel}>현재 비밀번호</label>
<input className={`${styles.input} ${styles.inputSize}`} type="password" name="userPassword" placeholder="8~11자리 사이" onChange={handlePwOnChange} onKeyPress={enterKey} maxLength="11" required />
</div>
{(style !== "visually-hidden-focusable") && <p className={styles.passwordConfirmError}>다음을 클릭해주세요.</p>}
</div> </div>
</div> <div className="modal-body">
<div className="modal-footer"> <input type="file" onChange={handleOnChange} />
<button className={`${style} rounded my-3 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} data-bs-target="#modify" data-bs-toggle="modal" data-bs-dismiss="modal" disable={style === "visually-hidden-focusable"}>다음</button> </div>
<button type="submit" className={`rounded my-3 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} disabled={loading}>확인</button> <div className="modal-footer">
<button type="button" className="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
</div> <button type="submit" className={`rounded fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`}>변경</button>
</form> </div>
</form>
</div>
</div> </div>
</div>
{/* 회원정보 수정 모달창 */} {/* 기존 비밀번호 확인 모달창 */}
<div className="modal fade" id="modify" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true" aria-labelledby="modifyLabel" tabindex="-1"> <div className="modal fade" id="verifyPassword" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true" aria-labelledby="verifyPasswordLabel" tabindex="-1">
<div className="modal-dialog modal-dialog-centered"> <div className="modal-dialog modal-dialog-centered modal-dialog-centered">
<form className={`modal-content d-flex col-md-6 col-12 justify-content-center d-flex flex-column`} onSubmit={handleOnSummit}> {page ?
<div className="modal-header"> <><form className="modal-content" onSubmit={handleOnSummitVerify}>
<h5 className="modal-title" id="modifyLabel">회원정보 수정</h5> <div className="modal-header">
<button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <h5 className="modal-title" id="verifyPasswordLabel">기존 비밀번호 확인</h5>
</div> <button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close" onclick={handleOnClick}></button>
<div className={`modal-body`}>
<div className="d-flex flex-column">
<div className={styles.inputContent}>
<label className={styles.signupLabel}>이메일</label>
<input className={`${styles.input} ${styles.inputSize}`} type="email" name="userEmail" placeholder="이메일을 입력해주세요" onChange={handleUserOnChange} maxlength="20" required />
</div> </div>
{errorMsg.errorEmail && <p className={styles.passwordConfirmError}>이메일을 입력해주세요</p>} <div clasNames="modal-body">
</div> <div className="d-flex flex-column">
<div className="d-flex flex-column"> <div className="d-flex justify-content-around align-items-center my-4">
<div className={styles.inputContent}> <label className={styles.signupLabel}>현재 비밀번호</label>
<label className={styles.signupLabel}>별명</label> <input className={`${styles.input} ${styles.inputSize}`} type="password" name="userPassword" placeholder="8~11자리 사이" onChange={handlePwOnChange} onKeyPress={enterKey} maxLength="11" required />
<input className={`${styles.input} ${styles.inputSize}`} type="text" name="userNickName" placeholder="10자리 이내" onChange={handleUserOnChange} maxLength="10" required /> </div>
</div>
</div> </div>
{errorMsg.errorNickName && <p className={styles.passwordConfirmError}>10 이내로 입력해주세요.</p>} <div className="modal-footer">
</div> <button type="submit" className={`rounded my-3 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} disabled={loading}>확인</button>
</div>
</form></>
: <><form className={`modal-content d-flex col-md-6 col-12 justify-content-center d-flex flex-column`} onSubmit={handleOnSummit}>
<div className="modal-header">
<h5 className="modal-title" id="modifyLabel">회원정보 수정</h5>
<button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close" onclick={handleOnClick}></button>
</div>
<div className={`modal-body`}>
<div className="d-flex flex-column">
<div className={styles.inputContent}>
<label className={styles.signupLabel}>이메일</label>
<input className={`${styles.input} ${styles.inputSize}`} type="email" name="userEmail" placeholder="이메일을 입력해주세요" onChange={handleUserOnChange} maxlength="20" required />
</div>
{errorMsg.errorEmail && <p className={styles.passwordConfirmError}>이메일을 입력해주세요</p>}
</div>
<div className="d-flex flex-column">
<div className={styles.inputContent}>
<label className={styles.signupLabel}>별명</label>
<input className={`${styles.input} ${styles.inputSize}`} type="text" name="userNickName" placeholder="10자리 이내" onChange={handleUserOnChange} maxLength="10" required />
</div>
{errorMsg.errorNickName && <p className={styles.passwordConfirmError}>10 이내로 입력해주세요.</p>}
</div>
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<div className={styles.inputContent}> <div className={styles.inputContent}>
<label className={styles.signupLabel}>휴대폰 번호</label> <label className={styles.signupLabel}>휴대폰 번호</label>
<div className="d-flex col-md-auto"> <div className="d-flex col-md-auto">
<input className={`${styles.input} ${styles.inputSize}`} type="number" name="userMbnum" placeholder="-없이 11자리 입력" onChange={handleUserOnChange} min="" max="99999999999" required /> <input className={`${styles.input} ${styles.inputSize}`} type="number" name="userMbnum" placeholder="-없이 11자리 입력" onChange={handleUserOnChange} min="" max="99999999999" required />
</div>
</div>
{errorMsg.errorMbnum && <p className={styles.passwordConfirmError}>-없이 숫자 11자리를 입력해주세요.</p>}
</div> </div>
</div>
{errorMsg.errorMbnum && <p className={styles.passwordConfirmError}>-없이 숫자 11자리를 입력해주세요.</p>}
</div>
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<div className={styles.inputContent}> <div className={styles.inputContent}>
<label className={styles.signupLabel}> 비밀번호</label> <label className={styles.signupLabel}> 비밀번호</label>
<input className={`${styles.input} ${styles.inputSize}`} type="password" name="userPassword" placeholder="8~11자리 사이" onChange={handleUserOnChange} maxLength="11" required /> <input className={`${styles.input} ${styles.inputSize}`} type="password" name="userPassword" placeholder="8~11자리 사이" onChange={handleUserOnChange} maxLength="11" required />
</div> </div>
{errorMsg.errorPassword && <p className={styles.passwordConfirmError}>8~11자리 사이로 입력해주세요.</p>} {errorMsg.errorPassword && <p className={styles.passwordConfirmError}>8~11자리 사이로 입력해주세요.</p>}
</div> </div>
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<div className={styles.inputContent}> <div className={styles.inputContent}>
<label className={styles.signupLabel}> 비밀번호 확인</label> <label className={styles.signupLabel}> 비밀번호 확인</label>
<input className={`${styles.input} ${styles.inputSize}`} type="password" name="userRePassword" placeholder="8~11자리 사이" onChange={handleUserOnChange} maxLength="11" required /> <input className={`${styles.input} ${styles.inputSize}`} type="password" name="userRePassword" placeholder="8~11자리 사이" onChange={handleUserOnChange} maxLength="11" required />
</div> </div>
{errorMsg.errorRePassword && <p className={styles.passwordConfirmError}>비밀번호가 일치하지 않습니다.</p>} {errorMsg.errorRePassword && <p className={styles.passwordConfirmError}>비밀번호가 일치하지 않습니다.</p>}
</div> </div>
</div> </div>
<div className="modal-footer"> <div className="modal-footer">
<button type="button" className="btn btn-secondary rounded my-3 py-2 fs-5" data-bs-dismiss="modal" disabled={loading}>닫기</button> <button type="button" className="btn btn-secondary rounded my-3 py-2 fs-5" data-bs-dismiss="modal" onClick={handleOnClick} disabled={loading}>닫기</button>
<button type="submit" className={`rounded my-3 py-2 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} disabled={loading}>수정하기</button> <button type="submit" className={`rounded my-3 py-2 fs-5 ${styles.butterYellowAndBtn} ${styles.btnHover}`} disabled={loading}>수정하기</button>
</div> </div>
</form> </form></>}
</div>
</div> </div>
</div> </>
</>
) )
} }
......
...@@ -28,13 +28,45 @@ width: 40%; ...@@ -28,13 +28,45 @@ width: 40%;
padding-right: 8px; padding-right: 8px;
text-align: left; text-align: left;
} }
.input_file_button{
padding: 6px 25px;
background-color:#FF6600;
border-radius: 4px;
color: white;
cursor: pointer;
}
.inputContent{ .inputContent{
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
align-items: center; align-items: center;
margin: 1rem 0; margin: 1rem 0;
} }
.box{
width:12rem;
margin: 0px auto;
position: relative;
}
.box:hover{
display: block;
}
.hoverTxt{
display: none;
position:absolute;
top:5rem;
left:2.5rem;
color : #FEDC00;
font-size: 1.5rem;
}
.box:hover .hoverTxt{
display: block;
}
.profile{
width: 12rem;
height: 12rem;
}
.profile:hover{
opacity: 0.5;
}
.input { .input {
margin: 0.5rem 0 0 0; margin: 0.5rem 0 0 0;
padding: 0.5rem 0 0.5rem 0; padding: 0.5rem 0 0.5rem 0;
......
import styles from "./reservation-details.module.scss";
const ReservationDetails = () => {
return(
<div className={`${styles.width}`}>
<header className={`${styles.header}`}>나의 예매 내역</header>
<main>
</main>
</div>
)
}
export default ReservationDetails
\ No newline at end of file
export { default } from "./ReservationDetails"
\ No newline at end of file
.width{
width : 100%;
display: flex;
margin-top: 5rem;
justify-content: center;
}
.header{
display: flex;
justify-content: center;
background-color: #FEDC00;
width: 80%;
text-align: center;
font-size: 2.5rem;
}
\ No newline at end of file
import MyInfo from "../components/MyInfo/MyInfo" import MyInfo from "../components/MyInfo/MyInfo"
import ReservationDetails from "../components/ReservationDetails";
const MyPage = () => { const MyPage = () => {
return ( return (
<div className="d-flex justify-content-center py-4"> <div className="d-flex flex-column justify-content-center align-items-center py-4">
<MyInfo/> <MyInfo/>
<ReservationDetails/>
</div> </div>
) )
} }
......
...@@ -666,6 +666,11 @@ ...@@ -666,6 +666,11 @@
"resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz", "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
"integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=" "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
}, },
"fs": {
"version": "0.0.1-security",
"resolved": "https://registry.npmjs.org/fs/-/fs-0.0.1-security.tgz",
"integrity": "sha1-invTcYa23d84E/I4WLV+yq9eQdQ="
},
"fsevents": { "fsevents": {
"version": "2.3.2", "version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
......
...@@ -7,7 +7,7 @@ const app = express() ...@@ -7,7 +7,7 @@ const app = express()
app.use(express.json()) app.use(express.json())
app.use(express.urlencoded({ extended: true })) app.use(express.urlencoded({ extended: true }))
app.use(cookieParser()) app.use(cookieParser())
app.use('/upload', express.static('upload'))
app.use('/api', mainRouter) app.use('/api', mainRouter)
......
import jwt from "jsonwebtoken"; import jwt from "jsonwebtoken";
import config from "../config/app.config.js"; import config from "../config/app.config.js";
import { User, Role } from '../db/index.js'; import { User, Role } from '../db/index.js';
import fs from "fs";
const getUser = async (req, res) => { const getUser = async (req, res) => {
try { try {
if (req.cookies) { if (req.cookies.butterStudio) {
const token = req.cookies.butterStudio; const token = req.cookies.butterStudio;
const decoded = jwt.verify(token, config.jwtSecret); const decoded = jwt.verify(token, config.jwtSecret);
res.json(decoded); res.json(decoded);
...@@ -109,38 +110,44 @@ const confirmMbnum = async (req, res) => { ...@@ -109,38 +110,44 @@ const confirmMbnum = async (req, res) => {
} }
const signup = async (req, res) => { const signup = async (req, res) => {
const { userId, userEmail, userNickName, userBirthday, userPassword } = req.body; const { userId, userEmail, userNickName, userBirthday, userMbnum, userPassword } = req.body;
// 휴대폰 중복 확인 // 휴대폰 중복 확인
const userMbnum = String(req.body.userMbnum);
try { try {
const mbnum = await User.findOne({ where: { phoneNumber: userMbnum } }); const mbnum = await User.findOne({ where: { phoneNumber: userMbnum } });
if (mbnum) { const email = await User.findOne({ where: { email: userEmail } });
if (mbnum && email) {
return res.status(422).send(`이미 있는 이메일, 휴대폰번호입니다.`);
} else if (!mbnum && email) {
return res.status(422).send(`이미 있는 이메일입니다.`);
} else if (mbnum && !email) {
return res.status(422).send(`이미 있는 휴대폰번호입니다.`); return res.status(422).send(`이미 있는 휴대폰번호입니다.`);
} else {
const role = await Role.findOne({ where: { name: "member" } })
const newUser = await User.create({
userId: userId,
email: userEmail,
nickname: userNickName,
birth: userBirthday,
phoneNumber: userMbnum,
password: userPassword,
roleId: role.id
});
res.json(newUser);
} }
const role = await Role.findOne({ where: { name: "member" } })
const newUser = await User.create({
userId: userId,
email: userEmail,
nickname: userNickName,
birth: userBirthday,
phoneNumber: userMbnum,
password: userPassword,
roleId: role.id
});
res.json(newUser);
} catch (error) { } catch (error) {
console.error(error.message); console.error(error.message);
res.status(500).send("회원가입 에러. 나중에 다시 시도 해주세요"); res.status(500).send("회원가입 에러. 나중에 다시 시도 해주세요");
} }
}; };
const getNickName = async (req, res) => { const getMember = async (req, res) => {
try { try {
const token = req.cookies.butterStudio; const token = req.cookies.butterStudio;
const decoded = jwt.verify(token, config.jwtSecret); const decoded = jwt.verify(token, config.jwtSecret);
if (decoded.role === "member") { if (decoded.role === "member") {
const user = await User.findOne({ where: { id: decoded.id }, attributes: ["nickname"] }); const user = await User.findOne({ where: { id: decoded.id } });
res.json(user.nickname); res.json({nickname : user.nickname, img : user.img});
} else { } else {
res.status(401).send("잘못된 접근입니다."); res.status(401).send("잘못된 접근입니다.");
} }
...@@ -150,6 +157,34 @@ const getNickName = async (req, res) => { ...@@ -150,6 +157,34 @@ const getNickName = async (req, res) => {
} }
} }
const uploadProfile = async (req, res) => {
try {
const image = req.file.filename;
console.log(req.file);
const token = req.cookies.butterStudio;
const decoded = jwt.verify(token, config.jwtSecret);
if (decoded) {
const img = await User.findOne({ where: { id:decoded.id }, attributes : ["img"]});
console.log("여기여기");
fs.unlink( "upload"+`\\${img.img}`, function(data){ console.log(data);});
const user = await User.update({
img: image
}, { where: { id: decoded.id } });
if(user){
const success = await User.findOne({ where: { id: decoded.id }, attributes: ["img"]});
res.json(success)
}else{
throw new Error("프로필 등록 실패")
}
}
} catch (error) {
console.error(error.message);
res.status(500).send("프로필 에러");
}
}
const comparePw = async (req, res) => { const comparePw = async (req, res) => {
try { try {
//쿠키 안 토큰에서 id추출 //쿠키 안 토큰에서 id추출
...@@ -171,26 +206,50 @@ const comparePw = async (req, res) => { ...@@ -171,26 +206,50 @@ const comparePw = async (req, res) => {
} }
} }
const overlap = async (decoded, dataType, data) => {
try {
let overlap = await User.findOne({ where: { id: decoded.id } });
console.log("overlap : ", overlap, "overlap[dataType] : ", overlap[dataType]);
if (overlap[dataType] === data) {
console.log("여기여기")
return true
} else {
overlap = await User.findOne({ where: { id: decoded.id }, attributes: [dataType] });
if (overlap) {
return false
} else {
return true
}
}
}catch(error){
console.error(error.message);
}
}
const modifyUser = async (req, res) => { const modifyUser = async (req, res) => {
try { try {
const token = req.cookies.butterStudio; const token = req.cookies.butterStudio;
const decoded = jwt.verify(token, config.jwtSecret); const decoded = jwt.verify(token, config.jwtSecret);
const { userEmail, userNickName, userMbnum, userPassword } = req.body; const { userEmail, userNickName, userMbnum, userPassword } = req.body;
const emailOverlap = await User.findOne({ where: { email: userEmail } }); const overlapEmail = await overlap(decoded, "email", userEmail);
const overlapMbnum = await overlap(decoded, "phoneNumber", userMbnum);
if (emailOverlap) { console.log("overlapEmail", overlapEmail, " overlapMbnum : ", overlapMbnum);
return res.status(422).send(`이미 있는 이메일입니다.`);
if (overlapEmail && overlapMbnum) {
const user = await User.update({
email: userEmail,
nickname: userNickName,
phoneNumber: userMbnum,
password: userPassword,
}, { where: { id: decoded.id } });
console.log("user22 :", user);
res.json(user);
} else if (!overlapEmail && overlapMbnum) {
res.status(500).send("이미 있는 이메일입니다.");
} else if (overlapEmail && !overlapMbnum) {
res.status(500).send("이미 있는 이메일입니다.");
} else { } else {
if (decoded) { res.status(500).send("이미 있는 이메일, 핸드폰번호입니다.");
let user = await User.findOne({ where: { id: decoded.id } });
await user.update({
email : userEmail,
nickname : userNickName,
phoneNumber : userMbnum,
password : userPassword,
});
res.json(user);
}
} }
} catch (error) { } catch (error) {
console.error(error.message); console.error(error.message);
...@@ -205,7 +264,8 @@ export default { ...@@ -205,7 +264,8 @@ export default {
compareId, compareId,
confirmMbnum, confirmMbnum,
signup, signup,
getNickName, getMember,
uploadProfile,
comparePw, comparePw,
modifyUser modifyUser
} }
...@@ -19,7 +19,6 @@ sequelize ...@@ -19,7 +19,6 @@ sequelize
); );
const adminRole = await Role.findOne({ where: { name: "admin" } }); const adminRole = await Role.findOne({ where: { name: "admin" } });
console.log("adminRole : ", adminRole);
if (!adminRole) { if (!adminRole) {
await User.create({ await User.create({
userId: "admin", userId: "admin",
......
...@@ -14,23 +14,26 @@ const UserModel = (sequelize) => { ...@@ -14,23 +14,26 @@ const UserModel = (sequelize) => {
autoIncrement: true, autoIncrement: true,
}, },
userId: { userId: {
type: DataTypes.STRING, type: DataTypes.STRING
}, },
email: { email: {
type: DataTypes.STRING, type: DataTypes.STRING
}, },
nickname: { nickname: {
type: DataTypes.STRING, type: DataTypes.STRING
}, },
birth: { birth: {
type: DataTypes.STRING, type: DataTypes.STRING
}, },
phoneNumber: { phoneNumber: {
type: DataTypes.STRING type: DataTypes.STRING
}, },
password: { password: {
type: DataTypes.STRING, type: DataTypes.STRING
}, },
img: {
type: DataTypes.STRING
}
}, },
{ {
timestamps: true, timestamps: true,
......
import express from "express"; import express from "express";
import userCtrl from "../controllers/user.controller.js"; import userCtrl from "../controllers/user.controller.js";
import multer from "multer"
const router = express.Router(); const router = express.Router();
const upload = multer({
dest: "upload/"
})
router router
.route("/user") .route("/user")
...@@ -19,14 +23,16 @@ router ...@@ -19,14 +23,16 @@ router
.route("/signup") .route("/signup")
.post(userCtrl.signup) .post(userCtrl.signup)
router
.post("/profile", upload.single("image"), userCtrl.uploadProfile)
router router
.route("/modify") .route("/modify")
.post(userCtrl.modifyUser) .post(userCtrl.modifyUser)
router router
.route("/nickname/:id") .route("/member")
.get(userCtrl.getNickName) .get(userCtrl.getMember)
router router
.route("/pw/:pw") .route("/pw/:pw")
......
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