cygnal/src/components/ReportMarker.vue

38 lines
861 B
Vue

<template>
<v-lmarker :lat-lng="marker.latLng" :icon="icon" @click="onClick"></v-lmarker>
</template>
<script>
import L from 'leaflet';
import { LMarker } from 'vue2-leaflet';
import { REPORT_TYPES } from '@/constants';
export default {
components: {
'v-lmarker': LMarker,
},
props: {
marker: Object,
},
computed: {
icon() {
if (this.$store.state.reportDetails.id === this.marker.id) {
return L.icon(REPORT_TYPES[this.marker.type].markerLarge);
}
return L.icon(REPORT_TYPES[this.marker.type].marker);
},
},
data() {
return {
showCard: false,
};
},
methods: {
onClick() {
this.$store.dispatch('showReportDetails', { id: this.marker.id, userAsked: true });
},
},
};
</script>