formulario de compras

This commit is contained in:
2021-04-22 22:37:05 -05:00
parent cf9505f26d
commit 25f9d2294d
6 changed files with 161 additions and 36 deletions

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>

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>

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>