378 change hours big modal (#383)

varianter · Dec 11, 2023 · a0c7314 · a0c7314
1 parent a0db6b8
commit a0c7314
Show file tree

Hide file tree

Showing 17 changed files with 621 additions and 201 deletions.
diff --git a/backend/Api/Projects/ProjectController.cs b/backend/Api/Projects/ProjectController.cs
@@ -182,7 +182,7 @@ public ActionResult<ProjectWithCustomerModel> Put([FromRoute] string orgUrlKey,
         service.ClearConsultantCache(orgUrlKey);
 
         var responseModel =
-            new ProjectWithCustomerModel(project.Name, customer.Name, project.State, project.IsBillable);
+            new ProjectWithCustomerModel(project.Name, customer.Name, project.State, project.IsBillable, project.Id);
 
         return Ok(responseModel);
     }

diff --git a/backend/Api/Projects/ProjectModels.cs b/backend/Api/Projects/ProjectModels.cs
@@ -14,14 +14,15 @@ public record EngagementReadModel(
     [property: Required] EngagementState BookingType,
     [property: Required] bool IsBillable);
 
-public record EngagementWriteModel(List<int> ConsultantIds, EngagementState BookingType,
+public record EngagementWriteModel( EngagementState BookingType,
     bool IsBillable, string ProjectName, string CustomerName);
 
 public record ProjectWithCustomerModel(
     [property: Required] string ProjectName,
     [property: Required] string CustomerName,
     [property: Required] EngagementState BookingType,
-    [property: Required] bool IsBillable);
+    [property: Required] bool IsBillable,
+    [property: Required] int ProjectId);
 
 public record UpdateProjectWriteModel(int EngagementId, EngagementState ProjectState, int StartYear, int StartWeek,
     int WeekSpan);
diff --git a/backend/Api/StaffingController/ReadModelFactory.cs b/backend/Api/StaffingController/ReadModelFactory.cs
@@ -32,7 +32,7 @@ public ConsultantReadModel GetConsultantReadModelForWeek(int consultantId, Week
         var readModel = MapToReadModelList(consultant, new List<Week> { week });
 
         return new ConsultantReadModel(consultant, new List<BookedHoursPerWeek> { readModel.Bookings.First() },
-            new List<DetailedBooking> { readModel.DetailedBooking.First() }, readModel.IsOccupied);
+             readModel.DetailedBooking.ToList(), readModel.IsOccupied);
     }
 
     public ConsultantReadModel GetConsultantReadModelForWeeks(int consultantId, List<Week> weeks)

diff --git a/frontend/src/api-types.ts b/frontend/src/api-types.ts
@@ -90,13 +90,20 @@ export interface EngagementReadModel {
   engagementId: number;
   /** @minLength 1 */
   engagementName: string;
-  bookingType: ProjectState;
+  bookingType: EngagementState;
   isBillable: boolean;
 }
 
+export enum EngagementState {
+  Closed = "Closed",
+  Order = "Order",
+  Lost = "Lost",
+  Offer = "Offer",
+  Active = "Active",
+}
+
 export interface EngagementWriteModel {
-  consultantIds?: number[];
-  bookingType?: ProjectState;
+  bookingType?: EngagementState;
   isBillable?: boolean;
   projectName?: string;
   customerName?: string;
@@ -109,53 +116,59 @@ export interface OrganisationReadModel {
   urlKey: string;
 }
 
-export enum ProjectState {
-  Closed = "Closed",
-  Order = "Order",
-  Lost = "Lost",
-  Offer = "Offer",
-  Active = "Active",
-}
-
 export interface ProjectWithCustomerModel {
   /** @minLength 1 */
   projectName: string;
   /** @minLength 1 */
   customerName: string;
-  bookingType: ProjectState;
+  bookingType: EngagementState;
   isBillable: boolean;
+  /** @format int32 */
+  projectId: number;
 }
 
 export interface SeveralStaffingWriteModel {
-  type: BookingType;
+  type?: BookingType;
   /** @format int32 */
-  consultantId: number;
+  consultantId?: number;
   /** @format int32 */
-  engagementId: number;
+  engagementId?: number;
   /** @format int32 */
-  startYear: number;
+  startYear?: number;
   /** @format int32 */
-  startWeek: number;
+  startWeek?: number;
   /** @format int32 */
-  endYear: number;
+  endYear?: number;
   /** @format int32 */
-  endWeek: number;
+  endWeek?: number;
   /** @format double */
-  hours: number;
+  hours?: number;
 }
 
 export interface StaffingWriteModel {
-  type: BookingType;
+  type?: BookingType;
   /** @format int32 */
-  consultantId: number;
+  consultantId?: number;
   /** @format int32 */
-  engagementId: number;
+  engagementId?: number;
   /** @format int32 */
-  startYear: number;
+  startYear?: number;
   /** @format int32 */
-  startWeek: number;
+  startWeek?: number;
   /** @format double */
-  hours: number;
+  hours?: number;
+}
+
+export interface UpdateProjectWriteModel {
+  /** @format int32 */
+  engagementId?: number;
+  projectState?: EngagementState;
+  /** @format int32 */
+  startYear?: number;
+  /** @format int32 */
+  startWeek?: number;
+  /** @format int32 */
+  weekSpan?: number;
 }
 
 export interface WeeklyBookingReadModel {
@@ -181,17 +194,3 @@ export interface WeeklyHours {
   /** @format double */
   hours: number;
 }
-
-export interface ProjectWithCustomerModel {
-  projectName: string;
-  customerName: string;
-  projectState: ProjectState;
-  isBillable: boolean;
-}
-
-export interface EngagementWriteModel {
-  projectState?: ProjectState;
-  isBillable?: boolean;
-  projectName?: string;
-  customerName?: string;
-}
diff --git a/frontend/src/app/[organisation]/bemanning/api/updateHours/route.ts b/frontend/src/app/[organisation]/bemanning/api/updateHours/route.ts
@@ -22,7 +22,7 @@ export async function PUT(
   const body: StaffingWriteModel | SeveralStaffingWriteModel = {
     type: requestBody.bookingType,
     consultantId: Number(requestBody.consultantId),
-    engagementId: Number(requestBody.bookingId),
+    engagementId: Number(requestBody.projectId),
     startYear: startWeek?.year ?? 0,
     startWeek: startWeek?.weekNumber ?? 0,
     endYear: endWeek?.year ?? 0,

diff --git a/frontend/src/components/FilteredConsultantsList.tsx b/frontend/src/components/FilteredConsultantsList.tsx
@@ -7,7 +7,6 @@ import InfoPill from "./Staffing/InfoPill";
 import { Calendar } from "react-feather";
 import StaffingSums from "./StaffingSums";
 import React from "react";
-import { BookedHoursPerWeek } from "@/api-types";
 
 export default function StaffingTable() {
   const {
@@ -20,35 +19,34 @@ export default function StaffingTable() {
   const { weekSpan } = useUrlRouteFilter();
 
   return (
-    <table
-      className={`w-full ${
-        weekSpan > 23
-          ? "min-w-[1400px]"
-          : weekSpan > 11
-          ? "min-w-[850px]"
-          : "min-w-[700px]"
-      } table-fixed`}
-    >
-      <colgroup>
-        <col span={1} className="w-14" />
-        <col span={1} className="w-[190px]" />
-        {filteredConsultants
-          .at(0)
-          ?.bookings.map((_, index) => <col key={index} span={1} />)}
-      </colgroup>
-      <thead>
-        <tr className="sticky -top-6 bg-white z-10">
-          <th colSpan={2} className="pt-3 pl-2 -left-2 relative bg-white">
-            <div className="flex flex-row gap-3 pb-4 items-center">
-              <p className="normal-medium ">Konsulenter</p>
-              <p className="text-primary small-medium rounded-full bg-primary/5 px-2 py-1">
-                {filteredConsultants?.length}
-              </p>
-            </div>
-          </th>
+    <>
+      <table
+        className={`w-full ${
+          weekSpan > 23
+            ? "min-w-[1400px]"
+            : weekSpan > 11
+            ? "min-w-[850px]"
+            : "min-w-[700px]"
+        } table-fixed`}
+      >
+        <colgroup>
+          <col span={1} className="w-14" />
+          <col span={1} className="w-[190px]" />
           {filteredConsultants
             .at(0)
-            ?.bookings.map((booking: BookedHoursPerWeek) => (
+            ?.bookings.map((_, index) => <col key={index} span={1} />)}
+        </colgroup>
+        <thead>
+          <tr className="sticky -top-6 bg-white z-10">
+            <th colSpan={2} className="pt-3 pl-2 -left-2 relative bg-white">
+              <div className="flex flex-row gap-3 pb-4 items-center">
+                <p className="normal-medium ">Konsulenter</p>
+                <p className="text-primary small-medium rounded-full bg-primary/5 px-2 py-1">
+                  {filteredConsultants?.length}
+                </p>
+              </div>
+            </th>
+            {filteredConsultants.at(0)?.bookings?.map((booking) => (
               <th key={booking.weekNumber} className=" px-2 py-1 pt-3 ">
                 <div className="flex flex-col gap-1">
                   {isCurrentWeek(booking.weekNumber, booking.year) ? (
@@ -101,18 +99,19 @@ export default function StaffingTable() {
                 </div>
               </th>
             ))}
-        </tr>
-      </thead>
-      <tbody>
-        {filteredConsultants?.map((consultant) => (
-          <ConsultantRows key={consultant.id} consultant={consultant} />
-        ))}
-      </tbody>
-      <StaffingSums
-        weeklyTotalBillable={weeklyTotalBillable}
-        weeklyTotalBillableAndOffered={weeklyTotalBillableAndOffered}
-        weeklyInvoiceRates={weeklyInvoiceRates}
-      />
-    </table>
+          </tr>
+        </thead>
+        <tbody>
+          {filteredConsultants.map((consultant) => (
+            <ConsultantRows key={consultant.id} consultant={consultant} />
+          ))}
+        </tbody>
+        <StaffingSums
+          weeklyTotalBillable={weeklyTotalBillable}
+          weeklyTotalBillableAndOffered={weeklyTotalBillableAndOffered}
+          weeklyInvoiceRates={weeklyInvoiceRates}
+        />
+      </table>
+    </>
   );
 }
diff --git a/frontend/src/components/Modals/LargeModal.tsx b/frontend/src/components/Modals/LargeModal.tsx
@@ -24,7 +24,7 @@ export function LargeModal(props: EasyModalProps) {
   }
 
   return (
-    <BaseModal modalRef={modalRef} classNames="h-[640px] max-w-[1200px]">
+    <BaseModal modalRef={modalRef} classNames="h-[640px] ">
       <div className="flex flex-col h-full">
         <LargeModalHeader project={project} />
         <div className="flex-1">{children}</div>

diff --git a/frontend/src/components/Modals/LargeModalHeader.tsx b/frontend/src/components/Modals/LargeModalHeader.tsx
@@ -9,21 +9,21 @@ export function LargeModalHeader({
 }: {
   project?: ProjectWithCustomerModel;
 }) {
-  const projectStateColor = getColorByProjectState(project?.projectState);
+  const projectStateColor = getColorByProjectState(project?.bookingType);
 
   return (
     <div className="flex flex-row gap-3 items-center">
       <div
         className={`w-[60px] h-[60px] bg-offer rounded-lg flex justify-center items-center ${projectStateColor}`}
       >
-        {getIconByProjectState(32, project?.projectState)}
+        {getIconByProjectState(32, project?.bookingType)}
       </div>
       <div className="flex flex-col justify-center">
         <h1>{project?.projectName}</h1>
         <div className="flex flex-row gap-2 items-center">
           <p className="normal text-black">{project?.customerName}</p>
           <div className="w-1 h-1 rounded-full bg-black"></div>
-          <p className="normal text-black">{project?.projectState}</p>
+          <p className="normal text-black">{project?.bookingType}</p>
         </div>
       </div>
     </div>