v0.3.0: Added distance sorting

package.json

@@ -1,6 +1,6 @@
 {
   "name": "lieferberlino",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "private": true,
   "scripts": {
     "install_dev": "docker-compose run web_dev npm install",

src/components/LbCard.vue

@@ -3,6 +3,7 @@
       <img :src="shop.image || 'https://via.placeholder.com/100'" :alt="`${shop.name}_logo`"/>
       <div class="infos">
         <h1>{{ shop.name }} <b-badge class="badge" pill :variant="shop.isOpen ? 'success' : 'danger'">{{ shop.isOpen ? 'Geöffnet' : 'Geschlossen' }}</b-badge></h1>
+        <h2>{{ format(shop.distance) }} entfernt</h2>
         <h2>{{ shop.type }}</h2>
         <h2>{{ shop.street }}</h2>
         <h2>{{ shop.postalcode }} Ort</h2>
@@ -17,7 +18,15 @@
 export default {
   props: [
     'shop'
-  ]
+  ],
+  methods: {
+    format (meter) {
+      if (meter > 1000) {
+        return `${(meter / 1000).toFixed(1)} km`
+      }
+      return `${meter} m`
+    }
+  }
 }
 </script>
 

src/views/SearchResults.vue

@@ -45,16 +45,26 @@ export default {
     if (this.shopList.length === 0) {
       this.$store.dispatch('getShops')
     }
+
+    if (this.$store.state.location.coords.latitude === 0) {
+      this.$store.dispatch('getCurrentLocation')
+    }
   },
   computed: {
     filteredList () {
       const list = this.shopList.filter(shop => {
         const location = {
-          latitude: parseInt(shop.location.split(';')[0]),
-          longitude: parseInt(shop.location.split(';')[1])
+          latitude: parseFloat(shop.location.split(';')[0]),
+          longitude: parseFloat(shop.location.split(';')[1])
         }
+
+        const currentCoords = {
+          latitude: this.$store.state.location.coords.latitude,
+          longitude: this.$store.state.location.coords.longitude
+        }
+
         const distance = getDistance(
-          this.$store.state.location.coords,
+          currentCoords,
           location
         )
 
@@ -63,7 +73,7 @@ export default {
         return distance !== 0
       })
 
-      // list.sort((shop, shop2) => shop.distance - shop2.distance)
+      list.sort((shop, shop2) => shop.distance - shop2.distance)
 
       return list
     },