Add more parameters to advanced search

frontend/src/app/components/search-input/search-input.component.html

@@ -93,19 +93,36 @@
           <span class="title">Climate</span>
           <span class="desc">| sweetspot selection</span>
         </div>
-        <app-toggle-slider [(model)]="temperatureMeanMax" [label]="'Temperature'" [max]="45"
+        <app-toggle-slider [(model)]="temperatureMeanMax" [label]="'Temperature (°C)'" [max]="45"
                            [min]="0"></app-toggle-slider>
-        <app-toggle-slider [(model)]="precipitation" [label]="'Precipitation'" [max]="500"
+        <app-toggle-slider [(model)]="precipitation" [label]="'Precipitation (mm)'" [max]="500"
+                           [min]="0"></app-toggle-slider>
+        <app-toggle-slider [(model)]="sunHours" [label]="'Sun hours'" [max]="400"
+                           [min]="0"></app-toggle-slider>
+        <app-toggle-slider [(model)]="rainDays" [label]="'Rain days'" [max]="31"
                            [min]="0"></app-toggle-slider>
       </section>
       <!--   Financial   -->
       <section class="group">
         <div class="horizontal">
           <span class="title">Financial</span>
-          <span class="desc">| sweetspot selection</span>
+          <span class="desc">| sweetspot selection (€/day)</span>
         </div>
-        <app-toggle-slider [(model)]="accommodation" [label]="'Accommodation'" [max]="60" [min]="0"></app-toggle-slider>
+        <app-toggle-slider [(model)]="costPerDay" [label]="'Cost'" [max]="400" [min]="0"></app-toggle-slider>
+        <app-toggle-slider [(model)]="accommodation" [label]="'Accommodation'" [max]="200"
+                           [min]="0"></app-toggle-slider>
+        <app-toggle-slider [(model)]="localTransport" [label]="'Local transport'" [max]="20"
+                           [min]="0"></app-toggle-slider>
       </section>
+      <!--   Tags   -->
+      <section class="group">
+        <div class="horizontal">
+          <span class="title">Tags</span>
+          <span class="desc">| Search by user ratings</span>
+        </div>
+        <app-multi-tag-select [(model)]="selectedTags" [availableTags]="tags"></app-multi-tag-select>
+      </section>
+
     </mat-tab>
 
   </mat-tab-group>

frontend/src/app/components/search-input/search-input.component.scss

@@ -31,6 +31,7 @@
   display: flex;
   flex-direction: column;
   margin: 1rem 0;
+  overflow: hidden;
 
   .title {
     font-size: 1.2rem;
@@ -52,6 +53,10 @@
       min-width: 14rem;
     }
   }
+
+  > app-multi-tag-select {
+    margin: 1rem;
+  }
 }
 
 .horizontal {

frontend/src/app/components/search-input/search-input.component.ts

@@ -37,7 +37,12 @@ export class SearchInputComponent implements OnInit {
   fullText = false;
   temperatureMeanMax: number;
   precipitation: number;
+  rainDays: number;
+  sunHours: number;
   accommodation: number;
+  costPerDay: number;
+  entertainment: number;
+  localTransport: number;
 
   readonly today = this.from = formatDate(new Date(), 'yyyy-MM-dd', 'en-GB');
 
@@ -124,6 +129,7 @@ export class SearchInputComponent implements OnInit {
     const query: Query = {
       from: new Date(this.from).getTime(),
       to: new Date(this.to).getTime(),
+      tags: this.selectedTags
     };
 
     if (this.textFilter.length > 0) {
@@ -150,7 +156,12 @@ export class SearchInputComponent implements OnInit {
       textFiler: this.textFilter,
       tempMeanMax: this.temperatureMeanMax,
       precipitation: this.precipitation,
+      rain_days: this.rainDays,
+      sun_hours: this.sunHours,
+      average_per_day_costs: this.costPerDay,
       accommodation: this.accommodation,
+      entertainment_costs: this.entertainment,
+      local_transportation_costs: this.localTransport,
     });
   }
 
@@ -168,7 +179,12 @@ export class SearchInputComponent implements OnInit {
       this.selectedTab = prevInput.wasAdvanced ? 1 : 0;
       this.temperatureMeanMax = prevInput.tempMeanMax;
       this.precipitation = prevInput.precipitation;
+      this.rainDays = prevInput.rain_days;
+      this.sunHours = prevInput.sun_hours;
+      this.costPerDay = prevInput.average_per_day_costs;
       this.accommodation = prevInput.accommodation;
+      this.entertainment = prevInput.entertainment_costs;
+      this.localTransport = prevInput.local_transportation_costs;
     }
   }
 

frontend/src/app/services/search.service.ts

@@ -13,7 +13,12 @@ export interface SearchInput {
   fullText: boolean;
   tempMeanMax: number;
   precipitation: number;
+  rain_days: number;
+  sun_hours: number;
+  average_per_day_costs: number;
   accommodation: number;
+  entertainment_costs: number;
+  local_transportation_costs: number;
 }
 
 @Injectable({