Changeset 76712b2 for trip-planner-front/src/app/explore/explore-result

Timestamp:

01/28/22 18:45:54 (3 years ago)

Author:

Ema <ema_spirova@…>

Branches:

master

Children:

6fe77af

Parents:

b738035

Message:

search all locations by city or region

Location:

trip-planner-front/src/app/explore/explore-result

Files:

• explore-result.component.css (modified) (1 diff)
• explore-result.component.html (modified) (1 diff)
• explore-result.component.ts (modified) (2 diffs)

trip-planner-front/src/app/explore/explore-result/explore-result.component.css

@@ +1 @@
+.container {
+    background-color: #F9F2E8;
+}

trip-planner-front/src/app/explore/explore-result/explore-result.component.html

@@ -14 +14 @@
   </header>
 
-  <main role="main" style="background-color: #F9F2E8;">
+  <main role="main">
+    <h1 style="color: #F77D62; display: inline; ">Explore </h1>
+    <h1 style=" display: inline;">{{place}}</h1>
+    <div class="lightbox" *ngFor="let l of allLocation">
+      <div class="row">
+        <div class="col-lg-6">
+          <img src="data:image/png;base64,{{l.photo}}"
+          class="w-100 mb-2 mb-md-4 shadow-1-strong rounded"/>
+      </div>
+      </div>
+    </div>
+    <div class="container">
+      <li *ngFor="let location of allLocation">
+        <ol>{{location.name}}</ol>
+      </li>
+    </div>
   </main>
   <br>

trip-planner-front/src/app/explore/explore-result/explore-result.component.ts

@@ -1 +1 @@
 import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { LocationService } from 'src/app/_services/location.service';
 
 @Component({
@@ -8 +10 @@
 export class ExploreResultComponent implements OnInit {
 
-  constructor() { }
+  place: string;
+  allLocation: any[] = [];
+
+  constructor(private route: ActivatedRoute, private locationService : LocationService) {
+    this.place = '';
+  }
 
   ngOnInit(): void {
+    this.route.queryParams
+      .subscribe(params => {
+        this.place = params.place;
+      }
+    );
+
+      this.locationService.getAllLocationsSearch(this.place).subscribe(
+        data => {
+          this.allLocation = data;
+        }
+    )
   }