sartography
/
spiff-arena
mirror of https://github.com/sartography/spiff-arena.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

updated column form var w/ burnettk

This commit is contained in:
jasquat 2022-12-01 14:48:44 -05:00
parent 3bf23f6624
commit 1be7b87b63
1 changed files with 21 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
spiffworkflow-frontend/src/components/ProcessInstanceListTable.tsx
View File

@ -139,10 +139,11 @@ export default function ProcessInstanceListTable({
>([]); >([]);
const [processInstanceReportJustSaved, setProcessInstanceReportJustSaved] = const [processInstanceReportJustSaved, setProcessInstanceReportJustSaved] =
useState<boolean>(false); useState<boolean>(false);
const [showColumnForm, setShowColumnForm] = useState<boolean>(false); const [showReportColumnForm, setShowReportColumnForm] =
useState<boolean>(false);
const [reportColumnToOperateOn, setReportColumnToOperateOn] = const [reportColumnToOperateOn, setReportColumnToOperateOn] =
useState<ReportColumn | null>(null); useState<ReportColumn | null>(null);
const [columnFormMode, setColumnFormMode] = useState<string>(''); const [reportColumnFormMode, setReportColumnFormMode] = useState<string>('');
const dateParametersToAlwaysFilterBy: dateParameters = useMemo(() => { const dateParametersToAlwaysFilterBy: dateParameters = useMemo(() => {
return { return {
@ -664,8 +665,8 @@ export default function ProcessInstanceListTable({
}; };
const handleColumnFormClose = () => { const handleColumnFormClose = () => {
setShowColumnForm(false); setShowReportColumnForm(false);
setColumnFormMode(''); setReportColumnFormMode('');
setReportColumnToOperateOn(null); setReportColumnToOperateOn(null);
}; };
@ -673,7 +674,7 @@ export default function ProcessInstanceListTable({
if (reportColumnToOperateOn) { if (reportColumnToOperateOn) {
const reportMetadataCopy = { ...reportMetadata }; const reportMetadataCopy = { ...reportMetadata };
let newReportColumns = null; let newReportColumns = null;
if (columnFormMode === 'new') { if (reportColumnFormMode === 'new') {
newReportColumns = reportColumns().concat([reportColumnToOperateOn]); newReportColumns = reportColumns().concat([reportColumnToOperateOn]);
} else { } else {
newReportColumns = reportColumns().map((rc: ReportColumn) => { newReportColumns = reportColumns().map((rc: ReportColumn) => {
@ -688,8 +689,8 @@ export default function ProcessInstanceListTable({
}); });
setReportMetadata(reportMetadataCopy); setReportMetadata(reportMetadataCopy);
setReportColumnToOperateOn(null); setReportColumnToOperateOn(null);
setShowColumnForm(false); setShowReportColumnForm(false);
setShowColumnForm(false); setShowReportColumnForm(false);
} }
}; };
@ -709,8 +710,8 @@ export default function ProcessInstanceListTable({
); );
}; };
const columnForm = () => { const reportColumnForm = () => {
if (columnFormMode === '') { if (reportColumnFormMode === '') {
return null; return null;
} }
const formElements = [ const formElements = [
@ -731,7 +732,7 @@ export default function ProcessInstanceListTable({
}} }}
/>, />,
]; ];
if (columnFormMode === 'new') { if (reportColumnFormMode === 'new') {
formElements.push( formElements.push(
<ComboBox <ComboBox
onChange={updateReportColumn} onChange={updateReportColumn}
@ -753,14 +754,14 @@ export default function ProcessInstanceListTable({
); );
} }
const modalHeading = const modalHeading =
columnFormMode === 'new' reportColumnFormMode === 'new'
? 'Add Column' ? 'Add Column'
: `Edit ${ : `Edit ${
reportColumnToOperateOn ? reportColumnToOperateOn.accessor : '' reportColumnToOperateOn ? reportColumnToOperateOn.accessor : ''
} column`; } column`;
return ( return (
<Modal <Modal
open={showColumnForm} open={showReportColumnForm}
modalHeading={modalHeading} modalHeading={modalHeading}
primaryButtonText="Save" primaryButtonText="Save"
primaryButtonDisabled={!reportColumnToOperateOn} primaryButtonDisabled={!reportColumnToOperateOn}
@ -791,8 +792,8 @@ export default function ProcessInstanceListTable({
title="Edit Header" title="Edit Header"
onClick={() => { onClick={() => {
setReportColumnToOperateOn(reportColumn); setReportColumnToOperateOn(reportColumn);
setShowColumnForm(true); setShowReportColumnForm(true);
setColumnFormMode('edit'); setReportColumnFormMode('edit');
}} }}
> >
{reportColumn.Header} {reportColumn.Header}
@ -822,8 +823,8 @@ export default function ProcessInstanceListTable({
hasIconOnly hasIconOnly
size="sm" size="sm"
onClick={() => { onClick={() => {
setShowColumnForm(true); setShowReportColumnForm(true);
setColumnFormMode('new'); setReportColumnFormMode('new');
}} }}
/> />
</Stack> </Stack>
@ -985,7 +986,7 @@ export default function ProcessInstanceListTable({
return value; return value;
}; };
const columnFormatters: Record<string, any> = { const reportColumnFormatters: Record<string, any> = {
id: formatProcessInstanceId, id: formatProcessInstanceId,
process_model_identifier: formatProcessModelIdentifier, process_model_identifier: formatProcessModelIdentifier,
process_model_display_name: FormatProcessModelDisplayName, process_model_display_name: FormatProcessModelDisplayName,
@ -993,7 +994,8 @@ export default function ProcessInstanceListTable({
end_in_seconds: formatSecondsForDisplay, end_in_seconds: formatSecondsForDisplay,
}; };
const formattedColumn = (row: any, column: any) => { const formattedColumn = (row: any, column: any) => {
const formatter = columnFormatters[column.accessor] ?? defaultFormatter; const formatter =
reportColumnFormatters[column.accessor] ?? defaultFormatter;
const value = row[column.accessor]; const value = row[column.accessor];
if (column.accessor === 'status') { if (column.accessor === 'status') {
return ( return (
@ -1093,7 +1095,7 @@ export default function ProcessInstanceListTable({
} }
return ( return (
<> <>
{columnForm()} {reportColumnForm()}
{processInstanceReportSaveTag()} {processInstanceReportSaveTag()}
{filterComponent()} {filterComponent()}
{reportSearchComponent()} {reportSearchComponent()}