complate dynamic form

This commit is contained in:
MehrdadAdabi 2025-11-28 09:41:00 +03:30
parent 84e9b2beb7
commit 47ea7f34d2
2 changed files with 77 additions and 104 deletions

View File

@ -21,6 +21,8 @@ const StepFormPage: FC = () => {
const stageID = params.get("stageID"); const stageID = params.get("stageID");
const processID = params.get("processID"); const processID = params.get("processID");
const { data, isLoading, error } = useQuery<WorkflowResponse>({ const { data, isLoading, error } = useQuery<WorkflowResponse>({
queryKey: ["dynamic-field", stageID, processID], queryKey: ["dynamic-field", stageID, processID],
queryFn: () => { queryFn: () => {

View File

@ -6,8 +6,7 @@ import { useMemo, type FC } from "react";
import { useNavigate, useParams } from "react-router-dom"; import { useNavigate, useParams } from "react-router-dom";
import type { import type {
CampaignProcess, CampaignProcess,
GroupedCampaign, GroupedCampaign
StepItems,
} from "./step.type"; } from "./step.type";
const StepsPage: FC = () => { const StepsPage: FC = () => {
@ -18,82 +17,74 @@ const StepsPage: FC = () => {
queryFn: () => getCampaignStepsService(), queryFn: () => getCampaignStepsService(),
}); });
const steps = useMemo(() => { const steps = useMemo(() => {
if (!Array.isArray(data) || data.length === 0) return []; if (!Array.isArray(data) || data.length === 0) return [];
const row = data[0]; const row = data[0];
if (!row || Object.keys(row).length === 0) return []; if (!row || Object.keys(row).length === 0) return [];
const processes = Object.keys(row) // 1) جمع‌آوری فرآیندها
.filter( const temp: CampaignProcess[] = [];
(key) =>
key.startsWith("process") &&
!key.endsWith("_id") &&
key.includes("_")
)
.map((key) => {
const index = key.match(/process(\d+)_/)?.[1];
if (!index) return null;
return { Object.keys(row).forEach(key => {
processId: row[`process${index}`], const match = key.match(/^process(\d+)_category$/);
category: row[`process${index}_category`], if (match) {
score: row[`process${index}_score`], const i = match[1];
stageId: row[`process${index}_stage_id`], temp.push({
status: row[`process${index}_status`], processId: String(row[`process${i}`]),
}; category: String(row[`process${i}_category`]),
}) score: String(row[`process${i}_score`]),
.filter(Boolean); stageId: String(row[`process${i}_stage_id`]),
status: String(row[`process${i}_status`]),
// title: String(row[`process${i}_title`]),
// selected: false,
// groupIndex: 0, // placeholder
});
}
});
// Group + Dedupe // 2) گروه‌بندی + حذف تکراری
const grouped = Object.values( const grouped: GroupedCampaign[] = Object.values(
processes.reduce( temp.reduce((acc: Record<string, GroupedCampaign>, item) => {
( if (!item?.category) return acc;
acc: Record<
string,
{
category: string;
processes: CampaignProcess[];
stageID: number;
processId: number;
}
>,
item
) => {
if (!item || !item.category) return acc;
if (!acc[item.category]) { if (!acc[item.category]) {
acc[item.category] = { acc[item.category] = {
category: item.category, category: item.category,
processes: [], processes: [],
stageID: Number(item.stageId), // groupIndex: 0,
processId: Number(item.processId), };
}; }
}
// حذف تکراری‌ها بر اساس processId const exists = acc[item.category].processes.some(
const exists = acc[item.category].processes.some( p => p.processId === item.processId
(p) => p.processId === item.processId );
);
if (!exists) { if (!exists) {
acc[item.category].processes.push({ acc[item.category].processes.push(item);
processId: String(item.processId), }
category: String(item.category),
score: String(item.score),
stageId: String(item.stageId),
status: String(item.status),
});
}
return acc; return acc;
}, }, {})
{}
)
); );
return grouped as Array<StepItems>;
// 3) ست کردن groupIndex روی گروه‌ها و process های داخلش
// grouped.forEach((group, index) => {
// group.groupIndex = index;
// group.processes.forEach(proc => {
// proc.groupIndex = index;
// });
// });
return grouped;
}, [data]); }, [data]);
const handleBack = () => { const handleBack = () => {
navigate( navigate(
`${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.campaigns}/${campaignId}` `${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.campaigns}/${campaignId}`
@ -103,50 +94,30 @@ const StepsPage: FC = () => {
const handleStepClick = (step: GroupedCampaign) => { const handleStepClick = (step: GroupedCampaign) => {
if ( const filteIncompleteProcess = step.processes.filter(el => el.status === 'انجام نشده')
step.stageID !== null &&
step.stageID !== 0 && if (filteIncompleteProcess.length > 0) {
step.processId !== null && const firstItem = filteIncompleteProcess[0]
step.processId !== 0 if (firstItem.stageId) {
) { navigate(
navigate( `${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.dynamicForm}?stageID=${firstItem.stageId}`,
`${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.dynamicForm}?stageID=${step.stageID}`, {
{ replace: true,
replace: true, })
} }
); if (firstItem.processId) {
navigate(
`${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.dynamicForm}?processID=${firstItem.processId}`,
{
replace: true,
}
);
}
} }
if (
(step.processId != 0 &&
step.processId != null &&
step.processId != undefined &&
step.stageID === null) ||
step.stageID === undefined
) {
navigate(
`${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.dynamicForm}?processID=${step.processId}`,
{
replace: true,
}
);
}
if ( }
(step.stageID != 0 &&
step.stageID != null &&
step.stageID != undefined &&
step.processId === null) ||
step.processId === undefined
) {
navigate(
`${DASHBOARD_ROUTE.sub}/${DASHBOARD_ROUTE.dynamicForm}?stageID=${step.stageID}`,
{
replace: true,
}
);
}
};
if (isLoading) { if (isLoading) {
return ( return (