Merge branch 'board-loading' into 'master'

Add Loading text in Finder&Loster Board

See merge request !17

src/views/FinderBoard.vue

@@ -36,7 +36,13 @@
       </v-flex>
       <v-flex md12>
         <material-card color="green" title="발견 게시판" text="제목을 클릭하여 게시글을 확인하세요.">
+          <v-card :elevation="20" width="300" :shaped="true" v-if="dataLoading" class="mx-auto">
+            <v-card-text>
+              <strong class="display-3 center">LOADING....</strong>
+            </v-card-text>
+          </v-card>
           <v-data-table
+            v-if="!dataLoading"
             :headers="headers" 
             :items="items" 
             item-key="_id" 
@@ -87,8 +93,8 @@ export default {
     items: [],
     search: '',
     loginDialog: false,
-    image:null
-    
+    image:null,
+    dataLoading: true
   }),
   created() {
     var log;
@@ -100,11 +106,13 @@ export default {
           this.loginDialog = true;
         }
         else{
+          this.dataLoading = true;
           this.items = response.data.finderboards;
           for(let i=0; i<this.items.length; i++){
             var base64data=Buffer.from(this.items[i].image.data.data,'binary').toString('base64');
             this.items[i].image='data:image/jpeg;base64,'+base64data;
           }
+          this.dataLoading = false;
         }
       }).catch(err => {
           alert("ERR while FET losterboard" + err)

src/views/LosterBoard.vue

@@ -36,7 +36,13 @@
       </v-flex>
       <v-flex md12>
         <material-card color="green" title="실종 게시판" text="제목을 클릭하여 게시글을 확인하세요.">
+          <v-card :elevation="20" width="300" :shaped="true" v-if="dataLoading" class="mx-auto">
+            <v-card-text>
+              <strong class="display-3 center">LOADING....</strong>
+            </v-card-text>
+          </v-card>
           <v-data-table
+            v-if="!dataLoading"
             :headers="headers" 
             :items="items" 
             item-key="_id"
@@ -87,8 +93,8 @@ export default {
     items: [],
     search: '',
     loginDialog: false,    
-    image:null
-
+    image:null,
+    dataLoading: true
   }),
   created() {
     var log;
@@ -100,14 +106,13 @@ export default {
           this.loginDialog = true;
         }
         else{
-          this.$http.get('/losterboard')
-            .then(response => {
+          this.dataLoading = true;
           this.items = response.data.losterboards;
           for(let i=0; i<this.items.length; i++){
             var base64data=Buffer.from(this.items[i].image.data.data,'binary').toString('base64');
             this.items[i].image='data:image/jpeg;base64,'+base64data;
           }
-            });
+          this.dataLoading = false;
         }
       }).catch(err => {
           alert("ERR while FET losterboard" + err)