add: crud completed of budgets
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
<script setup>
|
||||
import Swal from 'sweetalert2';
|
||||
import { useCompanyStore } from '../stores/company';
|
||||
import { useCompanyStore } from '../stores/company';
|
||||
|
||||
defineProps({
|
||||
const props = defineProps({
|
||||
budget: {
|
||||
type: Object,
|
||||
required: true
|
||||
@@ -34,7 +34,7 @@ import { useCompanyStore } from '../stores/company';
|
||||
});
|
||||
const resp = await companyStore.deleteBudgetCompany(props.budget._id);
|
||||
Swal.close();
|
||||
if(resp != null) {
|
||||
if(resp !== null) {
|
||||
Swal.fire({
|
||||
title: "Presupuesto eliminado!",
|
||||
text: "Tu presupuesto ha sido eliminado exitosamente.",
|
||||
@@ -80,19 +80,24 @@ import { useCompanyStore } from '../stores/company';
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<button
|
||||
class="btn-primary-sm radius-sm"
|
||||
class="btn btn-danger radius-sm"
|
||||
@click="handleDeleteBudget"
|
||||
>
|
||||
<i class="fa-solid fa-trash" /> <span class="clear-xsm">Eliminar</span>
|
||||
</button>
|
||||
<button
|
||||
class="btn-primary-sm radius-sm"
|
||||
@click="$emit('set-budget')"
|
||||
@click="$emit('set-budget', {budget: budget, print: false})"
|
||||
data-toggle="modal" data-target="#budgetModal"
|
||||
>
|
||||
<i class="fa-solid fa-pen-to-square" /> <span class="clear-xsm">Editar</span>
|
||||
</button>
|
||||
<button type="button" class="btn btn-dark">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-dark"
|
||||
@click="$emit('set-budget', {budget: budget, print: true})"
|
||||
data-toggle="modal" data-target="#budgetModal"
|
||||
>
|
||||
<i class="fa-solid fa-print" /> <span class="clear-xsm">Imprimir</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1,44 +1,51 @@
|
||||
<script setup>
|
||||
import { computed, onMounted, reactive } from 'vue';
|
||||
import { computed, onMounted, reactive, ref } from 'vue';
|
||||
import CustomInput from './ui/CustomInput.vue';
|
||||
import Products from './ui/Products.vue';
|
||||
import TruckTypes from './ui/TruckTypes.vue';
|
||||
import { useAuthStore } from '../stores/auth';
|
||||
import { useCompanyStore } from '../stores/company';
|
||||
import Swal from 'sweetalert2';
|
||||
import Spiner from './ui/Spiner.vue';
|
||||
import Cities from './ui/Cities.vue';
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
budget: {
|
||||
type: Object,
|
||||
required: false
|
||||
},
|
||||
isPrint: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
const authStore = useAuthStore();
|
||||
const companyStore = useCompanyStore();
|
||||
|
||||
const loading = ref(false);
|
||||
|
||||
onMounted(() => {
|
||||
console.log('entra onmounted')
|
||||
console.log(props.budget);
|
||||
if(props.budget) {
|
||||
budgetForm.budget_id = props.budget._id;
|
||||
budgetForm.client = props.budget.client;
|
||||
budgetForm.material = props.budget.material._id;
|
||||
budgetForm.origin = props.budget.origin;
|
||||
budgetForm.destination = props.budget.destination;
|
||||
|
||||
// let product = props.budget.material.name;
|
||||
// budgetForm.budgetproduct = {
|
||||
// name: product
|
||||
// }
|
||||
budgetForm.budgetproduct = props.budget.material
|
||||
|
||||
budgetForm.budgetTrucktypes = props.budget.truck_type
|
||||
// let truck_type = props.budget.truck_type;
|
||||
// budgetForm.budgetTrucktypes = {
|
||||
// meta_value: truck_type
|
||||
// }
|
||||
budgetForm.material = props.material?._id;
|
||||
budgetForm.origin = {
|
||||
city_name: props.budget.origin
|
||||
};
|
||||
budgetForm.destination = {
|
||||
city_name: props.budget.destination
|
||||
};
|
||||
budgetForm.budgetproduct = {
|
||||
name: props.budget.material?.name
|
||||
};
|
||||
|
||||
budgetForm.budgetTrucktypes = {
|
||||
meta_value: props.budget.truck_type
|
||||
}
|
||||
budgetForm.num_tons = props.budget.num_tons;
|
||||
budgetForm.price_per_ton = props.budget.price_per_ton;
|
||||
budgetForm.tonnage = props.budget.tonnage;
|
||||
@@ -99,6 +106,10 @@
|
||||
...initalState
|
||||
})
|
||||
|
||||
const errors = ref({
|
||||
client: null
|
||||
})
|
||||
|
||||
// const total = computed(() => {
|
||||
|
||||
// });
|
||||
@@ -148,12 +159,14 @@
|
||||
});
|
||||
|
||||
const saveBudget = async() => {
|
||||
validations();
|
||||
if(errors.value.client) return;
|
||||
let budgetData ={
|
||||
client: budgetForm.client,
|
||||
material: budgetForm.budgetproduct.length <= 0 ? null : budgetForm.budgetproduct,
|
||||
origin: budgetForm.origin,
|
||||
destination: budgetForm.destination,
|
||||
truck_type: budgetForm.budgetTrucktypes.length <= 0 ? null : budgetForm.budgetTrucktypes,
|
||||
material: budgetForm.budgetproduct ? budgetForm.budgetproduct._id : null,
|
||||
origin: budgetForm.origin ? budgetForm.origin.city_name : null,
|
||||
destination: budgetForm.destination ? budgetForm.destination.city_name : null,
|
||||
truck_type: budgetForm.budgetTrucktypes ? budgetForm.budgetTrucktypes.meta_value : null,
|
||||
num_tons: budgetForm.num_tons,
|
||||
price_per_ton: budgetForm.price_per_ton,
|
||||
|
||||
@@ -181,13 +194,41 @@
|
||||
company: authStore.user.company,
|
||||
}
|
||||
|
||||
if(props.budget !== null) { // update
|
||||
const result = companyStore.updateBudgetCompany(props.budget._id, budgetData);
|
||||
console.log(result)
|
||||
} else { // create
|
||||
const result = companyStore.createBudgetCompany(budgetData);
|
||||
console.log(result)
|
||||
let result = 'error';
|
||||
let action = 'Creado';
|
||||
loading.value = true;
|
||||
|
||||
const localData = {
|
||||
material: budgetForm.budgetproduct
|
||||
}
|
||||
|
||||
if(props.budget !== null) { // update
|
||||
result = await companyStore.updateBudgetCompany(props.budget._id, budgetData, localData);
|
||||
action = 'actualizado';
|
||||
} else { // create
|
||||
result = await companyStore.createBudgetCompany(budgetData);
|
||||
action = 'agregado';
|
||||
}
|
||||
|
||||
loading.value = false;
|
||||
if(result === 'success') {
|
||||
document.getElementById('btnClosebudgetModal').click();
|
||||
Swal.fire({
|
||||
title: `<strong>Presupuesto ${action} con éxito!</strong>`,
|
||||
icon: 'success'
|
||||
})
|
||||
} else {
|
||||
Swal.fire({
|
||||
title: result,
|
||||
icon: 'error'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const validations = () => {
|
||||
errors.value = {
|
||||
client: budgetForm.client?.length < 2 ? 'Ingrese nombre del cliente' : null,
|
||||
};
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -223,34 +264,36 @@
|
||||
type="text"
|
||||
:filled="false"
|
||||
name="client"
|
||||
:required="true"
|
||||
:error="(!budgetForm.client) ? 'Cliente es requerido' : null"
|
||||
:error="errors.client"
|
||||
v-model:field="budgetForm.client"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<div class="mb-4 mt-3">
|
||||
<label class="custom-label">MATERIAL</label>
|
||||
<Products
|
||||
v-model="budgetForm.budgetproduct"
|
||||
:disabled="isPrint"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-4 mt-3">
|
||||
<label class="custom-label">ORIGEN</label>
|
||||
<Cities
|
||||
v-model="budgetForm.origin"
|
||||
:disabled="isPrint"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-4 mt-3">
|
||||
<label class="custom-label">DESTINO</label>
|
||||
<Cities
|
||||
v-model="budgetForm.destination"
|
||||
:disabled="isPrint"
|
||||
/>
|
||||
</div>
|
||||
<CustomInput
|
||||
label="ORIGEN"
|
||||
type="text"
|
||||
:filled="false"
|
||||
name="origin"
|
||||
v-model:field="budgetForm.origin"
|
||||
/>
|
||||
<CustomInput
|
||||
label="DESTINO"
|
||||
type="text"
|
||||
:filled="false"
|
||||
name="destination"
|
||||
v-model:field="budgetForm.destination"
|
||||
/>
|
||||
<div class="mb-4 mt-3">
|
||||
<label class="custom-label">TIPO DE CAMIÓN</label>
|
||||
<TruckTypes
|
||||
v-model="budgetForm.budgetTrucktypes"
|
||||
:disabled="isPrint"
|
||||
/>
|
||||
</div>
|
||||
<CustomInput
|
||||
@@ -259,6 +302,7 @@
|
||||
:filled="false"
|
||||
name="num_tons"
|
||||
v-model:field="budgetForm.num_tons"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="PRECIO POR TONELADA"
|
||||
@@ -266,6 +310,7 @@
|
||||
:filled="false"
|
||||
name="price_per_ton"
|
||||
v-model:field="budgetForm.price_per_ton"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -280,6 +325,7 @@
|
||||
:filled="false"
|
||||
name="tonnage"
|
||||
v-model:field="budgetForm.tonnage"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="PRECIO POR TONELADA"
|
||||
@@ -287,6 +333,7 @@
|
||||
:filled="false"
|
||||
name="price_per_ton"
|
||||
v-model:field="budgetForm.price_per_ton"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="ORIGEN DEL CAMION AL ORIGEN DE CARGA(KM)"
|
||||
@@ -294,6 +341,7 @@
|
||||
:filled="false"
|
||||
name="pickup_distance"
|
||||
v-model:field="budgetForm.pickup_distance"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="ORIGEN DE CARGA A DESTINO DE DESCARGA(KM)"
|
||||
@@ -301,6 +349,7 @@
|
||||
:filled="false"
|
||||
name="delivery_distance"
|
||||
v-model:field="budgetForm.delivery_distance"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="DESTINO DE DESCARGA AL PATIO-BASE (KM)"
|
||||
@@ -308,6 +357,7 @@
|
||||
:filled="false"
|
||||
name="warehouse_distance"
|
||||
v-model:field="budgetForm.warehouse_distance"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<div class="calculator-card__totals">
|
||||
<div>
|
||||
@@ -330,6 +380,7 @@
|
||||
:filled="false"
|
||||
name="cost_per_liter"
|
||||
v-model:field="budgetForm.cost_per_liter"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="PRECIO DEL DIESEL POR LITRO"
|
||||
@@ -337,6 +388,7 @@
|
||||
:filled="false"
|
||||
name="fuel_price_per_liter"
|
||||
v-model:field="budgetForm.fuel_price_per_liter"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="OTROS GASTOS"
|
||||
@@ -344,6 +396,7 @@
|
||||
:filled="false"
|
||||
name="other_fuel_expenses"
|
||||
v-model:field="budgetForm.other_fuel_expenses"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<div class="calculator-card__totals">
|
||||
<div>
|
||||
@@ -374,6 +427,7 @@
|
||||
:filled="false"
|
||||
name="driver_salary"
|
||||
v-model:field="budgetForm.driver_salary"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="CASETAS"
|
||||
@@ -381,6 +435,7 @@
|
||||
:filled="false"
|
||||
name="accomadation_allowance"
|
||||
v-model:field="budgetForm.accomadation_allowance"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<CustomInput
|
||||
label="OTROS GASTOS"
|
||||
@@ -388,6 +443,7 @@
|
||||
:filled="false"
|
||||
name="other_administrative_expenses"
|
||||
v-model:field="budgetForm.other_administrative_expenses"
|
||||
:readonly="isPrint"
|
||||
/>
|
||||
<div class="calculator-card__totals">
|
||||
<div>
|
||||
@@ -439,19 +495,13 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-4 text-center">
|
||||
<button class="btn btn-primary myshipper-btn" type="submit">Guardar</button>
|
||||
<div class="mt-4 text-center" v-if="!isPrint">
|
||||
<Spiner v-if="loading"/>
|
||||
<button v-else class="btn-primary-sm radius-sm" type="submit">Guardar</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-dark"
|
||||
@click="$emit('reset-budget')"
|
||||
data-dismiss="modal">Cerrar</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -126,7 +126,6 @@
|
||||
icon: 'error'
|
||||
})
|
||||
}
|
||||
console.log(locationForm);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -14,6 +14,10 @@
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
defineEmits(['update:selectedCities', 'clear-option'])
|
||||
@@ -35,6 +39,7 @@
|
||||
:searchable="true"
|
||||
:loading="isLoading"
|
||||
:close-on-select="true"
|
||||
:disabled="disabled"
|
||||
@search-change="searchState"
|
||||
@remove="$emit('clear-option')"
|
||||
placeholder="Busca por ciudad"
|
||||
|
||||
@@ -14,6 +14,10 @@
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
defineEmits(['update:selectedProduct', 'clear-option'])
|
||||
@@ -36,6 +40,7 @@
|
||||
:searchable="true"
|
||||
:loading="isLoading"
|
||||
:close-on-select="true"
|
||||
:disabled="disabled"
|
||||
@search-change="searchProductFn"
|
||||
@remove="$emit('clear-option')"
|
||||
placeholder="Busca por producto"
|
||||
|
||||
@@ -14,6 +14,10 @@
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
defineEmits(['update:selectedTruckType', 'clear-option'])
|
||||
@@ -38,6 +42,7 @@
|
||||
:multiple="multiple"
|
||||
:loading="isLoading"
|
||||
:searchable="true"
|
||||
:disabled="disabled"
|
||||
:close-on-select="true"
|
||||
@search-change="getTruckTypesQuery"
|
||||
@remove="$emit('clear-option')"
|
||||
|
||||
Reference in New Issue
Block a user