mirror of
https://github.com/Kingsrook/qqq-frontend-material-dashboard.git
synced 2025-07-17 21:00:45 +00:00
Support combination of non-query table (so goto only) plus variants.
This commit is contained in:
@ -22,6 +22,7 @@
|
||||
import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData";
|
||||
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {QTableVariant} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableVariant";
|
||||
import {QCriteriaOperator} from "@kingsrook/qqq-frontend-core/lib/model/query/QCriteriaOperator";
|
||||
import {QFilterCriteria} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterCriteria";
|
||||
import {QQueryFilter} from "@kingsrook/qqq-frontend-core/lib/model/query/QQueryFilter";
|
||||
@ -45,8 +46,10 @@ interface Props
|
||||
isOpen: boolean;
|
||||
metaData: QInstance;
|
||||
tableMetaData: QTableMetaData;
|
||||
tableVariant?: QTableVariant;
|
||||
closeHandler: () => void;
|
||||
mayClose: boolean;
|
||||
subHeader?: JSX.Element;
|
||||
}
|
||||
|
||||
GotoRecordDialog.defaultProps = {
|
||||
@ -155,7 +158,9 @@ function GotoRecordDialog(props: Props): JSX.Element
|
||||
{
|
||||
setError("");
|
||||
const filter = new QQueryFilter([new QFilterCriteria(fieldName, QCriteriaOperator.EQUALS, [values[fieldName]])], null, "AND", null, 10);
|
||||
const queryResult = await qController.query(props.tableMetaData.name, filter)
|
||||
try
|
||||
{
|
||||
const queryResult = await qController.query(props.tableMetaData.name, filter, null, props.tableVariant)
|
||||
if (queryResult.length == 0)
|
||||
{
|
||||
setError("Record not found.");
|
||||
@ -163,7 +168,7 @@ function GotoRecordDialog(props: Props): JSX.Element
|
||||
}
|
||||
else if (queryResult.length == 1)
|
||||
{
|
||||
navigate(`${props.metaData.getTablePathByName(props.tableMetaData.name)}/${queryResult[0].values.get(props.tableMetaData.primaryKeyField)}`);
|
||||
navigate(`${props.metaData.getTablePathByName(props.tableMetaData.name)}/${encodeURIComponent(queryResult[0].values.get(props.tableMetaData.primaryKeyField))}`);
|
||||
close();
|
||||
}
|
||||
else
|
||||
@ -172,6 +177,13 @@ function GotoRecordDialog(props: Props): JSX.Element
|
||||
setTimeout(() => setError(""), 3000);
|
||||
}
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
// @ts-ignore
|
||||
setError(`Error: ${(e && e.message) ? e.message : e}`);
|
||||
setTimeout(() => setError(""), 6000);
|
||||
}
|
||||
}
|
||||
|
||||
if(props.tableMetaData)
|
||||
{
|
||||
@ -184,7 +196,9 @@ function GotoRecordDialog(props: Props): JSX.Element
|
||||
return (
|
||||
<Dialog open={props.isOpen} onClose={() => closeRequested} onKeyPress={(e) => keyPressed(e)} fullWidth maxWidth={"sm"}>
|
||||
<DialogTitle>Go To...</DialogTitle>
|
||||
|
||||
<DialogContent>
|
||||
{props.subHeader}
|
||||
{
|
||||
fields.map((field, index) =>
|
||||
(
|
||||
@ -237,9 +251,11 @@ interface GotoRecordButtonProps
|
||||
{
|
||||
metaData: QInstance;
|
||||
tableMetaData: QTableMetaData;
|
||||
tableVariant?: QTableVariant;
|
||||
autoOpen?: boolean;
|
||||
buttonVisible?: boolean;
|
||||
mayClose?: boolean;
|
||||
subHeader?: JSX.Element;
|
||||
}
|
||||
|
||||
GotoRecordButton.defaultProps = {
|
||||
@ -268,7 +284,7 @@ export function GotoRecordButton(props: GotoRecordButtonProps): JSX.Element
|
||||
{
|
||||
props.buttonVisible && hasGotoFieldNames(props.tableMetaData) && <Button onClick={openGoto} >Go To...</Button>
|
||||
}
|
||||
<GotoRecordDialog metaData={props.metaData} tableMetaData={props.tableMetaData} isOpen={gotoIsOpen} closeHandler={closeGoto} mayClose={props.mayClose} />
|
||||
<GotoRecordDialog metaData={props.metaData} tableMetaData={props.tableMetaData} tableVariant={props.tableVariant} isOpen={gotoIsOpen} closeHandler={closeGoto} mayClose={props.mayClose} subHeader={props.subHeader} />
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
@ -539,15 +539,7 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
|
||||
<CustomWidthTooltip title={tooltipHTML}>
|
||||
<IconButton sx={{p: 0, fontSize: "0.5rem", mb: 1, color: "#9f9f9f", fontVariationSettings: "'wght' 100"}}><Icon fontSize="small">emergency</Icon></IconButton>
|
||||
</CustomWidthTooltip>
|
||||
{
|
||||
tableVariant &&
|
||||
<Typography variant="h6" color="text" fontWeight="light">
|
||||
{tableMetaData.variantTableLabel}: {tableVariant.name}
|
||||
<Tooltip title={`Change ${tableMetaData.variantTableLabel}`}>
|
||||
<IconButton onClick={promptForTableVariantSelection} sx={{p: 0, m: 0, ml: .5, mb: .5, color: "#9f9f9f", fontVariationSettings: "'wght' 100"}}><Icon fontSize="small">settings</Icon></IconButton>
|
||||
</Tooltip>
|
||||
</Typography>
|
||||
}
|
||||
{tableVariant && getTableVariantHeader()}
|
||||
</div>);
|
||||
}
|
||||
else
|
||||
@ -555,19 +547,23 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
|
||||
return (
|
||||
<div>
|
||||
{label}
|
||||
{
|
||||
tableVariant &&
|
||||
<Typography variant="h6" color="text" fontWeight="light">
|
||||
{tableMetaData.variantTableLabel}: {tableVariant.name}
|
||||
<Tooltip title={`Change ${tableMetaData.variantTableLabel}`}>
|
||||
<IconButton onClick={promptForTableVariantSelection} sx={{p: 0, m: 0, ml: .5, mb: .5, color: "#9f9f9f", fontVariationSettings: "'wght' 100"}}><Icon fontSize="small">settings</Icon></IconButton>
|
||||
</Tooltip>
|
||||
</Typography>
|
||||
}
|
||||
{tableVariant && getTableVariantHeader()}
|
||||
</div>);
|
||||
}
|
||||
};
|
||||
|
||||
const getTableVariantHeader = () =>
|
||||
{
|
||||
return (
|
||||
<Typography variant="h6" color="text" fontWeight="light">
|
||||
{tableMetaData?.variantTableLabel}: {tableVariant?.name}
|
||||
<Tooltip title={`Change ${tableMetaData?.variantTableLabel}`}>
|
||||
<IconButton onClick={promptForTableVariantSelection} sx={{p: 0, m: 0, ml: .5, mb: .5, color: "#9f9f9f", fontVariationSettings: "'wght' 100"}}><Icon fontSize="small">settings</Icon></IconButton>
|
||||
</Tooltip>
|
||||
</Typography>
|
||||
);
|
||||
}
|
||||
|
||||
const updateTable = () =>
|
||||
{
|
||||
setLoading(true);
|
||||
@ -1888,10 +1884,27 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
|
||||
// instead, try to just render a Goto Record button, in auto-open, and may-not-close modes //
|
||||
/////////////////////////////////////////////////////////////////////////////////////////////
|
||||
if (tableMetaData && !tableMetaData.capabilities.has(Capability.TABLE_QUERY) && tableMetaData.capabilities.has(Capability.TABLE_GET))
|
||||
{
|
||||
if(tableMetaData?.usesVariants && (!tableVariant || tableVariantPromptOpen))
|
||||
{
|
||||
return (
|
||||
<BaseLayout>
|
||||
<GotoRecordButton metaData={metaData} tableMetaData={tableMetaData} autoOpen={true} buttonVisible={false} mayClose={false} />
|
||||
<TableVariantDialog table={tableMetaData} isOpen={true} closeHandler={(value: QTableVariant) =>
|
||||
{
|
||||
setTableVariantPromptOpen(false);
|
||||
setTableVariant(value);
|
||||
}} />
|
||||
</BaseLayout>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<BaseLayout>
|
||||
<GotoRecordButton metaData={metaData} tableMetaData={tableMetaData} tableVariant={tableVariant} autoOpen={true} buttonVisible={false} mayClose={false} subHeader={
|
||||
<Box mb={2}>
|
||||
{getTableVariantHeader()}
|
||||
</Box>
|
||||
} />
|
||||
</BaseLayout>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user