mirror of
https://github.com/Kingsrook/qqq-frontend-material-dashboard.git
synced 2025-07-18 05:10:45 +00:00
SPRINT-19: minor updates for dashboards
This commit is contained in:
@ -18,7 +18,6 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
|
||||
import {QWidgetMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QWidgetMetaData";
|
||||
import {Skeleton} from "@mui/material";
|
||||
import Box from "@mui/material/Box";
|
||||
@ -77,7 +76,6 @@ DashboardWidgets.defaultProps = {
|
||||
function DashboardWidgets({widgetMetaDataList, tableName, entityPrimaryKey, omitWrappingGridContainer, areChildren, childUrlParams}: Props): JSX.Element
|
||||
{
|
||||
const location = useLocation();
|
||||
const [qInstance, setQInstance] = useState(null as QInstance);
|
||||
const [widgetData, setWidgetData] = useState([] as any[]);
|
||||
const [widgetCounter, setWidgetCounter] = useState(0);
|
||||
const [, forceUpdate] = useReducer((x) => x + 1, 0);
|
||||
@ -85,15 +83,6 @@ function DashboardWidgets({widgetMetaDataList, tableName, entityPrimaryKey, omit
|
||||
const [currentUrlParams, setCurrentUrlParams] = useState(null as string);
|
||||
const [haveLoadedParams, setHaveLoadedParams] = useState(false);
|
||||
|
||||
useEffect(() =>
|
||||
{
|
||||
(async () =>
|
||||
{
|
||||
const newQInstance = await qController.loadMetaData();
|
||||
setQInstance(newQInstance);
|
||||
})();
|
||||
}, []);
|
||||
|
||||
useEffect(() =>
|
||||
{
|
||||
for (let i = 0; i < widgetMetaDataList.length; i++)
|
||||
|
@ -22,7 +22,7 @@
|
||||
|
||||
import Box from "@mui/material/Box";
|
||||
import {BarElement, CategoryScale, Chart as ChartJS, Legend, LinearScale, Title, Tooltip,} from "chart.js";
|
||||
import React, {useEffect} from "react";
|
||||
import React, {useEffect, useState} from "react";
|
||||
import {Bar} from "react-chartjs-2";
|
||||
import {useNavigate} from "react-router-dom";
|
||||
import colors from "qqq/assets/theme/base/colors";
|
||||
@ -39,6 +39,9 @@ ChartJS.register(
|
||||
|
||||
export const options = {
|
||||
responsive: true,
|
||||
animation: {
|
||||
duration: 0
|
||||
},
|
||||
scales: {
|
||||
x: {
|
||||
stacked: true,
|
||||
@ -59,6 +62,9 @@ function StackedBarChart({data}: Props): JSX.Element
|
||||
{
|
||||
const navigate = useNavigate();
|
||||
|
||||
const [stateData, setStateData] = useState(data);
|
||||
|
||||
|
||||
const handleClick = (e: Array<{}>) =>
|
||||
{
|
||||
if(e && e.length > 0 && data?.urls && data?.urls.length)
|
||||
@ -80,12 +86,13 @@ function StackedBarChart({data}: Props): JSX.Element
|
||||
dataset.backgroundColor = gradients[chartColors[index]].state;
|
||||
}
|
||||
});
|
||||
setStateData(stateData);
|
||||
}
|
||||
}, [data]);
|
||||
|
||||
|
||||
return data ? (
|
||||
<Box p={3}><Bar data={data} options={options} getElementsAtEvent={handleClick} /></Box>
|
||||
<Box p={3}><Bar data={data} options={options} /></Box>
|
||||
) : null;
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user