refactor(customer-vue): home view skeleton component 추가

- 즐겨찾기 데이터 로딩시 레이지로딩 엘리먼트 보여줌

customer-vue/src/components/SlideStore.vue

@@ -4,7 +4,21 @@
       show-arrows="desktop"
     >
       <v-slide-item
-          v-for="item in storeList"
+          :class="storeList.isActive"
+          v-for="n in 3"
+          :key="n"
+      >
+        <v-skeleton-loader
+            class="my-3 mx-3"
+            elevation="7"
+            height="250"
+            width="165"
+            type="card"
+            :key="n"
+        ></v-skeleton-loader>
+        </v-slide-item>
+      <v-slide-item
+          v-for="item in storeList.data"
           :key="item.id"
       >
         <v-card
@@ -13,6 +27,7 @@
             height="250"
             width="165"
         >
+          <v-skeleton-loader>
           <v-img
               height="165"
               width="165"
@@ -22,6 +37,7 @@
           <v-card-text>
             거리 : {{item.distance}}
           </v-card-text>
+          </v-skeleton-loader>
         </v-card>
       </v-slide-item>
     </v-slide-group>

customer-vue/src/views/HomeView.vue

@@ -13,18 +13,12 @@
     </v-row>
     <v-row justify="center">
       <v-col>
-        <div class="text-overline" >즐겨찾는 매장입니다.</div>
+        <div class="text-h5" >즐겨찾는 매장입니다.</div>
         <slide-store
           :store-list="favoriteStoreList"
         ></slide-store>
       </v-col>
     </v-row>
-    <v-overlay :value="isLoading">
-      <v-progress-circular
-          indeterminate
-          size="64"
-      ></v-progress-circular>
-    </v-overlay>
   </v-container>
 </template>
 
@@ -39,10 +33,13 @@ export default {
   },
   data(){
     return{
-      isLoading: true,
       latitude:0,
       longitude:0,
-      favoriteStoreList:[],
+      favoriteStoreList:{
+        data:[],
+        isActive:'',
+
+      },
     }
   },
   async mounted() {
@@ -51,9 +48,9 @@ export default {
     this.longitude = location.longitude;
     storeApi.getFavoriteStore(this.latitude,this.longitude)
     .then(response =>{
-      this.favoriteStoreList = response.data.data;
+      this.favoriteStoreList.isActive = 'd-none'
+      this.favoriteStoreList.data = response.data.data;
     });
-    this.isLoading = false
   },
   methods:{
     getLocation: async function() {