diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/services/site/site.service.ts b/src/app/core/services/site/site.service.ts index aa87fb1..82bfec6 100644 --- a/src/app/core/services/site/site.service.ts +++ b/src/app/core/services/site/site.service.ts @@ -19,7 +19,7 @@ } getSite(id: string): Observable { - return this.http.get(`${this.BASE_URL_API}/${id}`) + return this.http.get(`${this.BASE_URL_API}${id}/`) } } diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/services/site/site.service.ts b/src/app/core/services/site/site.service.ts index aa87fb1..82bfec6 100644 --- a/src/app/core/services/site/site.service.ts +++ b/src/app/core/services/site/site.service.ts @@ -19,7 +19,7 @@ } getSite(id: string): Observable { - return this.http.get(`${this.BASE_URL_API}/${id}`) + return this.http.get(`${this.BASE_URL_API}${id}/`) } } diff --git a/src/app/modules/public/discover/components/map/map.component.ts b/src/app/modules/public/discover/components/map/map.component.ts index e906462..91e6473 100644 --- a/src/app/modules/public/discover/components/map/map.component.ts +++ b/src/app/modules/public/discover/components/map/map.component.ts @@ -1,9 +1,12 @@ +import { MapService } from './../../../../../core/services/map/map.service'; +import { QueryService } from './../../../../../core/services/query/query.service'; import { Ffilter } from './../../../../../core/interfaces/utils/forms/filters'; import { AfterViewInit, Component, Input, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { MapInfoWindow, MapMarker, GoogleMap } from '@angular/google-maps' import { Site } from 'src/app/core/interfaces/site/site'; import { } from 'googlemaps' import { SITES } from '../../../../../core/mocks/data'; +import { environment } from 'src/environments/environment'; @Component({ selector: 'app-map', @@ -19,6 +22,7 @@ sites: Site[] = SITES; @Input() form!: Ffilter; + url = environment.BASE_URL_API; mapa?: any; zoom = 17; @@ -34,8 +38,8 @@ }; options: google.maps.MapOptions = { zoomControl: true, - scrollwheel: false, - disableDoubleClickZoom: true, + scrollwheel: true, + disableDoubleClickZoom: false, maxZoom: 17, minZoom: 8, noClear: false, @@ -77,21 +81,36 @@ ], } - constructor() { } + constructor(private mapService: MapService) { } ngOnInit(): void { this.position = { lat: this.form.lat, lng: this.form.lng }; - this.createMarkers(); - this.loading = false; + this.getSites(); } ngAfterViewInit() { console.log(this.map) } + getSites(){ + this.markers = []; + this.mapService.getSites(this.form).subscribe( + (data) => { + console.log("This is data",data) + console.log(data); + this.sites = data; + this.createMarkers(); + this.loading = false; + }, + (error) => { + console.log(error) + } + ) + } + createMarkers() { const image = { url: "../../../../../../assets/markers/redmarker.png", @@ -125,8 +144,9 @@ mapIsDragged() { this.form.lat = this.map.googleMap?.getCenter().lat() || 0 - this.form.lng = this.map.googleMap?.getCenter().lat() || 0 + this.form.lng = this.map.googleMap?.getCenter().lng() || 0 this.form.zoom = parseInt(this.map.googleMap?.getZoom().toPrecision() || '17') || 17 + this.getSites(); console.log(this.form) } diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/services/site/site.service.ts b/src/app/core/services/site/site.service.ts index aa87fb1..82bfec6 100644 --- a/src/app/core/services/site/site.service.ts +++ b/src/app/core/services/site/site.service.ts @@ -19,7 +19,7 @@ } getSite(id: string): Observable { - return this.http.get(`${this.BASE_URL_API}/${id}`) + return this.http.get(`${this.BASE_URL_API}${id}/`) } } diff --git a/src/app/modules/public/discover/components/map/map.component.ts b/src/app/modules/public/discover/components/map/map.component.ts index e906462..91e6473 100644 --- a/src/app/modules/public/discover/components/map/map.component.ts +++ b/src/app/modules/public/discover/components/map/map.component.ts @@ -1,9 +1,12 @@ +import { MapService } from './../../../../../core/services/map/map.service'; +import { QueryService } from './../../../../../core/services/query/query.service'; import { Ffilter } from './../../../../../core/interfaces/utils/forms/filters'; import { AfterViewInit, Component, Input, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { MapInfoWindow, MapMarker, GoogleMap } from '@angular/google-maps' import { Site } from 'src/app/core/interfaces/site/site'; import { } from 'googlemaps' import { SITES } from '../../../../../core/mocks/data'; +import { environment } from 'src/environments/environment'; @Component({ selector: 'app-map', @@ -19,6 +22,7 @@ sites: Site[] = SITES; @Input() form!: Ffilter; + url = environment.BASE_URL_API; mapa?: any; zoom = 17; @@ -34,8 +38,8 @@ }; options: google.maps.MapOptions = { zoomControl: true, - scrollwheel: false, - disableDoubleClickZoom: true, + scrollwheel: true, + disableDoubleClickZoom: false, maxZoom: 17, minZoom: 8, noClear: false, @@ -77,21 +81,36 @@ ], } - constructor() { } + constructor(private mapService: MapService) { } ngOnInit(): void { this.position = { lat: this.form.lat, lng: this.form.lng }; - this.createMarkers(); - this.loading = false; + this.getSites(); } ngAfterViewInit() { console.log(this.map) } + getSites(){ + this.markers = []; + this.mapService.getSites(this.form).subscribe( + (data) => { + console.log("This is data",data) + console.log(data); + this.sites = data; + this.createMarkers(); + this.loading = false; + }, + (error) => { + console.log(error) + } + ) + } + createMarkers() { const image = { url: "../../../../../../assets/markers/redmarker.png", @@ -125,8 +144,9 @@ mapIsDragged() { this.form.lat = this.map.googleMap?.getCenter().lat() || 0 - this.form.lng = this.map.googleMap?.getCenter().lat() || 0 + this.form.lng = this.map.googleMap?.getCenter().lng() || 0 this.form.zoom = parseInt(this.map.googleMap?.getZoom().toPrecision() || '17') || 17 + this.getSites(); console.log(this.form) } diff --git a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts index 0f5aab8..759b74e 100644 --- a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts +++ b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts @@ -12,7 +12,6 @@ url = environment.BASE_URL_API; loading = true; @Input() isOpenModal: boolean = false; - @Input() allyId!: number; display = 'none'; ally: Site = { id: 1, diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/services/site/site.service.ts b/src/app/core/services/site/site.service.ts index aa87fb1..82bfec6 100644 --- a/src/app/core/services/site/site.service.ts +++ b/src/app/core/services/site/site.service.ts @@ -19,7 +19,7 @@ } getSite(id: string): Observable { - return this.http.get(`${this.BASE_URL_API}/${id}`) + return this.http.get(`${this.BASE_URL_API}${id}/`) } } diff --git a/src/app/modules/public/discover/components/map/map.component.ts b/src/app/modules/public/discover/components/map/map.component.ts index e906462..91e6473 100644 --- a/src/app/modules/public/discover/components/map/map.component.ts +++ b/src/app/modules/public/discover/components/map/map.component.ts @@ -1,9 +1,12 @@ +import { MapService } from './../../../../../core/services/map/map.service'; +import { QueryService } from './../../../../../core/services/query/query.service'; import { Ffilter } from './../../../../../core/interfaces/utils/forms/filters'; import { AfterViewInit, Component, Input, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { MapInfoWindow, MapMarker, GoogleMap } from '@angular/google-maps' import { Site } from 'src/app/core/interfaces/site/site'; import { } from 'googlemaps' import { SITES } from '../../../../../core/mocks/data'; +import { environment } from 'src/environments/environment'; @Component({ selector: 'app-map', @@ -19,6 +22,7 @@ sites: Site[] = SITES; @Input() form!: Ffilter; + url = environment.BASE_URL_API; mapa?: any; zoom = 17; @@ -34,8 +38,8 @@ }; options: google.maps.MapOptions = { zoomControl: true, - scrollwheel: false, - disableDoubleClickZoom: true, + scrollwheel: true, + disableDoubleClickZoom: false, maxZoom: 17, minZoom: 8, noClear: false, @@ -77,21 +81,36 @@ ], } - constructor() { } + constructor(private mapService: MapService) { } ngOnInit(): void { this.position = { lat: this.form.lat, lng: this.form.lng }; - this.createMarkers(); - this.loading = false; + this.getSites(); } ngAfterViewInit() { console.log(this.map) } + getSites(){ + this.markers = []; + this.mapService.getSites(this.form).subscribe( + (data) => { + console.log("This is data",data) + console.log(data); + this.sites = data; + this.createMarkers(); + this.loading = false; + }, + (error) => { + console.log(error) + } + ) + } + createMarkers() { const image = { url: "../../../../../../assets/markers/redmarker.png", @@ -125,8 +144,9 @@ mapIsDragged() { this.form.lat = this.map.googleMap?.getCenter().lat() || 0 - this.form.lng = this.map.googleMap?.getCenter().lat() || 0 + this.form.lng = this.map.googleMap?.getCenter().lng() || 0 this.form.zoom = parseInt(this.map.googleMap?.getZoom().toPrecision() || '17') || 17 + this.getSites(); console.log(this.form) } diff --git a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts index 0f5aab8..759b74e 100644 --- a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts +++ b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts @@ -12,7 +12,6 @@ url = environment.BASE_URL_API; loading = true; @Input() isOpenModal: boolean = false; - @Input() allyId!: number; display = 'none'; ally: Site = { id: 1, diff --git a/src/app/modules/public/discover/components/sites/sites.component.ts b/src/app/modules/public/discover/components/sites/sites.component.ts index dab1d99..fd4f975 100644 --- a/src/app/modules/public/discover/components/sites/sites.component.ts +++ b/src/app/modules/public/discover/components/sites/sites.component.ts @@ -18,18 +18,14 @@ icon_border_all = faBorderAll; url = environment.BASE_URL_API; sites: Site[] = SITES; + nextPage: string | null = null; + previousPage: string | null = null; + actualPage = environment.BASE_URL_API+'/allys/'; constructor(private queryService: QueryService) { } ngOnInit() { - this.queryService.query(`${this.url}/allys/`, 'GET')?.subscribe( - (data) => { - console.log("This is data",data) - }, - (error) => { - console.log(error) - } - ) + this.getSites(); } changeModeList(){ @@ -44,4 +40,28 @@ this.emitAllyId.emit($event); } + getSites(){ + this.queryService.query(this.actualPage, 'GET')?.subscribe( + (data: any) => { + console.log("This is data",data) + this.sites = data.results; + this.nextPage = data.nextPage; + this.previousPage = data.previousPage; + }, + (error) => { + console.log(error) + } + ) + } + + handleNextPage(){ + if (this.nextPage) this.actualPage = this.nextPage; + this.getSites(); + } + + handlePreviousPage(){ + if (this.previousPage) this.actualPage = this.previousPage; + this.getSites(); + } + } diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/services/site/site.service.ts b/src/app/core/services/site/site.service.ts index aa87fb1..82bfec6 100644 --- a/src/app/core/services/site/site.service.ts +++ b/src/app/core/services/site/site.service.ts @@ -19,7 +19,7 @@ } getSite(id: string): Observable { - return this.http.get(`${this.BASE_URL_API}/${id}`) + return this.http.get(`${this.BASE_URL_API}${id}/`) } } diff --git a/src/app/modules/public/discover/components/map/map.component.ts b/src/app/modules/public/discover/components/map/map.component.ts index e906462..91e6473 100644 --- a/src/app/modules/public/discover/components/map/map.component.ts +++ b/src/app/modules/public/discover/components/map/map.component.ts @@ -1,9 +1,12 @@ +import { MapService } from './../../../../../core/services/map/map.service'; +import { QueryService } from './../../../../../core/services/query/query.service'; import { Ffilter } from './../../../../../core/interfaces/utils/forms/filters'; import { AfterViewInit, Component, Input, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { MapInfoWindow, MapMarker, GoogleMap } from '@angular/google-maps' import { Site } from 'src/app/core/interfaces/site/site'; import { } from 'googlemaps' import { SITES } from '../../../../../core/mocks/data'; +import { environment } from 'src/environments/environment'; @Component({ selector: 'app-map', @@ -19,6 +22,7 @@ sites: Site[] = SITES; @Input() form!: Ffilter; + url = environment.BASE_URL_API; mapa?: any; zoom = 17; @@ -34,8 +38,8 @@ }; options: google.maps.MapOptions = { zoomControl: true, - scrollwheel: false, - disableDoubleClickZoom: true, + scrollwheel: true, + disableDoubleClickZoom: false, maxZoom: 17, minZoom: 8, noClear: false, @@ -77,21 +81,36 @@ ], } - constructor() { } + constructor(private mapService: MapService) { } ngOnInit(): void { this.position = { lat: this.form.lat, lng: this.form.lng }; - this.createMarkers(); - this.loading = false; + this.getSites(); } ngAfterViewInit() { console.log(this.map) } + getSites(){ + this.markers = []; + this.mapService.getSites(this.form).subscribe( + (data) => { + console.log("This is data",data) + console.log(data); + this.sites = data; + this.createMarkers(); + this.loading = false; + }, + (error) => { + console.log(error) + } + ) + } + createMarkers() { const image = { url: "../../../../../../assets/markers/redmarker.png", @@ -125,8 +144,9 @@ mapIsDragged() { this.form.lat = this.map.googleMap?.getCenter().lat() || 0 - this.form.lng = this.map.googleMap?.getCenter().lat() || 0 + this.form.lng = this.map.googleMap?.getCenter().lng() || 0 this.form.zoom = parseInt(this.map.googleMap?.getZoom().toPrecision() || '17') || 17 + this.getSites(); console.log(this.form) } diff --git a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts index 0f5aab8..759b74e 100644 --- a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts +++ b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts @@ -12,7 +12,6 @@ url = environment.BASE_URL_API; loading = true; @Input() isOpenModal: boolean = false; - @Input() allyId!: number; display = 'none'; ally: Site = { id: 1, diff --git a/src/app/modules/public/discover/components/sites/sites.component.ts b/src/app/modules/public/discover/components/sites/sites.component.ts index dab1d99..fd4f975 100644 --- a/src/app/modules/public/discover/components/sites/sites.component.ts +++ b/src/app/modules/public/discover/components/sites/sites.component.ts @@ -18,18 +18,14 @@ icon_border_all = faBorderAll; url = environment.BASE_URL_API; sites: Site[] = SITES; + nextPage: string | null = null; + previousPage: string | null = null; + actualPage = environment.BASE_URL_API+'/allys/'; constructor(private queryService: QueryService) { } ngOnInit() { - this.queryService.query(`${this.url}/allys/`, 'GET')?.subscribe( - (data) => { - console.log("This is data",data) - }, - (error) => { - console.log(error) - } - ) + this.getSites(); } changeModeList(){ @@ -44,4 +40,28 @@ this.emitAllyId.emit($event); } + getSites(){ + this.queryService.query(this.actualPage, 'GET')?.subscribe( + (data: any) => { + console.log("This is data",data) + this.sites = data.results; + this.nextPage = data.nextPage; + this.previousPage = data.previousPage; + }, + (error) => { + console.log(error) + } + ) + } + + handleNextPage(){ + if (this.nextPage) this.actualPage = this.nextPage; + this.getSites(); + } + + handlePreviousPage(){ + if (this.previousPage) this.actualPage = this.previousPage; + this.getSites(); + } + } diff --git a/src/app/modules/public/discover/discover.component.html b/src/app/modules/public/discover/discover.component.html index 4527683..1d31557 100644 --- a/src/app/modules/public/discover/discover.component.html +++ b/src/app/modules/public/discover/discover.component.html @@ -16,4 +16,4 @@ - + diff --git a/src/app/core/interfaces/utils/forms/filters.ts b/src/app/core/interfaces/utils/forms/filters.ts index c5a2269..bebe053 100644 --- a/src/app/core/interfaces/utils/forms/filters.ts +++ b/src/app/core/interfaces/utils/forms/filters.ts @@ -2,7 +2,7 @@ search: string, lat: number, lng: number, - location: string, - category: string; + location: number, + activity: number; zoom: number; } diff --git a/src/app/core/services/map/map.service.ts b/src/app/core/services/map/map.service.ts new file mode 100644 index 0000000..4aecf29 --- /dev/null +++ b/src/app/core/services/map/map.service.ts @@ -0,0 +1,25 @@ +import { Ffilter } from './../../interfaces/utils/forms/filters'; +import { Injectable } from '@angular/core'; +import { HttpClient } from "@angular/common/http" +import { Observable } from 'rxjs'; +import { Site } from '../../interfaces/site/site'; +import { environment } from '../../../../environments/environment'; + +@Injectable({ + providedIn: 'root' +}) +export class MapService { + + BASE_URL_API = environment.BASE_URL_API + "/allys/maps/" + + constructor(private http: HttpClient) { } + + getSites(form: Ffilter) { + return this.http.post(this.BASE_URL_API, form); + } + + getSite(id: string): Observable { + return this.http.get(`${this.BASE_URL_API}/${id}`) + } + +} diff --git a/src/app/core/services/site/site.service.ts b/src/app/core/services/site/site.service.ts index aa87fb1..82bfec6 100644 --- a/src/app/core/services/site/site.service.ts +++ b/src/app/core/services/site/site.service.ts @@ -19,7 +19,7 @@ } getSite(id: string): Observable { - return this.http.get(`${this.BASE_URL_API}/${id}`) + return this.http.get(`${this.BASE_URL_API}${id}/`) } } diff --git a/src/app/modules/public/discover/components/map/map.component.ts b/src/app/modules/public/discover/components/map/map.component.ts index e906462..91e6473 100644 --- a/src/app/modules/public/discover/components/map/map.component.ts +++ b/src/app/modules/public/discover/components/map/map.component.ts @@ -1,9 +1,12 @@ +import { MapService } from './../../../../../core/services/map/map.service'; +import { QueryService } from './../../../../../core/services/query/query.service'; import { Ffilter } from './../../../../../core/interfaces/utils/forms/filters'; import { AfterViewInit, Component, Input, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { MapInfoWindow, MapMarker, GoogleMap } from '@angular/google-maps' import { Site } from 'src/app/core/interfaces/site/site'; import { } from 'googlemaps' import { SITES } from '../../../../../core/mocks/data'; +import { environment } from 'src/environments/environment'; @Component({ selector: 'app-map', @@ -19,6 +22,7 @@ sites: Site[] = SITES; @Input() form!: Ffilter; + url = environment.BASE_URL_API; mapa?: any; zoom = 17; @@ -34,8 +38,8 @@ }; options: google.maps.MapOptions = { zoomControl: true, - scrollwheel: false, - disableDoubleClickZoom: true, + scrollwheel: true, + disableDoubleClickZoom: false, maxZoom: 17, minZoom: 8, noClear: false, @@ -77,21 +81,36 @@ ], } - constructor() { } + constructor(private mapService: MapService) { } ngOnInit(): void { this.position = { lat: this.form.lat, lng: this.form.lng }; - this.createMarkers(); - this.loading = false; + this.getSites(); } ngAfterViewInit() { console.log(this.map) } + getSites(){ + this.markers = []; + this.mapService.getSites(this.form).subscribe( + (data) => { + console.log("This is data",data) + console.log(data); + this.sites = data; + this.createMarkers(); + this.loading = false; + }, + (error) => { + console.log(error) + } + ) + } + createMarkers() { const image = { url: "../../../../../../assets/markers/redmarker.png", @@ -125,8 +144,9 @@ mapIsDragged() { this.form.lat = this.map.googleMap?.getCenter().lat() || 0 - this.form.lng = this.map.googleMap?.getCenter().lat() || 0 + this.form.lng = this.map.googleMap?.getCenter().lng() || 0 this.form.zoom = parseInt(this.map.googleMap?.getZoom().toPrecision() || '17') || 17 + this.getSites(); console.log(this.form) } diff --git a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts index 0f5aab8..759b74e 100644 --- a/src/app/modules/public/discover/components/modal-site/modal-site.component.ts +++ b/src/app/modules/public/discover/components/modal-site/modal-site.component.ts @@ -12,7 +12,6 @@ url = environment.BASE_URL_API; loading = true; @Input() isOpenModal: boolean = false; - @Input() allyId!: number; display = 'none'; ally: Site = { id: 1, diff --git a/src/app/modules/public/discover/components/sites/sites.component.ts b/src/app/modules/public/discover/components/sites/sites.component.ts index dab1d99..fd4f975 100644 --- a/src/app/modules/public/discover/components/sites/sites.component.ts +++ b/src/app/modules/public/discover/components/sites/sites.component.ts @@ -18,18 +18,14 @@ icon_border_all = faBorderAll; url = environment.BASE_URL_API; sites: Site[] = SITES; + nextPage: string | null = null; + previousPage: string | null = null; + actualPage = environment.BASE_URL_API+'/allys/'; constructor(private queryService: QueryService) { } ngOnInit() { - this.queryService.query(`${this.url}/allys/`, 'GET')?.subscribe( - (data) => { - console.log("This is data",data) - }, - (error) => { - console.log(error) - } - ) + this.getSites(); } changeModeList(){ @@ -44,4 +40,28 @@ this.emitAllyId.emit($event); } + getSites(){ + this.queryService.query(this.actualPage, 'GET')?.subscribe( + (data: any) => { + console.log("This is data",data) + this.sites = data.results; + this.nextPage = data.nextPage; + this.previousPage = data.previousPage; + }, + (error) => { + console.log(error) + } + ) + } + + handleNextPage(){ + if (this.nextPage) this.actualPage = this.nextPage; + this.getSites(); + } + + handlePreviousPage(){ + if (this.previousPage) this.actualPage = this.previousPage; + this.getSites(); + } + } diff --git a/src/app/modules/public/discover/discover.component.html b/src/app/modules/public/discover/discover.component.html index 4527683..1d31557 100644 --- a/src/app/modules/public/discover/discover.component.html +++ b/src/app/modules/public/discover/discover.component.html @@ -16,4 +16,4 @@ - + diff --git a/src/app/modules/public/discover/discover.component.ts b/src/app/modules/public/discover/discover.component.ts index a9af473..faf8302 100644 --- a/src/app/modules/public/discover/discover.component.ts +++ b/src/app/modules/public/discover/discover.component.ts @@ -1,3 +1,4 @@ +import { SiteService } from './../../../core/services/site/site.service'; import { SITES } from './../../../core/mocks/data'; import { Ffilter } from './../../../core/interfaces/utils/forms/filters'; import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; @@ -18,19 +19,16 @@ openModal = false; icon_border_all = faBorderAll; - allyId: number = -1; - sites: Site[] = SITES; - search: string = ''; form: Ffilter = { search: '', lat: 7.376362792514798, lng: -72.65115193327162, - location: '', - category: '', + location: -1, + activity: -1, zoom: 2, } - constructor(private title: Title, private activeRoute: ActivatedRoute) { } + constructor(private title: Title, private siteService: SiteService, private activeRoute: ActivatedRoute) { } ngOnInit(): void { this.setTitle("Discover | Camara de comercio"); @@ -64,12 +62,12 @@ handlePatternAllyId($event: any) { console.log(this.modal as HTMLElement); const siteId = $event; - - const site = this.sites.filter((site) => site.id == siteId)[0] - this.modal.ally = site; - console.log($event); - // this.modal.ally = "" - /* this.modal.switchModal(); */ + this.siteService.getSite(siteId).subscribe( + (data) => { + this.modal.ally = data; + }, + (error) => {} + ) } }