Skip to content

Commit

Permalink
feat(#6): resolve conflict
Browse files Browse the repository at this point in the history
  • Loading branch information
@Suh-code
Suh-code committed Nov 6, 2024
2 parents 82fc9c9 + eaae862 commit a547055
Show file tree
Hide file tree
Showing 5 changed files with 109 additions and 78 deletions.
11 changes: 0 additions & 11 deletions setupProxy.js
View file

This file was deleted.

1 change: 0 additions & 1 deletion src/apis/AxiosInstance.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ const Axios = axios.create({

// eslint-disable-next-line no-undef
baseURL: import.meta.env.VITE_BASE_URL,

headers: {
Authorization: `Bearer ${token?.loginState?.data?.accessToken}`,
"Content-Type": "application/json",
Expand Down
12 changes: 6 additions & 6 deletions src/pages/LoginPage/LoginPage.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import styled from 'styled-components';
import { images } from '../../components/Images';
import { useNavigate } from 'react-router-dom';
import loginbtn from './loginbtn.png';
import styled from "styled-components";
import { images } from "../../components/Images";
import { useNavigate } from "react-router-dom";
import loginbtn from "./loginbtn.png";

const LoginPage = () => {
const navigate = useNavigate();
Expand All @@ -11,11 +11,11 @@ const LoginPage = () => {
<Image src={images.loginDogCat} alt="로그인 화면 강아지와 고양이 그림" />
<Title>지금 가입하면 5천원 즉시 할인!</Title>
<Subtitle>우리 댕냥이 엄마쇼핑 시작해볼까요?</Subtitle>
<a href="http://localhost:8080/api/oauth2/authorization/kakao">
<a href="https://ureca.store/api/oauth2/authorization/kakao">
<img src={loginbtn} alt="카카오 계정으로 로그인" />
</a>
<OtherMethodButton>다른 방법으로 시작하기</OtherMethodButton>
<SkipButton onClick={() => navigate('/')}>일단 둘러보기</SkipButton>
<SkipButton onClick={() => navigate("/")}>일단 둘러보기</SkipButton>
</Container>
);
};
Expand Down
161 changes: 102 additions & 59 deletions src/pages/RegisterPage/UserRegisterPage.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import React, { useState, useEffect } from 'react';
import styled from 'styled-components';
import { images } from '../../components/Images';
import { useNavigate } from 'react-router-dom';
import UploadImg from '../../components/Register/UploadImg';
import PopupDom from '../../components/Register/PopUpDom';
import PopupPostCode from '../../components/Register/PopupPostCode';
import axios from '../../apis/AxiosInstance';
import Cookies from 'js-cookie';
import { ScrollableContainer, Container, Label } from './CommonStyle';
import React, { useState, useEffect } from "react";
import styled from "styled-components";
import { images } from "../../components/Images";
import { useNavigate } from "react-router-dom";
import UploadImg from "../../components/Register/UploadImg";
import PopupDom from "../../components/Register/PopUpDom";
import PopupPostCode from "../../components/Register/PopupPostCode";
import axios from "../../apis/AxiosInstance";
import Cookies from "js-cookie";
import { ScrollableContainer, Container, Label } from "./CommonStyle";

const Description = styled.label`
font-size: 13px;
Expand Down Expand Up @@ -292,21 +292,20 @@ const RegisterButton = styled.button`

const UserRegisterPage = () => {
const navigate = useNavigate();
const [imgPath, setImgPath] = useState('');
const [imgPath, setImgPath] = useState("");
const [toggleStates, setToggleStates] = useState([false, false, false]);
const [isPopupOpen, setIsPopupOpen] = useState(false);
const [address, setAddress] = useState('');
const [zoneCode, setZoneCode] = useState('');
const [nickname, setNickname] = useState('');
const [phoneNumber, setPhoneNumber] = useState('');
const [detailedAddress, setDetailedAddress] = useState('');
const [email, setEmail] = useState('');
const [profileNickname, setProfileNickname] = useState('');


const [address, setAddress] = useState("");
const [zoneCode, setZoneCode] = useState("");
const [nickname, setNickname] = useState("");
const [phoneNumber, setPhoneNumber] = useState("");
const [detailedAddress, setDetailedAddress] = useState("");
const [email, setEmail] = useState("");
const [profileNickname, setProfileNickname] = useState("");

useEffect(() => {
const emailFromCookie = Cookies.get('email');
const profileNicknameFromCookie = Cookies.get('profile_nickname');
const emailFromCookie = Cookies.get("email");
const profileNicknameFromCookie = Cookies.get("profile_nickname");

if (emailFromCookie) {
setEmail(emailFromCookie);
Expand All @@ -320,52 +319,50 @@ const UserRegisterPage = () => {
const openPostCode = () => setIsPopupOpen(true);
const closePostCode = () => setIsPopupOpen(false);


const handlePhoneNumberChange = (e) => {
const value = e.target.value.replace(/[^0-9]/g, ''); // 숫자만 남기기
let formattedValue = '';
const value = e.target.value.replace(/[^0-9]/g, ""); // 숫자만 남기기
let formattedValue = "";

if (value.length > 0) {
formattedValue += value.substring(0, 3);
}
if (value.length > 3) {
formattedValue += '-' + value.substring(3, 7);
formattedValue += "-" + value.substring(3, 7);
}
if (value.length > 7) {
formattedValue += '-' + value.substring(7, 11);
formattedValue += "-" + value.substring(7, 11);
}

setPhoneNumber(formattedValue); // 포맷된 값으로 상태 업데이트
};

const handleRegister = async () => {

const nicknameRegex = /^[a-zA-Z0-9가-힣]+$/;

if (!nicknameRegex.test(nickname)) {
alert('닉네임에는 특수문자를 사용할 수 없습니다. 다시 입력해 주세요.');
setNickname('');
alert("닉네임에는 특수문자를 사용할 수 없습니다. 다시 입력해 주세요.");
setNickname("");
return;
}
if (!nickname || !phoneNumber || !address ) {
alert('모든 정보를 입력해주세요.');
if (!nickname || !phoneNumber || !address) {
alert("모든 정보를 입력해주세요.");
return;
}

const phoneRegex = /^010-\d{4}-\d{4}$/;
if (!phoneRegex.test(phoneNumber)) {
alert('휴대폰 번호는 010-1234-5678 형식으로 입력해 주세요.');
setPhoneNumber('');
alert("휴대폰 번호는 010-1234-5678 형식으로 입력해 주세요.");
setPhoneNumber("");
return;
}

if (!nickname || !phoneNumber || !address ) {
alert('모든 정보를 입력해주세요.');
if (!nickname || !phoneNumber || !address) {
alert("모든 정보를 입력해주세요.");
return;
}

try {
const response = await axios.post(`http://localhost:8080/api/user/Register`, {
const response = await axios.post(`/user/Register`, {
nickname,
phoneNumber,
address,
Expand All @@ -382,15 +379,15 @@ const UserRegisterPage = () => {

console.log(userId);

localStorage.setItem('userId', userId);
alert('userId가 localStorage에 저장되었습니다: ' + userId);
navigate('/petRegister/:userId');
localStorage.setItem("userId", userId);
alert("userId가 localStorage에 저장되었습니다: " + userId);
navigate("/petRegister/:userId");
} catch (error) {
console.error('Error updating user information:', error);
alert('사용자 정보 업데이트 중 오류가 발생했습니다.');
console.error("Error updating user information:", error);
alert("사용자 정보 업데이트 중 오류가 발생했습니다.");
}
};
const toggleHandler = index => {
const toggleHandler = (index) => {
const newToggleStates = [...toggleStates];
newToggleStates[index] = !newToggleStates[index];
setToggleStates(newToggleStates);
Expand All @@ -399,14 +396,19 @@ const UserRegisterPage = () => {
<ScrollableContainer>
<Container>
<Description>
<HightLight>발바닥 천국</HightLight>과🐾 당신의 반려동물 이야기를 시작해 볼까요?
<HightLight>발바닥 천국</HightLight>과🐾 당신의 반려동물 이야기를
시작해 볼까요?
<br /> 정보를 입력해 주시면 더 행복한 발걸음을 만들어 드릴게요!
</Description>
<UploadImg imgPath={imgPath} setImgPath={setImgPath} />

<Label>이메일</Label>
<InputContainer>
<KakaoEmail placeholder="이메일을 불러오고 있습니다..." value={email} disabled />
<KakaoEmail
placeholder="이메일을 불러오고 있습니다..."
value={email}
disabled
/>
<Icon src={images.kakaoIcon} alt="카카오 아이콘" />
</InputContainer>

Expand All @@ -415,7 +417,7 @@ const UserRegisterPage = () => {
<StyledInput
placeholder="닉네임을 입력해주세요"
value={nickname}
onChange={e => setNickname(e.target.value)}
onChange={(e) => setNickname(e.target.value)}
required
/>
</InputContainer>
Expand All @@ -435,19 +437,30 @@ const UserRegisterPage = () => {
<InputContainer>
<Label>주소</Label>
<AddressContainer>
<PostSearchContainer placeholder="우편번호" value={zoneCode} readOnly style={{ display: 'none' }} />
<SearchAddressButton onClick={openPostCode}>주소검색</SearchAddressButton>
<PostSearchContainer
placeholder="우편번호"
value={zoneCode}
readOnly
style={{ display: "none" }}
/>
<SearchAddressButton onClick={openPostCode}>
주소검색
</SearchAddressButton>
<div id="popupDom">
{isPopupOpen && (
<PopupDom>
<PopupPostCode onClose={closePostCode} setAddress={setAddress} setZoneCode={setZoneCode} />
<PopupPostCode
onClose={closePostCode}
setAddress={setAddress}
setZoneCode={setZoneCode}
/>
</PopupDom>
)}
</div>
<StyledInput
placeholder="기본주소를 입력해주세요"
value={address}
onChange={e => setAddress(e.target.value)}
onChange={(e) => setAddress(e.target.value)}
required
/>
</AddressContainer>
Expand All @@ -463,25 +476,45 @@ const UserRegisterPage = () => {
<TextContainer>
<SubTitleList>우리응애 건강관리</SubTitleList>
<DescriptionContainer>
<SubDescription>예방접종일과 병원 정보를 빠르게 받아보세요!</SubDescription>
<SubDescription>
예방접종일과 병원 정보를 빠르게 받아보세요!
</SubDescription>
</DescriptionContainer>
</TextContainer>
<FirstToggleContainer onClick={() => toggleHandler(0)}>
<div className={`toggle-container ${toggleStates[0] ? 'toggle--checked' : ''}`} />
<div className={`toggle-circle ${toggleStates[0] ? 'toggle--checked' : ''}`} />
<div
className={`toggle-container ${
toggleStates[0] ? "toggle--checked" : ""
}`}
/>
<div
className={`toggle-circle ${
toggleStates[0] ? "toggle--checked" : ""
}`}
/>
</FirstToggleContainer>
</SubContainer>

<SubContainer>
<TextContainer>
<SubTitleList>집사 생활</SubTitleList>
<DescriptionContainer>
<SubDescription>내가 작성한 글의 댓글을 빠르게 확인하세요!</SubDescription>
<SubDescription>
내가 작성한 글의 댓글을 빠르게 확인하세요!
</SubDescription>
</DescriptionContainer>
</TextContainer>
<SecondToggleContainer onClick={() => toggleHandler(1)}>
<div className={`toggle-container ${toggleStates[1] ? 'toggle--checked' : ''}`} />
<div className={`toggle-circle ${toggleStates[1] ? 'toggle--checked' : ''}`} />
<div
className={`toggle-container ${
toggleStates[1] ? "toggle--checked" : ""
}`}
/>
<div
className={`toggle-circle ${
toggleStates[1] ? "toggle--checked" : ""
}`}
/>
</SecondToggleContainer>
</SubContainer>

Expand All @@ -491,13 +524,23 @@ const UserRegisterPage = () => {
<DescriptionContainer>
<SubDescription>
다른 아이의 등록된 실종 위치 근처에 도착하면 알림을 보내드려요
<AlertAgreementDescription>가족의 품으로 가는 길, 도와주시면 감사하겠습니다*</AlertAgreementDescription>
<AlertAgreementDescription>
가족의 품으로 가는 길, 도와주시면 감사하겠습니다*
</AlertAgreementDescription>
</SubDescription>
</DescriptionContainer>
</TextContainer>
<ThirdToggleContainer onClick={() => toggleHandler(2)}>
<div className={`toggle-container ${toggleStates[2] ? 'toggle--checked' : ''}`} />
<div className={`toggle-circle ${toggleStates[2] ? 'toggle--checked' : ''}`} />
<div
className={`toggle-container ${
toggleStates[2] ? "toggle--checked" : ""
}`}
/>
<div
className={`toggle-circle ${
toggleStates[2] ? "toggle--checked" : ""
}`}
/>
</ThirdToggleContainer>
</SubContainer>
<RegisterButton onClick={handleRegister}>저장하기</RegisterButton>
Expand Down
2 changes: 1 addition & 1 deletion vite.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ export default defineConfig({
rewrite: (path) => path.replace(/^\/iamport/, ""), // "/iamport" 제거 후 전달
},
"/api": {
target: "http://localhost:8080",
target: "https://ureca.store/api",
changeOrigin: true,
},
},
Expand Down

0 comments on commit a547055

Please sign in to comment.