From 38f8903b0da6f16f1c6453c01f80c09ee7f4923d Mon Sep 17 00:00:00 2001 From: inyoung Date: Sun, 7 Apr 2024 20:57:23 +0900 Subject: [PATCH 1/9] =?UTF-8?q?Feat:=20=EC=85=B0=EC=96=B4=20=EC=83=81?= =?UTF-8?q?=EB=8B=B4-=EA=B3=B5=EA=B0=9C=EC=83=81=EB=8B=B4=20=EB=A6=AC?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8,=20=EA=B3=B5=EA=B0=9C=EC=83=81=EB=8B=B4=20?= =?UTF-8?q?=EC=8B=A0=EC=B2=AD=20api=20=EC=97=B0=EB=8F=99=20#210?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Router.tsx | 7 +- src/api/get.ts | 9 +- src/api/patch.ts | 4 + src/api/post.ts | 6 + .../BuyerConsult/BuyerOpenConsultSection.tsx | 126 ++++++++++++------ .../BuyerOpenConsult/OpenConsultList.tsx | 19 ++- .../BuyerWriteOpenConsult/FianlWritePopup.tsx | 25 +++- src/pages/Buyer/BuyerConsult.tsx | 42 +++--- src/pages/Buyer/BuyerOpenConsultRequest.tsx | 12 +- src/pages/Buyer/BuyerOpenPaymentDetail.tsx | 2 +- src/pages/Buyer/BuyerWriteOpenConsult.tsx | 15 ++- src/pages/Seller/SellerRefundBankAccount.tsx | 2 +- 12 files changed, 196 insertions(+), 73 deletions(-) diff --git a/src/Router.tsx b/src/Router.tsx index ab7bfda8..8aa3c673 100644 --- a/src/Router.tsx +++ b/src/Router.tsx @@ -73,11 +73,14 @@ const Router = () => { } /> } /> - } /> + } + /> } /> } /> - } /> + } /> } /> } /> } /> diff --git a/src/api/get.ts b/src/api/get.ts index 5fa6621a..24a99e76 100644 --- a/src/api/get.ts +++ b/src/api/get.ts @@ -104,7 +104,7 @@ export const getPaymentsCustomers = async (params: any) => export const getCounselorsAccount = async () => await getInstance('/counselors/account'); - + export const getPaymentsMinder = async (params: any) => await getInstance('/payments/counselors', params); @@ -116,3 +116,10 @@ export const getMinderReviews = async (params: any) => await getInstance('/reviews/counselors', params); export const getMinderReviewsHome = async () => await getInstance('/reviews/counselors/home'); + +// Post Controller +// 일대다상담 컨트롤러 +export const getCustomerOpenConsultList = async (params: any) => + await getInstance('/posts/customers', params); +export const getCustomerPublicConsultList = async (params: any) => + await getInstance('/posts/customers/public', params); diff --git a/src/api/patch.ts b/src/api/patch.ts index f92b9070..9eb24ef3 100644 --- a/src/api/patch.ts +++ b/src/api/patch.ts @@ -68,3 +68,7 @@ export const patchSearchWordsResults = async (sortType: string, body: any) => //찜하기 추가 export const patchWishLists = async (counselorId: number) => await patchInstance(`/wishLists?counselorId=${counselorId}`); + +export const patchOpenConsult = async (body: any) => { + await patchInstance(`/posts`, body); +}; diff --git a/src/api/post.ts b/src/api/post.ts index d9b551c0..ce09eadf 100644 --- a/src/api/post.ts +++ b/src/api/post.ts @@ -46,3 +46,9 @@ export const postIsPassQuiz = async (body: any, parmas: any) => //찜하기 목록 가져오기 export const postWishLists = async (body: any) => await postInstance('/wishLists', body); + +// Post controller +// 일대다상담 + +export const postOpenConsult = async (body: any) => + await postInstance('/posts', body); diff --git a/src/components/Buyer/BuyerConsult/BuyerOpenConsultSection.tsx b/src/components/Buyer/BuyerConsult/BuyerOpenConsultSection.tsx index 9c928ce9..92a51ea1 100644 --- a/src/components/Buyer/BuyerConsult/BuyerOpenConsultSection.tsx +++ b/src/components/Buyer/BuyerConsult/BuyerOpenConsultSection.tsx @@ -1,4 +1,4 @@ -import React, { useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'; import styled from 'styled-components'; import { Green, Grey1, Grey2, Grey3, Grey6 } from 'styles/color'; @@ -23,8 +23,12 @@ import IsBuyPopup from './IsBuyPopup'; import { Button } from 'components/Common/Button'; import { useNavigate } from 'react-router-dom'; import { BottomButton } from 'components/Seller/Common/BottomButton'; - -function BuyerOpenConsultSection() { +import { openConsultApiObject } from 'pages/Buyer/BuyerConsult'; +import { getCustomerOpenConsultList } from 'api/get'; +interface BuyerOpenConsultSectionProps { + isChecked: boolean; +} +function BuyerOpenConsultSection({ isChecked }: BuyerOpenConsultSectionProps) { const [isLoading, setIsLoading] = useState(false); const navigate = useNavigate(); const [isModalOpen, setIsModalOpen] = useRecoilState( @@ -36,6 +40,29 @@ function BuyerOpenConsultSection() { const handleWritePostButton = () => { setIsBuyPopupOpen(true); }; + const [cardData, setCardData] = useState([]); + useEffect(() => { + const fetchOpenConsult = async () => { + setIsLoading(true); + try { + const params = { + filter: isChecked, + postId: 0, + }; + const res: any = await getCustomerOpenConsultList({ params }); + if (res.status === 200) { + setCardData(res.data); + } else if (res.response.status === 404) { + alert('존재하지 않는 회원입니다.'); + } + } catch (err) { + alert(err); + } finally { + setIsLoading(false); + } + }; + fetchOpenConsult(); + }, [isChecked]); return ( <> {isLoading ? ( @@ -51,47 +78,60 @@ function BuyerOpenConsultSection() { ) : ( {/* 상담카드 부분 */} - -
- 이거 권태기 증상 맞나요? - - - 비공개 - -
- -
- 요즘따라 여자친구가 먼저 만나자고 이야기도 안 하고 만나면 - 피곤하다고만 해요. 스킨십도 하려고 하지 않고 인생이 재미가 - 없다네요.. 그런데 여자친구가 다른 남자 인스타 피드에는 좋아요를 - 눌러요... 이거 여자친구가 권태기가 맞는 걸까요? 맞다면 어떻게 - 이야기를 꺼내면 좋을까요? 너무 힘듭니다.. -
-
- - - 28 - - - - 28 - - - - 28 - -
- 8분 전 - + {cardData?.map((item) => { + if (item.title === null) { + return ( + + 상담 글을 작성해주세요! + + 결제 후 작성 전
+ 공개상담 글을 작성해보세요~ + + + + ); + } else { + return ( + +
+ {item?.title} + {!item?.isPublic && ( + + + 비공개 + + )} +
+ +
{item?.content}
+
+ + + {item?.totalLike} + + + + {item?.totalScrap} + + + + {item?.totalComment} + +
+ {item?.updatedAt} + + ); + } + })} + {/* 상담카드 부분 */} - - 상담 글을 작성해주세요! - - 결제 후 작성 전
- 공개상담 글을 작성해보세요~ - - - )}{' '} {isBuyPopupOpen && ( diff --git a/src/components/Buyer/BuyerOpenConsult/OpenConsultList.tsx b/src/components/Buyer/BuyerOpenConsult/OpenConsultList.tsx index 0ba65ab4..7a1bd8c9 100644 --- a/src/components/Buyer/BuyerOpenConsult/OpenConsultList.tsx +++ b/src/components/Buyer/BuyerOpenConsult/OpenConsultList.tsx @@ -1,4 +1,4 @@ -import React, { useState } from 'react'; +import React, { useEffect, useState } from 'react'; import styled from 'styled-components'; import { Green, Grey1, Grey2, Grey3, Grey6 } from 'styles/color'; import { Body1, Caption1, Caption2 } from 'styles/font'; @@ -13,8 +13,25 @@ import { ReactComponent as CheckIcon } from 'assets/icons/icon-check2.svg'; import { ReactComponent as WriteIcon } from 'assets/icons/icon-write.svg'; import { Space } from 'components/Common/Space'; import { BackDrop } from 'components/Common/BackDrop'; +import { openConsultApiObject } from 'pages/Buyer/BuyerConsult'; +import { getCustomerPublicConsultList } from 'api/get'; function OpenConsultList() { + const [cardData, setCardData] = useState([]); + useEffect(() => { + const fetchOpenConsultData = async () => { + const params = { + postId: '0', + finishedAt: new Date().toISOString().slice(0, 19), + }; + const res: any = await getCustomerPublicConsultList({ params }); + if (res.status === 200) { + setCardData(res.data); + } + }; + fetchOpenConsultData(); + }, []); + console.log(cardData); return (
diff --git a/src/components/Buyer/BuyerWriteOpenConsult/FianlWritePopup.tsx b/src/components/Buyer/BuyerWriteOpenConsult/FianlWritePopup.tsx index 24163e73..ec1d65b9 100644 --- a/src/components/Buyer/BuyerWriteOpenConsult/FianlWritePopup.tsx +++ b/src/components/Buyer/BuyerWriteOpenConsult/FianlWritePopup.tsx @@ -1,5 +1,6 @@ +import { patchOpenConsult } from 'api/patch'; import React from 'react'; -import { useNavigate } from 'react-router-dom'; +import { useNavigate, useParams } from 'react-router-dom'; import { useSetRecoilState } from 'recoil'; import styled from 'styled-components'; import { Green, Grey4, LightGreen, White } from 'styles/color'; @@ -9,13 +10,29 @@ import { isPostPopupOpenState, isSendPopupOpenState, } from 'utils/atom'; +import { convertCategoryEnum } from 'utils/convertCategoryEnum'; +interface FianlWritePopupProps { + title: string; + content: string; + category: string; +} -function FinalWritePopup() { +function FinalWritePopup({ title, content, category }: FianlWritePopupProps) { const navigate = useNavigate(); const setIsPostPopupOpen = useSetRecoilState(isPostPopupOpenState); - const handlePost = () => { + const { postId } = useParams(); + const handlePost = async () => { setIsPostPopupOpen(false); - navigate('/consult/?type=open-consult'); + const body = { + postId: postId, + consultCategory: convertCategoryEnum(category), + title: title, + content: content, + isCompleted: true, + }; + + await patchOpenConsult(body); + // navigate('/consult/?type=open-consult'); }; return ( diff --git a/src/pages/Buyer/BuyerConsult.tsx b/src/pages/Buyer/BuyerConsult.tsx index e287d24c..c63bf6b8 100644 --- a/src/pages/Buyer/BuyerConsult.tsx +++ b/src/pages/Buyer/BuyerConsult.tsx @@ -27,6 +27,19 @@ export interface consultApiObject { reviewCompleted: boolean | null; consultId: number | null; } +export interface openConsultApiObject { + postId: number; + title: string; + content: string; + isPublic: boolean; + isLiked: boolean; + totalLike: number; + isScrapped: boolean; + totalScrap: number; + totalComment: number; + updatedAt: string; + finishedAt: string; +} export const BuyerConsult = () => { const navigate = useNavigate(); @@ -102,27 +115,26 @@ export const BuyerConsult = () => {
)} - {consultType !== 'open-consult' && ( -
{ - setIsChecked(!isChecked); - searchParams.set('check', String(!isChecked)); - setSearchParams(searchParams); - }} - > - {isChecked ? : } - 종료/취소된 상담 제외 -
- )} + +
{ + setIsChecked(!isChecked); + searchParams.set('check', String(!isChecked)); + setSearchParams(searchParams); + }} + > + {isChecked ? : } + 종료/취소된 상담 제외 +
{consultType === 'letter' ? ( ) : consultType === 'chat' ? ( ) : ( - + )} {isModalOpen ? ( <> diff --git a/src/pages/Buyer/BuyerOpenConsultRequest.tsx b/src/pages/Buyer/BuyerOpenConsultRequest.tsx index 1560b93c..6f81af90 100644 --- a/src/pages/Buyer/BuyerOpenConsultRequest.tsx +++ b/src/pages/Buyer/BuyerOpenConsultRequest.tsx @@ -1,3 +1,4 @@ +import { postOpenConsult } from 'api/post'; import { BackIcon, HeaderWrapper } from 'components/Buyer/Common/Header'; import { Button } from 'components/Common/Button'; import { useEffect, useState } from 'react'; @@ -12,10 +13,15 @@ export const BuyerOpenConsultRequest = () => { const [isNotOpenConsult, setIsNotOpenConsult] = useState(false); const [buttonAcitve, setButtonAcitve] = useState(false); const location = useLocation(); - const handleNextClick = () => { + const handleNextClick = async () => { if (buttonAcitve) { if (isOpenConsult) { - navigate('/paymentFinish') + const body = { + cost: 0, + isPublic: true, + }; + await postOpenConsult(body); + navigate('/paymentFinish'); } else { navigate('/openPaymentDetail'); } @@ -33,7 +39,7 @@ export const BuyerOpenConsultRequest = () => { { - navigate("/consult"); + navigate('/consult'); }} /> 일대다상담 신청하기 diff --git a/src/pages/Buyer/BuyerOpenPaymentDetail.tsx b/src/pages/Buyer/BuyerOpenPaymentDetail.tsx index 806ed740..d35052d6 100644 --- a/src/pages/Buyer/BuyerOpenPaymentDetail.tsx +++ b/src/pages/Buyer/BuyerOpenPaymentDetail.tsx @@ -13,7 +13,7 @@ export const BuyerOpenPaymentDetail = () => { const handlePaymentClick = () => { navigate('/paymentComplete'); }; - return ( + return ( (White); //input 값 + const [titleInput, setTitleInput] = useState(''); const [input, setInput] = useState(''); const [isActivePostModal, setIsActivePostModal] = useState(false); @@ -88,7 +89,13 @@ function BuyerWriteOpenConsult() { {categoryList[categoryType]} - + { + setTitleInput(e.target.value); + }} + />