From 831965230e34b4f0a1e2a06f9ea91450623316bb Mon Sep 17 00:00:00 2001
From: Mike <mike.huang.mikank@gmail.com>
Date: Thu, 21 Nov 2019 15:18:38 +0800
Subject: [PATCH 1/4] Add error handling

---
 client/src/views/OwnerDishEdit.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/client/src/views/OwnerDishEdit.vue b/client/src/views/OwnerDishEdit.vue
index 84f3869..f9d0ee0 100644
--- a/client/src/views/OwnerDishEdit.vue
+++ b/client/src/views/OwnerDishEdit.vue
@@ -111,8 +111,10 @@ export default {
         // fire error messages
         Toast.fire({
           type: 'error',
-          title: '無法更新資料，請稍後再試'
+          title: '無法取得餐點資料，請稍後再試'
         })
+        // back to last page
+        this.$router.go(-1)
       }
     },
     async handleAfterSubmit (formData) {

From 4d9bab0cadfdba27ffa4c2275c7bf5009cc9ae1b Mon Sep 17 00:00:00 2001
From: Mike <mike.huang.mikank@gmail.com>
Date: Thu, 21 Nov 2019 16:09:33 +0800
Subject: [PATCH 2/4] Update district center

---
 client/src/utils/helpers.js   |  4 ++--
 client/src/views/Login.vue    |  2 +-
 server/location/district.json | 12 ++++++------
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/client/src/utils/helpers.js b/client/src/utils/helpers.js
index 7aad6be..fa45c51 100644
--- a/client/src/utils/helpers.js
+++ b/client/src/utils/helpers.js
@@ -1,8 +1,8 @@
 import axios from 'axios'
 import Swal from 'sweetalert2'
 
-const baseURL = 'https://nextmeal.herokuapp.com/api'
-// const baseURL = 'http://localhost:3000/api'
+// const baseURL = 'https://nextmeal.herokuapp.com/api'
+const baseURL = 'http://localhost:3000/api'
 
 // config an instance
 const axiosInstance = axios.create({
diff --git a/client/src/views/Login.vue b/client/src/views/Login.vue
index d7f9bd6..db3c0d1 100644
--- a/client/src/views/Login.vue
+++ b/client/src/views/Login.vue
@@ -159,7 +159,7 @@ export default {
         // fire error messages
         Toast.fire({
           type: 'error',
-          title: '目前無法登入，請稍後再試'
+          title: '帳號密碼有誤'
         })
       }
     }
diff --git a/server/location/district.json b/server/location/district.json
index 6e9f228..bdd697b 100644
--- a/server/location/district.json
+++ b/server/location/district.json
@@ -3,15 +3,15 @@
     "chinese_name": "大安區",
     "eng_name": "Da'an",
     "image": "https://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Taipei_Daan_Park_-_Ecological_Pool_-_20180805_-_02.jpg/1821px-Taipei_Daan_Park_-_Ecological_Pool_-_20180805_-_02.jpg",
-    "lng": 121.5434446,
-    "lat": 25.02677012
+    "lng": 121.543601,
+    "lat": 25.033331
   },
   {
     "chinese_name": "信義區",
     "eng_name": "Xinyi",
     "image": "https://images.unsplash.com/photo-1571566988511-67a346198378?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=8107&q=80",
-    "lng": 121.5716697,
-    "lat": 25.03062083
+    "lng": 121.566550,
+    "lat": 25.037971
   },
   {
     "chinese_name": "中山區",
@@ -24,7 +24,7 @@
     "chinese_name": "松山區",
     "eng_name": "Songshan",
     "image": "https://upload.wikimedia.org/wikipedia/commons/thumb/0/01/TransGlobe_Life_headquarters_at_Ruentex_Songshan_Station_Complex_B_20170812.jpg/768px-TransGlobe_Life_headquarters_at_Ruentex_Songshan_Station_Complex_B_20170812.jpg",
-    "lng": 121.5575876,
-    "lat": 25.05999101
+    "lng": 121.554291,
+    "lat": 25.054676
   }
 ]
\ No newline at end of file

From 84ed304e196eb25638766e556e6cb9190ddd5ccf Mon Sep 17 00:00:00 2001
From: Mike <mike.huang.mikank@gmail.com>
Date: Thu, 21 Nov 2019 16:12:09 +0800
Subject: [PATCH 3/4] Update base url

---
 client/src/utils/helpers.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/utils/helpers.js b/client/src/utils/helpers.js
index fa45c51..7aad6be 100644
--- a/client/src/utils/helpers.js
+++ b/client/src/utils/helpers.js
@@ -1,8 +1,8 @@
 import axios from 'axios'
 import Swal from 'sweetalert2'
 
-// const baseURL = 'https://nextmeal.herokuapp.com/api'
-const baseURL = 'http://localhost:3000/api'
+const baseURL = 'https://nextmeal.herokuapp.com/api'
+// const baseURL = 'http://localhost:3000/api'
 
 // config an instance
 const axiosInstance = axios.create({

From 184f333a883a5e2ea50715bcf285c9838ec27f28 Mon Sep 17 00:00:00 2001
From: Mike <mike.huang.mikank@gmail.com>
Date: Thu, 21 Nov 2019 17:04:10 +0800
Subject: [PATCH 4/4] Add animation to show image after loaded

---
 .../src/components/Card/MealVerticalCard.vue  | 25 ++++++++++++-------
 client/src/components/Card/RestaurantCard.vue | 22 +++++++++++-----
 2 files changed, 32 insertions(+), 15 deletions(-)

diff --git a/client/src/components/Card/MealVerticalCard.vue b/client/src/components/Card/MealVerticalCard.vue
index fc4227d..62d0125 100644
--- a/client/src/components/Card/MealVerticalCard.vue
+++ b/client/src/components/Card/MealVerticalCard.vue
@@ -4,11 +4,15 @@
     href="#"
   >
     <div class="card-img-top-container">
-      <img
-        :src="order.meal.image"
-        alt="photo of the restaurant"
-        class="card-img-top"
-      >
+      <transition name="fade">
+        <img
+          v-show="imgLoaded"
+          :src="order.meal.image"
+          alt="photo of the restaurant"
+          class="card-img-top"
+          @load="imgLoaded = true"
+        >
+      </transition>
     </div>
     <div class="card-body">
       <h5 class="card-title m-0">
@@ -31,24 +35,27 @@
 </template>
 
 <script>
-import SkelentonBox from '../Placeholder/SkeletonBox'
 import { padEndFilter, textTruncateFilter } from '../../utils/mixins'
 
 export default {
-  components: {
-    SkelentonBox
-  },
   mixins: [padEndFilter, textTruncateFilter],
   props: {
     order: {
       type: Object,
       required: true
     }
+  },
+  data () {
+    return {
+      imgLoaded: false
+    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
+@include fadeAnimation;
+
 .card {
   border: none;
   transition: opacity .2s linear;
diff --git a/client/src/components/Card/RestaurantCard.vue b/client/src/components/Card/RestaurantCard.vue
index 6ae8684..e78686a 100644
--- a/client/src/components/Card/RestaurantCard.vue
+++ b/client/src/components/Card/RestaurantCard.vue
@@ -9,12 +9,15 @@
         :width="'100%'"
         :height="'200px'"
       />
-      <img
-        v-if="!isLoading"
-        :src="restaurant.image || '@/assets/placeholder-image/logo/1260x750.png'"
-        alt="photo of the restaurant"
-        class="card-img-top"
-      >
+      <transition name="fade">
+        <img
+          v-show="!isLoading && imgLoaded"
+          :src="restaurant.image || '@/assets/placeholder-image/logo/1260x750.png'"
+          alt="photo of the restaurant"
+          class="card-img-top"
+          @load="imgLoaded = true"
+        >
+      </transition>
     </div>
     <div class="card-body">
       <h5 class="card-title m-0">
@@ -74,11 +77,18 @@ export default {
       type: Boolean,
       default: false
     }
+  },
+  data () {
+    return {
+      imgLoaded: false
+    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
+@include fadeAnimation;
+
 .card {
   transition: opacity .2s linear;