diff --git a/apps/cs/src/pages/apilog/ui/apilog-page.tsx b/apps/cs/src/pages/apilog/ui/apilog-page.tsx index 4bfce86e2..2785fbde8 100644 --- a/apps/cs/src/pages/apilog/ui/apilog-page.tsx +++ b/apps/cs/src/pages/apilog/ui/apilog-page.tsx @@ -26,36 +26,32 @@ type DateRange = { to?: Date | undefined; }; -function ApiLogPage({}) { - // 1주일 전부터 오늘까지 기본 날짜 설정 +function ApiLogPage() { const defaultDateRange: DateRange = { from: dayjs().subtract(7, "day").toDate(), to: dayjs().toDate(), }; - const [dateRange, setDateRange] = useState(defaultDateRange); - const [pagination, setPagination] = useState({ pageIndex: 0, pageSize: 10, }); - - const [loginlogPostQuery, setLoginlogPostQuery] = useState({ + const [dateRange, setDateRange] = useState(defaultDateRange); + const [userId, setUserId] = useState(""); + const [apiHttpPmhd, setApiHttpPmhd] = useState(""); + const [searchParams, setSearchParams] = useState({ userId: "", - siteId: "", apiHttpPmhd: "", - dmndUrl: "", - ipAddr: "", dmndDtStart: dayjs().subtract(7, "day").format("YYYY-MM-DD"), dmndDtEnd: dayjs().format("YYYY-MM-DD"), - sort: "lgnDt,asc", + sort: "regDt,desc", }); const query = useQuery({ - queryKey: [ENDPOINT.CMS_SERVICE.APILOG, pagination], + queryKey: [ENDPOINT.CMS_SERVICE.APILOG, searchParams, pagination], queryFn: () => ApiLogApi.getApiLogList({ - ...loginlogPostQuery, + ...searchParams, page: pagination.pageIndex, size: pagination.pageSize, }), @@ -81,13 +77,27 @@ function ApiLogPage({}) { const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - query.refetch(); + setSearchParams({ + ...searchParams, + userId, + apiHttpPmhd, + dmndDtStart: dayjs(dateRange.from).format("YYYY-MM-DD"), + dmndDtEnd: dayjs(dateRange.to).format("YYYY-MM-DD"), + }); }; - const handleLoginlogParamsChange = - (key: keyof ApiLogParams) => (value: unknown) => { - setLoginlogPostQuery({ ...loginlogPostQuery, [key]: value }); - }; + const handleReset = () => { + setUserId(""); + setApiHttpPmhd(""); + setDateRange(defaultDateRange); + setSearchParams({ + ...searchParams, + userId: "", + apiHttpPmhd: "", + dmndDtStart: dayjs().subtract(7, "day").format("YYYY-MM-DD"), + dmndDtEnd: dayjs().format("YYYY-MM-DD"), + }); + }; const handlePresetDateRange = (value: string) => { let presetDateRange: DateRange | undefined; @@ -113,19 +123,7 @@ function ApiLogPage({}) { default: presetDateRange = undefined; } - handleDateRangeChange(presetDateRange); - }; - - const handleDateRangeChange = (value: DateRange | undefined) => { - setDateRange(value || defaultDateRange); - setLoginlogPostQuery({ - ...loginlogPostQuery, - dmndDtStart: - dayjs(value?.from).format("YYYY-MM-DD") ?? - dayjs().subtract(7, "day").format("YYYY-MM-DD"), - dmndDtEnd: - dayjs(value?.to).format("YYYY-MM-DD") ?? dayjs().format("YYYY-MM-DD"), - }); + setDateRange(presetDateRange || defaultDateRange); }; return ( @@ -135,7 +133,7 @@ function ApiLogPage({}) { setDateRange(value || defaultDateRange)} >
setUserId(e.target.value)} className="h-[3.2rem] w-[20rem] rounded-sm !text-[1.3rem]" - value={loginlogPostQuery.userId} - onChange={(e) => - handleLoginlogParamsChange("userId")(e.target.value) - } /> - setApiHttpPmhd(value)} + > @@ -173,12 +172,20 @@ function ApiLogPage({}) { +
-

로그인로그 목록

+

작업로그 목록

@@ -159,13 +158,14 @@ function LoginlogPage({}) { - handleLoginlogParamsChange("userId")(e.target.value) - } + value={userId} + onChange={(e) => setUserId(e.target.value)} /> - setErrOcrnYn(value)} + > @@ -183,6 +183,14 @@ function LoginlogPage({}) { ? "조회 중..." : "조회"} +
diff --git a/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx b/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx index 5cb8bf13d..3637b80d4 100644 --- a/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx +++ b/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx @@ -3,65 +3,54 @@ import dayjs from "dayjs"; import { useState } from "react"; import { keepPreviousData, useQuery } from "@tanstack/react-query"; +import { getCoreRowModel, type PaginationState } from "@tanstack/react-table"; import { - getCoreRowModel, - type PaginationState, -} from "@tanstack/react-table"; -import { - Button, - DateRangePicker, - Input, + Button, + DateRangePicker, + Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, - } from "@common/components"; +} from "@common/components"; import { PrivacyLogPrivacy } from "@/entities/privacylog"; -import { type PrivacyLogParams} from "@/entities/privacylog/model/privacylog-interface"; -import { useDataTable } from "@/shared/lib"; +import type { PrivacyLogParams } from "@/entities/privacylog/model/privacylog-interface"; +import { useDataTable } from "@/shared/lib"; import { ENDPOINT } from "@/shared/config"; import { columns } from "@/pages/privacylog/model/table-columns"; - - type DateRange = { from: Date | undefined; to?: Date | undefined; }; -function PrivacyLogPage({ }) { - - // 1주일 전부터 오늘까지 기본 날짜 설정 +function PrivacyLogPage() { const defaultDateRange: DateRange = { from: dayjs().subtract(7, "day").toDate(), to: dayjs().toDate(), }; - - const [dateRange, setDateRange] = useState(defaultDateRange); const [pagination, setPagination] = useState({ pageIndex: 0, pageSize: 10, }); - - const [privacylogPostQuery, setprivacylogPostQuery] = useState< PrivacyLogParams>({ - siteId: "", - inqInfoKeywordType: "userName", - inqInfoKeyword: "", - rqstrIp: "", - inqDtStart: dayjs().subtract(7, "day").format("YYYY-MM-DD"), - inqDtEnd: dayjs().format("YYYY-MM-DD"), - sort:"inqDt,asc" + const [dateRange, setDateRange] = useState(defaultDateRange); + const [inqInfoKeyword, setInqInfoKeyword] = useState(""); + const [searchParams, setSearchParams] = useState({ + inqInfoKeywordType: "userName", + inqInfoKeyword: "", + inqDtStart: dayjs().subtract(7, "day").format("YYYY-MM-DD"), + inqDtEnd: dayjs().format("YYYY-MM-DD"), + sort: "inqDt,asc", }); - - + const query = useQuery({ - queryKey: [ENDPOINT.USER_SERVICE.PRIVACYLOG, pagination], + queryKey: [ENDPOINT.USER_SERVICE.PRIVACYLOG, searchParams, pagination], queryFn: () => PrivacyLogPrivacy.getPrivacyLogList({ - ...privacylogPostQuery, + ...searchParams, page: pagination.pageIndex, size: pagination.pageSize, }), @@ -87,14 +76,25 @@ function PrivacyLogPage({ }) { const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - query.refetch(); + setSearchParams({ + ...searchParams, + inqInfoKeyword, + inqDtStart: dayjs(dateRange.from).format("YYYY-MM-DD"), + inqDtEnd: dayjs(dateRange.to).format("YYYY-MM-DD"), + }); }; - const handleprivacylogParamsChange = - (key: keyof PrivacyLogParams) => (value: unknown) => { - setprivacylogPostQuery({ ...privacylogPostQuery, [key]: value }); + const handleReset = () => { + setInqInfoKeyword(""); + setDateRange(defaultDateRange); + setSearchParams({ + ...searchParams, + inqInfoKeyword: "", + inqDtStart: dayjs().subtract(7, "day").format("YYYY-MM-DD"), + inqDtEnd: dayjs().format("YYYY-MM-DD"), + }); }; - + const handlePresetDateRange = (value: string) => { let presetDateRange: DateRange | undefined; switch (value) { @@ -119,23 +119,9 @@ function PrivacyLogPage({ }) { default: presetDateRange = undefined; } - handleDateRangeChange(presetDateRange); + setDateRange(presetDateRange || defaultDateRange); }; - - - const handleDateRangeChange = (value: DateRange | undefined) => { - setDateRange(value || defaultDateRange); - setprivacylogPostQuery({ - ...privacylogPostQuery, - inqDtStart: dayjs(value?.from).format("YYYY-MM-DD") ?? dayjs().subtract(7, "day").format("YYYY-MM-DD"), - inqDtEnd: dayjs(value?.to).format("YYYY-MM-DD") ?? dayjs().format("YYYY-MM-DD"), - }); - }; - - - - return (
@@ -143,7 +129,7 @@ function PrivacyLogPage({ }) { setDateRange(value || defaultDateRange)} >
- handleprivacylogParamsChange("inqInfoKeyword")(e.target.value) - } + value={inqInfoKeyword} + onChange={(e) => setInqInfoKeyword(e.target.value)} /> - + +
-

로그인로그 목록

+

+ 개인정보 조회 로그 목록 +