Renamed prefixes in angular.json

projects/common-map/src/fm-map/components/feature-list/feature-list.component.html

@@ -0,0 +1,6 @@
+<div *ngIf="features;let features">
+  <a href="#" (click)="handleBackClick($event)">Go back</a>
+  <div class="row m-0" *ngFor="let feature of features" (click)="handleFeatureClick(feature)" (mouseenter)="handleFeatureMouseEnter(feature)" (mouseleave)="handleFeatureMouseLeave(feature)">
+    <fm-map-feature-list-feature-container [feature]="feature"></fm-map-feature-list-feature-container>
+  </div>
+</div>

projects/common-map/src/fm-map/components/feature-list/feature-list.component.scss

@@ -0,0 +1,16 @@
+@import "../../_theme.scss";
+@import "~bootstrap/scss/bootstrap.scss";
+
+feature-list-feature-container {
+  width: 100%;
+  pointer-events: none;
+}
+
+.row {
+  border-bottom: 1px solid gray('500');
+  user-select: none;
+}
+
+.row:hover {
+  background-color: gray('100');
+}

projects/common-map/src/fm-map/components/feature-list/feature-list.component.ts

@@ -0,0 +1,52 @@
+import { Component, Input, Injectable } from '@angular/core';
+import { Location } from '@angular/common';
+import { Feature } from 'ol';
+import { Store } from '@ngrx/store';
+import * as mapReducers from '../../reducers/map.reducer';
+import { commonReducers,ItemTypeService, IItem, Item } from '@farmmaps/common';
+import * as mapActions from '../../actions/map.actions';
+import { Observable, from } from 'rxjs';
+import { withLatestFrom } from 'rxjs/operators';
+import { tassign } from 'tassign';
+import { IQueryState } from '../../models';
+
+
+@Injectable()
+export abstract class AbstractFeatureListComponent {
+  @Input() features: Array<Feature>;
+  @Input() queryState: IQueryState;
+  constructor(public store: Store<mapReducers.State | commonReducers.State>, public itemTypeService: ItemTypeService, private location: Location) {
+  }
+
+  handleFeatureClick(feature:Feature) {
+    var newQuery: any = tassign(mapReducers.initialState.query);
+    newQuery.itemCode = feature.get('code');
+    this.store.dispatch(new mapActions.DoQuery(newQuery));
+  }
+
+  handleFeatureMouseEnter(feature) {
+    this.store.dispatch(new mapActions.SelectFeature(feature));
+  }
+
+  handleFeatureMouseLeave(feature) {
+    this.store.dispatch(new mapActions.SelectFeature(null));
+  }
+
+  handleBackClick(event: MouseEvent) {
+    event.preventDefault();
+    this.location.back();
+  }
+}
+
+@Injectable()
+@Component({
+  selector: 'fm-map-feature-list',
+  templateUrl: './feature-list.component.html',
+  styleUrls: ['./feature-list.component.scss']
+})
+export class FeatureListComponent extends AbstractFeatureListComponent {
+
+  constructor(store: Store<mapReducers.State | commonReducers.State>, itemTypeService: ItemTypeService,location:Location) {
+    super(store, itemTypeService,location);
+  }
+}