persist changes to the wp-table widget

frontend/src/app/components/wp-query/url-params-helper.ts

@@ -84,7 +84,8 @@ export class UrlParamsHelperService {
   private encodeColumns(paramsData:any, query:QueryResource) {
     paramsData.c = query.columns.map(function (column) {
       return column.id!;
-    })
+    });
+
     return paramsData;
   }
 

frontend/src/app/modules/grids/grid/area.service.ts

@@ -48,13 +48,18 @@ export class GridAreaService {
 
     this.resource.widgets = this.widgetResources;
     this.resource.rowCount = this.numRows;
+
     this.resource.columnCount = this.numColumns;
 
     if (save) {
-      this.gridDm.update(this.resource, this.schema);
+      this.saveGrid();
     }
   }
 
+  public saveGrid() {
+    this.gridDm.update(this.resource, this.schema);
+  }
+
   private buildGridAreas() {
     let cells:GridArea[] = [];
 

frontend/src/app/modules/grids/grid/grid.component.html

@@ -52,7 +52,7 @@
       </div>
       <ndc-dynamic [ndcDynamicComponent]="widgetComponent(area.widget)"
                    [ndcDynamicInputs]="{ resource: area.widget }"
-                   [ndcDynamicOutputs]="{}">
+                   [ndcDynamicOutputs]="widgetComponentOutput(area.widget)">
       </ndc-dynamic>
     </div>
     <resizer *ngIf="!drag.currentlyDragging"

frontend/src/app/modules/grids/grid/grid.component.ts

@@ -74,6 +74,10 @@ export class GridComponent implements OnDestroy, OnInit {
     }
   }
 
+  public widgetComponentOutput(resource:GridWidgetResource) {
+    return { resourceChanged: this.layout.saveGrid.bind(this.layout) };
+  }
+
   public get gridColumnStyle() {
     return this.sanitization.bypassSecurityTrustStyle(`repeat(${this.layout.numColumns}, 1fr)`);
   }

frontend/src/app/modules/grids/widgets/abstract-widget.component.ts

@@ -1,4 +1,4 @@
-import {HostBinding, Input} from "@angular/core";
+import {HostBinding, Input, EventEmitter, Output} from "@angular/core";
 import {GridWidgetResource} from "app/modules/hal/resources/grid-widget-resource";
 import {I18nService} from "core-app/modules/common/i18n/i18n.service";
 
@@ -10,5 +10,7 @@ export abstract class AbstractWidgetComponent {
 
   @Input() resource:GridWidgetResource;
 
+  @Output() resourceChanged = new EventEmitter<GridWidgetResource>();
+
   constructor(protected i18n:I18nService) { }
 }

frontend/src/app/modules/grids/widgets/wp-table/wp-table.component.ts

@@ -7,6 +7,8 @@ import {I18nService} from "core-app/modules/common/i18n/i18n.service";
 import {IsolatedQuerySpace} from "core-app/modules/work_packages/query-space/isolated-query-space";
 import {untilComponentDestroyed} from 'ng2-rx-componentdestroyed';
 import {WorkPackageIsolatedQuerySpaceDirective} from "core-app/modules/work_packages/query-space/wp-isolated-query-space.directive";
+import {skip} from 'rxjs/operators';
+import {UrlParamsHelperService} from "core-components/wp-query/url-params-helper";
 
 @Component({
   templateUrl: '../wp-widget/wp-widget.component.html',
@@ -14,7 +16,7 @@ import {WorkPackageIsolatedQuerySpaceDirective} from "core-app/modules/work_pack
 })
 export class WidgetWpTableComponent extends WidgetWpListComponent implements OnInit, OnDestroy, AfterViewInit {
   public text = { title: this.i18n.t('js.grid.widgets.work_packages_table.title') };
-  public queryProps = {};
+  public queryProps:any = {};
 
   public configuration:Partial<WorkPackageTableConfiguration> = {
     actionsColumnEnabled: false,
@@ -23,11 +25,18 @@ export class WidgetWpTableComponent extends WidgetWpListComponent implements OnI
     contextMenuEnabled: false
   };
 
+  constructor(protected i18n:I18nService,
+              protected urlParamsHelper:UrlParamsHelperService) {
+    super(i18n);
+  }
+
   @ViewChild(WorkPackageIsolatedQuerySpaceDirective) public querySpaceDirective:WorkPackageIsolatedQuerySpaceDirective;
 
   ngOnInit() {
+    if (this.resource.options.queryProps) {
+      this.queryProps = this.resource.options.queryProps;
+    }
     super.ngOnInit();
-
   }
 
   ngAfterViewInit() {
@@ -37,8 +46,15 @@ export class WidgetWpTableComponent extends WidgetWpListComponent implements OnI
       .query
       .values$()
       .pipe(
+        // 2 because ... well it is a magic number and works
+        skip(2),
         untilComponentDestroyed(this)
-      ).subscribe(() => console.log('query updated'));
+      ).subscribe((query) => {
+        let queryProps = this.urlParamsHelper.buildV3GetQueryFromQueryResource(query);
+
+        this.resource.options = { queryProps: queryProps };
+        this.resourceChanged.emit(this.resource);
+      });
   }
 
   ngOnDestroy() {

frontend/src/app/modules/grids/widgets/wp-widget/wp-widget.component.ts

@@ -2,7 +2,6 @@ import {AbstractWidgetComponent} from "app/modules/grids/widgets/abstract-widget
 import {OnInit} from "@angular/core";
 import {
   WorkPackageTableConfiguration,
-  WorkPackageTableConfigurationObject
 } from "core-components/wp-table/wp-table-configuration";
 
 export class WidgetWpListComponent extends AbstractWidgetComponent implements OnInit {