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

Make variants work for blob/download fields

Browse Source
This commit is contained in:
darin.kelkhoff
2025-02-14 20:36:49 -06:00
parent 7db4f34ddd
commit c69a4b8203
5 changed files with 40 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/qqq/components/widgets/misc/RecordGridWidget.tsx
View File

@ -111,7 +111,7 @@ function RecordGridWidget({widgetMetaData, data, addNewRecordCallback, disableRo
}
const tableMetaData = data.childTableMetaData instanceof QTableMetaData ? data.childTableMetaData as QTableMetaData : new QTableMetaData(data.childTableMetaData);
const rows = DataGridUtils.makeRows(records, tableMetaData, true);
const rows = DataGridUtils.makeRows(records, tableMetaData);
/////////////////////////////////////////////////////////////////////////////////
// note - tablePath may be null, if the user doesn't have access to the table. //

2
src/qqq/pages/records/query/RecordQuery.tsx
View File

@ -1103,7 +1103,7 @@ const RecordQuery = forwardRef(({table, usage, isModal, isPreview, allowVariable
////////////////////////////////
// make the rows for the grid //
////////////////////////////////
const rows = DataGridUtils.makeRows(results, tableMetaData);
const rows = DataGridUtils.makeRows(results, tableMetaData, tableVariant);
setRows(rows);
setLoading(false);

6
src/qqq/pages/records/view/RecordView.tsx
View File

@ -92,7 +92,7 @@ const TABLE_VARIANT_LOCAL_STORAGE_KEY_ROOT = "qqq.tableVariant";
/*******************************************************************************
**
*******************************************************************************/
export function renderSectionOfFields(key: string, fieldNames: string[], tableMetaData: QTableMetaData, helpHelpActive: boolean, record: QRecord, fieldMap?: { [name: string]: QFieldMetaData }, styleOverrides?: {label?: SxProps, value?: SxProps})
export function renderSectionOfFields(key: string, fieldNames: string[], tableMetaData: QTableMetaData, helpHelpActive: boolean, record: QRecord, fieldMap?: { [name: string]: QFieldMetaData }, styleOverrides?: {label?: SxProps, value?: SxProps}, tableVariant?: QTableVariant)
{
return <Box key={key} display="flex" flexDirection="column" py={1} pr={2}>
{
@ -118,7 +118,7 @@ export function renderSectionOfFields(key: string, fieldNames: string[], tableMe
}
<div style={{display: "inline-block", width: 0}}>&nbsp;</div>
<Typography variant="button" textTransform="none" fontWeight="regular" color="rgb(123, 128, 154)" sx={{...(styleOverrides?.value ?? {})}}>
{ValueUtils.getDisplayValue(field, record, "view", fieldName)}
{ValueUtils.getDisplayValue(field, record, "view", fieldName, tableVariant)}
</Typography>
</>
</Box>
@ -597,7 +597,7 @@ function RecordView({table, record: overrideRecord, launchProcess}: Props): JSX.
// for a section with field names, render the field values. //
// for the T1 section, the "wrapper" will come out below - but for other sections, produce a wrapper too. //
////////////////////////////////////////////////////////////////////////////////////////////////////////////
const fields = renderSectionOfFields(section.name, section.fieldNames, tableMetaData, helpHelpActive, record);
const fields = renderSectionOfFields(section.name, section.fieldNames, tableMetaData, helpHelpActive, record, undefined, undefined, tableVariant);
if (section.tier === "T1")
{

23
src/qqq/utils/DataGridUtils.tsx
View File

@ -24,6 +24,7 @@ import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QF
import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType";
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 {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
import Tooltip from "@mui/material/Tooltip/Tooltip";
import {GridColDef, GridRowsProp, MuiEvent} from "@mui/x-data-grid-pro";
@ -70,7 +71,7 @@ export default class DataGridUtils
/*******************************************************************************
**
*******************************************************************************/
public static makeRows = (results: QRecord[], tableMetaData: QTableMetaData, allowEmptyId = false): GridRowsProp[] =>
public static makeRows = (results: QRecord[], tableMetaData: QTableMetaData, tableVariant?: QTableVariant): GridRowsProp[] =>
{
const fields = [...tableMetaData.fields.values()];
const rows = [] as any[];
@ -82,7 +83,7 @@ export default class DataGridUtils
fields.forEach((field) =>
{
row[field.name] = ValueUtils.getDisplayValue(field, record, "query");
row[field.name] = ValueUtils.getDisplayValue(field, record, "query", undefined, tableVariant);
});
if (tableMetaData.exposedJoins)
@ -97,7 +98,7 @@ export default class DataGridUtils
fields.forEach((field) =>
{
let fieldName = join.joinTable.name + "." + field.name;
row[fieldName] = ValueUtils.getDisplayValue(field, record, "query", fieldName);
row[fieldName] = ValueUtils.getDisplayValue(field, record, "query", fieldName, tableVariant);
});
}
}
@ -111,7 +112,7 @@ export default class DataGridUtils
/////////////////////////////////////////////////////////////////////////////////////////
// DataGrid gets very upset about a null or undefined here, so, try to make it happier //
/////////////////////////////////////////////////////////////////////////////////////////
if (!allowEmptyId)
if (!tableVariant)
{
row["id"] = "--";
}
@ -241,6 +242,20 @@ export default class DataGridUtils
cellValues.value ? <Link to={`${linkBase}${encodeURIComponent(cellValues.value)}`} onClick={(e) => e.stopPropagation()}>{cellValues.value}</Link> : ""
);
}
/* todo wip ... not sure if/how to get tooltipFieldName set in the row... */
/*
else if (field.hasAdornment(AdornmentType.TOOLTIP))
{
const tooltipAdornment = field.getAdornment(AdornmentType.TOOLTIP);
const tooltipFieldName: string = tooltipAdornment.getValue("tooltipFieldName");
if(tooltipFieldName)
{
column.renderCell = (cellValues: any) => (
cellValues.value ? <Tooltip title={cellValues.row[tooltipFieldName]}><span>{cellValues.value}</span></Tooltip> : ""
);
}
}
*/
});
}

20
src/qqq/utils/qqq/ValueUtils.tsx
View File

@ -23,6 +23,7 @@ import {AdornmentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/Ado
import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData";
import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType";
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
import {QTableVariant} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableVariant";
import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
import "datejs"; // https://github.com/datejs/Datejs
import {Chip, ClickAwayListener, Icon} from "@mui/material";
@ -76,14 +77,14 @@ class ValueUtils
** When you have a field, and a record - call this method to get a string or
** element back to display the field's value.
*******************************************************************************/
public static getDisplayValue(field: QFieldMetaData, record: QRecord, usage: "view" | "query" = "view", overrideFieldName?: string): string | JSX.Element | JSX.Element[]
public static getDisplayValue(field: QFieldMetaData, record: QRecord, usage: "view" | "query" = "view", overrideFieldName?: string, tableVariant?: QTableVariant): string | JSX.Element | JSX.Element[]
{
const fieldName = overrideFieldName ?? field.name;
const displayValue = record.displayValues ? record.displayValues.get(fieldName) : undefined;
const rawValue = record.values ? record.values.get(fieldName) : undefined;
return ValueUtils.getValueForDisplay(field, rawValue, displayValue, usage);
return ValueUtils.getValueForDisplay(field, rawValue, displayValue, usage, tableVariant);
}
@ -91,7 +92,7 @@ class ValueUtils
** When you have a field and a value (either just a raw value, or a raw and
** display value), call this method to get a string Element to display.
*******************************************************************************/
public static getValueForDisplay(field: QFieldMetaData, rawValue: any, displayValue: any = rawValue, usage: "view" | "query" = "view"): string | JSX.Element | JSX.Element[]
public static getValueForDisplay(field: QFieldMetaData, rawValue: any, displayValue: any = rawValue, usage: "view" | "query" = "view", tableVariant?: QTableVariant): string | JSX.Element | JSX.Element[]
{
if (field.hasAdornment(AdornmentType.LINK))
{
@ -199,9 +200,20 @@ class ValueUtils
if (field.type == QFieldType.BLOB || field.hasAdornment(AdornmentType.FILE_DOWNLOAD))
{
return (<BlobComponent field={field} url={rawValue} filename={displayValue} usage={usage} />);
let url = rawValue;
if(tableVariant)
{
url += "?tableVariant=" + encodeURIComponent(JSON.stringify(tableVariant));
}
return (<BlobComponent field={field} url={url} filename={displayValue} usage={usage} />);
}
// todo if(field.hasAdornment(AdornmentType.CODE))
// todo {
// todo return <span style={{fontFamily: "monospace", fontSize: "12px", color: "#4f4f4f"}}>{ValueUtils.getUnadornedValueForDisplay(field, rawValue, displayValue)}</span>
// todo }
return (ValueUtils.getUnadornedValueForDisplay(field, rawValue, displayValue));
}