front presupuesto

APP/README.md

@@ -17,4 +17,17 @@ $ npm run start
 $ npm run generate
 ```
 
+## ToDo
+
+### Front
+
+[ ] Verificación formulario nuevo presupuesto y duplicados
+[ ] Delete Items presupuesto Front
+
+### Back
+
+[ ] API delete items presupuesto
+[ ] Verificación de nombre presupuesto repetidos
+
+
 For detailed explanation on how things work, check out [Nuxt.js docs](https://nuxtjs.org).

APP/components/Formularios/Fpresupuesto.vue

@@ -10,15 +10,9 @@
             
             <img  src="img//card-info.png" alt="" />
           </template>
-          <base-input
-            label="Fecha"
-            v-model="newPresupuesto.fecha"
-            type="Date"
-            required
-          ></base-input>
           <base-input
             label="Descripcion"
-            v-model="newPresupuesto.detalle"
+            v-model="newPresupuesto.nombrePresupuesto"
           ></base-input>
           <base-button
             

APP/pages/presupuesto.vue

@@ -3,12 +3,28 @@
     <card>
       <div class="row">
         <base-input class="col-6">
-          <select class="form-control">
+          <select
-            <option>Presupuesto</option>
+            class="form-control"
-            <option>Presupuesto 2</option>
+            @change="onChange()"
+            v-model="selectedPresupuestoName"
+          >
+            <option v-for="presupuesto in presupuestos">
+              {{ presupuesto.nombrePresupuesto }}
+            </option>
           </select>
         </base-input>
 
+        <base-button
+          type="danger"
+          icon
+          size="sm"
+          v-if="selectedPresupuesto.nombrePresupuesto !== ''"
+          class="btn-link"
+          @click="deletePresupuesto()"
+        >
+          <i class="el-icon-delete-solid"></i>
+        </base-button>
+
         <div class="row pull-right pull-buttom">
           <div class="col-12">
             <Fpresupuesto
@@ -19,11 +35,12 @@
         </div>
       </div>
     </card>
-    <card title="Presupuesto">
+    <card
+      title="Presupuesto"
+      v-if="selectedPresupuesto.nombrePresupuesto !== ''"
+    >
       <div class="row">
         <div class="col-6">
-
-
           <el-table
             :data="selectedPresupuesto.datos"
             border
@@ -32,16 +49,16 @@
             style="width: 100%"
             height="300"
           >
-          
             <el-TableColumn prop="detalle" label="Detalle" sortable>
             </el-TableColumn>
+
             <el-TableColumn prop="valor" label="Valor" sortable>
             </el-TableColumn>
 
+            <el-TableColumn prop="tipo" label="Tipo" sortable> </el-TableColumn>
+
             <el-TableColumn>
               <div slot-scope="{ row, $index }">
-              
- 
                 <el-tooltip content="Delete" effect="light">
                   <base-button
                     type="danger"
@@ -56,14 +73,12 @@
               </div>
             </el-TableColumn>
           </el-table>
-
         </div>
 
         <div class="col-6">
           <base-input v-model="newItem.detalle" label="Descripción">
           </base-input>
-          <base-input v-model="newItem.valor" type="Number">
+          <base-input v-model="newItem.valor" type="Number"> </base-input>
-          </base-input>
           <base-input>
             <select class="form-control" v-model="newItem.tipo">
               <option>Ingreso</option>
@@ -71,32 +86,32 @@
             </select>
           </base-input>
           <base-button
-            
             type="info"
             class="mb-3 col-12"
             size="lg"
             @click="addItem()"
             >Guardar</base-button
           >
-
         </div>
       </div>
     </card>
 
     <card>
-
       <div class="row">
         <div class="col-4">
-          <b>Ingresos: </b> {{formatMoneda(totalIngresos)}}
+          <b>Ingresos: </b> {{ formatMoneda(totalIngresos) }}
         </div>
         <div class="col-4">
-          <b>Egreso:</b> <span>{{formatMoneda(totalEgresos)}} </span>
+          <b>Egreso:</b> <span>{{ formatMoneda(totalEgresos) }} </span>
         </div>
         <div class="col-4">
-          <b>Total:<span :class="[total<0?'text-danger':'text-success']"> {{formatMoneda(total)}}</span></b>  
+          <b
+            >Total:<span :class="[total < 0 ? 'text-danger' : 'text-success']">
+              {{ formatMoneda(total) }}</span
+            ></b
+          >
         </div>
       </div>
-     
     </card>
   </div>
 </template>
@@ -106,7 +121,6 @@ import { Table, TableColumn } from "element-ui";
 
 export default {
   components: {
-      
     [Table.name]: Table,
     [TableColumn.name]: TableColumn,
   },
@@ -114,43 +128,83 @@ export default {
   data() {
     return {
       newPresupuesto: {
-        fecha: "",
+        nombrePresupuesto: "",
-        detalle: "",
       },
-      selectedPresupuesto:{
+      selectedPresupuesto: {
-
+        _id: "",
-        _id:"",
+        nombrePresupuesto: "",
-        fecha:"",
+        datos: [],
-        nombrePresupuesto:"",
-        datos:[]
-
       },
+      selectedPresupuestoName: "",
       newItem: {
-        detalle:"",
+        _id: "",
+        detalle: "",
         valor: 0,
-        tipo:"Egreso"
+        tipo: "Egreso",
-
       },
 
       presupuestos: [],
-      totalIngresos:0,
+      totalIngresos: 0,
-      totalEgresos:0,
+      totalEgresos: 0,
-      total:0
+      total: 0,
     };
   },
   methods: {
-    savePresupuesto() {},
+    savePresupuesto() {
-    addItem() {
+      const axiosHeader = {
-      this.selectedPresupuesto.datos.push(JSON.parse(JSON.stringify(this.newItem)))
+        headers: {
-      this.sumItems()
+          token: this.$store.state.auth.token,
         },
-    sumItems(){
+      };
+      this.newPresupuesto.nombrePresupuesto = this.newPresupuesto.nombrePresupuesto.trim();
+      const toSend = this.newPresupuesto;
+      console.log(axiosHeader.data);
+      this.$axios
+        .post("/presupuesto", toSend, axiosHeader)
+        .then((res) => {
+          console.log(res.data.status);
+          this.getPresupuesto();
+        })
+        .catch((e) => console.log(e));
+    },
+    addItem() {
+      //this.selectedPresupuesto.datos.push(JSON.parse(JSON.stringify(this.newItem)))
+      console.log(this.newItem._id);
+      var nameSelected = this.selectedPresupuestoName;
+      console.log(nameSelected);
+      const axiosHeader = {
+        headers: {
+          token: this.$store.state.auth.token,
+        },
+      };
+      const toSend = this.newItem;
+      this.$axios
+        .put("/presupuesto", toSend, axiosHeader)
+        .then((res) => {
+          console.log(res.data.status);
+          this.getPresupuesto();
+          this.selectedPresupuestoName = nameSelected;
+          console.log(this.selectedPresupuestoName);
+          this.selectedPresupuesto = this.presupuestos.find(
+            (x) => x.nombrePresupuesto === this.selectedPresupuestoName
+          );
+          this.newItem._id = this.selectedPresupuesto._id;
+        })
+        .catch((e) => console.log(e));
 
-      this.totalIngresos=this.selectedPresupuesto.datos.reduce((acc,x) => x.tipo ==="Ingreso"?acc + Number(x.valor):acc,0)
+      this.sumItems();
-
+    },
-      this.totalEgresos = this.selectedPresupuesto.datos.reduce((acc,x) => x.tipo==="Egreso"?acc + Number(x.valor):acc,0)
+    sumItems() {
-      this.total =  this.totalIngresos - this.totalEgresos
+      this.totalIngresos = this.selectedPresupuesto.datos.reduce(
+        (acc, x) => (x.tipo === "Ingreso" ? acc + Number(x.valor) : acc),
+        0
+      );
 
+      this.totalEgresos = this.selectedPresupuesto.datos.reduce(
+        (acc, x) => (x.tipo === "Egreso" ? acc + Number(x.valor) : acc),
+        0
+      );
+      this.total = this.totalIngresos - this.totalEgresos;
     },
     formatMoneda(dato) {
       var num = dato;
@@ -165,11 +219,68 @@ export default {
         return `$ ${num}`;
       }
     },
+    getPresupuesto() {
+      const axiosHeader = {
+        headers: {
+          token: this.$store.state.auth.token,
+        },
+      };
+
+     
+      this.$axios
+        .get("/presupuesto", axiosHeader)
+        .then((res) => {
+           this.presupuestos=[]
+          if (res.data.data.length) {
+            this.presupuestos = res.data.data;
+            this.selectedPresupuesto = this.presupuestos[0];
+            this.selectedPresupuestoName = this.selectedPresupuesto.nombrePresupuesto;
+            this.newItem._id = this.selectedPresupuesto._id;
+            console.log(this.selectedPresupuesto);
+            this.sumItems();
+          }
+        })
+        .catch((e) => console.log(e));
+    },
+    onChange() {
+      this.selectedPresupuesto = this.presupuestos.find(
+        (x) => x.nombrePresupuesto === this.selectedPresupuestoName
+      );
+      this.newItem._id = this.selectedPresupuesto._id;
+      this.sumItems();
+    },
+    deletePresupuesto() {
+      console.log(this.selectedPresupuesto._id);
+      const axiosHeader = {
+        headers: {
+          token: this.$store.state.auth.token,
+        },
+        params: {
+          id: this.selectedPresupuesto._id,
+        },
+      };
+      this.$axios
+        .delete("/presupuesto", axiosHeader)
+        .then((res) => {
+          console.log(res.data);
+         
+          this.selectedPresupuesto = {
+            _id: "",
+            nombrePresupuesto: "",
+            datos: [],
+          }
+          this.selectedPresupuestoName=""
+           this.getPresupuesto();
+          
+        })
+        .catch((e) => console.log(e));
+    },
   },
   mounted() {
-    this.newPresupuesto.fecha = this.$store.state.fecha;
+    // this.newPresupuesto.fecha = this.$store.state.fecha;
-  },
 
+    this.getPresupuesto();
+  },
 };
 </script>
 

index.js

@@ -27,6 +27,7 @@ app.use(cors());
 app.use('/api',require('./routes/users'));
 app.use('/api',require('./routes/compras'))
 app.use('/api',require('./routes/ingresos'))
+app.use('/api',require('./routes/presupuesto'))
 app.use('/api',require('./routes/categorias'))
 app.use('/api',require('./routes/metodos_pago'))
 app.disable('x-powered-by');

routes/presupuesto.js

@@ -0,0 +1,78 @@
+const router = require("express").Router();
+const presupuesto = require("../models/presupuestoMes").Presupuesto;
+const itemPresupuesto = require("../models/presupuestoMes").itemPresupuesto;
+const { checkAuth } = require("../middlewares/authentication");
+
+
+router.get("/presupuesto", checkAuth, async (req, res) => {
+    var presupuestos; 
+    presupuestos = await presupuesto.find({ user: req.userData._id }).sort({
+      date: "desc",
+    });
+  
+   return res.send(
+        {
+            status:"ok",
+            data:presupuestos
+        }
+    )
+  });
+
+  router.post("/presupuesto", checkAuth, async (req, res) => {
+    const {nombrePresupuesto} = req.body;
+    const Presupuesto = new presupuesto({
+      nombrePresupuesto:nombrePresupuesto
+    });
+
+    console.log(Presupuesto)
+    Presupuesto.user = req.userData._id;
+    await Presupuesto.save();
+
+    res.json({
+      status:"OK"
+    })
+  
+   
+  });
+
+
+  router.put("/presupuesto", checkAuth, async (req, res) => {
+    const { _id, detalle, valor, tipo } = req.body;
+    console.log(_id)
+    const presupuesto_edit = await presupuesto.findOne({ _id: _id });
+    const itemP = new itemPresupuesto({detalle,valor,tipo});
+    presupuesto_edit.datos.push(itemP);
+    await presupuesto_edit.save();
+
+    //await presupuesto_edit.updateOne({ fecha, detalle, valor});
+
+
+  
+    res.json({
+      status:"OK"
+    })
+  
+   
+  });
+
+
+
+  router.delete("/presupuesto", checkAuth, async (req, res) => {
+
+    try{
+      const userId = req.userData._id;
+      const id = req.query.id;
+      
+      const resultado = await presupuesto.deleteOne({user:userId,_id:id});
+    
+      return res.json({status:"ok",data: resultado})
+    
+    }
+    catch(error){
+      console.log(error);
+        return res.status(500).json({status:"fail",error:error})
+    }
+  });
+
+
+  module.exports = router;