SPRINT-17: added tablename in widgets

This commit is contained in:
Tim Chamberlain
2022-12-08 15:05:05 -06:00
parent 63a579430b
commit 7ea20fd82f
5 changed files with 92 additions and 17 deletions

View File

@ -31,6 +31,7 @@ import MDBadgeDot from "qqq/components/Temporary/MDBadgeDot";
import MDBox from "qqq/components/Temporary/MDBox";
import MDTypography from "qqq/components/Temporary/MDTypography";
import BarChart from "qqq/pages/dashboards/Widgets/BarChart";
import DividerWidget from "qqq/pages/dashboards/Widgets/Data/Divider";
import DefaultLineChart from "qqq/pages/dashboards/Widgets/DefaultLineChart";
import FieldValueListWidget from "qqq/pages/dashboards/Widgets/FieldValueListWidget";
import HorizontalBarChart from "qqq/pages/dashboards/Widgets/HorizontalBarChart";
@ -51,6 +52,7 @@ const qController = QClient.getInstance();
interface Props
{
widgetMetaDataList: QWidgetMetaData[];
tableName?: string;
entityPrimaryKey?: string;
omitWrappingGridContainer: boolean;
areChildren?: boolean
@ -59,13 +61,14 @@ interface Props
DashboardWidgets.defaultProps = {
widgetMetaDataList: null,
tableName: null,
entityPrimaryKey: null,
omitWrappingGridContainer: false,
areChildren: false,
childUrlParams: ""
};
function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGridContainer, areChildren, childUrlParams}: Props): JSX.Element
function DashboardWidgets({widgetMetaDataList, tableName, entityPrimaryKey, omitWrappingGridContainer, areChildren, childUrlParams}: Props): JSX.Element
{
const location = useLocation();
const [qInstance, setQInstance] = useState(null as QInstance);
@ -95,7 +98,8 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
widgetData[i] = {};
(async () =>
{
widgetData[i] = await qController.widget(widgetMetaDataList[i].name, `id=${entityPrimaryKey}&${childUrlParams}`);
console.log(`widgets: ${getQueryParams(null)}`)
widgetData[i] = await qController.widget(widgetMetaDataList[i].name, getQueryParams(null));
setWidgetCounter(widgetCounter + 1);
forceUpdate();
})();
@ -112,11 +116,39 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
{
setTimeout(async () =>
{
widgetData[index] = await qController.widget(widgetMetaDataList[index].name, `id=${entityPrimaryKey}&${data}`);
widgetData[index] = await qController.widget(widgetMetaDataList[index].name, getQueryParams(data));
setWidgetCounter(widgetCounter + 1);
}, 1);
};
function getQueryParams(extraParams: string): string
{
let ampersand = "";
let params = "";
let foundParam = false;
if(entityPrimaryKey)
{
params += `${ampersand}id=${entityPrimaryKey}`;
ampersand = "&";
}
if(tableName)
{
params += `${ampersand}tableName=${tableName}`;
ampersand = "&";
}
if(extraParams)
{
params += `${ampersand}${extraParams}`;
ampersand = "&";
}
if(childUrlParams)
{
params += `${ampersand}${childUrlParams}`;
}
return params;
};
const widgetCount = widgetMetaDataList ? widgetMetaDataList.length : 0;
const renderWidget = (widgetMetaData: QWidgetMetaData, i: number): JSX.Element =>
@ -127,6 +159,7 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
widgetMetaData.type === "parentWidget" && (
<ParentWidget
entityPrimaryKey={entityPrimaryKey}
tableName={tableName}
widgetIndex={i}
label={widgetMetaData.label}
data={widgetData[i]}
@ -221,6 +254,13 @@ function DashboardWidgets({widgetMetaDataList, entityPrimaryKey, omitWrappingGri
/>
)
}
{
widgetMetaData.type === "divider" && (
<Box>
<DividerWidget />
</Box>
)
}
{
widgetMetaData.type === "horizontalBarChart" && (
widgetData && widgetData[i] && widgetData[i].chartData && (

View File

@ -0,0 +1,32 @@
/*
* QQQ - Low-code Application Framework for Engineers.
* Copyright (C) 2021-2022. 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 Divider from "@mui/material/Divider";
function DividerWidget(): JSX.Element
{
return (
<Divider sx={{padding: "1px", background: "red"}}/>
);
}
export default DividerWidget;

View File

@ -38,7 +38,7 @@ const options = {
maintainAspectRatio: false,
plugins: {
legend: {
display: false,
display: true,
},
tooltip: {
enabled: true,

View File

@ -42,6 +42,7 @@ export interface ParentWidgetData
label: string
}[][];
childWidgetNameList: string[];
dropdownNeedsSelectedText?: string;
}
@ -55,11 +56,12 @@ interface Props
data: ParentWidgetData;
reloadWidgetCallback?: (widgetIndex: number, params: string) => void;
entityPrimaryKey?: string;
tableName?: string;
}
const qController = QClient.getInstance();
function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPrimaryKey}: Props, ): JSX.Element
function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPrimaryKey, tableName}: Props, ): JSX.Element
{
const [childUrlParams, setChildUrlParams] = useState("");
const [qInstance, setQInstance] = useState(null as QInstance);
@ -86,15 +88,9 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
widgetMetaDataList.push(qInstance.widgets.get(widgetName));
})
setWidgets(widgetMetaDataList);
console.log(`SETTINGWIDGETS...${widgetMetaDataList.length}`)
}
}, [qInstance, data]);
function doit()
{
reloadWidgetCallback(0, "ok");
}
function handleDataChange(dropdownLabel: string, changedData: any)
{
if(dropdownData)
@ -128,8 +124,6 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
{
if(dropdownData)
{
console.log(JSON.stringify(data));
let params = "";
for (let i = 0; i < dropdownData.length; i++)
{
@ -144,7 +138,6 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
}
}
console.log(params);
reloadWidgetCallback(widgetIndex, params);
setChildUrlParams(params)
}
@ -173,7 +166,7 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
<DropdownMenu
key={`dropdown-${data.dropdownLabelList[index]}-${index}`}
label={`Select ${data.dropdownLabelList[index]}`}
sx={{width: 200, marginLeft: "15px", float: "right"}}
sx={{width: 250, marginLeft: "15px", float: "right"}}
dropdownOptions={dropdownData}
onChangeCallback={handleDataChange}
/>
@ -183,7 +176,17 @@ function ParentWidget({widgetIndex, label, data, reloadWidgetCallback, entityPri
</Grid>
</Grid>
<Box pr={3} pl={3}>
<DashboardWidgets widgetMetaDataList={widgets} entityPrimaryKey={entityPrimaryKey} childUrlParams={childUrlParams} areChildren={true}/>
{
data?.dropdownNeedsSelectedText ? (
<Box pb={3} sx={{width: "100%", textAlign: "right"}}>
<Typography variant="body2">
{data.dropdownNeedsSelectedText}
</Typography>
</Box>
) :(
<DashboardWidgets widgetMetaDataList={widgets} entityPrimaryKey={entityPrimaryKey} tableName={tableName} childUrlParams={childUrlParams} areChildren={true}/>
)
}
</Box>
</Card>
);

View File

@ -316,7 +316,7 @@ function EntityView({table, launchProcess}: Props): JSX.Element
sectionFieldElements.set(section.name,
<Grid id={section.name} key={section.name} item lg={widgetMetaData.gridColumns ? widgetMetaData.gridColumns : 12} xs={12} sx={{display: "flex", alignItems: "stretch", flexGrow: 1, scrollMarginTop: "100px"}}>
<Box width="100%" flexGrow={1} alignItems="stretch">
<DashboardWidgets key={section.name} widgetMetaDataList={[widgetMetaData]} entityPrimaryKey={record.values.get(tableMetaData.primaryKeyField)} omitWrappingGridContainer={true} />
<DashboardWidgets key={section.name} tableName={tableMetaData.name} widgetMetaDataList={[widgetMetaData]} entityPrimaryKey={record.values.get(tableMetaData.primaryKeyField)} omitWrappingGridContainer={true} />
</Box>
</Grid>
);