task locking

src/Pages/GroupTasks/GroupTasksViewModal.js

@@ -20,6 +20,7 @@ import {
   SentMessagesCommands,
   GetDuration,
   MyAvatar,
+  getUserId,
 } from "../../utils";
 import { InfoCircleOutlined } from "@ant-design/icons";
 
@@ -326,15 +327,19 @@ export default function GroupTasksViewModal({ isOpen }) {
                 )}
               </p>
 
+              {console.log("stepLocked", groupTaskSteps[index].Locked)}
+
               <Alert
                 message={<b>{getAlertMessage(groupTaskSteps[index].Status)}</b>}
                 description={
                   groupTaskSteps[index].Status ===
                   Constants.GROUP_TASKS_STATUS.INPUT_REQUIRED ? (
                     <InputRequiredHandler
+                      webSocketContext={webSocketContext}
                       currentGroupTask={currentGroupTask}
                       groupTaskParameters={groupTask.parameters}
                       notificationApi={notificationApi}
+                      step={index}
                     />
                   ) : (
                     getGroupTaskStepLog(groupTaskSteps[index].Log)
@@ -493,9 +498,11 @@ export default function GroupTasksViewModal({ isOpen }) {
 }
 
 function InputRequiredHandler({
+  webSocketContext,
   currentGroupTask,
   groupTaskParameters,
   notificationApi,
+  step,
 }) {
   const globalInputs = JSON.parse(currentGroupTask.GlobalInputs);
 
@@ -508,8 +515,8 @@ function InputRequiredHandler({
     ).value;
   };
 
-  const MyFormItem = ({ children, displayName, groupTaskParameter }) => {
+  const getLabel = (displayName, groupTaskParameter) => {
-    const label = groupTaskParameter.global ? (
+    return groupTaskParameter.global ? (
       <>
         {displayName}
         <Tag style={{ marginLeft: 6 }} color="purple">
@@ -519,12 +526,39 @@ function InputRequiredHandler({
     ) : (
       displayName
     );
+  };
 
-    return (
+  let lastChanges = [];
-      <Form.Item label={label} required>
+
-        {children}
+  const onInputChange = (currentGroupTaskId, parameterName) => {
-      </Form.Item>
+    console.log(
+      "change",
+
+      currentGroupTaskId,
+      parameterName,
+      step
     );
+
+    lastChanges = lastChanges.filter(
+      (lc) => Date.now() - new Date(lc.changeTime) < 3000
+    );
+
+    const lastChange = lastChanges.find((lC) => lC.step === step);
+
+    if (lastChange === undefined) {
+      lastChanges.push({
+        step: step,
+        changeTime: Date.now(),
+      });
+
+      console.warn("lock");
+
+      webSocketContext.SendSocketMessage(SentMessagesCommands.TaskLocking, {
+        lockedByUserId: getUserId(),
+        groupTaskId: currentGroupTaskId,
+        step: step,
+      });
+    }
   };
 
   return (
@@ -533,34 +567,50 @@ function InputRequiredHandler({
         switch (groupTaskParameter.type) {
           case "text":
             return (
-              <MyFormItem
+              <Form.Item
                 key={"fitem-" + groupTaskParameter.parameterName}
-                displayName={groupTaskParameter.displayName}
+                label={getLabel(
-                groupTaskParameter={groupTaskParameter}
+                  groupTaskParameter.displayName,
-                children={
+                  groupTaskParameter
+                )}
+                required
+              >
                 <Input
                   key={"input-" + groupTaskParameter.parameterName}
                   id={groupTaskParameter.parameterName}
                   defaultValue={getDefaultValue(groupTaskParameter)}
-                  />
+                  onChange={() =>
+                    onInputChange(
+                      currentGroupTask.Id,
+                      groupTaskParameter.parameterName
+                    )
                   }
                 />
+              </Form.Item>
             );
           case "number":
             return (
-              <MyFormItem
+              <Form.Item
                 key={"fitem-" + groupTaskParameter.parameterName}
-                displayName={groupTaskParameter.displayName}
+                label={getLabel(
-                groupTaskParameter={groupTaskParameter}
+                  groupTaskParameter.displayName,
-                children={
+                  groupTaskParameter
+                )}
+                required
+              >
                 <InputNumber
                   key={"fitem-" + groupTaskParameter.parameterName}
                   id={groupTaskParameter.parameterName}
                   style={{ width: "100%" }}
                   defaultValue={getDefaultValue(groupTaskParameter)}
-                  />
+                  onChange={() =>
+                    onInputChange(
+                      currentGroupTask.Id,
+                      groupTaskParameter.parameterName
+                    )
                   }
                 />
+              </Form.Item>
             );
           default:
             notificationApi["error"]({

src/Pages/GroupTasks/GroupTypeSelectionModal.js

@@ -193,21 +193,14 @@ function GroupGlobalInputs({
   currentSelectedModalGroupType,
   notificationApi,
 }) {
-  const MyFormItem = ({ children, displayName }) => {
+  const getLabel = (displayName) => {
     return (
-      <Form.Item
-        label={
       <>
         {displayName}
         <Tag style={{ marginLeft: 6 }} color="purple">
           Global
         </Tag>
       </>
-        }
-        required
-      >
-        {children}
-      </Form.Item>
     );
   };
 
@@ -223,31 +216,31 @@ function GroupGlobalInputs({
           switch (globalInput.type) {
             case "text":
               elements.push(
-                <MyFormItem
+                <Form.Item
                   key={"fitem-" + globalInput.parameterName}
-                  displayName={globalInput.displayName}
+                  label={getLabel(globalInput.displayName)}
-                  children={
+                  required
+                >
                   <Input
                     key={"input-" + globalInput.parameterName}
                     id={globalInput.parameterName}
                   />
-                  }
+                </Form.Item>
-                />
               );
               break;
             case "number":
               elements.push(
-                <MyFormItem
+                <Form.Item
                   key={"fitem-" + globalInput.parameterName}
-                  displayName={globalInput.displayName}
+                  label={getLabel(globalInput.displayName)}
-                  children={
+                  required
+                >
                   <InputNumber
                     key={"input-" + globalInput.parameterName}
                     style={{ width: "100%" }}
                     id={globalInput.parameterName}
                   />
-                  }
+                </Form.Item>
-                />
               );
               break;
             default:

src/utils.js

@@ -108,6 +108,7 @@ const ReceivedMessagesCommands = {
   UpdateScannerUsedByUserId: 13,
   ScanResult: 14,
   UpdateScannerLastUsed: 15,
+  TaskLocked: 16,
 };
 
 // commands sent to the backend server
@@ -116,6 +117,7 @@ export const SentMessagesCommands = {
   TaskFailedTryAgainRunTaskStep: 2,
   TaskContinueTaskStep: 3,
   ReloadGroupTasks: 4,
+  TaskLocking: 5,
 };
 
 export function WebSocketProvider({
@@ -308,6 +310,17 @@ export function WebSocketProvider({
             return newArr;
           });
           break;
+        case ReceivedMessagesCommands.TaskLocked:
+          setGroupTasksSteps((arr) => {
+            const newArr = [...arr];
+
+            newArr[
+              arr.findIndex((arr1) => arr1.GroupTasksId === body.groupTaskId)
+            ].Locked = true;
+
+            return newArr;
+          });
+          break;
         default:
           console.error("unknown command", cmd);
           break;