102 lines
3.2 KiB
TypeScript
102 lines
3.2 KiB
TypeScript
"use client";
|
|
|
|
import { useMemo, useState } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
|
|
import { getCoreRowModel, type PaginationState } from "@tanstack/react-table";
|
|
|
|
import { useDataTable, withListQs } from "@/shared/lib";
|
|
import {
|
|
type DesignCnstnMngResponseDto,
|
|
type DesignCnstnMngSearchDto,
|
|
useDesignCnstnMngPage,
|
|
} from "@/entities/design-cnstn";
|
|
import { PbadmsTaskApplyDialog, type PbadmsTaskApplySelection } from "@/widgets/pbadms-sprt";
|
|
import { Button } from "@common/components";
|
|
|
|
import { formatTaskSeComCdForApi } from "../lib/design-cnstn-regist-schema";
|
|
import { createDesignCnstnColumns } from "../model/columns";
|
|
|
|
interface DesignListProps {
|
|
searchParams: DesignCnstnMngSearchDto;
|
|
pagination: PaginationState;
|
|
onPaginationChange: (pagination: PaginationState) => void;
|
|
}
|
|
|
|
function DesignList({ searchParams, pagination, onPaginationChange }: DesignListProps) {
|
|
const router = useRouter();
|
|
const [isTaskSeDialogOpen, setIsTaskSeDialogOpen] = useState(false);
|
|
|
|
const queryParams = useMemo(
|
|
() => ({
|
|
bizNm: searchParams.bizNm,
|
|
taskSeComCd: searchParams.taskSeComCd,
|
|
admdstCd: searchParams.admdstCd,
|
|
page: pagination.pageIndex,
|
|
size: pagination.pageSize,
|
|
sort: searchParams.sort ?? "designCnstnDocNo,desc",
|
|
}),
|
|
[searchParams, pagination],
|
|
);
|
|
|
|
const pageQuery = useDesignCnstnMngPage(queryParams);
|
|
const columns = useMemo(() => createDesignCnstnColumns(), []);
|
|
|
|
const handleRowClick = (row: DesignCnstnMngResponseDto) => {
|
|
router.push(withListQs(`/design-cnstn/${row.designCnstnDocNo}`));
|
|
};
|
|
|
|
const { tableComponent } = useDataTable({
|
|
query: pageQuery,
|
|
tableOptions: {
|
|
columns,
|
|
state: { pagination },
|
|
onPaginationChange: (updater) => {
|
|
const next = typeof updater === "function" ? updater(pagination) : updater;
|
|
onPaginationChange(next);
|
|
},
|
|
getCoreRowModel: getCoreRowModel(),
|
|
manualPagination: true,
|
|
},
|
|
dataTableOptions: {
|
|
caption: "설계검토 목록",
|
|
viewPagination: true,
|
|
onRowClick: handleRowClick,
|
|
},
|
|
});
|
|
|
|
const handleConfirm = (selection: PbadmsTaskApplySelection) => {
|
|
setIsTaskSeDialogOpen(false);
|
|
const qs = new URLSearchParams({
|
|
taskSeComCd: formatTaskSeComCdForApi(selection.selectedCodes),
|
|
admdstCd: selection.admdstCd,
|
|
sido: selection.sido,
|
|
gugun: selection.gugun,
|
|
});
|
|
router.push(`/design-cnstn/regist?${qs}`);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<section className="card card-border mx-0 bg-background pb-8 pt-0">
|
|
<div className="card-header flex items-center justify-between">
|
|
<h3 className="text-2xl font-semibold">설계자문 목록</h3>
|
|
<Button type="button" color="green" onClick={() => setIsTaskSeDialogOpen(true)}>
|
|
신청
|
|
</Button>
|
|
</div>
|
|
{tableComponent}
|
|
</section>
|
|
<PbadmsTaskApplyDialog
|
|
open={isTaskSeDialogOpen}
|
|
onOpenChange={setIsTaskSeDialogOpen}
|
|
onConfirm={handleConfirm}
|
|
title="설계자문 신청"
|
|
codeUpCd="CNFM"
|
|
/>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export { DesignList };
|