diff --git a/src/components/signup/CircleNumBar/CircleNumBar.css b/src/components/signup/CircleNumBar/CircleNumBar.css
index 070e2da..ca7c5d8 100644
--- a/src/components/signup/CircleNumBar/CircleNumBar.css
+++ b/src/components/signup/CircleNumBar/CircleNumBar.css
@@ -44,7 +44,7 @@
position: absolute;
bottom: -1rem;
display: flex;
- transform: translateX(-51%);
+ transform: translateX(-52%);
width: 100%;
align-items: center;
justify-content: center;
diff --git a/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformation.jsx b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformation.jsx
index ab09344..8726cca 100644
--- a/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformation.jsx
+++ b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformation.jsx
@@ -1,175 +1,77 @@
-import { Modal } from "antd";
+import { message } from "antd";
import React, { useState } from "react";
-import DaumPostcode from "react-daum-postcode";
+import { useNavigate } from "react-router-dom";
+import RedButton from "../../../login/redButton/RedButton";
import "./UserInputStoreInformation.css";
+import CheckConsentForm from "./UserInputStoreInformationInputComponents/CheckConsentForm";
+import InputStoreAddress from "./UserInputStoreInformationInputComponents/InputStoreAddress";
+import InputStoreInformationText from "./UserInputStoreInformationInputComponents/InputStoreInformationText";
+import InputStoreInformationflie from "./UserInputStoreInformationInputComponents/InputStoreInformationflie";
-const InputStoreInformationText = ({
- title,
- id,
- placeholder,
- requiredname,
-}) => {
- return (
-
- );
-};
-
-const InputStoreAddressWrapper = () => {
+const UserInputStoreInformation = () => {
+ const navigate = useNavigate();
+ const [storeName, setStoreName] = useState("");
const [zonecode, setZonecode] = useState("");
const [zoneAddress, setZoneAddress] = useState("");
- const [openModal, setOpenModal] = useState(false);
+ const [zoneAddressDetail, setZoneAddressDetail] = useState("");
+ const [storeBusinessNumber, setStoreBusinessNumber] = useState("");
+ const [storeBusinessRegistration, setStoreBusinessRegistration] =
+ useState(null);
+ const [storeBusinessLicense, setStoreBusinessLicense] = useState(null);
+ const [userIdentification, setUserIdentification] = useState(null);
+ const [userPassbook, setUserPassbook] = useState(null);
+ const [personalInfoConsent, setPersonalInfoConsent] = useState(false);
- const handleComplete = (data) => {
- setZonecode(data.zonecode);
- setZoneAddress(data.address);
- onOpenPostModal();
+ const handleStoreNameChange = (event) => {
+ setStoreName(event.target.value);
};
- const onOpenPostModal = () => {
- setOpenModal((prev) => !prev);
+ const handleZonecodeChange = (zonecode) => {
+ setZonecode(zonecode);
};
- return (
-
-
- {openModal && (
-
-
-
- )}
-
-
-
-
- );
-};
-
-const InputStoreInformationflie = ({ title, id, requiredname }) => {
- const [selectedFile, setSelectedFile] = useState(null);
- const [fileSizeError, setFileSizeError] = useState(false);
- if (fileSizeError) {
- console.log("파일크기 에러");
- }
- const InputFilesss = () => {
- const handleFileChange = (event) => {
- const file = event.target.files[0];
-
- if (file && file.size <= 10 * 1024 * 1024) {
- setSelectedFile(file);
- setFileSizeError(false);
- } else {
- setFileSizeError(true);
- setSelectedFile(null);
- }
- };
+ const handleZoneAddressChange = (zoneAddress) => {
+ setZoneAddress(zoneAddress);
+ };
+ const handleZoneAddressDetailChange = (zoneAddressDetail) => {
+ setZoneAddressDetail(zoneAddressDetail);
+ };
- return (
-
- );
+ const handleStoreBusinessNumberChange = (event) => {
+ setStoreBusinessNumber(event.target.value);
};
- return (
-
-
-
-
- {
- const inputFile = document.getElementById(id);
- if (inputFile) {
- inputFile.click();
- }
- }}
- className="signup-page-content-store-input"
- />
-
-
- );
-};
+ const checkInputsCompletion = () => {
+ const isComplete =
+ storeName &&
+ zonecode &&
+ zoneAddress &&
+ zoneAddressDetail &&
+ storeBusinessNumber &&
+ storeBusinessRegistration &&
+ storeBusinessLicense &&
+ userIdentification &&
+ userPassbook &&
+ personalInfoConsent;
-const ConsentForm = () => {
- const [personalInfoConsent, setPersonalInfoConsent] = useState(false);
+ return isComplete;
+ };
const handlePersonalInfoConsentChange = () => {
setPersonalInfoConsent((prev) => !prev);
};
- return (
-
- {/* 약관 나오면 입히기 */}
-
-
-
- );
-};
+ const handleSubmission = () => {
+ const isComplete = checkInputsCompletion();
-const UserInputStoreInformation = () => {
+ if (isComplete) {
+ message.success("입력이 완료되었습니다.");
+ // 여기서 try..
+ navigate("/signup/auth/results/before");
+ } else {
+ message.error("필수 입력 항목을 모두 입력하세요.");
+ }
+ };
return (
{
id="storename"
placeholder="상호명 입력"
requiredname="storename"
+ onChange={handleStoreNameChange}
+ />
+
-
{
+ setStoreBusinessRegistration(file);
+ }}
/>
{
+ setStoreBusinessLicense(file);
+ }}
/>
{
+ setUserIdentification(file);
+ }}
/>
{
+ setUserPassbook(file);
+ }}
+ />
+
-
+
+ 승인요청 신청
+
);
};
diff --git a/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/CheckConsentForm.jsx b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/CheckConsentForm.jsx
new file mode 100644
index 0000000..d024fce
--- /dev/null
+++ b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/CheckConsentForm.jsx
@@ -0,0 +1,21 @@
+const CheckConsentForm = ({
+ personalInfoConsent,
+ onPersonalInfoConsentChange,
+}) => {
+ return (
+
+ {/* 약관 나오면 입히기 */}
+
+
+
+ );
+};
+
+export default CheckConsentForm;
diff --git a/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreAddress.jsx b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreAddress.jsx
new file mode 100644
index 0000000..d3c178a
--- /dev/null
+++ b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreAddress.jsx
@@ -0,0 +1,79 @@
+import { Modal } from "antd";
+import { useState } from "react";
+import DaumPostcode from "react-daum-postcode";
+
+const InputStoreAddress = ({
+ onZonecodeChange,
+ onZoneAddressChange,
+ onZoneAddressDetailChange,
+}) => {
+ const [zonecode, setZonecode] = useState("");
+ const [zoneAddress, setZoneAddress] = useState("");
+ const [openModal, setOpenModal] = useState(false);
+
+ const handleComplete = (data) => {
+ setZonecode(data.zonecode);
+ setZoneAddress(data.address);
+ onZonecodeChange(data.zonecode); // onZonecodeChange 함수를 호출하여 값 전달
+ onZoneAddressChange(data.address); // onZoneAddressChange 함수를 호출하여 값 전달
+ onOpenPostModal();
+ };
+
+ const onOpenPostModal = () => {
+ setOpenModal((prev) => !prev);
+ };
+
+ return (
+
+
+ {openModal && (
+
+
+
+ )}
+
+
+
onZoneAddressDetailChange(e.target.value)}
+ />
+
+ );
+};
+export default InputStoreAddress;
diff --git a/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreInformationText.jsx b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreInformationText.jsx
new file mode 100644
index 0000000..e22fde7
--- /dev/null
+++ b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreInformationText.jsx
@@ -0,0 +1,26 @@
+const InputStoreInformationText = ({
+ title,
+ id,
+ placeholder,
+ requiredname,
+ onChange,
+}) => {
+ return (
+
+ );
+};
+
+export default InputStoreInformationText;
diff --git a/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreInformationflie.jsx b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreInformationflie.jsx
new file mode 100644
index 0000000..28f37d1
--- /dev/null
+++ b/src/components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformationInputComponents/InputStoreInformationflie.jsx
@@ -0,0 +1,59 @@
+import { useState } from "react";
+
+const InputStoreInformationflie = ({ title, id, requiredname, onChange }) => {
+ const [selectedFile, setSelectedFile] = useState(null);
+ const [fileSizeError, setFileSizeError] = useState(false);
+ if (fileSizeError) {
+ console.log("파일크기 에러");
+ }
+ const InputFilesss = () => {
+ const handleFileChange = (event) => {
+ const file = event.target.files[0];
+
+ if (file && file.size <= 10 * 1024 * 1024) {
+ setSelectedFile(file);
+ onChange(file);
+ setFileSizeError(false);
+ } else {
+ setFileSizeError(true);
+ setSelectedFile(null);
+ onChange(null);
+ }
+ };
+
+ return (
+
+ );
+ };
+
+ return (
+
+
+
+
+ {
+ const inputFile = document.getElementById(id);
+ if (inputFile) {
+ inputFile.click();
+ }
+ }}
+ className="signup-page-content-store-input"
+ />
+
+
+ );
+};
+
+export default InputStoreInformationflie;
diff --git a/src/pages/Find/FindIdPage/NoneFindIdPage/NoneFindIdPage.jsx b/src/pages/Find/FindIdPage/NoneFindIdPage/NoneFindIdPage.jsx
index e7f36b1..0de273a 100644
--- a/src/pages/Find/FindIdPage/NoneFindIdPage/NoneFindIdPage.jsx
+++ b/src/pages/Find/FindIdPage/NoneFindIdPage/NoneFindIdPage.jsx
@@ -9,17 +9,17 @@ function NoneFindIdPage() {
const containerSize = is480
? ["25rem", "37.5rem", "4.13rem", "1.06rem"]
: ["31.3rem", "37.5rem", "5.56rem", "1.38rem"];
- useEffect(() => {
- const handleResize = () => {
- setIs480(window.innerWidth <= 480);
- };
-
- window.addEventListener("resize", handleResize);
-
- return () => {
- window.removeEventListener("resize", handleResize);
- };
- }, []);
+ useEffect(() => {
+ const handleResize = () => {
+ setIs480(window.innerWidth <= 480);
+ };
+
+ window.addEventListener("resize", handleResize);
+
+ return () => {
+ window.removeEventListener("resize", handleResize);
+ };
+ }, []);
return (
{
function LoginPage() {
const [is480, setIs480] = useState(window.innerWidth <= 480);
const containerSize = is480
- ? ["25rem", "37.5rem", "4.12rem", "3.63rem"]
- : ["31.3rem", "37.5rem", "5.69rem", "3.25rem"];
+ ? ["25rem", "37.5rem", "4.12rem", "3.63rem"]
+ : ["31.3rem", "37.5rem", "5.69rem", "3.25rem"];
useEffect(() => {
const handleResize = () => {
@@ -156,7 +156,7 @@ function LoginPage() {
diff --git a/src/pages/Signup/JudgeResults/JudgeResultsBeforePage.jsx b/src/pages/Signup/JudgeResults/JudgeResultsBeforePage.jsx
index 486f809..77a395a 100644
--- a/src/pages/Signup/JudgeResults/JudgeResultsBeforePage.jsx
+++ b/src/pages/Signup/JudgeResults/JudgeResultsBeforePage.jsx
@@ -1,43 +1,84 @@
-import CircleNumBar from "../../../components/signup/CircleNumBar/CircleNumBar";
-import RedButton from "../../../components/login/redButton/RedButton"
-import Container from "../../../components/login/Container/Container";
import logo from "../../../assets/icons/Big_LOGO.svg";
-import redyveryicon from "../../../assets/icons/img_readyVery.svg";
import kakaolinkedicon from "../../../assets/icons/icon_kakao.svg";
+import redyveryicon from "../../../assets/icons/img_readyVery.svg";
+import Container from "../../../components/login/Container/Container";
+import RedButton from "../../../components/login/redButton/RedButton";
+import CircleNumBar from "../../../components/signup/CircleNumBar/CircleNumBar";
// import basketicon from "../../../assets/icons/icon_basket.svg"; 크기 에러 해결되면 업로드
+import { useEffect, useState } from "react";
import "./JudgeResultsBeforePage.css";
-function JudgeResultsBeforePage () {
- const is480 = window.innerWidth <= 480;
- const containerSize = is480
- ? ["20rem", "30rem", "2.4rem"]
- : ["30rem", "40rem", "4.1rem"];
-
- return(
-
- {/* */}
-
-
-
입점 신청이 완료되었습니다
-
-
1~2일 이내로 담당자가 사장님께 전화를 드리거나
-
가게를 방문하여 입점을 도와드립니다.
-
궁금한 사항이나 도움이 필요하면 언제든지 문의해 주세요.
-
-
-
-
-
레디베이 상담
-
매일 00:00 ~ 24:00
-
-
-
+function JudgeResultsBeforePage() {
+ const [is480, setIs480] = useState(window.innerWidth <= 480);
+ const containerSize = is480
+ ? ["25rem", "37.5rem", "3rem", "2.28rem"]
+ : ["37.5rem", "50rem", "5.25rem", "3rem"];
+ useEffect(() => {
+ const handleResize = () => {
+ setIs480(window.innerWidth <= 480);
+ };
+
+ window.addEventListener("resize", handleResize);
+
+ return () => {
+ window.removeEventListener("resize", handleResize);
+ };
+ }, []);
+ return (
+
+ {/* */}
+
+
+
+ 입점 신청이 완료되었습니다
+
+
+
+ 1~2일 이내로{" "}
+
+ 담당자가 사장님께 전화를 드리거나
+
+
가게를 방문하여 입점을 도와드립니다.
+
+ 궁금한 사항이나 도움이 필요하면 언제든지 문의해 주세요.
+
+
+
+
+
+
+ 레디베이 상담
+
+
+ 매일 00:00 ~ 24:00
+
+
+
+
-
- 확인
-
-
-
- )
+
+ 확인
+
+
+
+ );
}
-export default JudgeResultsBeforePage;
\ No newline at end of file
+export default JudgeResultsBeforePage;
diff --git a/src/pages/Signup/Terms/TermsPage.jsx b/src/pages/Signup/Terms/TermsPage.jsx
index 0103976..167ff46 100644
--- a/src/pages/Signup/Terms/TermsPage.jsx
+++ b/src/pages/Signup/Terms/TermsPage.jsx
@@ -1,9 +1,11 @@
import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
import Container from "../../../components/login/Container/Container";
import RedButton from "../../../components/login/redButton/RedButton";
import "./TermsPage.css";
function TermsPage() {
+ const navigate = useNavigate();
const [is480, setIs480] = useState(window.innerWidth <= 480);
const containerSize = is480
? ["20rem", "30rem", "2.4rem"]
@@ -104,7 +106,9 @@ function TermsPage() {
- 확인
+ navigate(`/signup`)}>
+ 확인
+
diff --git a/src/pages/Signup/Verification/VerificationPage.css b/src/pages/Signup/Verification/VerificationPage.css
index 106d3c3..6fe6a4c 100644
--- a/src/pages/Signup/Verification/VerificationPage.css
+++ b/src/pages/Signup/Verification/VerificationPage.css
@@ -12,6 +12,7 @@
}
.signup-page-verification-next-button {
margin-top: 1rem;
+ width: 100%;
}
}
@@ -23,5 +24,6 @@
}
.signup-page-verification-next-button {
margin-top: 0.49rem;
+ width: 100%;
}
}
diff --git a/src/pages/Signup/Verification/VerificationPage.jsx b/src/pages/Signup/Verification/VerificationPage.jsx
index efc5c80..92f4c72 100644
--- a/src/pages/Signup/Verification/VerificationPage.jsx
+++ b/src/pages/Signup/Verification/VerificationPage.jsx
@@ -1,27 +1,26 @@
import { useEffect, useState } from "react";
import Container from "../../../components/login/Container/Container";
-import RedButton from "../../../components/login/redButton/RedButton";
import CircleNumBar from "../../../components/signup/CircleNumBar/CircleNumBar";
import UserInputStoreInformation from "../../../components/signup/UserInput/UserInputStoreInformation/UserInputStoreInformation";
import "./VerificationPage.css";
function VerificationPage() {
- const [is480, setIs480] = useState(window.innerWidth <= 480);
- const containerSize = is480
- ? ["25rem", "54.8rem", "1.81rem", "1.79rem"]
- : ["37.5rem", "90.7rem", "4.69rem", "3.94rem"];
-
- useEffect(() => {
- const handleResize = () => {
- setIs480(window.innerWidth <= 480);
- };
-
- window.addEventListener("resize", handleResize);
-
- return () => {
- window.removeEventListener("resize", handleResize);
- };
- }, []);
+ const [is480, setIs480] = useState(window.innerWidth <= 480);
+ const containerSize = is480
+ ? ["25rem", "54.8rem", "1.81rem", "1.79rem"]
+ : ["37.5rem", "90.7rem", "4.69rem", "3.94rem"];
+
+ useEffect(() => {
+ const handleResize = () => {
+ setIs480(window.innerWidth <= 480);
+ };
+
+ window.addEventListener("resize", handleResize);
+
+ return () => {
+ window.removeEventListener("resize", handleResize);
+ };
+ }, []);
return (
);