Jannex
/
admin-dashboard-web
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

group task steps

main
alex 2023-08-31 19:18:54 +02:00
parent c77ea909a8
commit 8609c2998e
2 changed files with 143 additions and 179 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/Components/MyModal/index.js
View File

@ -1,7 +1,5 @@
import { Button, Grid, Modal, Result, Spin } from "antd";
import { useEffect, useState } from "react";
import { Button, Grid, Modal, Result } from "antd";
import { useTranslation } from "react-i18next";
import { myFetch } from "../../utils";
const { useBreakpoint } = Grid;
@ -32,7 +30,7 @@ export default function MyModal({
// This modal will show a loading indicator until the data is loaded.
// If the data is loaded and no data is found, it will show a not found modal.
// If the data is loaded and data is found, it will show the children.
export function MyLazyLoadingModal({
/*export function MyLazyLoadingModal({
isOpen,
onCancel,
children,
@ -86,7 +84,7 @@ export function MyLazyLoadingModal({
)}
</MyModal>
);
}
} */
export function MyNotFoundModal({ isOpen, onCancel, resultTitle }) {
return (

314
src/Pages/GroupTasks/Overview/GroupTasksViewModal.js
View File

@ -33,7 +33,7 @@ import {
import TextArea from "antd/es/input/TextArea";
import { useTranslation } from "react-i18next";
import { MyAvatar } from "../../../Components/MyAvatar";
import MyModal, { MyNotFoundModal } from "../../../Components/MyModal";
import MyModal, { MyNotFoundModalContent } from "../../../Components/MyModal";
import MyAttachments from "../../../Components/MyAttachments";
import { useWebSocketContext } from "../../../Contexts/WebSocketContext";
import { useGroupTasksContext } from "../../../Contexts/GroupTasksContext";
@ -51,25 +51,17 @@ export default function GroupTasksViewModal({ isOpen }) {
const currentGroupTask = useRef(null);
const handleCancel = () => {
groupTasksContext.setGroupTasksSteps([]);
currentGroupTask.current = null;
navigate(`${Constants.ROUTE_PATHS.GROUP_TASKS}${paramCategory}`);
};
console.log("isOpen", isOpen);
useEffect(() => {
console.log("start useEffect");
if (!isOpen) return;
console.log("trigger use effect");
myFetch(
`/grouptasks/${paramCategory}/steps/${paramGroupTaskId}`,
"GET"
).then((data) => {
console.log("data", data);
currentGroupTask.current = data.GroupTask;
groupTasksContext.setGroupTasksSteps(data.GroupTaskSteps);
});
@ -237,14 +229,6 @@ export default function GroupTasksViewModal({ isOpen }) {
};
const ActionHandler = ({ status, taskStepId, index, taskLocked }) => {
/*const currentStepTask = groupTasksContext.categoryGroups
.find((category) => category.category === currentGroupTask.Category)
.groups.find((group) => group.id === currentGroupTask.GroupId).tasks[
index
]; */
console.log("here2", groupTasksContext.categoryGroup);
const currentStepTask = groupTasksContext.categoryGroup.groups.find(
(group) => group.id === currentGroupTask.current.GroupId
).tasks[index];
@ -345,13 +329,6 @@ export default function GroupTasksViewModal({ isOpen }) {
groupTaskSteps.sort((a, b) => a.Step - b.Step);
console.log(
"render here",
groupTaskSteps,
paramGroupTaskId,
groupTasksContext.groupTasksSteps
);
groupTasksContext.categoryGroup.groups.forEach((group) => {
if (currentGroupTask.current.GroupId === group.id) {
groupTasks = group.tasks;
@ -423,7 +400,7 @@ export default function GroupTasksViewModal({ isOpen }) {
{groupTaskSteps[index]?.CreatorUserId !== undefined && (
<MyAvatar
tooltip
allUsers={webSocketContext.AllUsers}
allUsers={appContext.users}
userId={groupTaskSteps[index].CreatorUserId}
/>
)}
@ -434,7 +411,7 @@ export default function GroupTasksViewModal({ isOpen }) {
{groupTaskSteps[index]?.CreatorUserId !== undefined && (
<MyAvatar
tooltip
allUsers={webSocketContext.AllUsers}
allUsers={appContext.users}
userId={groupTaskSteps[index].CreatorUserId}
/>
)}
@ -481,7 +458,7 @@ export default function GroupTasksViewModal({ isOpen }) {
<LockOutlined />{" "}
<MyAvatar
tooltip
allUsers={webSocketContext.AllUsers}
allUsers={appContext.users}
userId={groupTaskSteps[index].LockedByUserId}
avatarWidth={24}
/>
@ -573,158 +550,147 @@ export default function GroupTasksViewModal({ isOpen }) {
return stepItems;
};
// invalid group task id in url specified or no permissions
if (
!currentGroupTask.current ||
!hasXYPermission(
appContext.userPermissions,
Constants.PERMISSIONS.GROUP_TASKS.OVERVIEW.XYView,
currentGroupTask.current.Category
)
) {
return (
<MyNotFoundModal
isOpen={isOpen}
onCancel={handleCancel}
resultTitle={t("groupTasks.groupTasksViewModal.groupTaskNotFound")}
/>
);
}
console.log("context", groupTasksContext.categoryGroup);
return (
<MyModal isOpen={isOpen} onCancel={handleCancel}>
{notificationContextHolder}
<div key={paramGroupTaskId}>
<h1
style={{
color: Constants.COLORS.PRIMARY,
fontWeight: "bold",
marginBottom: 0,
}}
>
{currentGroupTask.current.GroupName}{" "}
<Popover
trigger="click"
title={
<h2
style={{
fontWeight: "bold",
color: Constants.COLORS.SECONDARY,
}}
>
{t("groupTasks.groupTasksViewModal.popover.details")}
</h2>
}
content={
<>
<p>
<span style={{ fontWeight: "bold" }}>ID:</span>{" "}
{paramGroupTaskId} <br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.category")}:
</span>{" "}
{currentGroupTask.current.Category}
<br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.startedAt")}:
</span>{" "}
{FormatDatetime(currentGroupTask.current.StartedAt)}
<br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.endedAt")}:
</span>{" "}
{FormatDatetime(currentGroupTask.current.EndedAt)}
<br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.duration")}:
</span>{" "}
{GetDuration(
currentGroupTask.current.StartedAt,
currentGroupTask.current.EndedAt
)}
</p>
{currentGroupTask.current.GlobalInputs !== "[]" ? (
<>
<h2
style={{
fontWeight: "bold",
color: Constants.COLORS.SECONDARY,
}}
>
{t(
"groupTasks.groupTasksViewModal.popover.specifiedGlobalInputs"
)}
</h2>
{console.log("here3", groupTasksContext.categoryGroup)}
<span>
{JSON.parse(currentGroupTask.current.GlobalInputs).map(
(globalInput) => {
return (
<span
key={
globalInput.parameterName + globalInput.value
}
>
<span style={{ fontWeight: "bold" }}>
{
groupTasksContext.categoryGroup.groups
.find(
(group) =>
group.id ===
currentGroupTask.current.GroupId
)
.globalInputs.find(
(gI) =>
gI.parameterName ===
globalInput.parameterName
).displayName
}
:{" "}
</span>
<span>
{globalInput.value !== ""
? globalInput.value
: Constants.TEXT_EMPTY_PLACEHOLDER}
</span>
<br />
</span>
);
}
)}
</span>
</>
) : null}
</>
}
{!currentGroupTask.current ||
!hasXYPermission(
appContext.userPermissions,
Constants.PERMISSIONS.GROUP_TASKS.OVERVIEW.XYView,
currentGroupTask.current.Category
) ? (
<MyNotFoundModalContent
resultTitle={t("groupTasks.groupTasksViewModal.groupTaskNotFound")}
/>
) : (
<div key={paramGroupTaskId}>
<h1
style={{
color: Constants.COLORS.PRIMARY,
fontWeight: "bold",
marginBottom: 0,
}}
>
<InfoCircleOutlined
style={{
fontSize: "18px",
color: Constants.COLORS.ICON_INFO,
marginBottom: "4px",
verticalAlign: "middle",
}}
/>
</Popover>{" "}
<MyAvatar
tooltip
allUsers={webSocketContext.AllUsers}
userId={currentGroupTask.current.CreatorUserId}
/>
<br />
</h1>
<div style={{ marginBottom: 16 }}>
<span>{currentGroupTask.current.Description}</span>
</div>
{currentGroupTask.current.GroupName}{" "}
<Popover
trigger="click"
title={
<h2
style={{
fontWeight: "bold",
color: Constants.COLORS.SECONDARY,
}}
>
{t("groupTasks.groupTasksViewModal.popover.details")}
</h2>
}
content={
<>
<p>
<span style={{ fontWeight: "bold" }}>ID:</span>{" "}
{paramGroupTaskId} <br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.category")}:
</span>{" "}
{currentGroupTask.current.Category}
<br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.startedAt")}:
</span>{" "}
{FormatDatetime(currentGroupTask.current.StartedAt)}
<br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.endedAt")}:
</span>{" "}
{FormatDatetime(currentGroupTask.current.EndedAt)}
<br />
<span style={{ fontWeight: "bold" }}>
{t("groupTasks.groupTasksViewModal.duration")}:
</span>{" "}
{GetDuration(
currentGroupTask.current.StartedAt,
currentGroupTask.current.EndedAt
)}
</p>
<Steps direction="vertical" items={stepsItemHandler()} />
</div>
{currentGroupTask.current.GlobalInputs !== "[]" ? (
<>
<h2
style={{
fontWeight: "bold",
color: Constants.COLORS.SECONDARY,
}}
>
{t(
"groupTasks.groupTasksViewModal.popover.specifiedGlobalInputs"
)}
</h2>
<span>
{JSON.parse(currentGroupTask.current.GlobalInputs).map(
(globalInput) => {
return (
<span
key={
globalInput.parameterName + globalInput.value
}
>
<span style={{ fontWeight: "bold" }}>
{
groupTasksContext.categoryGroup.groups
.find(
(group) =>
group.id ===
currentGroupTask.current.GroupId
)
.globalInputs.find(
(gI) =>
gI.parameterName ===
globalInput.parameterName
).displayName
}
:{" "}
</span>
<span>
{globalInput.value !== ""
? globalInput.value
: Constants.TEXT_EMPTY_PLACEHOLDER}
</span>
<br />
</span>
);
}
)}
</span>
</>
) : null}
</>
}
>
<InfoCircleOutlined
style={{
fontSize: "18px",
color: Constants.COLORS.ICON_INFO,
marginBottom: "4px",
verticalAlign: "middle",
}}
/>
</Popover>{" "}
<MyAvatar
tooltip
allUsers={appContext.users}
userId={currentGroupTask.current.CreatorUserId}
/>
<br />
</h1>
<div style={{ marginBottom: 16 }}>
<span>{currentGroupTask.current.Description}</span>
</div>
<Steps direction="vertical" items={stepsItemHandler()} />
</div>
)}
</MyModal>
);
}