feat(draw): Management of the editing of individual element

packages/common/src/lib/entity/entity-table/entity-table.component.html

@@ -1,4 +1,4 @@
-<div class="table-container">
+<div class="table-container" [ngStyle]="{'height': tableHeight}">
   <table mat-table matSort [ngClass]="getTableClass()" [dataSource]="dataSource" [trackBy]="getTrackByFunction()" (matSortChange)="onSort($event)">
       <ng-container matColumnDef="selectionCheckbox" class="mat-cell-checkbox">
           <th mat-header-cell *matHeaderCellDef>
@@ -143,7 +143,7 @@
           </ng-container>
       </ng-container>
 
-      <tr mat-header-row *matHeaderRowDef="headers; sticky: fixedHeader;" [ngClass]="getHeaderClass()">
+      <tr mat-header-row *matHeaderRowDef="headers; sticky: true;" [ngClass]="getHeaderClass()">
       </tr>
       <tr mat-row igoEntityTableRow *matRowDef="let record; columns: headers;" [scrollBehavior]="scrollBehavior" [ngClass]="getRowClass(record)" [selection]="selection" [selected]="rowIsSelected(record)" (select)="onRowSelect(record)" (click)="onRowClick(record)">
       </tr>

packages/common/src/lib/entity/entity-table/entity-table.component.scss

@@ -5,6 +5,7 @@
 }
 
 :host.table-compact {
+    overflow: auto;
     tr.mat-header-row,
      ::ng-deep .mat-checkbox .mat-checkbox-ripple {
         height: 36px;

packages/common/src/lib/entity/entity-table/entity-table.component.ts

@@ -198,6 +198,8 @@ export class EntityTableComponent implements OnInit, OnChanges, OnDestroy {
    */
   get fixedHeader(): boolean { return this.template.fixedHeader === undefined ? true : this.template.fixedHeader; }
 
+  get tableHeight(): string { return this.template.tableHeight ? this.template.tableHeight : 'auto'; }
+
   constructor(private cdRef: ChangeDetectorRef,
     private formBuilder: FormBuilder,
     protected _focusMonitor: FocusMonitor,

packages/common/src/lib/entity/shared/entity.interfaces.ts

@@ -79,6 +79,7 @@ export interface EntityTableTemplate {
   selectMany?: boolean;
   sort?: boolean;
   fixedHeader?: boolean;
+  tableHeight?:string;
   valueAccessor?: (entity: object, property: string, record: EntityRecord<object>) => any;
   headerClassFunc?: () => {
     [key: string]: boolean;

packages/geo/src/lib/draw/draw/draw-popup.component.html

@@ -1,20 +1,21 @@
 <div mat-dialog-content>
-  <p class="mat-typography">
-    {{ 'igo.geo.draw.dialogInstruction' | translate }}
-  </p>
+  <p class="mat-typography">{{ 'igo.geo.draw.dialogInstruction' | translate }}</p>
   <mat-form-field class="example-full-width">
     <input
       #input
       matInput
-      placeholder="{{ 'igo.geo.draw.dialogTitle' | translate }}"
-      value="{{ data.currentLabel }}"/>
+      placeholder="{{'igo.geo.draw.dialogTitle' | translate}}"
+      value="{{data.currentLabel}}"/>
   </mat-form-field>
 </div>
 <div mat-dialog-actions>
-  <button mat-raised-button (click)="cancelDrawing()">
-    {{ 'igo.geo.draw.cancel' | translate }}
+  <button 
+    mat-raised-button 
+    (click)="cancelDrawing()">{{'igo.geo.draw.cancel' | translate}}
   </button>
-  <button mat-raised-button color="primary" (click)="confirm(input.value)">
-    OK
+  <button 
+    mat-raised-button 
+    color="primary" 
+    (click)="confirm(input.value)">OK
   </button>
 </div>

packages/geo/src/lib/draw/draw/draw-popup.component.ts

@@ -9,18 +9,18 @@ export interface DialogData {
   selector: 'igo-draw-popup-component',
   templateUrl: './draw-popup.component.html',
   styleUrls: ['./draw-popup.component.scss']
-})
+  })
 export class DrawPopupComponent {
   @Input() confirmFlag: boolean = false;
 
   constructor(
     public dialogRef: MatDialogRef<DrawPopupComponent>,
-    @Inject(MAT_DIALOG_DATA) public data: { currentLabel: string }
-  ) {}
+    @Inject(MAT_DIALOG_DATA) public data: { currentLabel: string }){}
 
   cancelDrawing() {
     this.dialogRef.close();
   }
+
   confirm(labelString: string) {
     this.confirmFlag = true;
     this.dialogRef.close(labelString);