refactor: 사이트 반영 폼 리팩토링
This commit is contained in:
@@ -24,15 +24,15 @@ import type { PageableList } from "@/shared/model";
|
||||
import { ENDPOINT } from "@/shared/config";
|
||||
import { type PostingType } from "../model/posting-interface";
|
||||
|
||||
type PostingTarget = {
|
||||
interface PostingTarget {
|
||||
pstgTrgtNm: string;
|
||||
pstgTrgtNo: number;
|
||||
};
|
||||
}
|
||||
|
||||
type PostingDialogProps = {
|
||||
interface PostingDialogProps {
|
||||
postingType: PostingType;
|
||||
postingTargets: PostingTarget[];
|
||||
};
|
||||
}
|
||||
|
||||
const POSTING_TYPE_LABEL = {
|
||||
POPUP: "팝업",
|
||||
@@ -42,6 +42,9 @@ const POSTING_TYPE_LABEL = {
|
||||
|
||||
function PostingDialog({ postingType, postingTargets }: PostingDialogProps) {
|
||||
const [selectedRows, setSelectedRows] = useState<number[]>([]);
|
||||
const [rememberSelectValues, setRememberSelectValues] = useState<
|
||||
Record<string, string>
|
||||
>({});
|
||||
|
||||
const { data: siteList } = useQuery<PageableList<Site>>({
|
||||
queryKey: [ENDPOINT.CMS_SERVICE.SITES],
|
||||
@@ -54,13 +57,49 @@ function PostingDialog({ postingType, postingTargets }: PostingDialogProps) {
|
||||
name: "pstg",
|
||||
});
|
||||
|
||||
const handleSelectAll = () => {
|
||||
if (selectedRows.length === (siteList?.content.length ?? 0)) {
|
||||
initialize();
|
||||
} else {
|
||||
setSelectedRows(siteList?.content.map((_, i) => i) ?? []);
|
||||
handleAllSelectRow();
|
||||
}
|
||||
const isAllSelected =
|
||||
siteList && selectedRows.length === siteList.content.length;
|
||||
|
||||
const initialize = () => {
|
||||
setSelectedRows([]);
|
||||
replace([]);
|
||||
};
|
||||
|
||||
const handleOpenChange = (open: boolean) => {
|
||||
if (open) return true;
|
||||
initialize();
|
||||
};
|
||||
|
||||
const handleAppendFields = (i: number) => {
|
||||
const siteId = siteList?.content[i]?.siteId ?? "";
|
||||
const newFields = postingTargets.map((target) => ({
|
||||
siteId,
|
||||
pstgTypeCd: postingType,
|
||||
pstgTrgtNo: target.pstgTrgtNo,
|
||||
pstgBgngDt: "",
|
||||
pstgEndDt: "",
|
||||
pstgPrdSeCd: rememberSelectValues[siteId] ?? "",
|
||||
delYn: "N",
|
||||
mode: "C",
|
||||
}));
|
||||
append(newFields);
|
||||
};
|
||||
|
||||
const handleUpdateFields =
|
||||
(siteId: string) => (obj: Record<string, unknown>) => {
|
||||
const updatedFields = fields.map((field) =>
|
||||
"siteId" in field && field.siteId === siteId
|
||||
? { ...field, ...obj }
|
||||
: field,
|
||||
);
|
||||
replace(updatedFields);
|
||||
};
|
||||
|
||||
const handleRemoveFields = (siteId: string) => {
|
||||
const filteredFields = fields.filter(
|
||||
(field) => "siteId" in field && field.siteId !== siteId,
|
||||
);
|
||||
replace(filteredFields);
|
||||
};
|
||||
|
||||
const handleSelectRow = (i: number) => {
|
||||
@@ -72,7 +111,6 @@ function PostingDialog({ postingType, postingTargets }: PostingDialogProps) {
|
||||
if (isSelected) {
|
||||
const siteId = siteList?.content[i]?.siteId;
|
||||
if (!siteId) return;
|
||||
|
||||
handleRemoveFields(siteId);
|
||||
return;
|
||||
}
|
||||
@@ -80,48 +118,26 @@ function PostingDialog({ postingType, postingTargets }: PostingDialogProps) {
|
||||
handleAppendFields(i);
|
||||
};
|
||||
|
||||
const handleAllSelectRow = () => {
|
||||
replace([]);
|
||||
siteList?.content.forEach((_, i) => {
|
||||
handleAppendFields(i);
|
||||
});
|
||||
};
|
||||
|
||||
const handleAppendFields = (i: number) => {
|
||||
for (const target of postingTargets) {
|
||||
append({
|
||||
siteId: siteList?.content[i]?.siteId ?? "",
|
||||
pstgTypeCd: postingType,
|
||||
pstgTrgtNo: target.pstgTrgtNo,
|
||||
pstgBgngDt: "",
|
||||
pstgEndDt: "",
|
||||
pstgPrdSeCd: "",
|
||||
delYn: "N",
|
||||
mode: "C",
|
||||
});
|
||||
const handleSelectAll = () => {
|
||||
if (selectedRows.length === (siteList?.content.length ?? 0)) {
|
||||
initialize();
|
||||
} else {
|
||||
setSelectedRows(siteList?.content.map((_, i) => i) ?? []);
|
||||
replace([]);
|
||||
siteList?.content.forEach((_, i) => handleAppendFields(i));
|
||||
}
|
||||
};
|
||||
|
||||
const handleRemoveFields = (siteId: string) => {
|
||||
const filteredFields = fields.filter(
|
||||
(field) => "siteId" in field && field.siteId !== siteId,
|
||||
);
|
||||
replace(filteredFields);
|
||||
const handleSelectValueChange = (siteId: string) => (value: string) => {
|
||||
setRememberSelectValues((prev) => ({
|
||||
...prev,
|
||||
[siteId]: value,
|
||||
}));
|
||||
handleUpdateFields(siteId)({
|
||||
pstgPrdSeCd: value,
|
||||
});
|
||||
};
|
||||
|
||||
const handleOpenChange = (open: boolean) => {
|
||||
if (open) return true;
|
||||
initialize();
|
||||
};
|
||||
|
||||
const initialize = () => {
|
||||
setSelectedRows([]);
|
||||
replace([]);
|
||||
};
|
||||
|
||||
const isAllSelected =
|
||||
siteList && selectedRows.length === siteList.content.length;
|
||||
|
||||
return (
|
||||
<Dialog onOpenChange={handleOpenChange}>
|
||||
<DialogTrigger asChild>
|
||||
@@ -176,7 +192,10 @@ function PostingDialog({ postingType, postingTargets }: PostingDialogProps) {
|
||||
</TableCell>
|
||||
<TableCell align="center">{site.siteNm}</TableCell>
|
||||
<TableCell align="left">
|
||||
<PostingPeriodSelect disabled={!selectedRows.includes(i)} />
|
||||
<PostingPeriodSelect
|
||||
onValueChange={handleSelectValueChange(site.siteId)}
|
||||
disabled={!selectedRows.includes(i)}
|
||||
/>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
|
||||
Reference in New Issue
Block a user