feedback updates

src/app/carnet/goods/goods.component.html

@@ -46,6 +46,9 @@
             <button mat-raised-button color="primary" type="button" *ngIf="!isViewMode" (click)="addNewItem()">
                 <mat-icon>add</mat-icon> Add Item
             </button>
+            <button mat-raised-button color="primary" type="button" *ngIf="!isViewMode" (click)="deleteAllItems()">
+                <mat-icon>delete</mat-icon> Delete All
+            </button>
             <div class="upload-section">
                 <input type="file" accept=".xlsx,.xls,.csv" (change)="fileUpload($event)" hidden #fileInput>
                 <button mat-raised-button type="button" *ngIf="!isViewMode" (click)="fileInput.click()"

src/app/carnet/goods/goods.component.ts

@@ -63,6 +63,7 @@ export class GoodsComponent {
   // Data
   countries: Country[] = [];
   unitsOfMeasures: UnitOfMeasure[] = [];
+  goodsItems: GoodsItem[] = [];
 
   private destroy$ = new Subject<void>();
 
@@ -135,7 +136,7 @@ export class GoodsComponent {
       this.isLoading = false;
     })).subscribe({
       next: (items: GoodsItem[]) => {
-        this.dataSource.data = items;
+        this.dataSource.data = this.goodsItems = items;
         this.completed.emit((this.goodsForm.valid || this.goodsForm.disabled) && this.dataSource.data.length > 0);
       },
       error: (error: any) => {
@@ -285,18 +286,56 @@ export class GoodsComponent {
     });
   }
 
+  // Delete all items with confirmation
+  deleteAllItems(): void {
+    const dialogRef = this.dialog.open(ConfirmDialogComponent, {
+      width: '350px',
+      data: {
+        title: 'Confirm Delete',
+        message: 'Are you sure you want to delete all the items?',
+        confirmText: 'Delete',
+        cancelText: 'Cancel'
+      }
+    });
+
+    dialogRef.afterClosed().subscribe(result => {
+      if (result) {
+        this.changeInProgress = true;
+        this.goodsService.deleteAllGoodsItems(this.headerid, this.goodsItems).pipe(finalize(() => {
+          this.changeInProgress = false;
+        })).subscribe({
+          next: () => {
+            this.notificationService.showSuccess('All items deleted successfully');
+            this.loadGoodsItems();
+            this.cancelEdit();
+          },
+          error: (error) => {
+            let errorMessage = this.errorHandler.handleApiError(error, 'Failed to delete all items');
+            this.notificationService.showError(errorMessage);
+            console.error('Error deleting all items:', error);
+          }
+        });
+      }
+    });
+  }
+
   // Handle file selection for upload
   fileUpload(event: any): void {
-    const file: File = event.target.files[0];
+    const fileInput = event.target as HTMLInputElement;
+    const file: File | null = fileInput?.files ? fileInput.files[0] : null;
+
+    if (!file) {
+      return;
+    }
 
     this.processExcelFile(file)
-      // .then(response => {
-      //   // console.log('File uploaded successfully:', response);
-      //   // Handle success (e.g., update UI)
-      // })
+      .then(() => {
+        fileInput.value = '';
+      })
       .catch(error => {
         console.error('Error processing file:', error);
         this.notificationService.showError('Failed to upload file');
+        fileInput.value = '';
       });
   }
 
@@ -384,15 +423,20 @@ export class GoodsComponent {
 
   // Parse Excel data into our format
   private parseExcelData(data: any[]): any[] {
-    return data.map(row => ({
-      itemNumber: row['Item Number'] || row['itemNumber'] || '',
-      description: row['Description'] || row['description'] || '',
-      pieces: Number(row['Pieces'] || row['pieces'] || 0),
-      weight: Number(row['Weight'] || row['weight'] || 0),
-      unitOfMeasure: row['Unit of Measure'] || row['unit of measure'] || row['unitofmeasure'] || row['UnitOfMeasure'],
-      value: Number(row['Value'] || row['value'] || 0),
-      countryOfOrigin: row['Country Of Origin'] || row['Country of Origin'] || row['country of origin'] || row['countryoforigin'] || row['CountryOfOrigin'] || ''
-    })).filter(item =>
+    return data.map(row => {
+      // Convert row to array if it's not already
+      const rowArray = Array.isArray(row) ? row : Object.values(row);
+
+      return {
+        itemNumber: rowArray[0]?.toString().trim() || '',
+        description: rowArray[1]?.toString().trim() || '',
+        pieces: Number(rowArray[2]) || 0,
+        weight: Number(rowArray[3]) || 0,
+        unitOfMeasure: rowArray[4]?.toString().trim() || '',
+        value: Number(rowArray[5]) || 0,
+        countryOfOrigin: rowArray[6]?.toString().trim() || ''
+      };
+    }).filter(item =>
       item.itemNumber &&
       item.description &&
       item.pieces > 0

src/app/carnet/shipping/fees-dialog.component.ts

@@ -16,24 +16,26 @@ import { NotificationService } from '../../core/services/common/notification.ser
     <mat-dialog-content>
         <p> The following fees apply:</p>
         <ul>
-            <li *ngIf="estimatedFees.basicFee">Basic fee: {{estimatedFees.basicFee | currency}}</li>
-            <li *ngIf="estimatedFees.counterFoilFee">Counterfoil Fee: {{estimatedFees.counterFoilFee | currency}}
-            </li>
-            <li *ngIf="estimatedFees.continuationSheetFee">Continuation sheet fee:
-                {{estimatedFees.continuationSheetFee | currency}}</li>
-            <li *ngIf="estimatedFees.expeditedFee">Expedited fee: {{estimatedFees.expeditedFee | currency}}</li>
-            <li *ngIf="estimatedFees.shippingFee">Shipping fee: {{estimatedFees.shippingFee | currency}}</li>
-            <li *ngIf="estimatedFees.bondPremium">{{bondPremiumLabel}}: {{estimatedFees.bondPremium | currency}}</li>
-            <li *ngIf="estimatedFees.cargoPremium">Cargo Premium: {{estimatedFees.cargoPremium | currency}}</li>
-            <li *ngIf="estimatedFees.ldiPremium">LDI Premium: {{estimatedFees.ldiPremium | currency}}</li>
+            <li *ngIf="estimatedFees.basicFee">Basic fee <span> {{estimatedFees.basicFee | currency}} </span></li>
+            <li *ngIf="estimatedFees.counterFoilFee">Counterfoil Fee <span> {{estimatedFees.counterFoilFee | currency}}
+            </span></li>
+            <li *ngIf="estimatedFees.continuationSheetFee">Continuation sheet fee
+            <span>  {{estimatedFees.continuationSheetFee | currency}}</span></li>
+            <li *ngIf="estimatedFees.expeditedFee">Expedited fee  <span> {{estimatedFees.expeditedFee | currency}}</span></li>
+            <li *ngIf="estimatedFees.shippingFee">Shipping fee  <span> {{estimatedFees.shippingFee | currency}}</span></li>
+            <li *ngIf="estimatedFees.bondPremium">{{bondPremiumLabel}}  <span> {{estimatedFees.bondPremium | currency}}</span></li>
+            <li *ngIf="estimatedFees.cargoPremium">Cargo Premium  <span> {{estimatedFees.cargoPremium | currency}}</span></li>
+            <li *ngIf="estimatedFees.ldiPremium">LDI Premium <span> {{estimatedFees.ldiPremium | currency}}</span></li>
         </ul>
         <hr/>
         <ul>
-          <li *ngIf="estimatedFees.securityAmount">Security Amount: {{estimatedFees.securityAmount | currency}}</li>
-          <li *ngIf="estimatedFees.insuredValue">Insured Value: {{estimatedFees.insuredValue | currency}}</li>
+          <li class="total">Total:  <span>{{total | currency}}</span></li>
         </ul>
         <hr/>
-        <p class="total">Total: {{total | currency}}</p>
+        <ul>
+          <li *ngIf="estimatedFees.securityAmount">Security Amount  <span>{{estimatedFees.securityAmount | currency}}</span></li>
+          <li *ngIf="estimatedFees.insuredValue">Insured Value  <span>{{estimatedFees.insuredValue | currency}}</span></li>
+        </ul>
     </mat-dialog-content>
     <mat-dialog-actions>
       <button mat-raised-button color="primary" (click)="onClose()">
@@ -44,6 +46,8 @@ import { NotificationService } from '../../core/services/common/notification.ser
   styles: [`
     li {
         margin-bottom: 8px;
+        display: flex;
+        justify-content: space-between;
     }
 
     .total {

src/app/carnet/shipping/shipping.component.html

@@ -17,7 +17,7 @@
 
                 <mat-form-field appearance="outline" class="formofsecurity">
                     <mat-label>Form Of Security</mat-label>
-                    <mat-select formControlName="formOfSecurity" required>
+                    <mat-select formControlName="formOfSecurity">
                         <mat-option *ngFor="let formOfSecurity of formOfSecurities" [value]="formOfSecurity.value">
                             {{ formOfSecurity.name }}
                         </mat-option>

src/app/carnet/shipping/shipping.component.ts

@@ -490,7 +490,11 @@ export class ShippingComponent {
 
     if (this.applicationType === 'duplicate' || this.applicationType === 'additional'
       || this.applicationType === 'extend') {
-      this.shippingForm.get('formOfSecurity')?.disable();
+      const formOfSecurityControl = this.shippingForm.get('formOfSecurity');
+      formOfSecurityControl?.disable();
+      formOfSecurityControl?.clearValidators();
+      formOfSecurityControl?.updateValueAndValidity();
+      
       this.shippingForm.get('needsLostDocProtection')?.disable();
     }
 

src/app/carnet/terms-conditions/terms-conditions.component.html

@@ -11,26 +11,35 @@
             <h3>Fees and Charges</h3>
             <p> The following fees apply:</p>
             <ul>
-                <li *ngIf="estimatedFees.basicFee">Basic fee: {{estimatedFees.basicFee | currency}}</li>
-                <li *ngIf="estimatedFees.counterFoilFee">Counterfoil Fee: {{estimatedFees.counterFoilFee | currency}}
+                <li *ngIf="estimatedFees.basicFee">Basic fee <span> {{estimatedFees.basicFee | currency}} </span></li>
+                <li *ngIf="estimatedFees.counterFoilFee">Counterfoil Fee <span> {{estimatedFees.counterFoilFee |
+                        currency}}
+                    </span></li>
+                <li *ngIf="estimatedFees.continuationSheetFee">Continuation sheet fee
+                    <span> {{estimatedFees.continuationSheetFee | currency}}</span>
                 </li>
-                <li *ngIf="estimatedFees.continuationSheetFee">Continuation sheet fee:
-                    {{estimatedFees.continuationSheetFee | currency}}</li>
-                <li *ngIf="estimatedFees.expeditedFee">Expedited fee: {{estimatedFees.expeditedFee | currency}}</li>
-                <li *ngIf="estimatedFees.shippingFee">Shipping fee: {{estimatedFees.shippingFee | currency}}</li>
-                <li *ngIf="estimatedFees.bondPremium">{{bondPremiumLabel}}: {{estimatedFees.bondPremium | currency}}
+                <li *ngIf="estimatedFees.expeditedFee">Expedited fee <span> {{estimatedFees.expeditedFee |
+                        currency}}</span></li>
+                <li *ngIf="estimatedFees.shippingFee">Shipping fee <span> {{estimatedFees.shippingFee |
+                        currency}}</span></li>
+                <li *ngIf="estimatedFees.bondPremium">{{bondPremiumLabel}} <span> {{estimatedFees.bondPremium |
+                        currency}}</span></li>
+                <li *ngIf="estimatedFees.cargoPremium">Cargo Premium <span> {{estimatedFees.cargoPremium |
+                        currency}}</span></li>
+                <li *ngIf="estimatedFees.ldiPremium">LDI Premium <span> {{estimatedFees.ldiPremium | currency}}</span>
                 </li>
-                <li *ngIf="estimatedFees.cargoPremium">Cargo Premium: {{estimatedFees.cargoPremium | currency}}</li>
-                <li *ngIf="estimatedFees.ldiPremium">LDI Premium: {{estimatedFees.ldiPremium | currency}}</li>
             </ul>
             <hr />
             <ul>
-                <li *ngIf="estimatedFees.securityAmount">Security Amount: {{estimatedFees.securityAmount | currency}}
-                </li>
-                <li *ngIf="estimatedFees.insuredValue">Insured Value: {{estimatedFees.insuredValue | currency}}</li>
+                <li class="total">Total: <span>{{total | currency}}</span></li>
             </ul>
             <hr />
-            <p class="total">Total: {{total | currency}}</p>
+            <ul>
+                <li *ngIf="estimatedFees.securityAmount">Security Amount <span>{{estimatedFees.securityAmount |
+                        currency}}</span></li>
+                <li *ngIf="estimatedFees.insuredValue">Insured Value <span>{{estimatedFees.insuredValue |
+                        currency}}</span></li>
+            </ul>
             <mat-checkbox [(ngModel)]="hasReadAllTerms" color="primary" class="read-checkbox">
                 I have read and agree to all terms and conditions above
             </mat-checkbox>

src/app/carnet/terms-conditions/terms-conditions.component.scss

@@ -38,6 +38,8 @@ mat-card-header {
 
     li {
         margin-bottom: 8px;
+        display: flex;
+        justify-content: space-between;
     }
 
     strong {

src/app/core/services/carnet/goods.service.ts

@@ -3,7 +3,7 @@ import { environment } from '../../../../environments/environment';
 import { HttpClient } from '@angular/common/http';
 import { UserService } from '../common/user.service';
 import { Goods, GoodsItem } from '../../models/carnet/goods';
-import { map, Observable } from 'rxjs';
+import { catchError, from, map, mergeMap, Observable, of, toArray } from 'rxjs';
 
 @Injectable({
   providedIn: 'root'
@@ -117,4 +117,34 @@ export class GoodsService {
     // delete request with body
     return this.http.delete(`${this.apiUrl}/${this.apiDb}/DeleteGenerallistItems`, { body: goodsItemsObj });
   }
+
+  deleteAllGoodsItems(headerid: number, items: GoodsItem[]): Observable<any[]> {
+    return from(items).pipe(
+      mergeMap(item => {
+        const goodsItemsObj = {
+          P_HEADERID: headerid,
+          P_ITEMNO: item.itemNumber,
+          P_USERID: this.userService.getUser(),
+        };
+
+        return this.http.delete(
+          `${this.apiUrl}/${this.apiDb}/DeleteGenerallistItems`,
+          { body: goodsItemsObj }
+        ).pipe(
+          catchError(error => {
+            console.error(`Failed to delete item ${item.itemNumber}:`, error);
+            // Return error result instead of failing the whole stream
+            return of({
+              success: false,
+              item: item.itemNumber,
+              error: error.message
+            });
+          })
+        );
+      }, 5),
+
+      // Collect all results into an array
+      toArray()
+    );
+  }
 }

src/app/home/home.component.ts

@@ -295,7 +295,7 @@ export class HomeComponent {
       }
       else if (item.orderType === 'REPLACE') {
         route = 'extend-carnet';
-      } else if (item.orderType === 'ADDLSETS') {
+      } else if (item.orderType === 'REORDER') {
         route = 'additional-sets';
       }