Merge pull request 'Se realiza compra desde vuetify' (#36) from achive_purchase_from_vuetify_issue_#35 into main

Reviewed-on: #36
This commit is contained in:
mono 2024-09-28 17:46:57 -05:00
commit cf913884f0
4 changed files with 61 additions and 19 deletions

View File

@ -22,13 +22,13 @@
required required
></v-text-field> ></v-text-field>
<v-select <v-select
v-model="purchase.client" v-model="purchase.customer"
:items="clients" :items="clients"
item-title="name"
item-value="id"
label="Cliente" label="Cliente"
:rules="[rules.required]" :rules="[rules.required]"
required required
item-text="name"
item-value="id"
></v-select> ></v-select>
<v-textarea <v-textarea
v-model="purchase.notes" v-model="purchase.notes"
@ -39,26 +39,29 @@
<v-toolbar> <v-toolbar>
<v-toolbar-title secondary>Productos</v-toolbar-title> <v-toolbar-title secondary>Productos</v-toolbar-title>
</v-toolbar> </v-toolbar>
<div v-for="(line, index) in purchase.lines" :key="line.id"> <div v-for="(line, index) in purchase.saleline_set" :key="line.id">
<v-row> <v-row>
<v-col> <v-col>
<v-text-field <v-select
v-model="line.product" v-model="line.product"
:items="products"
item-title="name"
item-value="id"
label="Producto" label="Producto"
:rules="[rules.required]" :rules="[rules.required]"
required required
></v-text-field> ></v-select>
</v-col> </v-col>
<v-col> <v-col>
<v-text-field <v-text-field
v-model.number="line.price" v-model.number="line.unit_price"
label="Precio" label="Precio"
type="number" type="number"
:rules="[rules.required]" :rules="[rules.required]"
required required
></v-text-field> ></v-text-field>
</v-col> </v-col>
n <v-col> <v-col>
<v-text-field <v-text-field
v-model.number="line.quantity" v-model.number="line.quantity"
label="Cantidad" label="Cantidad"
@ -110,7 +113,7 @@ n <v-col>
date: '', date: '',
client: null, client: null,
notes: '', notes: '',
lines: [{product:'', price: 0, quantity: 0}], saleline_set: [{product:'', unit_price: 0, quantity: 0}],
}, },
rules: { rules: {
required: value => !!value || 'Requerido.', required: value => !!value || 'Requerido.',
@ -120,15 +123,17 @@ n <v-col>
{ title: 'Compras', route:'/compras'}, { title: 'Compras', route:'/compras'},
], ],
clients: [], clients: [],
products: [],
}; };
}, },
created() { created() {
this.fetchClients(); this.fetchClients();
this.fetchProducts();
}, },
computed: { computed: {
calculateTotal() { calculateTotal() {
return this.purchase.lines.reduce((total, line) => { return this.purchase.saleline_set.reduce((total, saleline) => {
return total + this.calculateSubtotal(line); return total + this.calculateSubtotal(saleline);
}, 0); }, 0);
}, },
}, },
@ -137,25 +142,36 @@ n <v-col>
fetch('/don_confiao/api/customers/') fetch('/don_confiao/api/customers/')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.clients = data.map(client => client.name); this.clients = data;
})
.catch(error => {
console.error(error);
});
},
fetchProducts() {
fetch('/don_confiao/api/products/')
.then(response => response.json())
.then(data => {
console.log(data);
this.products = data;
}) })
.catch(error => { .catch(error => {
console.error(error); console.error(error);
}); });
}, },
addLine() { addLine() {
this.purchase.lines.push({ product: '', price: 0, quantity:0 }); this.purchase.saleline_set.push({ product: '', unit_price: 0, quantity:0 });
}, },
removeLine(index) { removeLine(index) {
this.purchase.lines.splice(index, 1); this.purchase.saleline_set.splice(index, 1);
}, },
calculateSubtotal(line) { calculateSubtotal(line) {
return line.price * line.quantity; return line.unit_price * line.quantity;
}, },
async submit() { async submit() {
if (this.$refs.form.validate()) { if (this.$refs.form.validate()) {
try { try {
const response = await fetch('http://localhost:8000/don_confiao/', { const response = await fetch('/don_confiao/api/sales/', {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
@ -165,6 +181,7 @@ n <v-col>
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
console.log('Compra enviada:', data); console.log('Compra enviada:', data);
this.$router.push("SummaryPurchase");
} else { } else {
console.error('Error al enviar la compra:', response.statusText); console.error('Error al enviar la compra:', response.statusText);
} }
@ -174,7 +191,7 @@ n <v-col>
} }
}, },
navigate(route) { navigate(route) {
this.$route.push(route); this.$router.push(route);
}, },
}, },
}; };

View File

@ -0,0 +1,18 @@
<template>
<v-app>
<v-navigation-drawer app>
</v-navigation-drawer>
<v-app-bar>
Resumen de la compra
</v-app-bar>
<v-container>
Pon aqui la información de la compra
</v-container>
</v-app>
</template>
<script>
</script>
<style>
</style>

View File

@ -0,0 +1,7 @@
<template>
<SummaryPurchase />
</template>
<script setup>
//
</script>

View File

@ -18,9 +18,9 @@ class SaleSerializer(serializers.ModelSerializer):
class ProductSerializer(serializers.ModelSerializer): class ProductSerializer(serializers.ModelSerializer):
class Meta: class Meta:
model = Product model = Product
fields = ['name', 'price', 'measuring_unit', 'categories'] fields = ['id', 'name', 'price', 'measuring_unit', 'categories']
class CustomerSerializer(serializers.ModelSerializer): class CustomerSerializer(serializers.ModelSerializer):
class Meta: class Meta:
model = Customer model = Customer
fields = ['name', 'address'] fields = ['id', 'name', 'address']