54 lines
1023 B
Vue
54 lines
1023 B
Vue
<template>
|
|
<div class="container">
|
|
<ul class="locations">
|
|
<li
|
|
v-for="location in store.locations"
|
|
@click="showDetails(location)"
|
|
>
|
|
<router-link :to="createLink(location)">
|
|
{{location.label}}
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import store from '../store';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
store
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
createLink(loc) {
|
|
let lat = loc.coordinates[0];
|
|
let lng = loc.coordinates[1];
|
|
return `/${lat}/${lng}`;
|
|
},
|
|
|
|
showDetails(loc) {
|
|
let lat = loc.coordinates[0];
|
|
let lng = loc.coordinates[1];
|
|
store.openPopup(loc.label, lat, lng);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
li {
|
|
margin-top: 20px;
|
|
}
|
|
</style>
|
|
|
|
<style>
|
|
.leaflet-sidebar-content ul {
|
|
list-style-type: none;
|
|
padding-left: 5px;
|
|
}
|
|
</style>
|