[ee137aa] | 1 | import { Component, OnInit, Inject } from '@angular/core';
|
---|
| 2 | import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
|
---|
| 3 | import { IHealthFacilities } from '../../shared/interfaces';
|
---|
[28d7d35] | 4 | import { latLng, LatLng, tileLayer, marker, icon } from 'leaflet';
|
---|
| 5 | import { HttpClient } from '@angular/common/http';
|
---|
[ee137aa] | 6 |
|
---|
| 7 | @Component({
|
---|
| 8 | selector: 'app-facility-dialog',
|
---|
| 9 | templateUrl: './facility-dialog.component.html',
|
---|
| 10 | styleUrls: ['./facility-dialog.component.css']
|
---|
| 11 | })
|
---|
| 12 | export class FacilityDialogComponent implements OnInit {
|
---|
| 13 | facility: IHealthFacilities;
|
---|
[28d7d35] | 14 | mapShown: boolean = true;
|
---|
| 15 | options = {
|
---|
| 16 | layers: [
|
---|
| 17 | tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' })
|
---|
| 18 | ],
|
---|
| 19 | zoom: 7,
|
---|
| 20 | center: latLng(41.61807, 21.74348)
|
---|
| 21 | }
|
---|
[ee137aa] | 22 |
|
---|
[28d7d35] | 23 | constructor(private dialogRef: MatDialogRef<FacilityDialogComponent>, @Inject(MAT_DIALOG_DATA) data, private http: HttpClient) {
|
---|
[ee137aa] | 24 | this.facility = data;
|
---|
[28d7d35] | 25 | if(this.facility) {
|
---|
| 26 | this.addMarkers();
|
---|
| 27 | }
|
---|
[ee137aa] | 28 | }
|
---|
| 29 |
|
---|
| 30 | ngOnInit(): void {
|
---|
| 31 | }
|
---|
| 32 |
|
---|
[28d7d35] | 33 | addMarkers() {
|
---|
| 34 | this.http.get<any>('https://nominatim.openstreetmap.org/search/?country=Macedonia&city='+this.facility?.municipality+'&street='+this.facility?.address+'&format=json').subscribe(obj => {
|
---|
| 35 | console.log(obj);
|
---|
| 36 | if(obj.length) {
|
---|
| 37 | let layer = marker([ obj[0]?.lat, obj[0]?.lon ], {
|
---|
| 38 | icon: icon({
|
---|
| 39 | iconSize: [ 25, 41 ],
|
---|
| 40 | iconAnchor: [ 13, 41 ],
|
---|
| 41 | iconUrl: 'assets/hospital-icon.png'
|
---|
| 42 | })
|
---|
| 43 | }).bindPopup("Аптека: "+this.facility?.name);
|
---|
| 44 | this.options.layers.push(layer);
|
---|
| 45 | this.options.center = latLng(obj[0]?.lat, obj[0]?.lon);
|
---|
| 46 | this.options.zoom = 13;
|
---|
| 47 | }
|
---|
| 48 | }, error => console.error(error));
|
---|
| 49 | this.mapShown = false;
|
---|
| 50 | setTimeout(() => this.mapShown = true, 300);
|
---|
| 51 | }
|
---|
| 52 |
|
---|
| 53 |
|
---|
[ee137aa] | 54 | close() {
|
---|
| 55 | this.dialogRef.close();
|
---|
| 56 | }
|
---|
| 57 |
|
---|
| 58 | }
|
---|