mirror of
https://github.com/Kingsrook/qqq-frontend-material-dashboard.git
synced 2025-07-19 05:40:44 +00:00
Merge branch 'feature/QQQ-38-app-home-widgets' into feature/sprint-10
This commit is contained in:
@ -19,30 +19,27 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import {QAppMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppMetaData";
|
||||
import {QAppNodeType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppNodeType";
|
||||
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {Icon} from "@mui/material";
|
||||
import Card from "@mui/material/Card";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import React, {useEffect, useState} from "react";
|
||||
import {Link, useLocation} from "react-router-dom";
|
||||
|
||||
// Material Dashboard 2 PRO React TS examples components
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
|
||||
import {QAppMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppMetaData";
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import MDBox from "components/MDBox";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import MiniStatisticsCard from "examples/Cards/StatisticsCards/MiniStatisticsCard";
|
||||
import {Icon} from "@mui/material";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import Card from "@mui/material/Card";
|
||||
import ComplexStatisticsCard from "examples/Cards/StatisticsCards/ComplexStatisticsCard";
|
||||
import ReportsLineChart from "examples/Charts/LineCharts/ReportsLineChart";
|
||||
import DefaultLineChart from "examples/Charts/LineCharts/DefaultLineChart";
|
||||
import MDBadgeDot from "components/MDBadgeDot";
|
||||
import ReportsBarChart from "examples/Charts/BarCharts/ReportsBarChart";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {QAppNodeType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QAppNodeType";
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import MDBox from "components/MDBox";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import DefaultInfoCard from "examples/Cards/InfoCards/DefaultInfoCard";
|
||||
import MiniStatisticsCard from "examples/Cards/StatisticsCards/MiniStatisticsCard";
|
||||
import DefaultLineChart from "examples/Charts/LineCharts/DefaultLineChart";
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import ProcessLinkCard from "qqq/components/ProcessLinkCard";
|
||||
import BarChart from "qqq/components/Widgets/BarChart";
|
||||
import QuickSightChart from "qqq/components/Widgets/QuickSightChart";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
|
||||
const qController = QClient.getInstance();
|
||||
|
||||
@ -57,6 +54,9 @@ function AppHome({app}: Props): JSX.Element
|
||||
const [tables, setTables] = useState([] as QTableMetaData[]);
|
||||
const [processes, setProcesses] = useState([] as QProcessMetaData[]);
|
||||
const [childApps, setChildApps] = useState([] as QAppMetaData[]);
|
||||
const [tableCounts, setTableCounts] = useState(new Map<string, { isLoading: boolean, value: number }>());
|
||||
const [updatedTableCounts, setUpdatedTableCounts] = useState(new Date());
|
||||
const [widgets, setWidgets] = useState([] as any[]);
|
||||
|
||||
const location = useLocation();
|
||||
|
||||
@ -102,154 +102,213 @@ function AppHome({app}: Props): JSX.Element
|
||||
setTables(newTables);
|
||||
setProcesses(newProcesses);
|
||||
setChildApps(newChildApps);
|
||||
|
||||
const tableCounts = new Map<string, { isLoading: boolean, value: number }>();
|
||||
newTables.forEach((table) =>
|
||||
{
|
||||
tableCounts.set(table.name, {isLoading: true, value: null});
|
||||
|
||||
setTimeout(async () =>
|
||||
{
|
||||
const count = await qController.count(table.name);
|
||||
tableCounts.set(table.name, {isLoading: false, value: count});
|
||||
setTableCounts(tableCounts);
|
||||
setUpdatedTableCounts(new Date());
|
||||
}, 1);
|
||||
});
|
||||
setTableCounts(tableCounts);
|
||||
|
||||
console.log(app.widgets);
|
||||
if (app.widgets)
|
||||
{
|
||||
const widgets: any[] = [];
|
||||
for (let i = 0; i < app.widgets.length; i++)
|
||||
{
|
||||
widgets[i] = {};
|
||||
setTimeout(async () =>
|
||||
{
|
||||
const widget = await qController.widget(app.widgets[i]);
|
||||
widgets[i] = widget;
|
||||
setUpdatedTableCounts(new Date());
|
||||
}, 1);
|
||||
}
|
||||
setWidgets(widgets);
|
||||
}
|
||||
}, [qInstance, location]);
|
||||
|
||||
const reportsBarChartData = {
|
||||
labels: ["M", "T", "W", "T", "F", "S", "S"],
|
||||
datasets: {label: "Sales", data: [50, 20, 10, 22, 50, 10, 40]},
|
||||
};
|
||||
|
||||
interface Types {
|
||||
labels: string[];
|
||||
datasets: {
|
||||
label: string;
|
||||
color: "primary" | "secondary" | "info" | "success" | "warning" | "error" | "light" | "dark";
|
||||
data: number[];
|
||||
}[];
|
||||
}
|
||||
|
||||
const demoLineChartData: Types = {
|
||||
labels: ["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
|
||||
datasets: [
|
||||
{
|
||||
label: "Facebook Ads",
|
||||
color: "info",
|
||||
data: [50, 100, 200, 190, 400, 350, 500, 450, 700],
|
||||
/*
|
||||
const charts = [
|
||||
{
|
||||
type: "barChart",
|
||||
title: "Parcel Invoice Lines per Month",
|
||||
barChartData: {
|
||||
labels: ["Feb 22", "Mar 22", "Apr 22", "May 22", "Jun 22", "Jul 22", "Aug 22"],
|
||||
datasets: {label: "Parcel Invoice Lines", data: [50000, 22000, 11111, 22333, 40404, 9876, 2355]},
|
||||
},
|
||||
{
|
||||
label: "Google Ads",
|
||||
color: "dark",
|
||||
data: [10, 30, 40, 120, 150, 220, 280, 250, 280],
|
||||
},
|
||||
{
|
||||
type: "lineChart",
|
||||
title: "Total Charges by Carrier per Month",
|
||||
lineChartData: {
|
||||
labels: ["Feb 22", "Mar 22", "Apr 22", "May 22", "Jun 22", "Jul 22", "Aug 22"],
|
||||
datasets: [
|
||||
{label: "UPS", color: "info", data: [50000, 22000, 11111, 22333, 40404, 9876, 2355]},
|
||||
{label: "FedEx", color: "dark", data: [5000, 22000, 31111, 32333, 20404, 19876, 24355]},
|
||||
{label: "LSO", color: "error", data: [500, 2200, 1111, 2333, 404, 17876, 2355]},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
];
|
||||
*/
|
||||
|
||||
console.log(`Widgets: ${widgets} and tables: ${tables}`);
|
||||
|
||||
const haveWidgets = widgets && widgets.length;
|
||||
const widgetCount = widgets ? widgets.length : 0;
|
||||
|
||||
// eslint-disable-next-line no-nested-ternary
|
||||
const tileSizeLg = (widgetCount === 0 ? 3 : widgetCount === 1 ? 4 : 6);
|
||||
let gridIndex = 0;
|
||||
|
||||
return (
|
||||
<BaseLayout>
|
||||
<MDBox mt={4}>
|
||||
<Grid container spacing={3}>
|
||||
|
||||
<Grid item xs={6} lg={6}>
|
||||
<Grid container spacing={3}>
|
||||
|
||||
<Grid item xs={6} lg={6}>
|
||||
<MDBox mb={3}>
|
||||
<MDBox mb={3}>
|
||||
<ReportsBarChart
|
||||
color="info"
|
||||
title="Packages Shipped"
|
||||
description="Total outbound shipments"
|
||||
date="Updated at 7:04 a.m. ET"
|
||||
chart={reportsBarChartData}
|
||||
/>
|
||||
</MDBox>
|
||||
</MDBox>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6} lg={6}>
|
||||
<DefaultLineChart
|
||||
title="Revenue"
|
||||
description={(
|
||||
<MDBox display="flex" justifyContent="space-between">
|
||||
<MDBox display="flex" ml={-1}>
|
||||
<MDBadgeDot color="info" size="sm" badgeContent="UPS" />
|
||||
<MDBadgeDot color="dark" size="sm" badgeContent="FedEx" />
|
||||
</MDBox>
|
||||
<MDBox mt={-4} mr={-1} position="absolute" right="1.5rem" />
|
||||
</MDBox>
|
||||
)}
|
||||
chart={demoLineChartData}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6} lg={6}>
|
||||
{
|
||||
tables.length ? (
|
||||
<MDBox mb={3}>
|
||||
<Card id="basic-info" sx={{overflow: "visible"}}>
|
||||
<MDBox p={3}>
|
||||
<MDTypography variant="h5">Tables</MDTypography>
|
||||
</MDBox>
|
||||
<Grid container spacing={3} padding={3} paddingTop={0}>
|
||||
{tables.map((table) => (
|
||||
<Grid key={table.name} item xs={12} md={12} lg={6}>
|
||||
<Link to={table.name}>
|
||||
<MDBox mb={3}>
|
||||
<MiniStatisticsCard
|
||||
title={{fontWeight: "bold", text: table.label}}
|
||||
count="17,013"
|
||||
percentage={{color: "info", text: "total records"}}
|
||||
icon={{color: "info", component: <Icon>{table.iconName || app.iconName}</Icon>}}
|
||||
direction="right"
|
||||
{
|
||||
widgetCount > 0 ? (
|
||||
<Grid item xs={12} lg={widgetCount === 1 ? 3 : 6}>
|
||||
<Grid container spacing={3}>
|
||||
{
|
||||
widgets.map((chart) => (
|
||||
<Grid key={`${gridIndex++}`} item xs={12} lg={widgetCount === 1 ? 12 : 6}>
|
||||
<MDBox mb={3}>
|
||||
{
|
||||
chart.type === "quickSightChart" && (
|
||||
<QuickSightChart url={chart.url} label={chart.label} />
|
||||
)
|
||||
}
|
||||
{
|
||||
chart.type === "barChart" && (
|
||||
<BarChart
|
||||
color="info"
|
||||
title={chart.title}
|
||||
date={`As of ${new Date().toDateString()}`}
|
||||
chart={chart.barChartData}
|
||||
/>
|
||||
</MDBox>
|
||||
</Link>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</Card>
|
||||
</MDBox>
|
||||
) : null
|
||||
}
|
||||
)
|
||||
}
|
||||
{
|
||||
chart.type === "lineChart" && (
|
||||
<DefaultLineChart
|
||||
title={chart.title}
|
||||
description={(
|
||||
<MDBox display="flex" justifyContent="space-between">
|
||||
<MDBox display="flex" ml={-1}>
|
||||
{
|
||||
chart.lineChartData.datasets.map((dataSet: any) => (
|
||||
<MDBadgeDot key={dataSet.label} color={dataSet.color} size="sm" badgeContent={dataSet.label} />
|
||||
))
|
||||
}
|
||||
</MDBox>
|
||||
<MDBox mt={-4} mr={-1} position="absolute" right="1.5rem" />
|
||||
</MDBox>
|
||||
)}
|
||||
chart={chart.lineChartData as { labels: string[]; datasets: { label: string; color: "primary" | "secondary" | "info" | "success" | "warning" | "error" | "light" | "dark"; data: number[]; }[]; }}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</MDBox>
|
||||
</Grid>
|
||||
))
|
||||
}
|
||||
</Grid>
|
||||
</Grid>
|
||||
) : null
|
||||
}
|
||||
|
||||
{
|
||||
processes.length ? (
|
||||
<MDBox mb={3}>
|
||||
<Card id="basic-info" sx={{overflow: "visible"}}>
|
||||
<MDBox p={3}>
|
||||
<MDTypography variant="h5">Processes</MDTypography>
|
||||
{
|
||||
tables.length > 0 || processes.length > 0 || childApps.length > 0 ? (
|
||||
// eslint-disable-next-line no-nested-ternary
|
||||
<Grid item xs={12} lg={widgetCount === 0 ? 12 : widgetCount === 1 ? 9 : 6}>
|
||||
{
|
||||
tables.length ? (
|
||||
<MDBox mb={3}>
|
||||
<Card id="basic-info" sx={{overflow: "visible"}}>
|
||||
<MDBox p={3}>
|
||||
<MDTypography variant="h5">Tables</MDTypography>
|
||||
</MDBox>
|
||||
<Grid container spacing={3} padding={3} paddingTop={0}>
|
||||
{tables.map((table) => (
|
||||
<Grid key={table.name} item xs={12} md={12} lg={tileSizeLg}>
|
||||
<Link to={table.name}>
|
||||
<MDBox mb={3}>
|
||||
<MiniStatisticsCard
|
||||
title={{fontWeight: "bold", text: table.label}}
|
||||
count={!tableCounts.has(table.name) || tableCounts.get(table.name).isLoading ? "..." : tableCounts.get(table.name).value.toLocaleString()}
|
||||
percentage={{color: "info", text: (!tableCounts.has(table.name) || tableCounts.get(table.name).isLoading ? "" : "total records")}}
|
||||
icon={{color: "info", component: <Icon>{table.iconName || app.iconName}</Icon>}}
|
||||
direction="right"
|
||||
/>
|
||||
</MDBox>
|
||||
</Link>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</Card>
|
||||
</MDBox>
|
||||
<Grid container spacing={3} padding={3} paddingTop={3}>
|
||||
{processes.map((process) => (
|
||||
<Grid key={process.name} item xs={12} md={12} lg={6}>
|
||||
<Link to={process.name}>
|
||||
<ProcessLinkCard
|
||||
icon={process.iconName || app.iconName}
|
||||
title={process.label}
|
||||
/>
|
||||
</Link>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</Card>
|
||||
</MDBox>
|
||||
) : null
|
||||
}
|
||||
) : null
|
||||
}
|
||||
|
||||
{
|
||||
childApps.length ? (
|
||||
<MDBox mb={3}>
|
||||
<Card id="basic-info" sx={{overflow: "visible"}}>
|
||||
<Grid container spacing={3} padding={3} paddingTop={3}>
|
||||
{childApps.map((childApp) => (
|
||||
<Grid key={childApp.name} item xs={12} md={12} lg={6}>
|
||||
<Link to={childApp.name}>
|
||||
<DefaultInfoCard
|
||||
icon={childApp.iconName || app.iconName}
|
||||
title={childApp.label}
|
||||
/>
|
||||
</Link>
|
||||
{
|
||||
processes.length ? (
|
||||
<MDBox mb={3}>
|
||||
<Card id="basic-info" sx={{overflow: "visible"}}>
|
||||
<MDBox p={3}>
|
||||
<MDTypography variant="h5">Processes</MDTypography>
|
||||
</MDBox>
|
||||
<Grid container spacing={3} padding={3} paddingTop={3}>
|
||||
{processes.map((process) => (
|
||||
<Grid key={process.name} item xs={12} md={12} lg={tileSizeLg}>
|
||||
<Link to={process.name}>
|
||||
<ProcessLinkCard
|
||||
icon={process.iconName || app.iconName}
|
||||
title={process.label}
|
||||
/>
|
||||
</Link>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</Card>
|
||||
</MDBox>
|
||||
) : null
|
||||
}
|
||||
</Grid>
|
||||
</Card>
|
||||
</MDBox>
|
||||
) : null
|
||||
}
|
||||
|
||||
{
|
||||
childApps.length ? (
|
||||
<MDBox mb={3}>
|
||||
<Card id="basic-info" sx={{overflow: "visible"}}>
|
||||
<MDBox p={3}>
|
||||
<MDTypography variant="h5">Apps</MDTypography>
|
||||
</MDBox>
|
||||
<Grid container spacing={3} padding={3} paddingTop={3}>
|
||||
{childApps.map((childApp) => (
|
||||
<Grid key={childApp.name} item xs={12} md={12} lg={tileSizeLg}>
|
||||
<Link to={childApp.name}>
|
||||
<DefaultInfoCard
|
||||
icon={childApp.iconName || app.iconName}
|
||||
title={childApp.label}
|
||||
/>
|
||||
</Link>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</Card>
|
||||
</MDBox>
|
||||
) : null
|
||||
}
|
||||
</Grid>
|
||||
) : null
|
||||
}
|
||||
|
||||
</Grid>
|
||||
</MDBox>
|
||||
|
||||
@ -19,16 +19,11 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @mui material components
|
||||
import Grid from "@mui/material/Grid";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
|
||||
// Settings page components
|
||||
import EntityForm from "qqq/components/EntityForm";
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import MDBox from "components/MDBox";
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import EntityForm from "qqq/components/EntityForm";
|
||||
|
||||
interface Props
|
||||
{
|
||||
|
||||
@ -19,18 +19,12 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// @mui material components
|
||||
import Grid from "@mui/material/Grid";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
|
||||
// Settings page components
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import {useParams} from "react-router-dom";
|
||||
import EntityForm from "qqq/components/EntityForm";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import EntityList from "qqq/pages/entity-list";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import {useParams} from "react-router-dom";
|
||||
import MDBox from "components/MDBox";
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import EntityForm from "qqq/components/EntityForm";
|
||||
|
||||
interface Props
|
||||
{
|
||||
|
||||
@ -19,26 +19,25 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import React, {
|
||||
useCallback, useEffect, useReducer, useRef, useState,
|
||||
} from "react";
|
||||
import {
|
||||
Link, useNavigate, useParams, useSearchParams,
|
||||
} from "react-router-dom";
|
||||
|
||||
// @mui material components
|
||||
import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType";
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {QFilterCriteria} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterCriteria";
|
||||
import {QFilterOrderBy} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterOrderBy";
|
||||
import {QQueryFilter} from "@kingsrook/qqq-frontend-core/lib/model/query/QQueryFilter";
|
||||
import {Alert, TablePagination} from "@mui/material";
|
||||
import Button from "@mui/material/Button";
|
||||
import Card from "@mui/material/Card";
|
||||
import Icon from "@mui/material/Icon";
|
||||
import LinearProgress from "@mui/material/LinearProgress";
|
||||
import Menu from "@mui/material/Menu";
|
||||
import MenuItem from "@mui/material/MenuItem";
|
||||
import {Alert, TablePagination} from "@mui/material";
|
||||
import {
|
||||
DataGridPro,
|
||||
GridCallbackDetails,
|
||||
GridColDef,
|
||||
GridColumnOrderChangeParams,
|
||||
GridColumnVisibilityModel,
|
||||
GridExportMenuItemProps,
|
||||
GridFilterModel,
|
||||
GridRowId,
|
||||
GridRowParams,
|
||||
@ -51,33 +50,22 @@ import {
|
||||
GridToolbarDensitySelector,
|
||||
GridToolbarExportContainer,
|
||||
GridToolbarFilterButton,
|
||||
MuiEvent,
|
||||
GridExportMenuItemProps,
|
||||
MuiEvent
|
||||
} from "@mui/x-data-grid-pro";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import DashboardLayout from "examples/LayoutContainers/DashboardLayout";
|
||||
import MDBox from "components/MDBox";
|
||||
import React, {useCallback, useEffect, useReducer, useRef, useState} from "react";
|
||||
import {Link, useNavigate, useParams, useSearchParams} from "react-router-dom";
|
||||
import MDAlert from "components/MDAlert";
|
||||
|
||||
// QQQ
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {QQueryFilter} from "@kingsrook/qqq-frontend-core/lib/model/query/QQueryFilter";
|
||||
import {QFilterOrderBy} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterOrderBy";
|
||||
import {QFilterCriteria} from "@kingsrook/qqq-frontend-core/lib/model/query/QFilterCriteria";
|
||||
import {QCriteriaOperator} from "@kingsrook/qqq-frontend-core/lib/model/query/QCriteriaOperator";
|
||||
import {QFieldType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldType";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import MDBox from "components/MDBox";
|
||||
import DashboardLayout from "examples/LayoutContainers/DashboardLayout";
|
||||
import Navbar from "qqq/components/Navbar";
|
||||
import Button from "@mui/material/Button";
|
||||
import {QActionsMenuButton, QCreateNewButton} from "qqq/components/QButtons";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import QFilterUtils from "qqq/utils/QFilterUtils";
|
||||
import QValueUtils from "qqq/utils/QValueUtils";
|
||||
import Footer from "../../components/Footer";
|
||||
import QProcessUtils from "../../utils/QProcessUtils";
|
||||
|
||||
import {QActionsMenuButton, QCreateNewButton} from "qqq/components/QButtons";
|
||||
import QValueUtils from "qqq/utils/QValueUtils";
|
||||
import LinearProgress from "@mui/material/LinearProgress";
|
||||
import QFilterUtils from "qqq/utils/QFilterUtils";
|
||||
|
||||
const COLUMN_VISIBILITY_LOCAL_STORAGE_KEY_ROOT = "qqq.columnVisibility";
|
||||
const COLUMN_SORT_LOCAL_STORAGE_KEY_ROOT = "qqq.columnSort";
|
||||
const FILTER_LOCAL_STORAGE_KEY_ROOT = "qqq.filter";
|
||||
|
||||
@ -19,41 +19,34 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
// react components
|
||||
import {useLocation, useNavigate, useSearchParams} from "react-router-dom";
|
||||
import React, {useReducer, useState} from "react";
|
||||
|
||||
// @material-ui core components
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
|
||||
import Avatar from "@mui/material/Avatar";
|
||||
import Button from "@mui/material/Button";
|
||||
import Card from "@mui/material/Card";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import Dialog from "@mui/material/Dialog";
|
||||
import DialogTitle from "@mui/material/DialogTitle";
|
||||
import DialogActions from "@mui/material/DialogActions";
|
||||
import DialogContent from "@mui/material/DialogContent";
|
||||
import DialogContentText from "@mui/material/DialogContentText";
|
||||
import DialogActions from "@mui/material/DialogActions";
|
||||
import Button from "@mui/material/Button";
|
||||
|
||||
// qqq imports
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import DialogTitle from "@mui/material/DialogTitle";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import Icon from "@mui/material/Icon";
|
||||
import Menu from "@mui/material/Menu";
|
||||
import MenuItem from "@mui/material/MenuItem";
|
||||
import MDAlert from "components/MDAlert";
|
||||
import QProcessUtils from "../../../../utils/QProcessUtils";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import {QActionsMenuButton, QDeleteButton, QEditButton} from "qqq/components/QButtons";
|
||||
import QValueUtils from "qqq/utils/QValueUtils";
|
||||
import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
|
||||
import Icon from "@mui/material/Icon";
|
||||
import Avatar from "@mui/material/Avatar";
|
||||
import QRecordSidebar from "qqq/components/QRecordSidebar";
|
||||
import QTableUtils from "qqq/utils/QTableUtils";
|
||||
import React, {useReducer, useState} from "react";
|
||||
import {useLocation, useNavigate, useSearchParams} from "react-router-dom";
|
||||
import colors from "assets/theme/base/colors";
|
||||
import {QSection} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QSection";
|
||||
import MDAlert from "components/MDAlert";
|
||||
import MDBox from "components/MDBox";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import {QActionsMenuButton, QDeleteButton, QEditButton} from "qqq/components/QButtons";
|
||||
import QRecordSidebar from "qqq/components/QRecordSidebar";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import QTableUtils from "qqq/utils/QTableUtils";
|
||||
import QValueUtils from "qqq/utils/QValueUtils";
|
||||
import QProcessUtils from "../../../../utils/QProcessUtils";
|
||||
|
||||
const qController = QClient.getInstance();
|
||||
|
||||
|
||||
@ -19,19 +19,12 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import {useParams} from "react-router-dom";
|
||||
|
||||
// @mui material components
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import Grid from "@mui/material/Grid";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import {useParams} from "react-router-dom";
|
||||
import MDBox from "components/MDBox";
|
||||
|
||||
// Settings page components
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import ViewContents from "./components/ViewContents";
|
||||
import {QTableMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import EntityList from "qqq/pages/entity-list";
|
||||
|
||||
interface Props
|
||||
{
|
||||
|
||||
@ -19,48 +19,41 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import * as Yup from "yup";
|
||||
|
||||
import {
|
||||
Button, CircularProgress, Icon, TablePagination,
|
||||
} from "@mui/material";
|
||||
import {DataGridPro, GridColDef} from "@mui/x-data-grid-pro";
|
||||
// formik components
|
||||
import {Form, Formik} from "formik";
|
||||
import React, {Fragment, useEffect, useState} from "react";
|
||||
import {useLocation, useNavigate, useParams} from "react-router-dom";
|
||||
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import Card from "@mui/material/Card";
|
||||
import DynamicFormUtils from "qqq/components/QDynamicForm/utils/DynamicFormUtils";
|
||||
import FormData from "form-data";
|
||||
import Grid from "@mui/material/Grid";
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
import MDButton from "components/MDButton";
|
||||
import MDProgress from "components/MDProgress";
|
||||
import MDTypography from "../../../components/MDTypography";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import {QException} from "@kingsrook/qqq-frontend-core/lib/exceptions/QException";
|
||||
import {QComponentType} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QComponentType";
|
||||
import QDynamicForm from "../../components/QDynamicForm";
|
||||
import {QFieldMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFieldMetaData";
|
||||
import {QFrontendComponent} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFrontendComponent";
|
||||
import {QFrontendStepMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QFrontendStepMetaData";
|
||||
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import {QJobComplete} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobComplete";
|
||||
import {QJobError} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobError";
|
||||
import {QJobRunning} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobRunning";
|
||||
import {QJobStarted} from "@kingsrook/qqq-frontend-core/lib/model/processes/QJobStarted";
|
||||
import {QProcessMetaData} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QProcessMetaData";
|
||||
import {QException} from "@kingsrook/qqq-frontend-core/lib/exceptions/QException";
|
||||
import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
|
||||
import {Button, Icon, CircularProgress, TablePagination} from "@mui/material";
|
||||
import Card from "@mui/material/Card";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import Step from "@mui/material/Step";
|
||||
import StepLabel from "@mui/material/StepLabel";
|
||||
import Stepper from "@mui/material/Stepper";
|
||||
import QValidationReview from "qqq/pages/process-run/components/QValidationReview";
|
||||
import {QInstance} from "@kingsrook/qqq-frontend-core/lib/model/metaData/QInstance";
|
||||
import QProcessSummaryResults from "./components/QProcessSummaryResults";
|
||||
import {QRecord} from "@kingsrook/qqq-frontend-core/lib/model/QRecord";
|
||||
import {DataGridPro, GridColDef} from "@mui/x-data-grid-pro";
|
||||
import FormData from "form-data";
|
||||
import {Form, Formik} from "formik";
|
||||
import React, {Fragment, useEffect, useState} from "react";
|
||||
import {useLocation, useNavigate, useParams} from "react-router-dom";
|
||||
import * as Yup from "yup";
|
||||
import MDBox from "components/MDBox";
|
||||
import MDButton from "components/MDButton";
|
||||
import MDProgress from "components/MDProgress";
|
||||
import BaseLayout from "qqq/components/BaseLayout";
|
||||
import {QCancelButton, QSubmitButton} from "qqq/components/QButtons";
|
||||
import {formatDate} from "@fullcalendar/react";
|
||||
import DynamicFormUtils from "qqq/components/QDynamicForm/utils/DynamicFormUtils";
|
||||
import QValidationReview from "qqq/pages/process-run/components/QValidationReview";
|
||||
import QClient from "qqq/utils/QClient";
|
||||
import MDTypography from "../../../components/MDTypography";
|
||||
import QDynamicForm from "../../components/QDynamicForm";
|
||||
import QProcessSummaryResults from "./components/QProcessSummaryResults";
|
||||
|
||||
interface Props
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user