From b70288f66c5d7c7b4d384906153460e6adead2cb Mon Sep 17 00:00:00 2001 From: Minji Lee <79428205+alswlfl29@users.noreply.github.com> Date: Fri, 5 Jul 2024 17:32:50 +0900 Subject: [PATCH] =?UTF-8?q?[Fix/#51]=20=EC=98=A4=EB=A5=98=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20=EB=B0=8F=20=EB=82=B4=EC=9A=A9=20=EB=B3=80=EA=B2=BD?= =?UTF-8?q?=20(#54)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: 결제 input 금액 검은색으로 색 변경 * fix: 후면 카메라로 설정 변경 * fix: 신청자 수 추가, 날짜=>등록 이름 변경 * fix: 내가 호스트일 경우 신청 버튼 비활성화 * fix: 계좌 데이터 캐시 무효화 --- src/components/Atom/InputMoney.tsx | 2 +- src/components/molecules/LessonSearchCard.tsx | 14 ++++++++++---- src/components/molecules/QRScanner.tsx | 2 +- src/constants/sortList.ts | 2 +- src/pages/main/QRPay.tsx | 11 +++++++++-- src/pages/search/LessonDetail.tsx | 8 +++++++- src/pages/search/LessonSearch.tsx | 1 - src/pages/search/PayLesson.tsx | 9 ++++++++- src/types/category.d.ts | 1 + src/types/lesson.d.ts | 1 + 10 files changed, 39 insertions(+), 12 deletions(-) diff --git a/src/components/Atom/InputMoney.tsx b/src/components/Atom/InputMoney.tsx index 4ec806c..2a717fc 100644 --- a/src/components/Atom/InputMoney.tsx +++ b/src/components/Atom/InputMoney.tsx @@ -48,7 +48,7 @@ export const InputMoney: FC = ({ defaultValue={isChangeMoney ? 0 : maxMoney.toLocaleString()} disabled={!isChangeMoney} onChange={handleChangeMoney} - className='border-none bg-transparent text-end pr-2 focus:outline-none' + className='border-none bg-transparent text-end pr-2 focus:outline-none disabled:text-black' style={{ width: width + 'rem' }} /> 원 diff --git a/src/components/molecules/LessonSearchCard.tsx b/src/components/molecules/LessonSearchCard.tsx index 4405ff1..c8d455a 100644 --- a/src/components/molecules/LessonSearchCard.tsx +++ b/src/components/molecules/LessonSearchCard.tsx @@ -25,12 +25,18 @@ export const LessonSearchCard: FC = ({ lesson }) => { {lesson.price.toLocaleString()}원

+
-

- logo - {lesson.hostName} -

+
+

+ logo + {lesson.hostName} +

+

+ 참여자 {lesson.applicantSum} +

+
diff --git a/src/components/molecules/QRScanner.tsx b/src/components/molecules/QRScanner.tsx index 2b62206..572c268 100644 --- a/src/components/molecules/QRScanner.tsx +++ b/src/components/molecules/QRScanner.tsx @@ -18,7 +18,7 @@ export const QRScanner: FC = ({ onClose }) => { const QrOptions = { // 핸드폰의 경우, 외부 카메라인지 셀프카메라인지 - preferredCamera: 'user', + preferredCamera: 'environment', // 1초당 몇번의 스캔을 할 것인지? ex) 1초에 5번 QR 코드 감지한다. maxScansPerSecond: 5, // QR 스캔이 일어나는 부분을 표시해줄 지 (노란색 네모 테두리가 생긴다.) diff --git a/src/constants/sortList.ts b/src/constants/sortList.ts index 0d7227e..e373755 100644 --- a/src/constants/sortList.ts +++ b/src/constants/sortList.ts @@ -5,7 +5,7 @@ export type SortType = { export const SortCategories: SortType[] = [ { - name: '날짜순', + name: '등록순', sort: 'date', }, { diff --git a/src/pages/main/QRPay.tsx b/src/pages/main/QRPay.tsx index d90dd34..d1148d3 100644 --- a/src/pages/main/QRPay.tsx +++ b/src/pages/main/QRPay.tsx @@ -7,13 +7,15 @@ import { ChoiceAccount } from '../../components/organisms/ChoiceAccount'; import { InputMoney } from '../../components/Atom/InputMoney'; import { ChoiceInput } from '../../components/molecules/ChoiceInput'; import { CompleteSend } from '../../components/organisms/CompleteSend'; -import { useMutation, useQuery } from '@tanstack/react-query'; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; import { ApiClient } from '../../apis/apiClient'; import { ModalBottomContainer } from '../../components/organisms/ModalBottomContainer'; import { useModal } from '../../context/ModalContext'; import { Loading } from '../Loading'; +import { getCookie } from '../../utils/cookie'; export const QRPay = () => { + const queryClient = useQueryClient(); const location = useLocation(); const navigate = useNavigate(); const { openModal, closeModal } = useModal(); @@ -31,7 +33,12 @@ export const QRPay = () => { return res; }, onSuccess: (data) => { - if (data.isSuccess && data.data?.transactionId) setIsSend(true); + if (data.isSuccess && data.data?.transactionId) { + queryClient.invalidateQueries({ + queryKey: [getCookie('token'), 'accountList'], + }); + setIsSend(true); + } }, }); diff --git a/src/pages/search/LessonDetail.tsx b/src/pages/search/LessonDetail.tsx index 35dc0c5..ace1bea 100644 --- a/src/pages/search/LessonDetail.tsx +++ b/src/pages/search/LessonDetail.tsx @@ -171,7 +171,13 @@ export const LessonDetail = () => {
diff --git a/src/pages/search/LessonSearch.tsx b/src/pages/search/LessonSearch.tsx index a77a817..3c58bcb 100644 --- a/src/pages/search/LessonSearch.tsx +++ b/src/pages/search/LessonSearch.tsx @@ -75,7 +75,6 @@ export const LessonSearch = () => { const handleSearchInput = () => { if (inputRef.current) setSearchText(inputRef.current.value); }; - useEffect(() => { if (lessonList?.data && selectedCategory === -1) setItems(lessonList.data); if (lessonListByCategory?.data && selectedCategory !== -1) diff --git a/src/pages/search/PayLesson.tsx b/src/pages/search/PayLesson.tsx index 6eb2a45..30a22ea 100644 --- a/src/pages/search/PayLesson.tsx +++ b/src/pages/search/PayLesson.tsx @@ -10,13 +10,14 @@ import { useLocation, useNavigate } from 'react-router-dom'; import { AccountPwKeypad } from '../../components/organisms/AccountPwKeypad'; import { CompleteSend } from '../../components/organisms/CompleteSend'; import { ChoiceAccount } from '../../components/organisms/ChoiceAccount'; -import { useMutation, useQuery } from '@tanstack/react-query'; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; import { ApiClient } from '../../apis/apiClient'; import { getCookie } from '../../utils/cookie'; import { Loading } from '../Loading'; import { useModal } from '../../context/ModalContext'; export const PayLesson = () => { + const queryClient = useQueryClient(); const navigate = useNavigate(); const { state } = useLocation(); const [account, setAccount] = useState(null); @@ -84,6 +85,12 @@ export const PayLesson = () => { }, onSuccess: (data) => { if (data.isSuccess) { + queryClient.invalidateQueries({ + queryKey: [getCookie('token'), 'accountList'], + }); + queryClient.invalidateQueries({ + queryKey: [getCookie('token'), 'hanamoney'], + }); setIsSend(true); setShowModal(false); setShowPwModal(false); diff --git a/src/types/category.d.ts b/src/types/category.d.ts index 5ff91ac..26cd99f 100644 --- a/src/types/category.d.ts +++ b/src/types/category.d.ts @@ -9,6 +9,7 @@ interface SearchLessonResType { title: string; price: number; hostName: string; + applicantSum: number; } interface CategoryType { diff --git a/src/types/lesson.d.ts b/src/types/lesson.d.ts index f8c4645..72df258 100644 --- a/src/types/lesson.d.ts +++ b/src/types/lesson.d.ts @@ -24,6 +24,7 @@ interface LessonDetailType { materials: string; capacity: number; categoryName: string; + hostMe: boolean; } interface CreateLessonReqType {