From 8e7fb7cf20df85ed26dbafedd50beb7ba97cbeeb Mon Sep 17 00:00:00 2001
From: "cyril.tsui" <cyril.tsui@2fi-solutions.com.hk>
Date: Thu, 16 May 2024 16:30:20 +0800
Subject: [PATCH] update project

---
 .../CreateProject/CreateProject.tsx           | 36 +++++++++----------
 src/components/CreateProject/Milestone.tsx    |  7 ++--
 .../CreateProject/MilestoneSection.tsx        |  2 ++
 .../CreateProject/StaffAllocation.tsx         |  4 +--
 4 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/src/components/CreateProject/CreateProject.tsx b/src/components/CreateProject/CreateProject.tsx
index 4242afb..fac9c79 100644
--- a/src/components/CreateProject/CreateProject.tsx
+++ b/src/components/CreateProject/CreateProject.tsx
@@ -170,12 +170,12 @@ const CreateProject: React.FC<Props> = ({
 
         // Tab - Milestone
         let projectTotal = 0
-        const milestonesKeys = Object.keys(data.milestones)
+        const milestonesKeys = Object.keys(data.milestones).filter(key => taskGroupKeys.includes(key))
         milestonesKeys.filter(key => Object.keys(data.taskGroups).includes(key)).forEach(key => {
           const { startDate, endDate, payments } = data.milestones[parseFloat(key)]
 
           if (!Boolean(startDate) || startDate === "Invalid Date" || !Boolean(endDate) || endDate === "Invalid Date" || new Date(startDate) > new Date(endDate)) {
-            formProps.setError("milestones", {message: "milestones is not valid", type: "invalid"})
+            formProps.setError("milestones", { message: "milestones is not valid", type: "invalid" })
             setTabIndex(3)
             hasErrors = true
           }
@@ -183,8 +183,8 @@ const CreateProject: React.FC<Props> = ({
           projectTotal += payments.reduce((acc, payment) => acc + payment.amount, 0)
         })
 
-        if (projectTotal !== data.expectedProjectFee) {
-          formProps.setError("milestones", {message: "milestones is not valid", type: "invalid"})
+        if (projectTotal !== data.expectedProjectFee || milestonesKeys.length !== taskGroupKeys.length) {
+          formProps.setError("milestones", { message: "milestones is not valid", type: "invalid" })
           setTabIndex(3)
           hasErrors = true
         }
@@ -219,7 +219,7 @@ const CreateProject: React.FC<Props> = ({
               data.projectActualEnd = dayjs().format("YYYY-MM-DD");
             }
 
-            data.taskTemplateId = data.taskTemplateId === "All" ? undefined : data.taskTemplateId; 
+            data.taskTemplateId = data.taskTemplateId === "All" ? undefined : data.taskTemplateId;
             const response = await saveProject(data);
 
             if (response.id > 0) {
@@ -293,7 +293,7 @@ const CreateProject: React.FC<Props> = ({
           {isEditMode && !(formProps.getValues("projectDeleted") === true) && (
             <Stack direction="row" gap={1}>
               {/* {!formProps.getValues("projectActualStart") && ( */}
-              {formProps.getValues("projectStatus") === "Pending to Start" && (
+              {formProps.getValues("projectStatus").toLowerCase() === "pending to start" && (
                 <Button
                   name="start"
                   type="submit"
@@ -306,21 +306,21 @@ const CreateProject: React.FC<Props> = ({
               )}
               {/* {formProps.getValues("projectActualStart") &&
                 !formProps.getValues("projectActualEnd") && ( */}
-                {formProps.getValues("projectStatus") === "On-going" && (
-                  <Button
-                    name="complete"
-                    type="submit"
-                    variant="contained"
-                    startIcon={<DoneIcon />}
-                    color="info"
-                  >
-                    {t("Complete Project")}
-                  </Button>
-                )}
+              {formProps.getValues("projectStatus").toLowerCase() === "on-going" && (
+                <Button
+                  name="complete"
+                  type="submit"
+                  variant="contained"
+                  startIcon={<DoneIcon />}
+                  color="info"
+                >
+                  {t("Complete Project")}
+                </Button>
+              )}
               {!(
                 // formProps.getValues("projectActualStart") &&
                 // formProps.getValues("projectActualEnd")
-                formProps.getValues("projectStatus") === "Completed" || 
+                formProps.getValues("projectStatus") === "Completed" ||
                 formProps.getValues("projectStatus") === "Deleted"
               ) && (
                   <Button
diff --git a/src/components/CreateProject/Milestone.tsx b/src/components/CreateProject/Milestone.tsx
index d9c021b..c91c0fa 100644
--- a/src/components/CreateProject/Milestone.tsx
+++ b/src/components/CreateProject/Milestone.tsx
@@ -61,11 +61,12 @@ const Milestone: React.FC<Props> = ({ allTasks, isActive }) => {
   const milestones = watch("milestones")
   const expectedTotalFee = watch("expectedProjectFee");
   useEffect(() => {
-    const milestonesKeys = Object.keys(milestones)
+    const taskGroupsIds = taskGroups.map(taskGroup => taskGroup.id.toString())
+    const milestonesKeys = Object.keys(milestones).filter(key => taskGroupsIds.includes(key))
     let hasError = false
     let projectTotal = 0
 
-    milestonesKeys.filter(key => taskGroups.map(taskGroup => taskGroup.id).includes(parseInt(key))).forEach(key => {
+    milestonesKeys.forEach(key => {
       const { startDate, endDate, payments } = milestones[parseFloat(key)]
 
       if (new Date(startDate) > new Date(endDate) || !Boolean(startDate) || !Boolean(endDate)) {
@@ -75,7 +76,7 @@ const Milestone: React.FC<Props> = ({ allTasks, isActive }) => {
       projectTotal += payments.reduce((acc, payment) => acc + payment.amount, 0)
     })
 
-    if (projectTotal !== expectedTotalFee) {
+    if (projectTotal !== expectedTotalFee || milestonesKeys.length !== taskGroupsIds.length) {
       hasError = true
     }
     // console.log(Object.keys(milestones).reduce((acc, key) => acc + milestones[parseFloat(key)].payments.reduce((acc2, value) => acc2 + value.amount, 0), 0))
diff --git a/src/components/CreateProject/MilestoneSection.tsx b/src/components/CreateProject/MilestoneSection.tsx
index 969f0c5..a9e65e7 100644
--- a/src/components/CreateProject/MilestoneSection.tsx
+++ b/src/components/CreateProject/MilestoneSection.tsx
@@ -244,6 +244,7 @@ const MilestoneSection: React.FC<Props> = ({ taskGroupId }) => {
               <DatePicker
                 label={t("Stage Start Date")}
                 value={startDate ? dayjs(startDate) : null}
+                format="YYYY/MM/DD"
                 onChange={(date) => {
                   if (!date) return;
                   const milestones = getValues("milestones");
@@ -272,6 +273,7 @@ const MilestoneSection: React.FC<Props> = ({ taskGroupId }) => {
               <DatePicker
                 label={t("Stage End Date")}
                 value={endDate ? dayjs(endDate) : null}
+                format="YYYY/MM/DD"
                 onChange={(date) => {
                   if (!date) return;
                   const milestones = getValues("milestones");
diff --git a/src/components/CreateProject/StaffAllocation.tsx b/src/components/CreateProject/StaffAllocation.tsx
index b65aeb5..89f20fa 100644
--- a/src/components/CreateProject/StaffAllocation.tsx
+++ b/src/components/CreateProject/StaffAllocation.tsx
@@ -39,8 +39,8 @@ import { StaffResult } from "@/app/api/staff";
 
 const staffComparator = (a: StaffResult, b: StaffResult) => {
   return (
-    a.team.localeCompare(b.team) ||
-    a.grade.localeCompare(b.grade) ||
+    a.team?.localeCompare(b.team) ||
+    a.grade?.localeCompare(b.grade) ||
     a.id - b.id
   );
 };