format log messages
parent
c99a466992
commit
506bbc8ecc
|
|
@ -3,7 +3,7 @@ import {
|
|||
ArrowRightOutlined,
|
||||
ReloadOutlined,
|
||||
} from "@ant-design/icons";
|
||||
import { Card, Checkbox, Space, Spin, Tooltip } from "antd";
|
||||
import { Card, Checkbox, Popover, Space, Spin, Tooltip } from "antd";
|
||||
import { useContext, useEffect, useState } from "react";
|
||||
import {
|
||||
Constants,
|
||||
|
|
@ -12,6 +12,7 @@ import {
|
|||
getUserSessionFromLocalStorage,
|
||||
handleUnauthorizedStatus,
|
||||
} from "../../utils";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
export default function LogCard({ type }) {
|
||||
const webSocketContext = useContext(WebSocketContext);
|
||||
|
|
@ -38,6 +39,51 @@ export default function LogCard({ type }) {
|
|||
return colorCodes[colorIndex];
|
||||
};
|
||||
|
||||
const getLogDataValue = (logData, splittedMessage) => {
|
||||
const logDataIndex = logData.findIndex(
|
||||
(data) => data.Type === splittedMessage.replace(new RegExp("%", "g"), "")
|
||||
);
|
||||
|
||||
return logData[logDataIndex].Value;
|
||||
};
|
||||
|
||||
const ColoredSpanItem = ({ dataLogs, splittedMessage, children }) => {
|
||||
const logDataIndex = dataLogs.LogData.findIndex(
|
||||
(data) => data.Type === splittedMessage.replace(new RegExp("%", "g"), "")
|
||||
);
|
||||
|
||||
if (logDataIndex !== -1) {
|
||||
return (
|
||||
<span style={{ color: getColorCode(logDataIndex) }}>
|
||||
{children === undefined ? (
|
||||
dataLogs.LogData[logDataIndex].Value
|
||||
) : (
|
||||
<>{children}</>
|
||||
)}{" "}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
return <></>;
|
||||
};
|
||||
|
||||
const getGroupTaskStepName = (groupTaskStep) => {
|
||||
const foundName = webSocketContext.CategoryGroups.find(
|
||||
(categoryGroup) =>
|
||||
categoryGroup.category ===
|
||||
webSocketContext.GroupTasks.find(
|
||||
(groupTask) => groupTask.Id === groupTaskStep.GroupTasksId
|
||||
).Category
|
||||
).groups.find(
|
||||
(groups) =>
|
||||
groups.id ===
|
||||
webSocketContext.GroupTasks.find(
|
||||
(groupTask) => groupTask.Id === groupTaskStep.GroupTasksId
|
||||
).GroupId
|
||||
).tasks[groupTaskStep.Step - 1];
|
||||
|
||||
return foundName !== undefined ? foundName.name : groupTaskStep.Id;
|
||||
};
|
||||
|
||||
const loadLogs = (date) => {
|
||||
setLoadingSpinner(true);
|
||||
|
||||
|
|
@ -94,23 +140,123 @@ export default function LogCard({ type }) {
|
|||
} else {
|
||||
items.push(<span key={s}>{splittedMessage[s]} </span>);
|
||||
}
|
||||
} else {
|
||||
const logDataIndex = data.Logs[i].LogData.findIndex(
|
||||
(data) =>
|
||||
data.Type ===
|
||||
splittedMessage[s].replace(new RegExp("%", "g"), "")
|
||||
} else if (splittedMessage[s] === "%groupTaskId%") {
|
||||
const foundData = data.Logs[i].LogData.find(
|
||||
(data) => data.Type === "groupTaskId"
|
||||
);
|
||||
|
||||
if (logDataIndex !== -1) {
|
||||
if (foundData !== undefined) {
|
||||
const foundGroupTask = webSocketContext.GroupTasks.find(
|
||||
(groupTask) => groupTask.Id === foundData.Value
|
||||
);
|
||||
|
||||
items.push(
|
||||
<span
|
||||
<ColoredSpanItem
|
||||
key={s}
|
||||
style={{ color: getColorCode(logDataIndex) }}
|
||||
>
|
||||
{data.Logs[i].LogData[logDataIndex].Value}{" "}
|
||||
</span>
|
||||
dataLogs={data.Logs[i]}
|
||||
splittedMessage={splittedMessage[s]}
|
||||
children={
|
||||
<Popover
|
||||
content={
|
||||
<div>
|
||||
<span style={{ fontWeight: "bold" }}>ID: </span>
|
||||
<Link
|
||||
to={`${
|
||||
Constants.ROUTE_PATHS.GROUP_TASKS_VIEW
|
||||
}${getLogDataValue(
|
||||
data.Logs[i].LogData,
|
||||
splittedMessage[s]
|
||||
)}`}
|
||||
>
|
||||
{getLogDataValue(
|
||||
data.Logs[i].LogData,
|
||||
splittedMessage[s]
|
||||
)}
|
||||
</Link>
|
||||
</div>
|
||||
}
|
||||
title="Group Task"
|
||||
trigger="click"
|
||||
>
|
||||
<span style={{ cursor: "pointer" }}>
|
||||
{foundGroupTask !== undefined
|
||||
? foundGroupTask.GroupName
|
||||
: getLogDataValue(
|
||||
data.Logs[i].LogData,
|
||||
splittedMessage[s]
|
||||
)}
|
||||
</span>
|
||||
</Popover>
|
||||
}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
items.push(<span key={s}>{splittedMessage[s]} </span>);
|
||||
}
|
||||
} else if (splittedMessage[s] === "%taskStepId%") {
|
||||
const foundData = data.Logs[i].LogData.find(
|
||||
(data) => data.Type === "taskStepId"
|
||||
);
|
||||
|
||||
if (foundData !== undefined) {
|
||||
const foundGroupTaskStep =
|
||||
webSocketContext.GroupTasksSteps.find(
|
||||
(step) => step.Id === foundData.Value
|
||||
);
|
||||
|
||||
if (foundGroupTaskStep !== undefined) {
|
||||
items.push(
|
||||
<ColoredSpanItem
|
||||
key={s}
|
||||
dataLogs={data.Logs[i]}
|
||||
splittedMessage={splittedMessage[s]}
|
||||
children={
|
||||
<Popover
|
||||
content={
|
||||
<div>
|
||||
<span style={{ fontWeight: "bold" }}>
|
||||
ID:{" "}
|
||||
</span>
|
||||
<span>{foundGroupTaskStep.Id}</span>
|
||||
</div>
|
||||
}
|
||||
title="Group Task Step"
|
||||
trigger="click"
|
||||
>
|
||||
{" "}
|
||||
<span style={{ cursor: "pointer" }}>
|
||||
{getGroupTaskStepName(foundGroupTaskStep)}
|
||||
</span>
|
||||
</Popover>
|
||||
}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
items.push(
|
||||
<ColoredSpanItem
|
||||
key={s}
|
||||
dataLogs={data.Logs[i]}
|
||||
splittedMessage={splittedMessage[s]}
|
||||
/>
|
||||
);
|
||||
}
|
||||
} else {
|
||||
items.push(
|
||||
<ColoredSpanItem
|
||||
key={s}
|
||||
dataLogs={data.Logs[i]}
|
||||
splittedMessage={splittedMessage[s]}
|
||||
/>
|
||||
);
|
||||
}
|
||||
} else {
|
||||
items.push(
|
||||
<ColoredSpanItem
|
||||
key={s}
|
||||
dataLogs={data.Logs[i]}
|
||||
splittedMessage={splittedMessage[s]}
|
||||
/>
|
||||
);
|
||||
}
|
||||
} else {
|
||||
items.push(<span key={s}>{splittedMessage[s]} </span>);
|
||||
|
|
|
|||
|
|
@ -246,7 +246,7 @@ export default function AllUsers() {
|
|||
avatar: (
|
||||
<Popover
|
||||
placement="right"
|
||||
trigger={"hover"}
|
||||
trigger="hover"
|
||||
content={<MyAvatar avatar={user.Avatar} avatarWidth={256} />}
|
||||
>
|
||||
<>
|
||||
|
|
|
|||
Loading…
Reference in New Issue