feat(fulfilment): show total sizes and weight of parcels

restorecommerce · Nov 17, 2024 · 90a6056 · 90a6056
1 parent a7871b7
commit 90a6056
Show file tree

Hide file tree

Showing 4 changed files with 74 additions and 10 deletions.
diff --git a/packages/modules/fulfillment/src/lib/components/fulfillment-view-details.component.html b/packages/modules/fulfillment/src/lib/components/fulfillment-view-details.component.html
@@ -188,16 +188,41 @@
     <span class="my-2 rc-lv-l-heading">Total items size</span>
   </vcl-data-list-header>
 
-  <div>...</div>
-</vcl-data-list>
+  <div>
+    <div class="row justify-content-between align-items-center">
+      <span>Length</span>
+      <span
+        >{{
+      (fulfillment.packaging?.parcels?.[0]?.items || []) |
+      parcelTotalSize : 'length' }}
+        Cm</span
+      >
+    </div>
 
-<vcl-data-list
-  mode="none"
-  [noBorder]="true"
->
-  <vcl-data-list-header>
-    <span class="my-2 rc-lv-l-heading">Total items weight</span>
-  </vcl-data-list-header>
+    <div class="row justify-content-between align-items-center">
+      <span>Width</span>
+      <span
+        >{{ (fulfillment.packaging?.parcels?.[0]?.items || []) |
+      parcelTotalSize : 'width' }}
+        Cm</span
+      >
+    </div>
 
-  <div>...</div>
+    <div class="row justify-content-between align-items-center">
+      <span>Height</span>
+      <span
+        >{{ (fulfillment.packaging?.parcels?.[0]?.items || []) |
+      parcelTotalSize : 'height' }}
+        Cm</span
+      >
+    </div>
+
+    <div class="row justify-content-between align-items-center">
+      <span>Weight</span>
+      <span
+        >{{ (fulfillment.packaging?.parcels?.[0]?.items || []) | parcelTotalWeight }}
+        Kg</span
+      >
+    </div>
+  </div>
 </vcl-data-list>
diff --git a/packages/modules/fulfillment/src/lib/modules-fulfillment.module.ts b/packages/modules/fulfillment/src/lib/modules-fulfillment.module.ts
@@ -10,6 +10,8 @@ import { FulfillmentViewDetailsComponent } from './components/fulfillment-view-d
 import { FulfillmentViewComponent } from './components/fulfillment-view.component';
 import { FulfillmentTemplateComponent } from './components/template/fulfillment-template.component';
 import { modulesFulfillmentRoutes } from './lib.routes';
+import { ParcelsTotalSizePipe } from './pipes/parcels-total-size.pipe';
+import { ParcelsTotalWeightPipe } from './pipes/parcels-total-weight.pipe';
 
 @NgModule({
   declarations: [
@@ -19,6 +21,8 @@ import { modulesFulfillmentRoutes } from './lib.routes';
     FulfillmentViewComponent,
     FulfillmentViewDetailsComponent,
     FulfillmentTemplateComponent,
+    ParcelsTotalSizePipe,
+    ParcelsTotalWeightPipe,
   ],
   imports: [
     ModulesUiModule.forChild(),

diff --git a/packages/modules/fulfillment/src/lib/pipes/parcels-total-size.pipe.ts b/packages/modules/fulfillment/src/lib/pipes/parcels-total-size.pipe.ts
@@ -0,0 +1,19 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+import { IoRestorecommerceFulfillmentItem } from '@console-core/graphql';
+
+@Pipe({
+  name: 'parcelTotalSize',
+  pure: true,
+})
+export class ParcelsTotalSizePipe implements PipeTransform {
+  transform(
+    parcels: IoRestorecommerceFulfillmentItem[],
+    property: 'length' | 'width' | 'height'
+  ): number {
+    return parcels.reduce((total, parcel) => {
+      const propValue = parcel.package?.sizeInCm?.[property] || 0;
+      return propValue + total;
+    }, 0);
+  }
+}
diff --git a/packages/modules/fulfillment/src/lib/pipes/parcels-total-weight.pipe.ts b/packages/modules/fulfillment/src/lib/pipes/parcels-total-weight.pipe.ts
@@ -0,0 +1,16 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+import { IoRestorecommerceFulfillmentItem } from '@console-core/graphql';
+
+@Pipe({
+  name: 'parcelTotalWeight',
+  pure: true,
+})
+export class ParcelsTotalWeightPipe implements PipeTransform {
+  transform(parcels: IoRestorecommerceFulfillmentItem[]): number {
+    return parcels.reduce((total, parcel) => {
+      const propValue = parcel.package?.weightInKg || 0;
+      return propValue + total;
+    }, 0);
+  }
+}