QRunIO/qqq-frontend-material-dashboard
2
0
Fork 0
mirror of https://github.com/Kingsrook/qqq-frontend-material-dashboard.git synced 2025-07-18 05:10:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

CE-1955 - Break ProcessViewForm out into its own reusable component

Browse Source
This commit is contained in:
darin.kelkhoff
2024-11-25 10:35:35 -06:00
parent 451af347f7
commit 3fc4e37c12
2 changed files with 74 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/qqq/components/processes/ProcessViewForm.tsx Normal file
View File

@ -0,0 +1,71 @@
/*
* QQQ - Low-code Application Framework for Engineers.
* Copyright (C) 2021-2024. Kingsrook, LLC
* 651 N Broad St Ste 205 # 6917 | Middletown DE 19709 | United States
* contact@kingsrook.com
* https://github.com/Kingsrook/
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import {AdornmentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/AdornmentType";
import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData";
import Grid from "@mui/material/Grid";
import MDTypography from "qqq/components/legacy/MDTypography";
import ValueUtils from "qqq/utils/qqq/ValueUtils";
interface ProcessViewFormProps
{
fields: QFieldMetaData[];
values: { [fieldName: string]: any };
columns?: number;
}
ProcessViewForm.defaultProps = {
columns: 2
};
/***************************************************************************
** a "view form" within a process step
**
***************************************************************************/
export default function ProcessViewForm({fields, values, columns}: ProcessViewFormProps): JSX.Element
{
const sm = Math.floor(12 / columns);
return <Grid container>
{fields.map((field: QFieldMetaData) => (
field.hasAdornment(AdornmentType.ERROR) ? (
values[field.name] && (
<Grid item xs={12} sm={sm} key={field.name} display="flex" py={1} pr={2}>
<MDTypography variant="button" fontWeight="regular">
{ValueUtils.getValueForDisplay(field, values[field.name], undefined, "view")}
</MDTypography>
</Grid>
)
) : (
<Grid item xs={12} sm={sm} key={field.name} display="flex" py={1} pr={2}>
<MDTypography variant="button" fontWeight="bold">
{field.label}
: &nbsp;
</MDTypography>
<MDTypography variant="button" fontWeight="regular" color="text">
{ValueUtils.getValueForDisplay(field, values[field.name], undefined, "view")}
</MDTypography>
</Grid>
)))
}
</Grid>;
}

28
src/qqq/pages/processes/ProcessRun.tsx
View File

@ -20,7 +20,6 @@
*/
import {QException} from "@kingsrook/qqq-frontend-core/lib/exceptions/QException";
import {AdornmentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/AdornmentType";
import {QComponentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QComponentType";
import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData";
import {QFrontendComponent} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFrontendComponent";
@ -65,6 +64,7 @@ import BulkLoadProfileForm from "qqq/components/processes/BulkLoadProfileForm";
import BulkLoadValueMappingForm from "qqq/components/processes/BulkLoadValueMappingForm";
import {GoogleDriveFolderPickerWrapper} from "qqq/components/processes/GoogleDriveFolderPickerWrapper";
import ProcessSummaryResults from "qqq/components/processes/ProcessSummaryResults";
import ProcessViewForm from "qqq/components/processes/ProcessViewForm";
import ValidationReview from "qqq/components/processes/ValidationReview";
import {BlockData} from "qqq/components/widgets/blocks/BlockModels";
import CompositeWidget, {CompositeData} from "qqq/components/widgets/CompositeWidget";
@ -874,29 +874,7 @@ function ProcessRun({process, table, defaultProcessValues, isModal, isWidget, is
}
{
component.type === QComponentType.VIEW_FORM && step.viewFields && (
<div>
{step.viewFields.map((field: QFieldMetaData) => (
field.hasAdornment(AdornmentType.ERROR) ? (
processValues[field.name] && (
<Box key={field.name} display="flex" py={1} pr={2}>
<MDTypography variant="button" fontWeight="regular">
{ValueUtils.getValueForDisplay(field, processValues[field.name], undefined, "view")}
</MDTypography>
</Box>
)
) : (
<Box key={field.name} display="flex" py={1} pr={2}>
<MDTypography variant="button" fontWeight="bold">
{field.label}
: &nbsp;
</MDTypography>
<MDTypography variant="button" fontWeight="regular" color="text">
{ValueUtils.getValueForDisplay(field, processValues[field.name], undefined, "view")}
</MDTypography>
</Box>
)))
}
</div>
<ProcessViewForm fields={step.viewFields} values={processValues} columns={1} />
)
}
{
@ -1906,7 +1884,7 @@ function ProcessRun({process, table, defaultProcessValues, isModal, isWidget, is
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// clear out the active step now, to avoid a flash of the old one after the job completes, but before the new one is all set //
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
setActiveStep(null);
// setActiveStep(null);
setTimeout(async () =>
{