Squashed 'spiffworkflow-frontend/' changes from ca2bc557f1..1df0c1a9b2

1df0c1a9b2 Change steps when viewing a process instance model (#18)
b471cbaa77 Prettier
01fc31aa27 From the logs, allow viewing a diagram in a previous state (#15)

git-subtree-dir: spiffworkflow-frontend
git-subtree-split: 1df0c1a9b2af5e22343da13f78e585096f877c65
This commit is contained in:
burnettk 2022-11-04 09:33:46 -04:00
parent ac0aa03739
commit fbebc72725
3 changed files with 88 additions and 7 deletions

View File

@ -76,6 +76,10 @@ export default function AdminRoutes() {
path="process-models/:process_group_id/:process_model_id/process-instances/:process_instance_id"
element={<ProcessInstanceShow />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/process-instances/:process_instance_id/:spiff_step"
element={<ProcessInstanceShow />}
/>
<Route
path="process-models/:process_group_id/:process_model_id/process-instances/reports"
element={<ProcessInstanceReportList />}

View File

@ -1,6 +1,6 @@
import { useEffect, useState } from 'react';
import { Table } from 'react-bootstrap';
import { useParams, useSearchParams } from 'react-router-dom';
import { useParams, useSearchParams, Link } from 'react-router-dom';
import PaginationForTable from '../components/PaginationForTable';
import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
import {
@ -39,7 +39,14 @@ export default function ProcessInstanceLogList() {
<td>{rowToUse.bpmn_task_name}</td>
<td>{rowToUse.bpmn_task_type}</td>
<td>{rowToUse.username}</td>
<td>{convertSecondsToFormattedDate(rowToUse.timestamp)}</td>
<td>
<Link
data-qa="process-instance-show-link"
to={`/admin/process-models/${params.process_group_id}/${params.process_model_id}/process-instances/${rowToUse.process_instance_id}/${rowToUse.spiff_step}`}
>
{convertSecondsToFormattedDate(rowToUse.timestamp)}
</Link>
</td>
</tr>
);
});

View File

@ -32,10 +32,16 @@ export default function ProcessInstanceShow() {
path: `/process-models/${params.process_group_id}/${params.process_model_id}/process-instances/${params.process_instance_id}`,
successCallback: setProcessInstance,
});
HttpService.makeCallToBackend({
path: `/process-instance/${params.process_instance_id}/tasks?all_tasks=true`,
successCallback: setTasks,
});
if (typeof params.spiff_step === 'undefined')
HttpService.makeCallToBackend({
path: `/process-instance/${params.process_instance_id}/tasks?all_tasks=true`,
successCallback: setTasks,
});
else
HttpService.makeCallToBackend({
path: `/process-instance/${params.process_instance_id}/tasks?all_tasks=true&spiff_step=${params.spiff_step}`,
successCallback: setTasks,
});
}, [params]);
const deleteProcessInstance = () => {
@ -90,6 +96,62 @@ export default function ProcessInstanceShow() {
return taskIds;
};
const currentSpiffStep = (processInstanceToUse: any) => {
if (typeof params.spiff_step === 'undefined') {
return processInstanceToUse.spiff_step;
}
return Number(params.spiff_step);
};
const showingFirstSpiffStep = (processInstanceToUse: any) => {
return currentSpiffStep(processInstanceToUse) === 1;
};
const showingLastSpiffStep = (processInstanceToUse: any) => {
return (
currentSpiffStep(processInstanceToUse) === processInstanceToUse.spiff_step
);
};
const spiffStepLink = (
processInstanceToUse: any,
label: string,
distance: number
) => {
return (
<li>
<Link
reloadDocument
data-qa="process-instance-step-link"
to={`/admin/process-models/${params.process_group_id}/${
params.process_model_id
}/process-instances/${params.process_instance_id}/${
currentSpiffStep(processInstanceToUse) + distance
}`}
>
{label}
</Link>
</li>
);
};
const previousStepLink = (processInstanceToUse: any) => {
if (showingFirstSpiffStep(processInstanceToUse)) {
return null;
}
return spiffStepLink(processInstanceToUse, 'Previous Step', -1);
};
const nextStepLink = (processInstanceToUse: any) => {
if (showingLastSpiffStep(processInstanceToUse)) {
return null;
}
return spiffStepLink(processInstanceToUse, 'Next Step', 1);
};
const getInfoTag = (processInstanceToUse: any) => {
const currentEndDate = convertSecondsToFormattedDate(
processInstanceToUse.end_in_seconds
@ -129,6 +191,12 @@ export default function ProcessInstanceShow() {
Messages
</Link>
</li>
<li>
Step {currentSpiffStep(processInstanceToUse)} of{' '}
{processInstanceToUse.spiff_step}
</li>
{previousStepLink(processInstanceToUse)}
{nextStepLink(processInstanceToUse)}
</ul>
);
};
@ -228,7 +296,9 @@ export default function ProcessInstanceShow() {
};
const canEditTaskData = (task: any) => {
return task.state === 'READY';
return (
task.state === 'READY' && showingLastSpiffStep(processInstance as any)
);
};
const cancelEditingTaskData = () => {