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

SPRINT-12: implemented html widget, bug fix

Browse Source
This commit is contained in:
Tim Chamberlain
2022-09-26 13:01:18 -05:00
parent 13acea1a77
commit 275f71f03a
2 changed files with 32 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/qqq/components/DashboardWidgets.tsx
View File

@ -22,7 +22,7 @@ import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstan
import Card from "@mui/material/Card"; import Card from "@mui/material/Card";
import Grid from "@mui/material/Grid"; import Grid from "@mui/material/Grid";
import parse from "html-react-parser"; import parse from "html-react-parser";
import React, {useEffect, useState} from "react"; import React, {useEffect, useReducer, useState} from "react";
import {useLocation} from "react-router-dom"; import {useLocation} from "react-router-dom";
import MDBadgeDot from "qqq/components/Temporary/MDBadgeDot"; import MDBadgeDot from "qqq/components/Temporary/MDBadgeDot";
import MDBox from "qqq/components/Temporary/MDBox"; import MDBox from "qqq/components/Temporary/MDBox";
@ -53,6 +53,7 @@ function DashboardWidgets({widgetNameList, entityPrimaryKey}: Props): JSX.Elemen
const [widgets, setWidgets] = useState([] as any[]); const [widgets, setWidgets] = useState([] as any[]);
const [widgetNames, setWidgetNames] = useState([] as any[]); const [widgetNames, setWidgetNames] = useState([] as any[]);
const [widgetCounter, setWidgetCounter] = useState(0); const [widgetCounter, setWidgetCounter] = useState(0);
const [, forceUpdate] = useReducer((x) => x + 1, 0);
useEffect(() => useEffect(() =>
{ {
@ -77,6 +78,7 @@ function DashboardWidgets({widgetNameList, entityPrimaryKey}: Props): JSX.Elemen
{ {
widgets[i] = await qController.widget(widgetNameList[i], `id=${entityPrimaryKey}`); widgets[i] = await qController.widget(widgetNameList[i], `id=${entityPrimaryKey}`);
setWidgetCounter(widgetCounter + 1); setWidgetCounter(widgetCounter + 1);
forceUpdate();
})(); })();
} }
setWidgets(widgets); setWidgets(widgets);
@ -105,20 +107,34 @@ function DashboardWidgets({widgetNameList, entityPrimaryKey}: Props): JSX.Elemen
{ {
widgets.map((widget, i) => ( widgets.map((widget, i) => (
<Grid key={`${i}`} item xs={12} lg={12}> <Grid key={`${i}`} item xs={12} lg={12}>
<MDBox mb={3}> {
{ widget.type === "table" && (
widget.type === "table" && ( <TableCard
<TableCard color="info"
color="info" title={widget.title}
title={widget.title} data={widget}
data={widget} dropdownOptions={widget.dropdownOptions}
dropdownOptions={widget.dropdownOptions} dropdownOnChange={handleDropdownOnChange}
dropdownOnChange={handleDropdownOnChange} widgetIndex={i}
widgetIndex={i} />
/> )
) }
} {
</MDBox> widget.type === "html" && (
<MDBox pb={3}>
<Card sx={{marginTop: "0px", paddingTop: "0px"}}>
<MDBox padding="1rem">
<MDTypography variant="h5" textTransform="capitalize">
{widget.title}
</MDTypography>
<MDTypography component="div" variant="button" color="text" fontWeight="light">
{parse(widget.html)}
</MDTypography>
</MDBox>
</Card>
</MDBox>
)
}
</Grid> </Grid>
)) ))
} }
@ -146,22 +162,6 @@ function DashboardWidgets({widgetNameList, entityPrimaryKey}: Props): JSX.Elemen
</MDBox> </MDBox>
) )
} }
{
widget.type === "html" && (
<MDBox mb={3}>
<Card>
<MDBox padding="1rem">
<MDTypography variant="h6" textTransform="capitalize">
{widget.title}
</MDTypography>
<MDTypography component="div" variant="button" color="text" fontWeight="light">
{parse(widget.html)}
</MDTypography>
</MDBox>
</Card>
</MDBox>
)
}
{ {
widget.type === "lineChart" && ( widget.type === "lineChart" && (
<MDBox mb={3}> <MDBox mb={3}>

2
src/qqq/components/QRecordSidebar/index.tsx
View File

@ -47,7 +47,7 @@ function QRecordSidebar({tableSections, widgetNames, light}: Props): JSX.Element
// insert widgets after identity (first) table section // // insert widgets after identity (first) table section //
///////////////////////////////////////////////////////// /////////////////////////////////////////////////////////
const sidebarEntries = [] as SidebarEntry[]; const sidebarEntries = [] as SidebarEntry[];
tableSections.forEach((section, index) => tableSections && tableSections.forEach((section, index) =>
{ {
if (index === 1 && widgetNames) if (index === 1 && widgetNames)
{ {