delete in lists

angular/src/app/_components/list/list.component.html

@@ -90,11 +90,11 @@
                             </ng-container>
 
                             <ng-container *ngSwitchCase="COLUMN_TYPE_BTN_REMOVE">
-                                <span class="spt-icon-remove" (click)="onRemoveItemFunction(element, column)"></span>
+                                <span class="spt-icon-remove" (click)="onDeleteItem(element)"></span>
                             </ng-container>
 
                             <ng-container *ngSwitchCase="COLUMN_TYPE_BTN_EDIT">
-                                <span class="spt-icon-edit" data-type="user-tool" data-action="edit" (click)="onEditData(element)"></span>
+                                <span class="spt-icon-edit" data-type="user-tool" data-action="edit" (click)="onEditItem(element)"></span>
                             </ng-container>
 
                             <ng-container *ngSwitchCase="COLUMN_TYPE_DATE">

angular/src/app/_components/list/list.component.ts

@@ -8,8 +8,9 @@ import {ListGetDataFunctionType} from "@app/_components/list/list-get-data-funct
 import {ListUpdateElementFunctionType} from "@app/_components/list/list-update-element-function-type";
 import {FilterBarComponent} from "@app/_components/filter-bar/filter-bar.component";
 import { Router } from '@angular/router';
-import {interval, Subscription} from "rxjs";
+import {interval, Observable, Subscription} from "rxjs";
 import {AbstractDataFormComponent} from "@app/_components/_abstract/abstract-data-form-component";
+import {TranslateService} from "@ngx-translate/core";
 
 @Component({
     selector: 'app-list',
@@ -23,8 +24,8 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
     @Input() public onSortFunction?: Function;
     @Input() public onNavigateToDetailsFunction!: Function;
     @Input() public getCustomDetailLinkFunction!: Function;
-    @Input() public onRemoveItemFunction!: Function;
-    @Input() public onEditFunction!: Function;
+    @Input() public deleteItemFunction?: (id: string) => Observable<any>;
+    @Input() public onEditItemFunction!: Function;
     @Input() public onDownloadFunction!: Function;
     @Input() public onRowSelectedFunction!: Function;
     @Input() public onUpdateBooleanStateFunction!: ListUpdateElementFunctionType;
@@ -83,6 +84,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
     constructor(
         protected appHelperService: AppHelperService,
         private router: Router,
+        protected translateService: TranslateService
     ) {
         this.searchable = true;
         this.showPosition = true;
@@ -105,12 +107,12 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
         if (this.showPosition) {
             this.listColDefinitions.unshift(ListComponent.getDefaultColPosition());
         }
-        if (this.showEditButton) {
-            this.listColDefinitions.unshift(ListComponent.getDefaultColEditBtn());
-        }
-        if (this.showRemoveButton) {
+        if (this.deleteItemFunction && this.showRemoveButton) {
             this.listColDefinitions.unshift(ListComponent.getDefaultRemoveBtn());
         }
+        if (this.dataFormComponent && this.showEditButton) {
+            this.listColDefinitions.unshift(ListComponent.getDefaultColEditBtn());
+        }
         if (this.showDetailButton) {
             const url = this.getCustomDetailLinkFunction !== undefined ? '' : this.router.routerState.snapshot.url;
             this.listColDefinitions.unshift(ListComponent.getDefaultColDetailBtnLink(url));
@@ -431,17 +433,41 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
         );
     }
 
-    public onEditData(element: any) {
-        // Create a new object instead of modifying the existing one
-        this.dataFormComponentData = {
-            ...this.dataFormComponentData,
-            data: element
-        };
-        this.appHelperService.openModal(
-            this.dataFormComponent,
-            this.dataFormComponentData,
-            this.getData
-        );
+    public onEditItem(element: any) {
+        if (this.onEditItemFunction) {
+            this.onEditItemFunction(element);
+        } else {
+            // Default edit
+            // Create a new object instead of modifying the existing one
+            this.dataFormComponentData = {
+                ...this.dataFormComponentData,
+                data: element
+            };
+            this.appHelperService.openModal(
+                this.dataFormComponent,
+                this.dataFormComponentData,
+                this.getData
+            );
+        }
+    }
+
+    public onDeleteItem(element: any) {
+        const deleteFunction = this.deleteItemFunction;
+        if (deleteFunction) {
+            this.translateService.get('basic.delete_confirm_related').subscribe((confirmMessage: string) => {
+                if (confirm(confirmMessage)) {
+                    deleteFunction(element.dbId).subscribe({
+                        next: () => {
+                            this.getData();
+                        },
+                        error: (error: any) => {
+                            console.error('Delete error:', error);
+                            alert('Error while deleting dataset (there might be related data)');
+                        }
+                    });
+                }
+            });
+        }
     }
 
     public getFilterJsonString(): any {

angular/src/app/_views/location/location-list/location-list.component.html

@@ -2,6 +2,7 @@
     <app-list #listComponent
               [listId]="'locationList'"
               [getDataFunction]="getData"
+              [deleteItemFunction]="deleteItemFunction"
               [getCustomDetailLinkFunction]="getCustomDetailLink"
               [listColDefinitions]="listColDefinitions"
               [dataFormComponent]="LocationFormComponent"

angular/src/app/_views/location/location-list/location-list.component.ts

@@ -9,6 +9,7 @@ import {ROUTE_LOCATIONS} from "@app/app-routing.module";
 import {Sort} from "@angular/material/sort";
 import {LocationFormComponent} from "@app/_views/location/location-form/location-form.component";
 import {SearchSelectComponent} from "@app/_components/search-select/search-select.component";
+import {Observable} from "rxjs";
 
 @Component({
   selector: 'app-location-list',
@@ -55,4 +56,8 @@ export class LocationListComponent implements OnInit, AfterViewInit {
     getCustomDetailLink(element: LocationJsonld) {
         return ROUTE_LOCATIONS + '/' + this.appHelperService.extractId(element?.id);
     }
+
+    get deleteItemFunction(): (id: string) => Observable<any> {
+        return (id: string) => this.locationService.locationsIdDelete(id);
+    }
 }

angular/src/app/_views/shipping-company/shipping-company-list/shipping-company-list.component.html

@@ -2,6 +2,7 @@
     <app-list #listComponent
               [listId]="'shippingCompanyList'"
               [getDataFunction]="getData"
+              [deleteItemFunction]="deleteItemFunction"
               [getCustomDetailLinkFunction]="getCustomDetailLink"
               [listColDefinitions]="listColDefinitions"
               [dataFormComponent]="ShippingCompanyFormComponent"

angular/src/app/_views/shipping-company/shipping-company-list/shipping-company-list.component.ts

@@ -15,6 +15,7 @@ import {ROUTE_LOCATIONS, ROUTE_SHIPPING_COMPANIES} from "@app/app-routing.module
 import {
     ShippingCompanyFormComponent
 } from "@app/_views/shipping-company/shipping-company-form/shipping-company-form.component";
+import {Observable} from "rxjs";
 
 @Component({
   selector: 'app-shipping-company-list',
@@ -84,6 +85,10 @@ export class ShippingCompanyListComponent {
         );
     }
 
+    get deleteItemFunction(): (id: string) => Observable<any> {
+        return (id: string) => this.shippingCompanyService.shippingCompaniesIdDelete(id);
+    }
+
     getCustomDetailLink(element: LocationJsonld) {
         return ROUTE_SHIPPING_COMPANIES + '/' + this.appHelperService.extractId(element?.id);
     }

angular/src/app/_views/trip/trip-list/trip-list.component.html

@@ -1,8 +1,8 @@
 <div class="spt-container">
     <app-list #listComponent
               [listId]="'tripList'"
-              [showEditButton]="true"
               [getDataFunction]="getData"
+              [deleteItemFunction]="deleteItemFunction"
               [listColDefinitions]="listColDefinitions"
               [dataFormComponent]="tripFormComponent"
     ></app-list>

angular/src/app/_views/trip/trip-list/trip-list.component.ts

@@ -6,6 +6,7 @@ import {TripService} from "@app/core/api/v1";
 import {AppHelperService} from "@app/_helpers/app-helper.service";
 import {FilterBarComponent} from "@app/_components/filter-bar/filter-bar.component";
 import {ListGetDataFunctionType} from "@app/_components/list/list-get-data-function-type";
+import {Observable} from "rxjs";
 
 @Component({
   selector: 'app-trip-list',
@@ -116,4 +117,7 @@ export class TripListComponent {
         );
     }
 
+    get deleteItemFunction(): (id: string) => Observable<any> {
+        return (id: string) => this.tripService.tripsIdDelete(id);
+    }
 }

angular/src/app/_views/trip/trip-location-list/trip-location-list.component.html

@@ -1,10 +1,11 @@
 <div class="spt-container">
     <app-list #listComponent
               [listId]="'tripLocationList'"
-              [showEditButton]="true"
+              [showDetailButton]="false"
               [getDataFunction]="getData"
               [listColDefinitions]="listColDefinitions"
               [dataFormComponent]="tripLocationFormComponent"
               [dataFormComponentData]="dataFormComponentData"
+              [deleteItemFunction]="deleteItemFunction"
     ></app-list>
 </div>

angular/src/app/_views/trip/trip-location-list/trip-location-list.component.ts

@@ -7,6 +7,7 @@ import {FilterBarComponent} from "@app/_components/filter-bar/filter-bar.compone
 import {ListGetDataFunctionType} from "@app/_components/list/list-get-data-function-type";
 import {TripLocationFormComponent} from "@app/_views/trip/trip-location-form/trip-location-form.component";
 import {map, tap} from "rxjs/operators";
+import {Observable} from "rxjs";
 
 @Component({
   selector: 'app-trip-location-list',
@@ -23,7 +24,7 @@ export class TripLocationListComponent {
     protected dataFormComponentData: any;
 
     constructor(
-        private tripLocationService: TripLocationService,
+        public tripLocationService: TripLocationService,
         protected appHelperService: AppHelperService,
     ) {
         this.listColDefinitions = [
@@ -124,4 +125,8 @@ export class TripLocationListComponent {
             })
         );
     }
+
+    get deleteItemFunction(): (id: string) => Observable<any> {
+        return (id: string) => this.tripLocationService.tripLocationsIdDelete(id);
+    }
 }

angular/src/app/_views/vessel/vessel-list/vessel-list.component.html

@@ -2,6 +2,7 @@
     <app-list #listComponent
               [listId]="'vesselList'"
               [getDataFunction]="getData"
+              [deleteItemFunction]="deleteItemFunction"
               [getCustomDetailLinkFunction]="getCustomDetailLink"
               [listColDefinitions]="listColDefinitions"
               [dataFormComponent]="VesselFormComponent"

angular/src/app/_views/vessel/vessel-list/vessel-list.component.ts

@@ -5,9 +5,10 @@ import {VesselService, ZoneJsonld} from "@app/core/api/v1";
 import {Router} from "@angular/router";
 import {AppHelperService} from "@app/_helpers/app-helper.service";
 import {ListGetDataFunctionType} from "@app/_components/list/list-get-data-function-type";
-import {ROUTE_VESSELS, ROUTE_ZONES} from "@app/app-routing.module";
+import {ROUTE_VESSELS} from "@app/app-routing.module";
 import {VesselFormComponent} from "@app/_views/vessel/vessel-form/vessel-form.component";
 import {SearchSelectComponent} from "@app/_components/search-select/search-select.component";
+import {Observable} from "rxjs";
 
 @Component({
   selector: 'app-vessel-list',
@@ -51,6 +52,10 @@ export class VesselListComponent {
         );
     }
 
+    get deleteItemFunction(): (id: string) => Observable<any> {
+        return (id: string) => this.vesselService.vesselsIdDelete(id);
+    }
+
     getCustomDetailLink(element: ZoneJsonld) {
         return ROUTE_VESSELS + '/' + this.appHelperService.extractId(element?.id);
     }

angular/src/app/_views/zone/zone-list/zone-list.component.html

@@ -2,6 +2,7 @@
     <app-list #listComponent
               [listId]="'zoneList'"
               [getDataFunction]="getData"
+              [deleteItemFunction]="deleteItemFunction"
               [getCustomDetailLinkFunction]="getCustomDetailLink"
               [listColDefinitions]="listColDefinitions"
               [dataFormComponent]="ZoneFormComponent"

angular/src/app/_views/zone/zone-list/zone-list.component.ts

@@ -1,14 +1,14 @@
 import {Component, ViewChild} from '@angular/core';
 import {ListComponent} from "@app/_components/list/list.component";
 import {ListColDefinition} from "@app/_components/list/list-col-definition";
-import {LocationJsonld, ZoneJsonld, ZoneService} from "@app/core/api/v1";
+import {ZoneJsonld, ZoneService} from "@app/core/api/v1";
 import {Router} from "@angular/router";
 import {AppHelperService} from "@app/_helpers/app-helper.service";
 import {ListGetDataFunctionType} from "@app/_components/list/list-get-data-function-type";
-import {Sort} from "@angular/material/sort";
-import {ROUTE_LOCATIONS, ROUTE_ZONES} from "@app/app-routing.module";
+import {ROUTE_ZONES} from "@app/app-routing.module";
 import {SearchSelectComponent} from "@app/_components/search-select/search-select.component";
 import {ZoneFormComponent} from "@app/_views/zone/zone-form/zone-form.component";
+import {Observable} from "rxjs";
 
 @Component({
   selector: 'app-zone-list',
@@ -50,6 +50,10 @@ export class ZoneListComponent {
         );
     }
 
+    get deleteItemFunction(): (id: string) => Observable<any> {
+        return (id: string) => this.zoneService.zonesIdDelete(id);
+    }
+
     getCustomDetailLink(element: ZoneJsonld) {
         return ROUTE_ZONES + '/' + this.appHelperService.extractId(element?.id);
     }