From 316a161b1b0169bb3e7d5df3b3b02e291a9b34d1 Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 22 Mar 2024 19:10:26 +0900 Subject: [PATCH 01/54] =?UTF-8?q?fix:=20=ED=9A=8C=EC=9B=90=EA=B0=80?= =?UTF-8?q?=EC=9E=85=20=EC=8B=9C=20=EC=82=AC=EC=A7=84=EC=9D=84=201?= =?UTF-8?q?=EC=9E=A5=20=EC=9D=B4=EC=83=81=20=EB=93=B1=EB=A1=9D=ED=95=98?= =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/Signup/hooks/useOwnerData.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/page/Auth/Signup/hooks/useOwnerData.ts b/src/page/Auth/Signup/hooks/useOwnerData.ts index 9be27c6b..12cb951f 100644 --- a/src/page/Auth/Signup/hooks/useOwnerData.ts +++ b/src/page/Auth/Signup/hooks/useOwnerData.ts @@ -171,8 +171,8 @@ export default function useCheckOwnerData(isMobile:boolean) { addFiles(watch('registerFiles')); }, validate: () => { - if (ownerData.registerFiles && ownerData.registerFiles.length < 3) { - return '파일을 3개 이상 첨부해주세요'; + if (ownerData.registerFiles && ownerData.registerFiles.length < 1) { + return '파일을 1개 이상 첨부해주세요'; } return true; }, From 83084e1887dd0fbe42536cc3ffd18cdecd09633b Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 22 Mar 2024 19:12:18 +0900 Subject: [PATCH 02/54] =?UTF-8?q?fix:=20=ED=9A=8C=EC=9B=90=EA=B0=80?= =?UTF-8?q?=EC=9E=85=20=EC=8B=9C=20=EC=82=AC=EC=A7=84=EC=9D=84=201?= =?UTF-8?q?=EA=B0=9C=20=EC=9D=B4=EC=83=81=20=EB=93=B1=EB=A1=9D=ED=95=98?= =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/Signup/hooks/useOwnerData.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/page/Auth/Signup/hooks/useOwnerData.ts b/src/page/Auth/Signup/hooks/useOwnerData.ts index 12cb951f..fb705c90 100644 --- a/src/page/Auth/Signup/hooks/useOwnerData.ts +++ b/src/page/Auth/Signup/hooks/useOwnerData.ts @@ -171,7 +171,7 @@ export default function useCheckOwnerData(isMobile:boolean) { addFiles(watch('registerFiles')); }, validate: () => { - if (ownerData.registerFiles && ownerData.registerFiles.length < 1) { + if (!ownerData.registerFiles) { return '파일을 1개 이상 첨부해주세요'; } return true; From 0059a2e002e505b423cc6eab4c60e622d457deaf Mon Sep 17 00:00:00 2001 From: hana Date: Fri, 22 Mar 2024 19:13:14 +0900 Subject: [PATCH 03/54] =?UTF-8?q?fix:=20reviewer=20=EC=98=88=EC=99=B8?= =?UTF-8?q?=EC=B2=98=EB=A6=AC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/PICK_REVIEWER.yml | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/.github/workflows/PICK_REVIEWER.yml b/.github/workflows/PICK_REVIEWER.yml index 1165ab1a..3608bde9 100644 --- a/.github/workflows/PICK_REVIEWER.yml +++ b/.github/workflows/PICK_REVIEWER.yml @@ -24,24 +24,24 @@ jobs: const prUrl = context.payload.pull_request.html_url; const prCreatorJson = developers.reviewers.find(person => person.githubName === prCreator); - if (developers.length <= 1) { - core.setOutput('reviewers', developers.reviewers[0]); - core.setOutput('writer', prCreatorJson.name); - core.setOutput('pullRequestLink', prUrl); + //PrCreator가 reviewer에 등록되지 않은 사람인 경우 + if (!prCreatorJson) { + const randomReviewer1 = developers[Math.floor(Math.random() * candidateInternalReviewers.length)]; + const randomReviewer2 = developers[Math.floor(Math.random() * candidateExternalReviewers.length)]; + core.setOutput('writer', JSON.stringify(prCreator)); } else { const candidateInternalReviewers = developers.reviewers.filter(person => person.team === prCreatorJson.team && person.githubName !== prCreator); const candidateExternalReviewers = developers.reviewers.filter(person => person.team !== prCreatorJson.team); - const randomReviewer1 = candidateInternalReviewers[Math.floor(Math.random() * candidateInternalReviewers.length)]; const randomReviewer2 = candidateExternalReviewers[Math.floor(Math.random() * candidateExternalReviewers.length)]; - - core.setOutput('reviewer1Name', JSON.stringify(randomReviewer1.name)); - core.setOutput('reviewer2Name', JSON.stringify(randomReviewer2.name)); - core.setOutput('reviewer1GithubName', randomReviewer1.githubName); - core.setOutput('reviewer2GithubName', randomReviewer2.githubName); core.setOutput('writer', JSON.stringify(prCreatorJson.name)); - core.setOutput('pullRequestLink', JSON.stringify(prUrl)); } + + core.setOutput('pullRequestLink', JSON.stringify(prUrl)); + core.setOutput('reviewer1Name', JSON.stringify(randomReviewer1.name)); + core.setOutput('reviewer2Name', JSON.stringify(randomReviewer2.name)); + core.setOutput('reviewer1GithubName', randomReviewer1.githubName); + core.setOutput('reviewer2GithubName', randomReviewer2.githubName); - name: test valiable uses: actions/github-script@v7 From e5ecf286d7a05ffc0f436bd341b4ce6399cbaeda Mon Sep 17 00:00:00 2001 From: hana Date: Fri, 22 Mar 2024 19:15:07 +0900 Subject: [PATCH 04/54] =?UTF-8?q?fix:=20reviewer=20=EC=98=88=EC=99=B8?= =?UTF-8?q?=EC=B2=98=EB=A6=AC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/PICK_REVIEWER.yml | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/.github/workflows/PICK_REVIEWER.yml b/.github/workflows/PICK_REVIEWER.yml index 3608bde9..fd9c6df6 100644 --- a/.github/workflows/PICK_REVIEWER.yml +++ b/.github/workflows/PICK_REVIEWER.yml @@ -26,8 +26,9 @@ jobs: //PrCreator가 reviewer에 등록되지 않은 사람인 경우 if (!prCreatorJson) { - const randomReviewer1 = developers[Math.floor(Math.random() * candidateInternalReviewers.length)]; - const randomReviewer2 = developers[Math.floor(Math.random() * candidateExternalReviewers.length)]; + const reviewerArr = developers.reviewers; + const randomReviewer1 = reviewerArr[Math.floor(Math.random() * reviewerArr.length)]; + const randomReviewer2 = reviewerArr[Math.floor(Math.random() * reviewerArr.length)]; core.setOutput('writer', JSON.stringify(prCreator)); } else { const candidateInternalReviewers = developers.reviewers.filter(person => person.team === prCreatorJson.team && person.githubName !== prCreator); From 3ccc2d0a02a8982e9c93969fabdd7252751dd4b5 Mon Sep 17 00:00:00 2001 From: dooohun Date: Fri, 22 Mar 2024 19:28:14 +0900 Subject: [PATCH 05/54] =?UTF-8?q?fix:=20https=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/Signup/utils/parseRegisterData.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/page/Auth/Signup/utils/parseRegisterData.ts b/src/page/Auth/Signup/utils/parseRegisterData.ts index 805d3e26..0c904078 100644 --- a/src/page/Auth/Signup/utils/parseRegisterData.ts +++ b/src/page/Auth/Signup/utils/parseRegisterData.ts @@ -11,7 +11,7 @@ const parseRegisterData = async ( ) => { const companyNumber = ownerInfo.registrationNumberMobile ? ownerInfo.registrationNumberMobile.replace(/^(\d{3})(\d{2})(\d+)/, '$1-$2-$3') : `${ownerInfo.registrationNumberFront}-${ownerInfo.registrationNumberMiddle}-${ownerInfo.registrationNumberEnd}`; const phoneNumber = ownerInfo.phoneMobile ? ownerInfo.phoneMobile.replace(/^(\d{3})(\d{4})(\d+)/, '$1-$2-$3') : `${ownerInfo.phoneFront}-${ownerInfo.phoneMiddle}-${ownerInfo.phoneEnd}`; - const attachmentUrls = fileUrls!.map((file) => ({ file_url: `https://${file}` })); + const attachmentUrls = fileUrls!.map((file) => ({ file_url: `${file}` })); const shopId = ownerInfo.shopName === searchShopState ? Number(selectedShopId) : null; const hashedPassword = await sha256(userInfo.password!); From adaa78fb9a102da279ad98a2e1257d002c23cb22 Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 22 Mar 2024 19:39:23 +0900 Subject: [PATCH 06/54] =?UTF-8?q?fix:=20=EB=AA=A8=EB=B0=94=EC=9D=BC=20?= =?UTF-8?q?=ED=99=94=EB=A9=B4=EC=97=90=EC=84=9C=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8=20=EC=8B=A4=ED=8C=A8=EC=8B=9C=20=EC=97=90=EB=9F=AC=20?= =?UTF-8?q?=EB=A9=94=EC=8B=9C=EC=A7=80=20=EC=B6=9C=EB=A0=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/Login/Login.module.scss | 12 ++++++------ src/page/Auth/Login/index.tsx | 7 ++++++- 2 files changed, 12 insertions(+), 7 deletions(-) diff --git a/src/page/Auth/Login/Login.module.scss b/src/page/Auth/Login/Login.module.scss index 380534ec..9ad18983 100644 --- a/src/page/Auth/Login/Login.module.scss +++ b/src/page/Auth/Login/Login.module.scss @@ -71,7 +71,7 @@ @include media.media-breakpoint-down(mobile) { border: none; - border-bottom: 1px solid #d2dae2; + border-bottom: 1px solid #f7941e; } } @@ -98,10 +98,6 @@ &__error-message { font-size: 12px; color: #f7941e; - - @include media.media-breakpoint-down(mobile) { - display: none; - } } &__icon { @@ -136,7 +132,7 @@ &--login { @include media.media-breakpoint-down(mobile) { background: #f7941e; - margin-top: 48px; + margin-top: 38px; } } } @@ -190,6 +186,10 @@ } } } + + &__error { + height: 10px; + } } .option { diff --git a/src/page/Auth/Login/index.tsx b/src/page/Auth/Login/index.tsx index 3d07c2cd..29db67ae 100644 --- a/src/page/Auth/Login/index.tsx +++ b/src/page/Auth/Login/index.tsx @@ -83,7 +83,7 @@ export default function Login() {
{(isError || !!isFormError) && ( -
{loginError || emailError}
+
{loginError || emailError}
)}
+
+ {isMobile && (isError || !!isFormError) && ( +
{loginError || emailError}
+ )} +
+ + + + + , + document.body, + ); +} diff --git a/src/page/Auth/Login/index.tsx b/src/page/Auth/Login/index.tsx index 29db67ae..668242a5 100644 --- a/src/page/Auth/Login/index.tsx +++ b/src/page/Auth/Login/index.tsx @@ -15,6 +15,7 @@ import sha256 from 'utils/ts/SHA-256'; import { useErrorMessageStore } from 'store/errorMessageStore'; import styles from './Login.module.scss'; import OPTION from './static/option'; +import ApprovalModal from './ApprovalModal'; export default function Login() { const { value: isBlind, changeValue: changeIsBlind } = useBooleanState(); @@ -23,8 +24,9 @@ export default function Login() { const { login, isError: isServerError } = useLogin(); const [isFormError, setIsFormError] = useState(false); const navigate = useNavigate(); - const { loginError } = useErrorMessageStore(); + const { loginError, loginErrorCode } = useErrorMessageStore(); const [emailError, setEmailError] = useState(''); + const { value: isModalOpen, changeValue: toggle } = useBooleanState(false); const isError = isServerError || isFormError; @@ -107,6 +109,7 @@ export default function Login() { [styles['form__button--login']]: true, })} type="submit" + onClick={toggle} > 로그인 @@ -132,6 +135,7 @@ export default function Login() { + {loginErrorCode === 100005 && isModalOpen && } ); } From ad75aa69c8c17739bd45f84b21789a97652fe63c Mon Sep 17 00:00:00 2001 From: "(hoooooony)" <(cjh41820@gmail.com)> Date: Thu, 28 Mar 2024 20:48:31 +0900 Subject: [PATCH 25/54] =?UTF-8?q?refactor:=20=EB=A9=94=EB=89=B4=20?= =?UTF-8?q?=EA=B0=80=EA=B2=A9=20=EB=8B=A8=EC=9D=BC=EB=A1=9C=EB=A7=8C=20?= =?UTF-8?q?=EC=9E=85=EB=A0=A5=ED=95=98=EB=8F=84=EB=A1=9D=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../MenuPrice/MenuPrice.module.scss | 5 +- .../AddMenu/components/MenuPrice/index.tsx | 246 +++--------------- src/page/ModifyMenu/ModifyMenu.module.scss | 2 +- 3 files changed, 38 insertions(+), 215 deletions(-) diff --git a/src/page/AddMenu/components/MenuPrice/MenuPrice.module.scss b/src/page/AddMenu/components/MenuPrice/MenuPrice.module.scss index 7de73a86..faf91011 100644 --- a/src/page/AddMenu/components/MenuPrice/MenuPrice.module.scss +++ b/src/page/AddMenu/components/MenuPrice/MenuPrice.module.scss @@ -220,6 +220,7 @@ display: flex; gap: 16px; align-items: center; + width: 100%; &__size-input { box-sizing: border-box; @@ -252,7 +253,7 @@ &__price-input-box { position: relative; box-sizing: border-box; - width: 335px; + width: 100%; height: 62px; border: 0.5px solid #858585; } @@ -260,7 +261,7 @@ &__price-input { text-align: right; box-sizing: border-box; - width: 303px; + width: 98%; height: 60px; padding: 16px; color: #252525; diff --git a/src/page/AddMenu/components/MenuPrice/index.tsx b/src/page/AddMenu/components/MenuPrice/index.tsx index b83c1588..cdb789c8 100644 --- a/src/page/AddMenu/components/MenuPrice/index.tsx +++ b/src/page/AddMenu/components/MenuPrice/index.tsx @@ -1,13 +1,5 @@ import useMediaQuery from 'utils/hooks/useMediaQuery'; import useAddMenuStore from 'store/addMenu'; -import { ReactComponent as PlusIcon } from 'assets/svg/main/plus.svg'; -import { ReactComponent as DeleteIcon } from 'assets/svg/addmenu/delete-icon.svg'; -import { ReactComponent as MobileDeleteIcon } from 'assets/svg/addmenu/mobile-delete-icon.svg'; -import { ReactComponent as MobileCheckCircleIcon } from 'assets/svg/addmenu/mobile-single-menu-check.svg'; -import { ReactComponent as CheckCircleIcon } from 'assets/svg/addmenu/single-menu-check.svg'; -import { ReactComponent as MobilePlusIcon } from 'assets/svg/addmenu/mobile-plus-icon.svg'; -import { ReactComponent as SelectedCheck } from 'assets/svg/addmenu/selected-check.svg'; -import { ReactComponent as MobileselectedCheck } from 'assets/svg/addmenu/mobile-single-menu-check-selected.svg'; import styles from './MenuPrice.module.scss'; interface MenuPriceProps { @@ -18,37 +10,11 @@ export default function MenuPrice({ isComplete }:MenuPriceProps) { const { isMobile } = useMediaQuery(); const { optionPrices, - setOptionPrices, isSingle, - setIsSingle, singlePrice, setSinglePrice, - resetOptionPrice, } = useAddMenuStore(); - const updatePriceInput = (index: number, field: string, newValue: string | number) => { - const updatedOptionPrices = (optionPrices || []).map( - (price, idx) => (index === idx ? { ...price, [field]: newValue } : price), - ); - setOptionPrices(updatedOptionPrices); - }; - - const addPriceInput = () => { - const newId = (optionPrices || []).length; - if (!isSingle) { - setOptionPrices([...(optionPrices || []), { id: newId, option: '', price: 0 }]); - } else { - setIsSingle(false); - } - }; - - const deletePriceInput = (index: number) => { - setOptionPrices((optionPrices || []).filter((_, idx) => idx !== index)); - }; - const handleIsSingleMenu = () => { - setIsSingle(!isSingle); - resetOptionPrice(); - }; return (
{isMobile ? ( @@ -58,116 +24,34 @@ export default function MenuPrice({ isComplete }:MenuPriceProps) {
가격
- {isSingle ? ( -
-
-
- {singlePrice} - 원 -
+
+
+
+ {singlePrice} + 원
- ) - : (optionPrices || []).map((input) => ( -
-
-
- {input.option} -
-
- / -
-
- {input.price} - 원 -
-
-
- ))} +
) : ( <>
가격
-
-
단일메뉴
- -
- {isSingle - ? ( -
-
- -
- setSinglePrice(e.target.value === '' ? 0 : Number(e.target.value))} - /> -

원

-
-
- -
- ) - : (optionPrices || []).map((input) => ( -
-
- updatePriceInput(input.id, 'option', e.target.value)} - disabled={isSingle} - /> -
- updatePriceInput(input.id, 'price', e.target.value)} - /> -

원

-
-
- +
+
+ +
+ setSinglePrice(e.target.value === '' ? 0 : Number(e.target.value))} + /> +

원

- ))} - +
+
)}
@@ -209,85 +93,23 @@ export default function MenuPrice({ isComplete }:MenuPriceProps) { <>
가격
-
-
단일메뉴
- -
+
- {isSingle - ? ( -
-
- -
- setSinglePrice(e.target.value === '' ? 0 : Number(e.target.value))} - /> -

원

-
-
- -
- ) - : (optionPrices || []).map((input) => ( -
-
- updatePriceInput(input.id, 'option', e.target.value)} - disabled={isSingle} - /> -
- updatePriceInput(input.id, 'price', e.target.value)} - /> -

원

-
-
- + +
+
+
+ setSinglePrice(e.target.value === '' ? 0 : Number(e.target.value))} + /> +

원

- ))} - +
+ +
)}
diff --git a/src/page/ModifyMenu/ModifyMenu.module.scss b/src/page/ModifyMenu/ModifyMenu.module.scss index 2ac079a7..3f64e51c 100644 --- a/src/page/ModifyMenu/ModifyMenu.module.scss +++ b/src/page/ModifyMenu/ModifyMenu.module.scss @@ -53,7 +53,7 @@ } &__button-check { - width: 226px; + width: 180px; height: 43px; flex-shrink: 0; background: #175c8e; From 34402e2540fd26436b0f87ac5c99945c357e54e7 Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Thu, 28 Mar 2024 22:21:13 +0900 Subject: [PATCH 26/54] =?UTF-8?q?refactor:=20=EA=B5=AC=EA=B8=80=20?= =?UTF-8?q?=EC=9E=90=EB=8F=99=EB=B2=88=EC=97=AD=20=EB=B0=A9=EC=A7=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/public/index.html b/public/index.html index 35a5fcbc..70a9baed 100644 --- a/public/index.html +++ b/public/index.html @@ -8,6 +8,7 @@ name="description" content="backoffice for koin's store owner" /> + From b25474ba779ff1f12c1f7b15bc7c0c3238f9e0f8 Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 29 Mar 2024 00:35:01 +0900 Subject: [PATCH 27/54] =?UTF-8?q?feat:=20=EB=8B=A4=EC=A4=91=20=EC=97=85?= =?UTF-8?q?=EB=A1=9C=EB=93=9C=20=EC=BB=A4=EC=8A=A4=ED=85=80=20=ED=9B=85=20?= =?UTF-8?q?=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/hooks/useImagesUpload.ts | 75 ++++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 src/utils/hooks/useImagesUpload.ts diff --git a/src/utils/hooks/useImagesUpload.ts b/src/utils/hooks/useImagesUpload.ts new file mode 100644 index 00000000..2bce11f4 --- /dev/null +++ b/src/utils/hooks/useImagesUpload.ts @@ -0,0 +1,75 @@ +import { uploadFile } from 'api/uploadFile/Uploadfile'; +import { useRef, useState } from 'react'; +import showToast from 'utils/ts/showToast'; + +// 정의할 수 있는 에러 타입 +type UploadError = '413' | '415' | '404' | '422' | 'networkError' | '401' | ''; + +/* eslint-disable */ +export default function useImagesUpload() { + const [imageFile, setImageFile] = useState([]); + const [uploadError, setUploadError] = useState(''); + const imgRef = useRef(null); + + const saveImgFile = async () => { + const files = imgRef.current?.files; + + if (files && files.length > 3) { + showToast('error', '파일은 3개까지 등록할 수 있습니다.') + return; + } + if (files && files.length) { + const uploadedFiles: string[] = []; + const maxSize = 1024 * 1024 * 10; // 10 MB limit for each file + const correctForm = new RegExp('(.*?)\\.(jpg|jpeg|gif|bmp|png)$'); + + for (let i = 0; i < files.length; i++) { + const file = files[i]; + + if (file.size > maxSize) { + setUploadError('413'); // File size too large + setImageFile([]); + return; + } + + if (!correctForm.test(file.name)) { + setUploadError('415'); // Unsupported file type + setImageFile([]); + return; + } + + const formData = new FormData(); + formData.append('multipartFile', file); + + try { + const data = await uploadFile(formData); + if (data?.data?.file_url) { + uploadedFiles.push(data.data.file_url); + } + } catch (error: any) { + setImageFile([]); + const errorMessage = error.toString(); + if (errorMessage.includes('415')) { + setUploadError('415'); + } else if (errorMessage.includes('404')) { + setUploadError('404'); + } else if (errorMessage.includes('422')) { + setUploadError('422'); + } else if (errorMessage.includes('Network Error')) { + setUploadError('networkError'); + } else { + setUploadError('401'); + } + return; + } + } + + setImageFile(uploadedFiles); + setUploadError(''); + } + }; + + return { + imageFile, imgRef, saveImgFile, uploadError, + }; +} From 175e15f4b29a1d98a356cf4cb07a695026005142 Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 29 Mar 2024 00:35:24 +0900 Subject: [PATCH 28/54] =?UTF-8?q?refactor:=20pc=20=EB=B0=8F=20=EB=AA=A8?= =?UTF-8?q?=EB=B0=94=EC=9D=BC=20=EB=B2=84=EC=A0=84=20=EB=A9=94=EB=89=B4=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80=EC=97=90=20=EB=8B=A4=EC=A4=91=20=EC=9D=B4?= =?UTF-8?q?=EB=AF=B8=EC=A7=80=20=EC=97=85=EB=A1=9C=EB=93=9C=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/AddMenuImgModal/index.tsx | 15 ++++--- .../AddMenu/components/MenuImage/index.tsx | 44 ++++++++++--------- src/store/addMenu.ts | 4 ++ 3 files changed, 35 insertions(+), 28 deletions(-) diff --git a/src/page/AddMenu/components/AddMenuImgModal/index.tsx b/src/page/AddMenu/components/AddMenuImgModal/index.tsx index 31b5bb1c..0de66a5d 100644 --- a/src/page/AddMenu/components/AddMenuImgModal/index.tsx +++ b/src/page/AddMenu/components/AddMenuImgModal/index.tsx @@ -2,9 +2,9 @@ import React, { useEffect } from 'react'; import { createPortal } from 'react-dom'; import { ReactComponent as CancelIcon } from 'assets/svg/addmenu/mobile-cancle-icon.svg'; import useAddMenuStore from 'store/addMenu'; -import useImageUpload from 'utils/hooks/useImageUpload'; import ErrorMessage from 'page/Auth/Signup/component/ErrorMessage'; -import { ERRORMESSAGE } from 'page/ShopRegistration/constant/errorMessage'; import styles from './AddMenuImgModal.module.scss'; +import { ERRORMESSAGE } from 'page/ShopRegistration/constant/errorMessage'; import useImagesUpload from 'utils/hooks/useImagesUpload'; +import styles from './AddMenuImgModal.module.scss'; interface AddMenuImgModalProps { isOpen: boolean; @@ -12,10 +12,11 @@ interface AddMenuImgModalProps { } export default function AddMenuImgModal({ isOpen, closeModal }: AddMenuImgModalProps) { - const { setImageUrl } = useAddMenuStore(); + const { setImageUrls } = useAddMenuStore(); + const { imageFile, imgRef, saveImgFile, uploadError, - } = useImageUpload(); + } = useImagesUpload(); const triggerFileInput = () => { imgRef.current?.click(); @@ -28,10 +29,10 @@ export default function AddMenuImgModal({ isOpen, closeModal }: AddMenuImgModalP }; useEffect(() => { if (imageFile && !uploadError) { - setImageUrl(imageFile); + setImageUrls(imageFile); closeModal(); } - }, [imageFile, uploadError, setImageUrl, closeModal]); + }, [imageFile, uploadError, setImageUrls, closeModal]); if (!isOpen) return null; @@ -44,7 +45,7 @@ export default function AddMenuImgModal({ isOpen, closeModal }: AddMenuImgModalP 이미지 추가 메뉴 사진을 추가할 수 있습니다.
- +
diff --git a/src/page/AddMenu/components/MenuImage/index.tsx b/src/page/AddMenu/components/MenuImage/index.tsx index 91a83cf3..b4129da7 100644 --- a/src/page/AddMenu/components/MenuImage/index.tsx +++ b/src/page/AddMenu/components/MenuImage/index.tsx @@ -5,9 +5,9 @@ import useMediaQuery from 'utils/hooks/useMediaQuery'; import useBooleanState from 'utils/hooks/useBooleanState'; import AddMenuImgModal from 'page/AddMenu/components/AddMenuImgModal'; import useAddMenuStore from 'store/addMenu'; -import useImageUpload from 'utils/hooks/useImageUpload'; import ErrorMessage from 'page/Auth/Signup/component/ErrorMessage'; import { ERRORMESSAGE } from 'page/ShopRegistration/constant/errorMessage'; +import useImagesUpload from 'utils/hooks/useImagesUpload'; import styles from './MenuImage.module.scss'; interface MenuImageProps { @@ -16,15 +16,16 @@ interface MenuImageProps { export default function MenuImage({ isComplete }: MenuImageProps) { const { isMobile } = useMediaQuery(); - const { imageUrl, setImageUrl, removeImageUrl } = useAddMenuStore(); + const { imageUrl, setImageUrls, removeImageUrl } = useAddMenuStore(); const { value: isAddMenuImgModal, setTrue: openAddMenuImgModal, setFalse: closeAddMenuImgModal, } = useBooleanState(false); + const { imageFile, imgRef, saveImgFile, uploadError, - } = useImageUpload(); + } = useImagesUpload(); const handleAddImage = () => { imgRef.current?.click(); }; @@ -36,9 +37,9 @@ export default function MenuImage({ isComplete }: MenuImageProps) { }; useEffect(() => { if (imageFile) { - setImageUrl(imageFile); + setImageUrls(imageFile); } - }, [imageFile, setImageUrl]); + }, [imageFile, setImageUrls]); return (
{isMobile ? ( @@ -52,14 +53,14 @@ export default function MenuImage({ isComplete }: MenuImageProps) {
{`Selected {!isComplete && ( - + )}
))} @@ -88,14 +89,14 @@ export default function MenuImage({ isComplete }: MenuImageProps) {
{`Selected {!isComplete && ( - + )}
))} @@ -114,6 +115,7 @@ export default function MenuImage({ isComplete }: MenuImageProps) { style={{ display: 'none' }} onChange={handleImageChange} ref={imgRef} + multiple />
diff --git a/src/store/addMenu.ts b/src/store/addMenu.ts index eefc8e79..f064a97e 100644 --- a/src/store/addMenu.ts +++ b/src/store/addMenu.ts @@ -19,6 +19,7 @@ interface AddMenuStore { setCategoryIds: (categoryIds: number[]) => void; setDescription: (description: string) => void; setImageUrl: (newImageUrl: string) => void; + setImageUrls: (newImageUrls: string[]) => void, removeImageUrl: (imageUrlToRemove: string) => void; setIsSingle: (isSingle: boolean) => void; setName: (name: string) => void; @@ -45,6 +46,9 @@ const useAddMenuStore = create((set) => ({ setImageUrl: (newImageUrl) => set((state) => ({ imageUrl: [...state.imageUrl, newImageUrl], })), + setImageUrls: (newImageUrl) => set((state) => ({ + imageUrl: [...state.imageUrl, ...newImageUrl], + })), removeImageUrl: (imageUrlToRemove) => set((state) => ({ imageUrl: state.imageUrl.filter((img) => img !== imageUrlToRemove), })), From 10f055dd6c4826e9c42d90c9c1b003fb5d6590ce Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 29 Mar 2024 00:39:14 +0900 Subject: [PATCH 29/54] =?UTF-8?q?refactor:=203=EA=B0=9C=EC=9D=98=20?= =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EC=97=85=EB=A1=9C=EB=93=9C=20?= =?UTF-8?q?=ED=9B=84=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EC=97=85=EB=A1=9C?= =?UTF-8?q?=EB=93=9C=20=EC=8B=9C=20=EC=97=90=EB=9F=AC=20=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/hooks/useImagesUpload.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/utils/hooks/useImagesUpload.ts b/src/utils/hooks/useImagesUpload.ts index 2bce11f4..2088060c 100644 --- a/src/utils/hooks/useImagesUpload.ts +++ b/src/utils/hooks/useImagesUpload.ts @@ -14,10 +14,11 @@ export default function useImagesUpload() { const saveImgFile = async () => { const files = imgRef.current?.files; - if (files && files.length > 3) { + if (files && (files.length > 3 || imageFile.length >= 3)) { showToast('error', '파일은 3개까지 등록할 수 있습니다.') return; } + if (files && files.length) { const uploadedFiles: string[] = []; const maxSize = 1024 * 1024 * 10; // 10 MB limit for each file From c36d07475e301952304cb180e8af8b02ce460f45 Mon Sep 17 00:00:00 2001 From: hana Date: Fri, 29 Mar 2024 00:55:34 +0900 Subject: [PATCH 30/54] =?UTF-8?q?fix:=20error=20type=20=EC=83=81=EC=88=98?= =?UTF-8?q?=20=EC=BB=A8=EB=B2=A4=EC=85=98=EC=9C=BC=EB=A1=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/index.ts | 4 ++-- src/model/error/index.ts | 4 ++-- src/utils/ts/isKoinError.ts | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/api/index.ts b/src/api/index.ts index 77d3aa8e..4bc1c746 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -64,14 +64,14 @@ function createKoinErrorFromAxiosError(error: AxiosError): KoinError if (isAxiosErrorWithResponseData(error)) { const koinError = error.response!; return { - type: 'koin-error', + type: 'KOIN_ERROR', status: koinError.status, code: koinError.data.code, message: koinError.data.message, }; } return { - type: 'axios-error', + type: 'AXIOS_ERROR', ...error, }; } diff --git a/src/model/error/index.ts b/src/model/error/index.ts index 60926a28..ecf34591 100644 --- a/src/model/error/index.ts +++ b/src/model/error/index.ts @@ -1,12 +1,12 @@ import { AxiosError } from 'axios'; export interface KoinError { - type: 'koin-error'; + type: 'KOIN_ERROR'; status: number; code: number; message: string; } export interface CustomAxiosError extends AxiosError { - type: 'axios-error'; + type: 'AXIOS_ERROR'; } diff --git a/src/utils/ts/isKoinError.ts b/src/utils/ts/isKoinError.ts index 04642db7..f3efde8a 100644 --- a/src/utils/ts/isKoinError.ts +++ b/src/utils/ts/isKoinError.ts @@ -3,7 +3,7 @@ import { KoinError } from 'model/error'; export function isKoinError(error: unknown): error is KoinError { try { // 코인 서버 에러인지 아닌지를 확인 - return (error as KoinError).type === 'koin-error'; + return (error as KoinError).type === 'KOIN_ERROR'; } catch { return false; } From a5632839dcc9c5a86e77b1dfa4fd4f3eda470aec Mon Sep 17 00:00:00 2001 From: Daeeui Kim Date: Fri, 29 Mar 2024 14:36:26 +0900 Subject: [PATCH 31/54] =?UTF-8?q?fix:=20useLogin=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/query/auth.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/query/auth.ts b/src/query/auth.ts index a4967bb4..8d2275d7 100644 --- a/src/query/auth.ts +++ b/src/query/auth.ts @@ -64,9 +64,7 @@ export const useLogin = () => { sessionStorage.removeItem('access_token'); localStorage.removeItem('refresh_token'); setLoginError(err.message || '로그인에 실패했습니다.'); - if (err.response?.data && 'code' in err.response.data) { - setLoginErrorCode(err.response?.data?.code as number); - } + setLoginErrorCode(err.code); } }, }); From 52f4512abdc9c559fc483d8fe2fc96de86b711b9 Mon Sep 17 00:00:00 2001 From: Daeeui Kim Date: Fri, 29 Mar 2024 15:33:06 +0900 Subject: [PATCH 32/54] =?UTF-8?q?fix:=20singlePrice=20=ED=83=80=EC=9E=85?= =?UTF-8?q?=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/store/addMenu.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/store/addMenu.ts b/src/store/addMenu.ts index eefc8e79..da643247 100644 --- a/src/store/addMenu.ts +++ b/src/store/addMenu.ts @@ -15,7 +15,7 @@ interface AddMenuStore { isSingle: boolean; name: string; optionPrices: OptionPrices[] | null; - singlePrice: number | null; + singlePrice: number; setCategoryIds: (categoryIds: number[]) => void; setDescription: (description: string) => void; setImageUrl: (newImageUrl: string) => void; @@ -79,7 +79,7 @@ const useAddMenuStore = create((set) => ({ isSingle: menuData.is_single, name: menuData.name, optionPrices: newOptionPrices, - singlePrice: 'single_price' in menuData ? menuData.single_price : null, + singlePrice: menuData.single_price !== null ? menuData.single_price : undefined, }); } }, From bcdc817b7824bf620fe28594f3eb5ade28164247 Mon Sep 17 00:00:00 2001 From: Daeeui Kim Date: Fri, 29 Mar 2024 15:33:32 +0900 Subject: [PATCH 33/54] =?UTF-8?q?feat:=20showToast=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/AddMenu/hook/useFormValidation.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/page/AddMenu/hook/useFormValidation.ts b/src/page/AddMenu/hook/useFormValidation.ts index 6afc46b4..f1331a19 100644 --- a/src/page/AddMenu/hook/useFormValidation.ts +++ b/src/page/AddMenu/hook/useFormValidation.ts @@ -1,5 +1,6 @@ import useAddMenuStore from 'store/addMenu'; import { useErrorMessageStore } from 'store/errorMessageStore'; +import showToast from 'utils/ts/showToast'; const useFormValidation = () => { const { setMenuError, setCategoryError } = useErrorMessageStore(); @@ -10,6 +11,7 @@ const useFormValidation = () => { if (name.length === 0) { setMenuError('메뉴명을 입력해주세요.'); + showToast('error', '메뉴명을 입력해주세요.'); isValid = false; } else { setMenuError(''); @@ -17,6 +19,7 @@ const useFormValidation = () => { if (categoryIds.length === 0) { setCategoryError('카테고리를 1개 이상 선택해주세요.'); + showToast('error', '카테고리를 1개 이상 선택해주세요.'); isValid = false; } else { setCategoryError(''); From a9f84b3caddb4b331a8dcb40955c76dbf65f3240 Mon Sep 17 00:00:00 2001 From: Daeeui Kim Date: Fri, 29 Mar 2024 15:34:02 +0900 Subject: [PATCH 34/54] =?UTF-8?q?feat:=20=EC=97=90=EB=9F=AC=20css=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AddMenu/components/MenuName/MenuName.module.scss | 8 ++++++++ src/page/AddMenu/components/MenuName/index.tsx | 11 +++++++++-- src/page/AddMenu/components/MenuPrice/index.tsx | 6 ++---- 3 files changed, 19 insertions(+), 6 deletions(-) diff --git a/src/page/AddMenu/components/MenuName/MenuName.module.scss b/src/page/AddMenu/components/MenuName/MenuName.module.scss index 3b76b940..8916328d 100644 --- a/src/page/AddMenu/components/MenuName/MenuName.module.scss +++ b/src/page/AddMenu/components/MenuName/MenuName.module.scss @@ -25,6 +25,10 @@ font-size: 13px; font-weight: 400; } + + &--error { + border: 0.5px #f7941e solid; + } } &__name-text { @@ -67,6 +71,10 @@ font-size: 20px; font-weight: 400; } + + &--error { + border: 0.5px #f7941e solid; + } } .name-text { diff --git a/src/page/AddMenu/components/MenuName/index.tsx b/src/page/AddMenu/components/MenuName/index.tsx index a26499a7..56fa9fd5 100644 --- a/src/page/AddMenu/components/MenuName/index.tsx +++ b/src/page/AddMenu/components/MenuName/index.tsx @@ -1,6 +1,7 @@ import useMediaQuery from 'utils/hooks/useMediaQuery'; import useAddMenuStore from 'store/addMenu'; import { useErrorMessageStore } from 'store/errorMessageStore'; +import cn from 'utils/ts/className'; import styles from './MenuName.module.scss'; interface MenuNameProps { @@ -27,7 +28,10 @@ export default function MenuName({ isComplete }: MenuNameProps) { {name} ) : ( {name} ) : ( setSinglePrice(e.target.value === '' ? 0 : Number(e.target.value))} + value={singlePrice} + onChange={(e) => setSinglePrice(Number(e.target.value))} />

원

@@ -93,9 +93,7 @@ export default function MenuPrice({ isComplete }:MenuPriceProps) { <>
가격
-
-
From c3e4cd73c6443599a7d49d914145646539c940f6 Mon Sep 17 00:00:00 2001 From: Daeeui Kim Date: Fri, 29 Mar 2024 15:37:47 +0900 Subject: [PATCH 35/54] =?UTF-8?q?fix:=20=EB=AA=A8=EB=B0=94=EC=9D=BC=20?= =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EC=B6=94=EA=B0=80=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=EC=9C=84=EC=B9=98=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/AddMenu/components/MenuImage/index.tsx | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/page/AddMenu/components/MenuImage/index.tsx b/src/page/AddMenu/components/MenuImage/index.tsx index 91a83cf3..56d72131 100644 --- a/src/page/AddMenu/components/MenuImage/index.tsx +++ b/src/page/AddMenu/components/MenuImage/index.tsx @@ -48,6 +48,14 @@ export default function MenuImage({ isComplete }: MenuImageProps) {
(최대 이미지 3장)
+ {imageUrl.map((image, index) => (
{`Selected @@ -63,14 +71,6 @@ export default function MenuImage({ isComplete }: MenuImageProps) { )}
))} -
Date: Fri, 29 Mar 2024 15:43:17 +0900 Subject: [PATCH 36/54] =?UTF-8?q?fix:=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?= =?UTF-8?q?=EC=97=85=EB=A1=9C=EB=93=9C=20=EC=8B=9C=20=EC=98=A4=EB=A5=98?= =?UTF-8?q?=EA=B0=80=20=EB=B0=9C=EC=83=9D=ED=96=88=EC=9D=84=EB=95=8C=20?= =?UTF-8?q?=EC=9D=B4=EB=AF=B8=20=EC=97=85=EB=A1=9C=EB=93=9C=ED=95=9C=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=EC=9D=B4=20=EC=82=AC=EB=9D=BC=EC=A7=80?= =?UTF-8?q?=EB=8A=94=20=ED=98=84=EC=83=81=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/hooks/useImagesUpload.ts | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/utils/hooks/useImagesUpload.ts b/src/utils/hooks/useImagesUpload.ts index 2088060c..8b48c105 100644 --- a/src/utils/hooks/useImagesUpload.ts +++ b/src/utils/hooks/useImagesUpload.ts @@ -24,18 +24,16 @@ export default function useImagesUpload() { const maxSize = 1024 * 1024 * 10; // 10 MB limit for each file const correctForm = new RegExp('(.*?)\\.(jpg|jpeg|gif|bmp|png)$'); - for (let i = 0; i < files.length; i++) { + for (let i = 0; i < files.length; i += 1) { const file = files[i]; if (file.size > maxSize) { - setUploadError('413'); // File size too large - setImageFile([]); + setUploadError('413'); // 파일 사이즈가 너무 큰 경우 return; } if (!correctForm.test(file.name)) { - setUploadError('415'); // Unsupported file type - setImageFile([]); + setUploadError('415'); // 지원하지 않는 타입 에러 return; } From ebabfe901648c73c6d8dd66377a983ff525fd314 Mon Sep 17 00:00:00 2001 From: chaeseungyun Date: Fri, 29 Mar 2024 15:53:38 +0900 Subject: [PATCH 37/54] =?UTF-8?q?refactor:=20=ED=8C=8C=EC=9D=BC=ED=81=AC?= =?UTF-8?q?=EA=B8=B0=20=EB=B3=80=EC=88=98=EB=AA=85=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/hooks/useImagesUpload.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/utils/hooks/useImagesUpload.ts b/src/utils/hooks/useImagesUpload.ts index 8b48c105..bb332c3b 100644 --- a/src/utils/hooks/useImagesUpload.ts +++ b/src/utils/hooks/useImagesUpload.ts @@ -5,6 +5,8 @@ import showToast from 'utils/ts/showToast'; // 정의할 수 있는 에러 타입 type UploadError = '413' | '415' | '404' | '422' | 'networkError' | '401' | ''; +const MAXSIZE = 1024 * 1024 * 10; + /* eslint-disable */ export default function useImagesUpload() { const [imageFile, setImageFile] = useState([]); @@ -21,13 +23,12 @@ export default function useImagesUpload() { if (files && files.length) { const uploadedFiles: string[] = []; - const maxSize = 1024 * 1024 * 10; // 10 MB limit for each file const correctForm = new RegExp('(.*?)\\.(jpg|jpeg|gif|bmp|png)$'); for (let i = 0; i < files.length; i += 1) { const file = files[i]; - if (file.size > maxSize) { + if (file.size > MAXSIZE) { setUploadError('413'); // 파일 사이즈가 너무 큰 경우 return; } From 3d4c50a7ef5e61c2ccf3626474b9565297ec1251 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Wed, 3 Apr 2024 01:32:15 +0900 Subject: [PATCH 38/54] =?UTF-8?q?feat:=20=EC=98=81=EC=96=91=EC=82=AC?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/App.tsx b/src/App.tsx index 38170254..54b1cebd 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -13,6 +13,7 @@ import PageNotFound from 'page/Error/PageNotFound'; import ModifyMenu from 'page/ModifyMenu'; import { Suspense } from 'react'; import Toast from 'component/common/Toast'; +import Coop from 'page/Coop'; function App() { return ( @@ -28,6 +29,7 @@ function App() { } /> } /> } /> + } /> }> } /> From 7f349ea601f7723624d9f1df45e4efcd77b15831 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Wed, 3 Apr 2024 01:33:16 +0900 Subject: [PATCH 39/54] =?UTF-8?q?feat:=20=EC=98=81=EC=96=91=EC=82=AC?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20API?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/coop/index.ts | 6 ++++++ src/model/Coop/index.ts | 17 +++++++++++++++++ src/query/coop.ts | 16 ++++++++++++++++ 3 files changed, 39 insertions(+) create mode 100644 src/api/coop/index.ts create mode 100644 src/model/Coop/index.ts create mode 100644 src/query/coop.ts diff --git a/src/api/coop/index.ts b/src/api/coop/index.ts new file mode 100644 index 00000000..050b08cc --- /dev/null +++ b/src/api/coop/index.ts @@ -0,0 +1,6 @@ +import { accessClient } from 'api'; + +export const getDining = async () => { + const { data } = await accessClient.get('/dinings'); + return data; +}; diff --git a/src/model/Coop/index.ts b/src/model/Coop/index.ts new file mode 100644 index 00000000..6028444e --- /dev/null +++ b/src/model/Coop/index.ts @@ -0,0 +1,17 @@ +import z from 'zod'; + +export type Menus = '아침' | '점심' | '저녁'; + +export const Dinings = z.object({ + date: z.string(), + id: z.number(), + kcal: z.number(), + menu: z.array(z.string()), + place: z.string(), + price_card: z.number(), + price_cash: z.number(), + type: z.string(), + updated_at: z.string(), +}); + +export type Dinings = z.infer; diff --git a/src/query/coop.ts b/src/query/coop.ts new file mode 100644 index 00000000..47939dd5 --- /dev/null +++ b/src/query/coop.ts @@ -0,0 +1,16 @@ +import { useQueryClient, useSuspenseQuery } from '@tanstack/react-query'; +import { getDining } from 'api/coop'; +import { Dinings } from 'model/Coop'; + +export const useGetDining = () => { + const queryClient = useQueryClient(); + const { data } = useSuspenseQuery( + { + queryKey: ['dining'], + queryFn: getDining, + }, + ); + return { + data, + }; +}; From ba52f271e6d71909d23a0aa022f4d2bd6e08a72f Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Wed, 3 Apr 2024 01:33:42 +0900 Subject: [PATCH 40/54] =?UTF-8?q?feat:=20=EC=98=81=EC=96=91=EC=82=AC?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/component/common/Header/index.tsx | 2 +- src/page/Coop/Coop.module.scss | 42 +++++++++++++++ .../components/MenuCard/MenuCard.module.scss | 48 +++++++++++++++++ src/page/Coop/components/MenuCard/index.tsx | 44 ++++++++++++++++ .../components/MenuType/MenuType.module.scss | 34 ++++++++++++ src/page/Coop/components/MenuType/index.tsx | 52 +++++++++++++++++++ .../SoldoutToggle/SoldoutToggle.module.scss | 15 ++++++ .../Coop/components/SoldoutToggle/index.tsx | 17 ++++++ src/page/Coop/index.tsx | 15 ++++++ 9 files changed, 268 insertions(+), 1 deletion(-) create mode 100644 src/page/Coop/Coop.module.scss create mode 100644 src/page/Coop/components/MenuCard/MenuCard.module.scss create mode 100644 src/page/Coop/components/MenuCard/index.tsx create mode 100644 src/page/Coop/components/MenuType/MenuType.module.scss create mode 100644 src/page/Coop/components/MenuType/index.tsx create mode 100644 src/page/Coop/components/SoldoutToggle/SoldoutToggle.module.scss create mode 100644 src/page/Coop/components/SoldoutToggle/index.tsx create mode 100644 src/page/Coop/index.tsx diff --git a/src/component/common/Header/index.tsx b/src/component/common/Header/index.tsx index ba553a3a..e98a1d5f 100644 --- a/src/component/common/Header/index.tsx +++ b/src/component/common/Header/index.tsx @@ -89,7 +89,7 @@ function Header() { )} - {pathname === '/' ? ( + {pathname === '/' || pathname === '/coop' ? ( ) : (CATEGORY .flatMap((categoryValue) => categoryValue.submenu) diff --git a/src/page/Coop/Coop.module.scss b/src/page/Coop/Coop.module.scss new file mode 100644 index 00000000..e1772022 --- /dev/null +++ b/src/page/Coop/Coop.module.scss @@ -0,0 +1,42 @@ +.container { + display: flex; + flex-direction: column; + background-color: #f5f5f5; + width: 390px; + height: 100vh; +} + +.place { + &__container { + display: flex; + align-items: center; + gap: 8px; + margin-top: 24px; + margin-left: 24px; + } + + &__button--selected { + width: 60px; + height: 30px; + background-color: #175c8e; + color: #fff; + display: flex; + align-items: center; + justify-content: center; + border-radius: 999px; + cursor: pointer; + } + + &__button--unselected { + width: 60px; + height: 30px; + background-color: #fff; + color: #175c8e; + display: flex; + align-items: center; + justify-content: center; + border: solid 1px #175c8e; + border-radius: 999px; + cursor: pointer; + } +} diff --git a/src/page/Coop/components/MenuCard/MenuCard.module.scss b/src/page/Coop/components/MenuCard/MenuCard.module.scss new file mode 100644 index 00000000..be13b791 --- /dev/null +++ b/src/page/Coop/components/MenuCard/MenuCard.module.scss @@ -0,0 +1,48 @@ +.container { + display: flex; + flex-direction: column; +} + +.card { + display: flex; + flex-direction: column; + background-color: #fff; + + &__header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1rem; + border-bottom: 1px solid #e0e0e0; + } + + &__title { + font-size: 18px; + font-weight: 500; + } + + &__content { + display: flex; + flex-direction: column; + font-size: 12px; + font-weight: 400; + line-height: 15px; + } + + &__image { + width: 150px; + } + + &__wrapper { + display: flex; + align-items: center; + justify-content: space-between; + padding: 12px; + } + + &__soldout { + color: #8e8e8e; + font-size: 13px; + font-weight: 400; + } +} diff --git a/src/page/Coop/components/MenuCard/index.tsx b/src/page/Coop/components/MenuCard/index.tsx new file mode 100644 index 00000000..baf8d3bc --- /dev/null +++ b/src/page/Coop/components/MenuCard/index.tsx @@ -0,0 +1,44 @@ +import { useGetDining } from 'query/coop'; +import { Menus } from 'model/Coop'; +import SoldoutToggle from 'page/Coop/components/SoldoutToggle'; +import styles from './MenuCard.module.scss'; + +interface MenuCardProps { + selectedMenuType: Menus; +} + +export default function MenuCard({ selectedMenuType }: MenuCardProps) { + const { data } = useGetDining(); + return ( +
+
+

{selectedMenuType}

+
+
+
+
+ A코너 +
+ 품절 + +
+
+
+
이미지공간
+
+ 피자 + 치킨 +
+
+ +
+ {data?.map((menu:any) => ( +
+

{menu.place}

+

{menu.menu.join(', ')}

+
+ ))} +
+
+ ); +} diff --git a/src/page/Coop/components/MenuType/MenuType.module.scss b/src/page/Coop/components/MenuType/MenuType.module.scss new file mode 100644 index 00000000..01475c7e --- /dev/null +++ b/src/page/Coop/components/MenuType/MenuType.module.scss @@ -0,0 +1,34 @@ +.place { + &__container { + display: flex; + align-items: center; + gap: 8px; + margin-top: 24px; + margin-left: 24px; + } + + &__button--selected { + width: 60px; + height: 30px; + background-color: #175c8e; + color: #fff; + display: flex; + align-items: center; + justify-content: center; + border-radius: 999px; + cursor: pointer; + } + + &__button--unselected { + width: 60px; + height: 30px; + background-color: #fff; + color: #175c8e; + display: flex; + align-items: center; + justify-content: center; + border: solid 1px #175c8e; + border-radius: 999px; + cursor: pointer; + } +} diff --git a/src/page/Coop/components/MenuType/index.tsx b/src/page/Coop/components/MenuType/index.tsx new file mode 100644 index 00000000..1c291adb --- /dev/null +++ b/src/page/Coop/components/MenuType/index.tsx @@ -0,0 +1,52 @@ +import { useState } from 'react'; +import cn from 'utils/ts/className'; +import { Menus } from 'model/Coop'; +import styles from './MenuType.module.scss'; + +interface MenuTypeProps { + selectedMenuType: Menus; + setSelectedMenuType: (menuType: Menus) => void; +} + +export default function MenuType({ selectedMenuType, setSelectedMenuType }: MenuTypeProps) { + return ( +
+ + + +
+ ); +} diff --git a/src/page/Coop/components/SoldoutToggle/SoldoutToggle.module.scss b/src/page/Coop/components/SoldoutToggle/SoldoutToggle.module.scss new file mode 100644 index 00000000..d4d44d08 --- /dev/null +++ b/src/page/Coop/components/SoldoutToggle/SoldoutToggle.module.scss @@ -0,0 +1,15 @@ +.toggleButton { + width: 46px; + height: 23px; + cursor: pointer; + + .background { + rx: 9.5; + stroke-width: 3; + } + + .circle { + r: 8; + fill: white; + } +} diff --git a/src/page/Coop/components/SoldoutToggle/index.tsx b/src/page/Coop/components/SoldoutToggle/index.tsx new file mode 100644 index 00000000..1e88fad8 --- /dev/null +++ b/src/page/Coop/components/SoldoutToggle/index.tsx @@ -0,0 +1,17 @@ +import { useState } from 'react'; +import styles from './SoldoutToggle.module.scss'; + +export default function SoldoutToggle() { + const [isActive, setIsActive] = useState(false); + + const toggleButton = () => { + setIsActive(!isActive); + }; + + return ( + + + + + ); +} diff --git a/src/page/Coop/index.tsx b/src/page/Coop/index.tsx new file mode 100644 index 00000000..c2627413 --- /dev/null +++ b/src/page/Coop/index.tsx @@ -0,0 +1,15 @@ +import { useState } from 'react'; +import { Menus } from 'model/Coop'; +import MenuCard from './components/MenuCard'; +import MenuType from './components/MenuType'; +import styles from './Coop.module.scss'; + +export default function Coop() { + const [selectedMenuType, setSelectedMenuType] = useState('아침'); + return ( +
+ + +
+ ); +} From ad1a062772e7572353ad39ed5bb9b8e2b1dbd559 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Thu, 4 Apr 2024 16:39:03 +0900 Subject: [PATCH 41/54] =?UTF-8?q?feat:=20=EC=B9=B4=EB=A9=94=EB=9D=BC=20?= =?UTF-8?q?=EC=95=84=EC=9D=B4=EC=BD=98=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/svg/coop/photo.svg | 8 ++++++++ 1 file changed, 8 insertions(+) create mode 100644 src/assets/svg/coop/photo.svg diff --git a/src/assets/svg/coop/photo.svg b/src/assets/svg/coop/photo.svg new file mode 100644 index 00000000..072b2982 --- /dev/null +++ b/src/assets/svg/coop/photo.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file From 295946a27d6d62cad9e29f91270c4c98a3b7234d Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Thu, 4 Apr 2024 16:39:36 +0900 Subject: [PATCH 42/54] =?UTF-8?q?feat:=20=EC=8B=9D=EB=8B=A8=20API=20?= =?UTF-8?q?=ED=83=80=EC=9E=85=20=EC=B6=94=EA=B0=80=EC=A0=95=EC=9D=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/model/Coop/index.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/model/Coop/index.ts b/src/model/Coop/index.ts index 6028444e..b675da84 100644 --- a/src/model/Coop/index.ts +++ b/src/model/Coop/index.ts @@ -12,6 +12,8 @@ export const Dinings = z.object({ price_cash: z.number(), type: z.string(), updated_at: z.string(), + sold_out: z.boolean(), + is_changed: z.boolean(), }); export type Dinings = z.infer; From 0e9ba67f556bd19f0f31bf7c8b06bc3013d76608 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Thu, 4 Apr 2024 16:40:03 +0900 Subject: [PATCH 43/54] =?UTF-8?q?feat:=20=EC=9B=B9=EC=97=90=EC=84=9C=20cen?= =?UTF-8?q?ter=20=EC=A0=95=EB=A0=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Coop/Coop.module.scss | 9 ++++++++- src/page/Coop/index.tsx | 8 +++++--- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/src/page/Coop/Coop.module.scss b/src/page/Coop/Coop.module.scss index e1772022..32e9f901 100644 --- a/src/page/Coop/Coop.module.scss +++ b/src/page/Coop/Coop.module.scss @@ -3,7 +3,14 @@ flex-direction: column; background-color: #f5f5f5; width: 390px; - height: 100vh; + min-height: 100vh; + height: 100%; +} + +.container-wrapper { + display: flex; + justify-content: center; + align-items: center; } .place { diff --git a/src/page/Coop/index.tsx b/src/page/Coop/index.tsx index c2627413..88a0e2e2 100644 --- a/src/page/Coop/index.tsx +++ b/src/page/Coop/index.tsx @@ -7,9 +7,11 @@ import styles from './Coop.module.scss'; export default function Coop() { const [selectedMenuType, setSelectedMenuType] = useState('아침'); return ( -
- - +
+
+ + +
); } From c55330c000b03c7836a96b6463ed2597633790be Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 5 Apr 2024 03:46:15 +0900 Subject: [PATCH 44/54] =?UTF-8?q?feat:=20=ED=86=A0=EA=B8=80=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=EB=B0=8F=20css=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/MenuCard/MenuCard.module.scss | 25 +++++++++++++++++-- .../components/MenuType/MenuType.module.scss | 4 +-- .../Coop/components/SoldoutToggle/index.tsx | 2 +- 3 files changed, 26 insertions(+), 5 deletions(-) diff --git a/src/page/Coop/components/MenuCard/MenuCard.module.scss b/src/page/Coop/components/MenuCard/MenuCard.module.scss index be13b791..561bd48c 100644 --- a/src/page/Coop/components/MenuCard/MenuCard.module.scss +++ b/src/page/Coop/components/MenuCard/MenuCard.module.scss @@ -7,13 +7,16 @@ display: flex; flex-direction: column; background-color: #fff; + margin: 10px 20px; + border-radius: 4px; + box-shadow: 0 1px 9px 1px rgb(0 0 0 / 6%); &__header { display: flex; justify-content: space-between; align-items: center; - padding: 1rem; border-bottom: 1px solid #e0e0e0; + padding: 10px; } &__title { @@ -27,17 +30,35 @@ font-size: 12px; font-weight: 400; line-height: 15px; + width: 150px; } &__image { width: 150px; + height: 100px; + flex-shrink: 0; + border-radius: 4px; + border: 1px solid #cacaca; + background: #fafafa; + display: flex; + align-items: center; + justify-content: center; + object-fit: scale-down; + } + + &__soldout-wrapper { + display: flex; + align-items: center; + justify-content: center; + gap: 8px; } &__wrapper { display: flex; align-items: center; - justify-content: space-between; + justify-content: center; padding: 12px; + gap: 40px; } &__soldout { diff --git a/src/page/Coop/components/MenuType/MenuType.module.scss b/src/page/Coop/components/MenuType/MenuType.module.scss index 01475c7e..bcd3bb0d 100644 --- a/src/page/Coop/components/MenuType/MenuType.module.scss +++ b/src/page/Coop/components/MenuType/MenuType.module.scss @@ -9,7 +9,7 @@ &__button--selected { width: 60px; - height: 30px; + height: 33px; background-color: #175c8e; color: #fff; display: flex; @@ -21,7 +21,7 @@ &__button--unselected { width: 60px; - height: 30px; + height: 33px; background-color: #fff; color: #175c8e; display: flex; diff --git a/src/page/Coop/components/SoldoutToggle/index.tsx b/src/page/Coop/components/SoldoutToggle/index.tsx index 1e88fad8..f7aab520 100644 --- a/src/page/Coop/components/SoldoutToggle/index.tsx +++ b/src/page/Coop/components/SoldoutToggle/index.tsx @@ -2,7 +2,7 @@ import { useState } from 'react'; import styles from './SoldoutToggle.module.scss'; export default function SoldoutToggle() { - const [isActive, setIsActive] = useState(false); + const [isActive, setIsActive] = useState(true); const toggleButton = () => { setIsActive(!isActive); From 1af670123076a12e656d39639b8abefd780df5b9 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 5 Apr 2024 03:46:40 +0900 Subject: [PATCH 45/54] =?UTF-8?q?feat:=20=EC=98=81=EC=96=91=EC=82=AC?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?= =?UTF-8?q?=EC=97=85=EB=A1=9C=EB=93=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/coop/index.ts | 9 ++ src/model/Coop/index.ts | 14 ++++ src/page/Coop/components/MenuCard/index.tsx | 92 ++++++++++++++++----- src/query/coop.ts | 33 +++++++- 4 files changed, 125 insertions(+), 23 deletions(-) diff --git a/src/api/coop/index.ts b/src/api/coop/index.ts index 050b08cc..4791562f 100644 --- a/src/api/coop/index.ts +++ b/src/api/coop/index.ts @@ -1,6 +1,15 @@ import { accessClient } from 'api'; +import { DiningImages, SoldOut } from 'model/Coop'; export const getDining = async () => { const { data } = await accessClient.get('/dinings'); return data; }; + +export const uploadDiningImage = async (data: DiningImages) => { + await accessClient.patch('/coop/dining/image', data); +}; + +export const updateSoldOut = async (data: SoldOut) => { + await accessClient.patch('/coop/dining/soldout', data); +}; diff --git a/src/model/Coop/index.ts b/src/model/Coop/index.ts index b675da84..4ccdad2f 100644 --- a/src/model/Coop/index.ts +++ b/src/model/Coop/index.ts @@ -17,3 +17,17 @@ export const Dinings = z.object({ }); export type Dinings = z.infer; + +export const DiningImages = z.object({ + menuId: z.number(), + imageUrl: z.string(), +}); + +export type DiningImages = z.infer; + +export const SoldOut = z.object({ + menuId: z.number(), + soldOut: z.boolean(), +}); + +export type SoldOut = z.infer; diff --git a/src/page/Coop/components/MenuCard/index.tsx b/src/page/Coop/components/MenuCard/index.tsx index baf8d3bc..171ac43d 100644 --- a/src/page/Coop/components/MenuCard/index.tsx +++ b/src/page/Coop/components/MenuCard/index.tsx @@ -1,6 +1,8 @@ import { useGetDining } from 'query/coop'; -import { Menus } from 'model/Coop'; +import { Dinings, Menus } from 'model/Coop'; import SoldoutToggle from 'page/Coop/components/SoldoutToggle'; +import { ReactComponent as Photo } from 'assets/svg/coop/photo.svg'; +import { useRef, useState } from 'react'; import styles from './MenuCard.module.scss'; interface MenuCardProps { @@ -9,36 +11,88 @@ interface MenuCardProps { export default function MenuCard({ selectedMenuType }: MenuCardProps) { const { data } = useGetDining(); + const [selectedImages, setSelectedImages] = useState<{ [key: number]: string }>({}); + const fileInputRefs = useRef<{ [key: number]: HTMLInputElement | null }>({}); + + const handleImageChange = (menuId: number) => (event: React.ChangeEvent) => { + if (event.target.files && event.target.files[0]) { + const fileReader = new FileReader(); + fileReader.onload = (e) => { + setSelectedImages((prevImages) => ({ + ...prevImages, + [menuId]: e.target?.result as string, + })); + }; + fileReader.readAsDataURL(event.target.files[0]); + } + }; + + const handleImageClick = (menuId: number) => () => { + fileInputRefs.current[menuId]?.click(); + }; + + const getDiningType = (menuType: Menus) => { + switch (menuType) { + case '아침': + return 'BREAKFAST'; + case '점심': + return 'LUNCH'; + case '저녁': + return 'DINNER'; + default: + return ''; + } + }; + + const filteredData = data?.filter((menu:Dinings) => { + const diningType = getDiningType(selectedMenuType); + return menu.type === diningType && ['A코너', 'B코너', 'C코너'].includes(menu.place); + }); + return (
-
-

{selectedMenuType}

-
-
-
+ {filteredData?.map((menu: Dinings) => ( +
- A코너 -
+ {menu.place} +
품절
-
이미지공간
+
{ + if (event.key === 'Enter') handleImageClick(menu.id)(); + }} + role="button" + tabIndex={0} + > + {selectedImages[menu.id] ? ( + + ) : ( + + )} +
- 피자 - 치킨 + {menu.menu.map((item) => ( +
{item}
+ ))}
- + { + fileInputRefs.current[menu.id] = el; + }} + />
- {data?.map((menu:any) => ( -
-

{menu.place}

-

{menu.menu.join(', ')}

-
- ))} -
+ ))}
); } diff --git a/src/query/coop.ts b/src/query/coop.ts index 47939dd5..2a0fa2e5 100644 --- a/src/query/coop.ts +++ b/src/query/coop.ts @@ -1,9 +1,8 @@ -import { useQueryClient, useSuspenseQuery } from '@tanstack/react-query'; -import { getDining } from 'api/coop'; -import { Dinings } from 'model/Coop'; +import { useMutation, useQueryClient, useSuspenseQuery } from '@tanstack/react-query'; +import { getDining, updateSoldOut, uploadDiningImage } from 'api/coop'; +import { DiningImages, SoldOut } from 'model/Coop'; export const useGetDining = () => { - const queryClient = useQueryClient(); const { data } = useSuspenseQuery( { queryKey: ['dining'], @@ -14,3 +13,29 @@ export const useGetDining = () => { data, }; }; + +export const useUpdateSoldOut = () => { + const queryClient = useQueryClient(); + const { mutate: updateSoldOutMutation } = useMutation({ + mutationFn: (data: SoldOut) => updateSoldOut(data), + onSuccess: () => { + queryClient.invalidateQueries(); + }, + }); + return { + updateSoldOutMutation, + }; +}; + +export const useUploadDiningImage = () => { + const queryClient = useQueryClient(); + const { mutate: uploadDiningImageMutation } = useMutation({ + mutationFn: (data: DiningImages) => uploadDiningImage(data), + onSuccess: () => { + queryClient.invalidateQueries(); + }, + }); + return { + uploadDiningImageMutation, + }; +}; From e1e5bce2d8448b6754726d34ba4061746189ae4d Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 5 Apr 2024 03:56:48 +0900 Subject: [PATCH 46/54] =?UTF-8?q?fix:=20lint=EC=97=90=EB=9F=AC=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Coop/components/MenuType/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/page/Coop/components/MenuType/index.tsx b/src/page/Coop/components/MenuType/index.tsx index 1c291adb..75721d2f 100644 --- a/src/page/Coop/components/MenuType/index.tsx +++ b/src/page/Coop/components/MenuType/index.tsx @@ -1,4 +1,3 @@ -import { useState } from 'react'; import cn from 'utils/ts/className'; import { Menus } from 'model/Coop'; import styles from './MenuType.module.scss'; From 3c975b8b2669d83062ff80792073a4068b3cb212 Mon Sep 17 00:00:00 2001 From: dooohun Date: Fri, 5 Apr 2024 22:19:10 +0900 Subject: [PATCH 47/54] =?UTF-8?q?fix:=20=EA=B0=80=EA=B2=8C=20=EC=A0=95?= =?UTF-8?q?=EB=B3=B4=20=EC=88=98=EC=A0=95=20=EB=AA=A8=EB=8B=AC=EC=97=90?= =?UTF-8?q?=EC=84=9C=20=EC=B9=B4=ED=85=8C=EA=B3=A0=EB=A6=AC=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../EditShopInfoModal.module.scss | 13 ++++++ .../components/EditShopInfoModal/index.tsx | 43 +++++++++++++++---- 2 files changed, 47 insertions(+), 9 deletions(-) diff --git a/src/page/MyShopPage/components/EditShopInfoModal/EditShopInfoModal.module.scss b/src/page/MyShopPage/components/EditShopInfoModal/EditShopInfoModal.module.scss index 73681394..b45a9ecd 100644 --- a/src/page/MyShopPage/components/EditShopInfoModal/EditShopInfoModal.module.scss +++ b/src/page/MyShopPage/components/EditShopInfoModal/EditShopInfoModal.module.scss @@ -151,6 +151,12 @@ padding: 8px 0 8px 12px; } + &__select { + width: 345px; + height: 40px; + padding-left: 12px; + } + &__operate-time { display: flex; @@ -171,6 +177,7 @@ &__checkboxes { display: grid; grid-template-columns: 1fr 1fr; + gap: 16px; } &__checkbox { @@ -295,6 +302,12 @@ border: 1px solid #898a8d; } + &--select { + width: 262px; + height: 37px; + padding: 0 8px; + } + &__checkboxes { display: flex; justify-content: space-between; diff --git a/src/page/MyShopPage/components/EditShopInfoModal/index.tsx b/src/page/MyShopPage/components/EditShopInfoModal/index.tsx index 041bfa06..4972b157 100644 --- a/src/page/MyShopPage/components/EditShopInfoModal/index.tsx +++ b/src/page/MyShopPage/components/EditShopInfoModal/index.tsx @@ -13,6 +13,7 @@ import { OwnerShop } from 'model/shopInfo/ownerShop'; import { zodResolver } from '@hookform/resolvers/zod'; import { useMutation } from '@tanstack/react-query'; import { putShop } from 'api/shop'; +import useShopCategory from 'query/shopCategory'; import useBooleanState from 'utils/hooks/useBooleanState'; import CustomModal from 'component/common/CustomModal'; import OperateTimePC from 'page/ShopRegistration/component/Modal/OperateTimePC'; @@ -41,12 +42,14 @@ EditShopInfoModalProps) { const { imageFile, saveImgFile, imgRef } = useImageUpload(); const { setName, setAddress, setPhone, setDeliveryPrice, setDescription, setDelivery, setPayBank, - setPayCard, + setPayCard, setCategoryId, } = useShopRegistrationStore(); const { - name, address, phone, deliveryPrice, description, delivery, payBank, payCard, + name, address, phone, deliveryPrice, description, delivery, payBank, payCard, categoryId, } = useShopRegistrationStore(); + const { categoryList } = useShopCategory(); + const { openTimeState, closeTimeState, @@ -64,6 +67,10 @@ EditShopInfoModalProps) { isAllClosed, } = CheckSameTime(); + const handleCategoryIdChange = (e: React.ChangeEvent) => { + setCategoryId(Number(e.target.value)); + }; + const { handleSubmit, setValue, } = useForm({ @@ -91,6 +98,7 @@ EditShopInfoModalProps) { setDelivery(shopInfo.delivery); setPayBank(shopInfo.pay_bank); setPayCard(shopInfo.pay_card); + setCategoryId(shopInfo.shop_categories[1].id); shopInfo.open.forEach((day, index) => { useModalStore.setState((prev) => ({ ...prev, @@ -133,12 +141,9 @@ EditShopInfoModalProps) { open_time: openTimeArray[index], })); // shop_categories[0]은 전체보기이므로 따로 처리 - if (shopInfo.shop_categories.length === 1) { - setValue('category_ids', [shopInfo.shop_categories[0].id]); - } else { - const categoryIds = shopInfo.shop_categories.map((category) => category.id); - setValue('category_ids', categoryIds); - } + const totalCategory = 1; + const categoryIds = categoryId === 0 ? [totalCategory] : [totalCategory, categoryId]; + setValue('category_ids', categoryIds); setValue('open', openValue); setValue('delivery_price', Number(deliveryPrice)); setValue('description', description); @@ -149,7 +154,7 @@ EditShopInfoModalProps) { setValue('phone', phone); setValue('address', address); }, [imageUrlList, openTimeState, closeTimeState, shopClosedState, deliveryPrice, - description, delivery, payBank, payCard, name, phone, address]); + description, delivery, payBank, payCard, name, phone, address, categoryId]); const onSubmit: SubmitHandler = (data) => { mutation.mutate(data); @@ -197,6 +202,16 @@ EditShopInfoModalProps) { className={styles['mobile-main-info--input']} /> + +
-
-