add link to map on projects which have a location

This commit is contained in:
2023-08-27 20:20:16 -06:00
parent 552fce3281
commit c8de13d376
4 changed files with 33 additions and 7 deletions

View File

@@ -39,6 +39,16 @@
<fa icon="calendar" class="fa-fw text-slate-400"></fa>
{{ timeSince }}
</div>
<div v-if="latitude || longitude">
<fa icon="location-dot" class="fa-fw text-slate-400"></fa>
<a
:href="getOpenStreetMapUrl()"
target="_blank"
class="underline"
>
Map View
</a>
</div>
</div>
</div>
</div>
@@ -231,6 +241,8 @@ export default class ProjectViewView extends Vue {
expanded = false;
givesToThis: Array<GiveServerRecord> = [];
givesByThis: Array<GiveServerRecord> = [];
latitude = 0;
longitude = 0;
name = "";
issuer = "";
projectId = localStorage.getItem("projectId") || ""; // handle ID
@@ -326,6 +338,8 @@ export default class ProjectViewView extends Vue {
this.name = resp.data.claim?.name || "(no name)";
this.description = resp.data.claim?.description || "(no description)";
this.truncatedDesc = this.description.slice(0, this.truncateLength);
this.latitude = resp.data.claim?.location?.geo?.latitude || 0;
this.longitude = resp.data.claim?.location?.geo?.longitude || 0;
} else if (resp.status === 404) {
// actually, axios throws an error so we never get here
this.$notify(
@@ -441,6 +455,20 @@ export default class ProjectViewView extends Vue {
this.$refs.customDialog.open(contact);
}
getOpenStreetMapUrl() {
// Google URL is https://maps.google.com/?q=LAT,LONG
return (
"https://www.openstreetmap.org/?mlat=" +
this.latitude +
"&mlon=" +
this.longitude +
"#map=15/" +
this.latitude +
"/" +
this.longitude
);
}
handleDialogResult(result) {
if (result.action === "confirm") {
return new Promise((resolve) => {