mdchaparror/finanzas_api
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

formulario de compras

Browse Source
This commit is contained in:
Martin Daniel Chaparro Ruiz
2021-04-22 22:37:05 -05:00
parent cf9505f26d
commit 25f9d2294d
6 changed files with 161 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
APP/assets/sass/dashboard/custom/_fixed-plugin.scss
View File

@@ -2,9 +2,9 @@
position: fixed;
right: 0;
width: 64px;
background: rgba(0,0,0,.3);
background: rgba(12, 44, 133, 0.5);
z-index: 1031;
border-radius: 8px 0 0 8px;
border-radius: 10px 10px 10px 10px;
text-align: center;
top: 130px;
@@ -28,7 +28,7 @@
top: -52px !important;
width: 290px;
border-radius: 0.1875rem;
padding: 0 10px;
padding: 0 0;
background: linear-gradient($black, $black-states);
}

84
APP/components/Formularios/Fcompras.vue Normal file
View File

@@ -0,0 +1,84 @@
<template>
<div class="fixed-plugin" v-click-outside="closeDropDown">
<div class="dropdown show-dropdown" :class="{ show: isOpen }">
<a data-toggle="dropdown" class="settings-icon">
<i class="fa fa-plus fa-2x" @click="toggleDropDown"> </i>
</a>
<span class="dropdown-menu" :class="{ show: isOpen }">
<div class="color_fondo p-3">
<base-input
label="Fecha"
v-model="newCompra.fecha"
type="Date"
></base-input>
<base-input
label="Descripcion"
v-model="newCompra.detalle"
></base-input>
<base-input
label="Valor"
type="Number"
v-model="newCompra.valor"
></base-input>
<base-input label="Metodo de pago">
<select class="form-control" v-model="newCompra.metodo_pago">
<option v-for="metodo in metodos_pago">
{{ metodo.metodo }}
</option>
</select>
</base-input>
<base-input label="categoría">
<select class="form-control" v-model="newCompra.categoria">
<option v-for="categoria in categorias">
{{ categoria.ctg }}
</option>
</select>
</base-input>
<base-button
type="primary"
class="mb-3 col-12"
size="lg"
@click="saveCompra()"
>Guardar</base-button
>
</div>
</span>
</div>
</div>
</template>
<script>
export default {
name: "Fcompras",
props: ["categorias", "metodos_pago", "newCompra", "saveCompra"],
data() {
return {
isOpen: false,
};
},
methods: {
toggleDropDown() {
this.isOpen = !this.isOpen;
},
closeDropDown() {
this.isOpen = false;
},
},
};
</script>
<style scoped lang="scss">
.settings-icon {
cursor: pointer;
}
.badge-vue {
background-color: #ffffff;
}
.color_fondo {
background-color: #ffffff;
}
</style>

48
APP/components/Formularios/Prueba.vue Normal file
View File

@@ -0,0 +1,48 @@
<template>
<div class="fixed-plugin" v-click-outside="closeDropDown">
<div class="dropdown show-dropdown" :class="{ show: isOpen }">
<a data-toggle="dropdown" class="settings-icon">
<i class="fa fa-cog fa-2x" @click="toggleDropDown"> </i>
</a>
<ul class="dropdown-menu" :class="{ show: isOpen }">
<base-input label="Hola"></base-input>
</ul>
</div>
</div>
</template>
<script>
export default {
name: 'Prueba',
data() {
return {
isOpen: false,
};
},
methods: {
toggleDropDown() {
this.isOpen = !this.isOpen;
},
closeDropDown() {
this.isOpen = false;
},
}
};
</script>
<style scoped lang="scss">
@import '~@/assets/sass/dashboard/custom/variables';
.settings-icon {
cursor: pointer;
}
.badge-vue {
background-color: $vue;
}
</style>

2
APP/components/Layout/SidebarSharePlugin.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="fixed-plugin" v-click-outside="closeDropDown">
<div class="" v-click-outside="closeDropDown">
<div class="dropdown show-dropdown" :class="{ show: isOpen }">
<a data-toggle="dropdown" class="settings-icon">
<i class="fa fa-cog fa-2x" @click="toggleDropDown"> </i>

2
APP/layouts/default.vue
View File

@@ -47,7 +47,7 @@
</template>
</side-bar>
<!--Share plugin (for demo purposes). You can remove it if don't plan on using it-->
<sidebar-share :background-color.sync="sidebarBackground"> </sidebar-share>
<!-- <sidebar-share :background-color.sync="sidebarBackground"> </sidebar-share> -->
<div class="main-panel" :data="sidebarBackground">
<dashboard-navbar></dashboard-navbar>
<router-view name="header"></router-view>

53
APP/pages/compras.vue
View File

@@ -1,7 +1,8 @@
<template>
<div>
<div class="row">
<card class="col-8">
<card class="col-12">
<el-table
:data="
compras.filter(
@@ -63,36 +64,16 @@
</el-table>
</card>
<card class="col-4">
<base-input
label="Fecha"
v-model="newCompra.fecha"
type="Date"
></base-input>
<base-input
label="Descripcion"
v-model="newCompra.detalle"
></base-input>
<base-input
label="Valor"
type="Number"
v-model="newCompra.valor"
></base-input>
<base-input label="Metodo de pago">
<select class="form-control" v-model="newCompra.metodo_pago">
<option v-for="metodo in metodos_pago">{{ metodo.metodo }}</option>
</select>
</base-input>
<base-input label="categoría">
<select class="form-control" v-model="newCompra.categoria">
<option v-for="categoria in categorias">{{ categoria.ctg }}</option>
</select>
</base-input>
<base-button type="primary" class="mb-3" size="lg" @click="saveCompra()"
>Guardar</base-button
>
</card>
<Fcompras
:categorias="categorias"
:metodos_pago="metodos_pago"
:newCompra="newCompra"
:saveCompra="saveCompra"
/>
</div>
</div>
</template>
<script>
@@ -140,6 +121,9 @@ export default {
],
};
},
mounted() {
this.getDate()
},
methods: {
saveCompra() {
var compra = JSON.stringify(this.newCompra);
@@ -150,6 +134,15 @@ export default {
this.compras.splice(index, 1);
//console.log(index)
},
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>