diff --git a/src/components/inquiry/list/ListForm.tsx b/src/components/inquiry/list/ListForm.tsx index bb41fb3..badcbcd 100644 --- a/src/components/inquiry/list/ListForm.tsx +++ b/src/components/inquiry/list/ListForm.tsx @@ -5,12 +5,15 @@ import { useState } from 'react' export default function ListForm() { const router = useRouter() - const { inquiryListRequest, setInquiryListRequest } = useInquiryFilterStore() + const { inquiryListRequest, setInquiryListRequest, reset } = useInquiryFilterStore() const [searchKeyword, setSearchKeyword] = useState(inquiryListRequest.schTitle ?? '') const handleSearch = () => { if (searchKeyword.length >= 2) { + reset() setInquiryListRequest({ ...inquiryListRequest, schTitle: searchKeyword }) + } else { + alert('2文字以上入力してください') } } const handleKeyDown = (e: React.KeyboardEvent) => { diff --git a/src/components/inquiry/list/ListTable.tsx b/src/components/inquiry/list/ListTable.tsx index 8d7878e..d01de9d 100644 --- a/src/components/inquiry/list/ListTable.tsx +++ b/src/components/inquiry/list/ListTable.tsx @@ -26,19 +26,17 @@ export default function ListTable() { const pathname = usePathname() const { inquiryList, isLoadingInquiryList } = useInquiry() - const { inquiryListRequest, setInquiryListRequest, reset } = useInquiryFilterStore() + const { inquiryListRequest, setInquiryListRequest, reset, offset, setOffset } = useInquiryFilterStore() - const [offset, setOffset] = useState(inquiryListRequest.startRow) const [hasMore, setHasMore] = useState(false) const [heldInquiryList, setHeldInquiryList] = useState([]) const { session } = useSessionStore() + useEffect(() => { - setInquiryListRequest({ ...inquiryListRequest, startRow: 1, endRow: 10 }) - setHeldInquiryList([]) setOffset(1) - setHasMore(false) + setHeldInquiryList([]) }, [pathname]) useEffect(() => { @@ -47,17 +45,17 @@ export default function ListTable() { setInquiryListRequest({ ...inquiryListRequest, storeId: session.storeId ?? '', loginId: session.userId ?? '' }) } if (inquiryList.length > 0 && inquiryList[0].totCnt > 0) { - if (inquiryListRequest.startRow > 1) { + if (offset > 1) { setHeldInquiryList([...heldInquiryList, ...inquiryList]) } else { setHeldInquiryList(inquiryList) } - setHasMore(inquiryList[0].totCnt > inquiryListRequest.endRow) + setHasMore(inquiryList[0].totCnt > offset + 9) } else { setHeldInquiryList([]) setHasMore(false) } - }, [session, inquiryList, inquiryListRequest.startRow, isLoadingInquiryList]) + }, [session, inquiryList]) const handleMyInquiry = () => { setInquiryListRequest({ ...inquiryListRequest, schRegId: inquiryListRequest.schRegId ? null : session.userId }) @@ -129,8 +127,7 @@ export default function ListTable() { { - setInquiryListRequest({ ...inquiryListRequest, startRow: offset + 10, endRow: offset + 19 }) - setOffset(inquiryListRequest.startRow) + setOffset(offset + 10) }} /> diff --git a/src/hooks/useInquiry.ts b/src/hooks/useInquiry.ts index 6575613..11c750a 100644 --- a/src/hooks/useInquiry.ts +++ b/src/hooks/useInquiry.ts @@ -19,16 +19,16 @@ export function useInquiry( commonCodeList: CommonCode[] } { const queryClient = useQueryClient() - const { inquiryListRequest } = useInquiryFilterStore() + const { inquiryListRequest, offset } = useInquiryFilterStore() const { session } = useSessionStore() const { axiosInstance } = useAxios() const { data: inquiryList, isLoading: isLoadingInquiryList } = useQuery({ - queryKey: ['inquiryList', inquiryListRequest], + queryKey: ['inquiryList', inquiryListRequest, offset], queryFn: async () => { try { const resp = await axiosInstance(null).get<{ data: InquiryList[] }>(`/api/qna/list`, { - params: { inquiryListRequest }, + params: { inquiryListRequest, startRow: offset, endRow: offset + 9 }, }) return resp.data.data } catch (error: any) { diff --git a/src/store/inquiryFilterStore.ts b/src/store/inquiryFilterStore.ts index 62f70df..b3fb8d9 100644 --- a/src/store/inquiryFilterStore.ts +++ b/src/store/inquiryFilterStore.ts @@ -5,6 +5,8 @@ type InquiryFilterState = { inquiryListRequest: InquiryListRequest setInquiryListRequest: (inquiryListRequest: InquiryListRequest) => void reset: () => void + offset: number + setOffset: (offset: number) => void } export const useInquiryFilterStore = create((set) => ({ @@ -18,8 +20,6 @@ export const useInquiryFilterStore = create((set) => ({ schFromDt: null, schToDt: null, schAnswerYn: null, - startRow: 1, - endRow: 10, loginId: '', }, setInquiryListRequest: (inquiryListRequest) => set({ inquiryListRequest }), @@ -35,9 +35,10 @@ export const useInquiryFilterStore = create((set) => ({ schFromDt: '', schToDt: '', schAnswerYn: null, - startRow: 1, - endRow: 10, loginId: '', }, + offset: 1, }), + offset: 1, + setOffset: (offset) => set({ offset }), })) diff --git a/src/types/Inquiry.ts b/src/types/Inquiry.ts index 475ed79..c30a5ce 100644 --- a/src/types/Inquiry.ts +++ b/src/types/Inquiry.ts @@ -8,8 +8,6 @@ export type InquiryListRequest = { schFromDt: string | null //search start date schToDt: string | null //search end date schAnswerYn: string | null //search answer yn - startRow: number //start row - endRow: number //end row loginId: string //login id }