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

Checkpoint - new validation & summary screens

Browse Source
This commit is contained in:
darin.kelkhoff
2022-08-29 13:30:29 -05:00
parent f829179f57
commit 0882b92b27
10 changed files with 1129 additions and 210 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/qqq/components/EntityForm/index.tsx
View File

@ -334,8 +334,8 @@ function EntityForm({table, id}: Props): JSX.Element
<MDBox component="div" p={3}>
<Grid container justifyContent="flex-end" spacing={3}>
<QCancelButton onClickHandler={handleCancelClicked} />
<QSaveButton />
<QCancelButton onClickHandler={handleCancelClicked} disabled={isSubmitting} />
<QSaveButton disabled={isSubmitting} />
</Grid>
</MDBox>

49
src/qqq/components/QButtons/index.tsx
View File

@ -24,6 +24,7 @@ import {Link} from "react-router-dom";
import MDButton from "components/MDButton";
import Icon from "@mui/material/Icon";
import React from "react";
import EntityForm from "qqq/components/EntityForm";
// eslint-disable import/prefer-default-export
@ -42,11 +43,16 @@ export function QCreateNewButton(): JSX.Element
);
}
export function QSaveButton(): JSX.Element
interface QSaveButtonProps
{
disabled: boolean
}
export function QSaveButton({disabled}: QSaveButtonProps): JSX.Element
{
return (
<MDBox ml={3} width={standardWidth}>
<MDButton type="submit" variant="gradient" color="info" size="small" fullWidth startIcon={<Icon>save</Icon>}>
<MDButton type="submit" variant="gradient" color="info" size="small" fullWidth startIcon={<Icon>save</Icon>} disabled={disabled}>
Save
</MDButton>
</MDBox>
@ -108,15 +114,48 @@ export function QActionsMenuButton({isOpen, onClickHandler}: QActionsMenuButtonP
interface QCancelButtonProps
{
onClickHandler: any;
disabled: boolean;
label?: string;
iconName?: string
}
export function QCancelButton({onClickHandler}: QCancelButtonProps): JSX.Element
export function QCancelButton({
onClickHandler, disabled, label, iconName,
}: QCancelButtonProps): JSX.Element
{
return (
<MDBox ml="auto" width={standardWidth}>
<MDButton type="button" variant="outlined" color="dark" size="small" fullWidth startIcon={<Icon>cancel</Icon>} onClick={onClickHandler}>
Cancel
<MDButton type="button" variant="outlined" color="dark" size="small" fullWidth startIcon={<Icon>{iconName}</Icon>} onClick={onClickHandler} disabled={disabled}>
{label}
</MDButton>
</MDBox>
);
}
QCancelButton.defaultProps = {
label: "cancel",
iconName: "cancel",
};
interface QSubmitButtonProps
{
label?: string
iconName?: string
disabled: boolean
}
export function QSubmitButton({label, iconName, disabled}: QSubmitButtonProps): JSX.Element
{
return (
<MDBox ml={3} width={standardWidth}>
<MDButton type="submit" variant="gradient" color="dark" size="small" fullWidth startIcon={<Icon>{iconName}</Icon>} disabled={disabled}>
{label}
</MDButton>
</MDBox>
);
}
QSubmitButton.defaultProps = {
label: "Submit",
iconName: "check",
};