feat(data): use general template for all offers

With help of Object.keys (which is provided to the
template) make offers template general for different
price group types (which are academic or sport course
for now).

See discussions on !2

src/app/modules/data/elements/academic-offers-detail.html

@@ -1,36 +0,0 @@
-<ion-card>
-  <ion-card-header>Offers</ion-card-header>
-  <ion-card-content>
-    <div *ngFor="let offer of offers">
-        <p *ngIf="offer.inPlace">
-          <ion-icon name="pin"></ion-icon>
-          <a [routerLink]="['/data-detail', offer.inPlace.uid]">{{offer.inPlace.name}}</a>,&nbsp;
-          <span *ngIf="offer.availabilityStarts">
-            <ion-icon name="calendar"></ion-icon> {{offer.availabilityStarts | date}}
-          </span>
-        </p>
-      <ion-grid>
-        <ion-row *ngIf="offer.prices.student">
-          <ion-col>Students:</ion-col>
-          <ion-col width-20 text-right>
-            <p *ngIf="offer.prices.student"> {{offer.prices.student | currency:'EUR':'symbol':undefined:'de'}}</p>
-          </ion-col>
-        </ion-row>
-        <ion-row *ngIf="offer.prices.employee">
-          <ion-col>Employees:</ion-col>
-          <ion-col width-20 text-right>
-            <p *ngIf="offer.prices.employee"> {{offer.prices.employee | currency:'EUR':'symbol':undefined:'de'}}
-            </p>
-          </ion-col>
-        </ion-row>
-        <ion-row *ngIf="offer.prices.guest">
-          <ion-col>Guests:</ion-col>
-          <ion-col width-20 text-right>
-            <p *ngIf="offer.prices.guest">
-              {{offer.prices.guest | currency:'EUR':'symbol':undefined:'de'}}</p>
-          </ion-col>
-        </ion-row>
-      </ion-grid>
-    </div>
-  </ion-card-content>
-</ion-card>

src/app/modules/data/elements/offers-detail.component.ts

@@ -16,9 +16,10 @@ import {Component, Input} from '@angular/core';
 import {SCAcademicPriceGroup, SCThingThatCanBeOfferedOffer} from '@openstapps/core';
 
 @Component({
-  selector: 'stapps-academic-offers-in-list',
-  templateUrl: 'academic-offers-in-list.html',
+  selector: 'stapps-offers-detail',
+  templateUrl: 'offers-detail.html',
 })
-export class AcademicOffersInListComponent {
+export class OffersDetailComponent {
+  objectKeys = Object.keys;
   @Input() offers: Array<SCThingThatCanBeOfferedOffer<SCAcademicPriceGroup>>;
 }

src/app/modules/data/elements/offers-detail.html

@@ -0,0 +1,22 @@
+<ion-card>
+  <ion-card-header>Offers</ion-card-header>
+  <ion-card-content>
+    <div *ngFor="let offer of offers">
+      <p *ngIf="offer.inPlace">
+        <ion-icon name="pin"></ion-icon>
+        <a [routerLink]="['/data-detail', offer.inPlace.uid]">{{offer.inPlace.name}}</a>,&nbsp;
+        <span *ngIf="offer.availabilityStarts">
+          <ion-icon name="calendar"></ion-icon> {{offer.availabilityStarts | date}}
+        </span>
+      </p>
+      <ion-grid *ngFor="let group of objectKeys(offer.prices)">
+        <ion-row>
+          <ion-col>{{group | titlecase}}</ion-col>
+          <ion-col width-20 text-right>
+            <p> {{offer.prices[group] | currency:'EUR':'symbol':undefined:'de'}}</p>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+    </div>
+  </ion-card-content>
+</ion-card>

src/app/modules/data/elements/offers-in-list.component.ts

@@ -16,9 +16,9 @@ import {Component, Input} from '@angular/core';
 import {SCAcademicPriceGroup, SCThingThatCanBeOfferedOffer} from '@openstapps/core';
 
 @Component({
-  selector: 'stapps-academic-offers-detail',
-  templateUrl: 'academic-offers-detail.html',
+  selector: 'stapps-offers-in-list',
+  templateUrl: 'offers-in-list.html',
 })
-export class AcademicOffersDetailComponent {
+export class OffersInListComponent {
   @Input() offers: Array<SCThingThatCanBeOfferedOffer<SCAcademicPriceGroup>>;
 }