cambios del 24 de abril

APP/pages/compras.vue

@@ -1,6 +1,5 @@
 <template>
   <div>
-   
     <div class="row">
       <card class="col-12">
         <el-table
@@ -10,7 +9,7 @@
                 !search ||
                 data.detalle.toLowerCase().includes(search.toLowerCase()) ||
                 data.fecha.toLowerCase().includes(search.toLowerCase()) ||
-                data.metodo_pago.toLowerCase().includes(search.toLowerCase()) ||
+                data.metodopago.toLowerCase().includes(search.toLowerCase()) ||
                 data.categoria.toLowerCase().includes(search.toLowerCase())
             )
           "
@@ -22,7 +21,7 @@
           </el-TableColumn>
           <el-TableColumn prop="valor" label="Valor" sortable> </el-TableColumn>
 
-          <el-TableColumn prop="metodo_pago" label="Metodo de pago" sortable>
+          <el-TableColumn prop="metodopago" label="Metodo de pago" sortable>
           </el-TableColumn>
 
           <el-TableColumn prop="categoria" label="Categoria" sortable>
@@ -35,7 +34,7 @@
                   icon
                   size="sm"
                   class="btn-link"
-                  @click="deleteCompra($index)"
+                  @click="deleteCompra(row._id)"
                 >
                   <i class="el-icon-delete-solid"></i>
                 </base-button>
@@ -46,7 +45,7 @@
                   icon
                   size="sm"
                   class="btn-link"
-                  @click="deleteCompra($index)"
+                  @click="deleteCompra($_id)"
                 >
                   <i class="el-icon-edit"></i>
                 </base-button>
@@ -64,22 +63,20 @@
         </el-table>
       </card>
 
-      
-        <Fcompras 
+      <Fcompras
         :categorias="categorias"
         :metodos_pago="metodos_pago"
         :newCompra="newCompra"
         :saveCompra="saveCompra"
-        />
-      
+      />
     </div>
- 
   </div>
 </template>
 <script>
 import { Table, TableColumn } from "element-ui";
 import { Select, Option } from "element-ui";
 export default {
+  middleware: "authenticated",
   components: {
     [Table.name]: Table,
     [TableColumn.name]: TableColumn,
@@ -89,10 +86,10 @@ export default {
   data() {
     return {
       newCompra: {
-        fecha:"",
+        fecha: "",
         detalle: "",
         valor: 0,
-        metodo_pago: "",
+        metodopago: "",
         categoria: "",
       },
       compras: [],
@@ -122,27 +119,63 @@ export default {
     };
   },
   mounted() {
-    this.getDate()
+    this.newCompra.fecha = this.$store.state.fecha;
+    this.getCompras();
   },
   methods: {
+    getCompras() {
+      const axiosHeader = {
+        headers: {
+          token: this.$store.state.auth.token,
+        },
+      };
+      this.$axios
+        .get("/compras", axiosHeader)
+        .then((res) => {
+          console.log(res.data.data);
+          this.compras = res.data.data;
+        })
+        .catch((e) => console.log(e));
+    },
     saveCompra() {
-      var compra = JSON.stringify(this.newCompra);
-      this.compras.push(JSON.parse(compra));
-      console.log(compra);
+      const axiosHeader = {
+        headers: {
+          token: this.$store.state.auth.token,
+        },
+      };
+      const toSend = this.newCompra;
+      console.log(axiosHeader.data);
+      this.$axios
+        .post("/compra", toSend, axiosHeader)
+        .then((res) => {
+          this.clearFormCompra();
+          console.log(res.data.status);
+          this.getCompras();
+        })
+        .catch((e) => console.log(e));
     },
-    deleteCompra(index) {
-      this.compras.splice(index, 1);
-      //console.log(index)
+    deleteCompra(id) {
+      const axiosHeader={
+        headers:{
+          token: this.$store.state.auth.token,
+          
+        },
+        params:{
+          id:id
+        }
+      }
+      this.$axios.delete("/compra",axiosHeader).then(res=>{
+        
+        console.log(res.data);
+        this.getCompras();
+      }).catch(e => console.log(e))
+    },
+    clearFormCompra() {
+      this.newCompra.detalle = "";
+      this.newCompra.valor = 0;
+      this.newCompra.metodopago = "";
+      this.newCompra.categoria = "";
     },
-    getDate(){
-      let data = new Date();
-      let year= data.getFullYear();
-      let month = (data.getMonth() + 1)<9?"0"+(data.getMonth() + 1):(data.getMonth() + 1)
-      let day = data.getDate()<9?"0"+data.getDate():data.getDate()
-      let dataF=`${year}-${month}-${day}`
-      this.newCompra.fecha=dataF;
-    }
-
   },
 };
 </script>