mirror of
https://github.com/Kingsrook/qqq-frontend-material-dashboard.git
synced 2025-07-17 21:00:45 +00:00
update audit to include child details
This commit is contained in:
1
.gitignore
vendored
1
.gitignore
vendored
@ -17,6 +17,7 @@ yalc.lock
|
||||
# production
|
||||
/build
|
||||
/lib
|
||||
/target
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
|
@ -6,7 +6,7 @@
|
||||
"@auth0/auth0-react": "1.10.2",
|
||||
"@emotion/react": "11.7.1",
|
||||
"@emotion/styled": "11.6.0",
|
||||
"@kingsrook/qqq-frontend-core": "1.0.49",
|
||||
"@kingsrook/qqq-frontend-core": "1.0.50",
|
||||
"@mui/icons-material": "5.4.1",
|
||||
"@mui/material": "5.11.1",
|
||||
"@mui/styles": "5.11.1",
|
||||
|
@ -26,6 +26,7 @@ import {QCriteriaOperator} from "@kingsrook/qqq-frontend-core/lib/model/query/QC
|
||||
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 {QueryJoin} from "@kingsrook/qqq-frontend-core/lib/model/query/QueryJoin";
|
||||
import Avatar from "@mui/material/Avatar";
|
||||
import Box from "@mui/material/Box";
|
||||
import Icon from "@mui/material/Icon/Icon";
|
||||
@ -52,12 +53,12 @@ const qController = Client.getInstance();
|
||||
|
||||
function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
|
||||
{
|
||||
const [initialLoadComplete, setInitialLoadComplete] = useState(false);
|
||||
const [audits, setAudits] = useState([] as QRecord[]);
|
||||
const [total, setTotal] = useState(null as number);
|
||||
const [limit, setLimit] = useState(1000);
|
||||
const [statusString, setStatusString] = useState("Loading audits...");
|
||||
const [auditsByDate, setAuditsByDate] = useState([] as QRecord[][]);
|
||||
const [auditDetailMap, setAuditDetailMap] = useState(null as Map<number, string[]>)
|
||||
const [sortDirection, setSortDirection] = useState(localStorage.getItem("audit.sortDirection") === "true");
|
||||
|
||||
useEffect(() =>
|
||||
@ -72,7 +73,8 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
|
||||
new QFilterCriteria("recordId", QCriteriaOperator.EQUALS, [recordId]),
|
||||
], [
|
||||
new QFilterOrderBy("timestamp", sortDirection),
|
||||
new QFilterOrderBy("id", sortDirection)
|
||||
new QFilterOrderBy("id", sortDirection),
|
||||
new QFilterOrderBy("auditDetail.id", true)
|
||||
]);
|
||||
|
||||
///////////////////////////////
|
||||
@ -81,7 +83,7 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
|
||||
let audits = [] as QRecord[]
|
||||
try
|
||||
{
|
||||
audits = await qController.query("audit", filter, limit, 0);
|
||||
audits = await qController.query("audit", filter, limit, 0, [new QueryJoin("auditDetail", true, "LEFT")]);
|
||||
setAudits(audits);
|
||||
}
|
||||
catch(e)
|
||||
@ -105,8 +107,37 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
|
||||
setTotal(count);
|
||||
}
|
||||
|
||||
setInitialLoadComplete(true);
|
||||
//////////////////////////////////////////////////////////////////////////////////////////////////////////
|
||||
// group the audits by auditId (e.g., this is a list that joined audit & auditDetail, so un-flatten it) //
|
||||
//////////////////////////////////////////////////////////////////////////////////////////////////////////
|
||||
const unflattenedAudits: QRecord[] = []
|
||||
const detailMap: Map<number, string[]> = new Map();
|
||||
for (let i = 0; i < audits.length; i++)
|
||||
{
|
||||
let id = audits[i].values.get("id");
|
||||
if(i == 0 || unflattenedAudits[unflattenedAudits.length-1].values.get("id") != id)
|
||||
{
|
||||
unflattenedAudits.push(audits[i]);
|
||||
}
|
||||
|
||||
let auditDetail = audits[i].values.get("auditDetail.message");
|
||||
if(auditDetail)
|
||||
{
|
||||
if(!detailMap.has(id))
|
||||
{
|
||||
detailMap.set(id, []);
|
||||
}
|
||||
|
||||
detailMap.get(id).push(auditDetail)
|
||||
}
|
||||
}
|
||||
audits = unflattenedAudits;
|
||||
setAuditDetailMap(detailMap);
|
||||
console.log(detailMap);
|
||||
|
||||
//////////////////////////////
|
||||
// group the audits by date //
|
||||
//////////////////////////////
|
||||
const auditsByDate = [];
|
||||
let thisDatesAudits = null as QRecord[];
|
||||
let lastDate = null;
|
||||
@ -240,6 +271,16 @@ function AuditBody({tableMetaData, recordId, record}: Props): JSX.Element
|
||||
<Box fontSize="1rem">
|
||||
{audit.values.get("message")}
|
||||
</Box>
|
||||
<Box fontSize="0.875rem">
|
||||
<ul style={{"marginLeft": "1rem"}}>
|
||||
{
|
||||
auditDetailMap.get(audit.values.get("id"))?.map((detail, key) =>
|
||||
{
|
||||
return (<li key={key}>{detail}</li>);
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
|
@ -83,6 +83,8 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
|
||||
{
|
||||
const tableName = table.name;
|
||||
const [ searchParams ] = useSearchParams();
|
||||
|
||||
const [showSuccessfullyDeletedAlert, setShowSuccessfullyDeletedAlert] = useState(searchParams.has("deleteSuccess"));
|
||||
|
||||
const location = useLocation();
|
||||
const navigate = useNavigate();
|
||||
@ -1154,9 +1156,11 @@ function RecordQuery({table, launchProcess}: Props): JSX.Element
|
||||
""
|
||||
)}
|
||||
{
|
||||
(tableLabel && searchParams.get("deleteSuccess")) ? (
|
||||
<Alert color="success" onClose={() =>
|
||||
{}}>
|
||||
(tableLabel && showSuccessfullyDeletedAlert) ? (
|
||||
<Alert color="success" sx={{mb: 3}} onClose={() =>
|
||||
{
|
||||
setShowSuccessfullyDeletedAlert(false);
|
||||
}}>
|
||||
{`${tableLabel} successfully deleted`}
|
||||
</Alert>
|
||||
) : null
|
||||
|
@ -47,7 +47,7 @@ import React, {useContext, useEffect, useReducer, useState} from "react";
|
||||
import {useLocation, useNavigate, useParams, useSearchParams} from "react-router-dom";
|
||||
import QContext from "QContext";
|
||||
import AuditBody from "qqq/components/audits/AuditBody";
|
||||
import {QActionsMenuButton, QCancelButton, QDeleteButton, QEditButton, QSaveButton} from "qqq/components/buttons/DefaultButtons";
|
||||
import {QActionsMenuButton, QCancelButton, QDeleteButton, QEditButton} from "qqq/components/buttons/DefaultButtons";
|
||||
import EntityForm from "qqq/components/forms/EntityForm";
|
||||
import colors from "qqq/components/legacy/colors";
|
||||
import QRecordSidebar from "qqq/components/misc/RecordSidebar";
|
||||
@ -164,12 +164,12 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
///////////////////////////////////////////////////////////////////////
|
||||
for (let i = 0; i < hashParts.length; i++)
|
||||
{
|
||||
const parts = hashParts[i].split("=")
|
||||
const parts = hashParts[i].split("=");
|
||||
if (parts.length > 1 && parts[0] == "launchProcess")
|
||||
{
|
||||
(async () =>
|
||||
{
|
||||
const processMetaData = await qController.loadProcessMetaData(parts[1])
|
||||
const processMetaData = await qController.loadProcessMetaData(parts[1]);
|
||||
setActiveModalProcess(processMetaData);
|
||||
})();
|
||||
return;
|
||||
@ -184,7 +184,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
{
|
||||
(async () =>
|
||||
{
|
||||
const childTable = await qController.loadTableMetaData(pathParts[pathParts.length - 1])
|
||||
const childTable = await qController.loadTableMetaData(pathParts[pathParts.length - 1]);
|
||||
const childId: any = null; // todo - for editing a child, not just creating one.
|
||||
openEditChildForm(childTable, childId, null, null); // todo - defaults & disableds
|
||||
})();
|
||||
@ -198,12 +198,12 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
for (let i = 0; i < hashParts.length; i++)
|
||||
{
|
||||
const parts = hashParts[i].split("=")
|
||||
const parts = hashParts[i].split("=");
|
||||
if (parts.length > 1 && parts[0] == "createChild")
|
||||
{
|
||||
(async () =>
|
||||
{
|
||||
const childTable = await qController.loadTableMetaData(parts[1])
|
||||
const childTable = await qController.loadTableMetaData(parts[1]);
|
||||
const childId: any = null; // todo - for editing a child, not just creating one.
|
||||
openEditChildForm(childTable, childId, null, null); // todo - defaults & disableds
|
||||
})();
|
||||
@ -292,20 +292,20 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
{
|
||||
console.error("Error pushing history: " + e);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (e instanceof QException)
|
||||
{
|
||||
if ((e as QException).status === "404")
|
||||
{
|
||||
setNotFoundMessage(`${tableMetaData.label} ${id} could not be found.`);
|
||||
historyPurge(location.pathname)
|
||||
historyPurge(location.pathname);
|
||||
return;
|
||||
}
|
||||
else if ((e as QException).status === "403")
|
||||
{
|
||||
setNotFoundMessage(`You do not have permission to view ${tableMetaData.label} records`);
|
||||
historyPurge(location.pathname)
|
||||
historyPurge(location.pathname);
|
||||
return;
|
||||
}
|
||||
}
|
||||
@ -315,7 +315,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
|
||||
try
|
||||
{
|
||||
HistoryUtils.push({label: `${tableMetaData?.label}: ${record.recordLabel}`, path: location.pathname, iconName: table.iconName})
|
||||
HistoryUtils.push({label: `${tableMetaData?.label}: ${record.recordLabel}`, path: location.pathname, iconName: table.iconName});
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
@ -441,7 +441,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
|
||||
const handleDelete = (event: { preventDefault: () => void }) =>
|
||||
{
|
||||
event.preventDefault();
|
||||
event?.preventDefault();
|
||||
(async () =>
|
||||
{
|
||||
await qController.delete(tableName, id)
|
||||
@ -509,7 +509,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
<MenuItem onClick={() =>
|
||||
{
|
||||
setActionsMenu(null);
|
||||
navigate("#audit")
|
||||
navigate("#audit");
|
||||
}}>
|
||||
<ListItemIcon><Icon>checklist</Icon></ListItemIcon>
|
||||
Audit
|
||||
@ -585,7 +585,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
|
||||
const closeAudit = (event: object, reason: string) =>
|
||||
{
|
||||
if (reason === "backdropClick" || reason === "escapeKeyDown")
|
||||
if (reason === "backdropClick") // allowing esc here, as it's a non-destructive close || reason === "escapeKeyDown")
|
||||
{
|
||||
return;
|
||||
}
|
||||
@ -623,7 +623,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
successMessage ?
|
||||
<Alert color="success" sx={{mb: 3}} onClose={() =>
|
||||
{
|
||||
setSuccessMessage(null)
|
||||
setSuccessMessage(null);
|
||||
}}>
|
||||
{successMessage}
|
||||
</Alert>
|
||||
@ -638,7 +638,7 @@ function RecordView({table, launchProcess}: Props): JSX.Element
|
||||
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} mb={3}>
|
||||
<Card id={t1SectionName} sx={{scrollMarginTop: "100px"}}>
|
||||
<Card id={t1SectionName} sx={{scrollMarginTop: "100px", minHeight: "88px"}}>
|
||||
<Box display="flex" p={3} pb={1}>
|
||||
<Box mr={1.5}>
|
||||
<Avatar sx={{bgcolor: colors.info.main}}>
|
||||
|
Reference in New Issue
Block a user