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

Updates for supporting blobs

Browse Source
This commit is contained in:
darin.kelkhoff
2023-05-30 10:20:01 -05:00
parent 084ed0732d
commit 48ebcb63c0
8 changed files with 108 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -29,7 +29,7 @@ import {getGridDateOperators, GridColDef, GridRowsProp} from "@mui/x-data-grid-p
import {GridFilterOperator} from "@mui/x-data-grid/models/gridFilterOperator";
import React from "react";
import {Link} from "react-router-dom";
import {buildQGridPvsOperators, QGridBooleanOperators, QGridNumericOperators, QGridStringOperators} from "qqq/pages/records/query/GridFilterOperators";
import {buildQGridPvsOperators, QGridBlobOperators, QGridBooleanOperators, QGridNumericOperators, QGridStringOperators} from "qqq/pages/records/query/GridFilterOperators";
import ValueUtils from "qqq/utils/qqq/ValueUtils";
export default class DataGridUtils
@ -249,6 +249,9 @@ export default class DataGridUtils
columnWidth = 75;
filterOperators = QGridBooleanOperators;
break;
case QFieldType.BLOB:
filterOperators = QGridBlobOperators;
break;
default:
// noop - leave as string
}
@ -287,11 +290,6 @@ export default class DataGridUtils
filterOperators: filterOperators,
};
if(field.type == QFieldType.BLOB)
{
column.filterable = false;
}
column.renderCell = (cellValues: any) => (
(cellValues.value)
);

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

@ -197,7 +197,7 @@ class ValueUtils
if (field.type == QFieldType.BLOB)
{
return (<BlobComponent url={rawValue} filename={displayValue} />);
return (<BlobComponent field={field} url={rawValue} filename={displayValue} usage={usage} />);
}
return (ValueUtils.getUnadornedValueForDisplay(field, rawValue, displayValue));
@ -580,15 +580,17 @@ function RevealComponent({fieldName, value, usage}: {fieldName: string, value: s
interface BlobComponentProps
{
field: QFieldMetaData;
url: string;
filename: string;
usage: "view" | "query";
}
BlobComponent.defaultProps = {
foo: null,
usage: "view",
};
function BlobComponent({url, filename}: BlobComponentProps): JSX.Element
function BlobComponent({field, url, filename, usage}: BlobComponentProps): JSX.Element
{
const download = (event: React.MouseEvent<HTMLSpanElement>) =>
{
@ -602,24 +604,29 @@ function BlobComponent({url, filename}: BlobComponentProps): JSX.Element
HtmlUtils.openInNewWindow(url, filename);
};
const useBlobIconStyles = makeStyles({
blobIcon: {
marginLeft: "0.25rem",
marginRight: "0.25rem",
cursor: "pointer"
}
})
const classes = useBlobIconStyles();
if(!filename || !url)
{
return (<React.Fragment />);
}
const tooltipPlacement = usage == "view" ? "bottom" : "right";
// todo - thumbnails if adorned?
// challenge is - must post (for auth header)...
return (
<Box display="inline-flex">
{filename}
<Tooltip placement="right" title="Open file">
<Icon className={classes.blobIcon} fontSize="small" onClick={(e) => open(e)}>open_in_new</Icon>
{
usage == "view" && filename
}
<Tooltip placement={tooltipPlacement} title="Open file">
<Icon className={"blobIcon"} fontSize="small" onClick={(e) => open(e)}>open_in_new</Icon>
</Tooltip>
<Tooltip placement="right" title="Download file">
<Icon className={classes.blobIcon} fontSize="small" onClick={(e) => download(e)}>save_alt</Icon>
<Tooltip placement={tooltipPlacement} title="Download file">
<Icon className={"blobIcon"} fontSize="small" onClick={(e) => download(e)}>save_alt</Icon>
</Tooltip>
{
usage == "query" && filename
}
</Box>
);
}