Odświezanie sortowanych danych po dodaniu nowych danych

frontend/app/src/views/Cards.vue

@@ -21,7 +21,7 @@
 
 
       <!-- pa-3 jest już nie potrzebne w <v-card> lepiej to wyglada jak sa koloery na samym brzegu-->
-      <v-card  flat v-for="card in cards" :key="card.due">
+      <v-card  flat v-for="card in visibleCards" :key="card.due">
         <!-- dynamiczne budowanie stringa bedącego wartością klasy - składnia z $ i ciapki ukosne -->
         <v-layout row wrap :class="`pa-3 cardType ${card.type}`">
           
@@ -30,10 +30,10 @@
            <div>{{card.text}}</div>
           </v-flex>
           
-          <v-flex xs6 sm4 md2>
+          <!-- <v-flex xs6 sm4 md2>
            <div class="caption grey--text">Dodana</div>
            <div>{{card.due}}</div>
-          </v-flex>
+          </v-flex> -->
 
           <v-flex xs6 sm4 md2>
             <div class="right">
@@ -57,15 +57,26 @@ export default {
   data(){
     return{
       cards: [],
+      visibleCards: [],
+      lastPropName: "",
       totalRows: null
     }
   },
   methods:{
-    sortBy(prop){
+    sortBy(propName){
         //sortowanie po typie karty
-      this.cards.filter( obj => {
-          return obj.type === prop
-      })
+      if (propName){
+        this.visibleCards = this.cards.filter( obj => {
+          console.log(obj.type === "answer")
+            if (obj.type === propName) {
+              console.log(obj)
+            return obj
+            }
+        })
+      }//koniec Id
+      else{
+        this.visibleCards = this.cards
+      }
     },
     daneZbazy(){
     // w linii komend jako admin na Windzie w folderze app 
@@ -94,6 +105,7 @@ export default {
       })
 
       this.cards = cardsTmp
+      this.sortBy(this.lastPropName)
     },
     checkDiference(){
       var objectVue = this;