ETA/WebETA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: crud completed of budgets

Browse Source
This commit is contained in:
Alexandro Uc Santos
2024-01-20 20:01:56 -06:00
parent 6c9c3c9f7d
commit 94f6132361
8 changed files with 152 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/CardBudget.vue
View File

@@ -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>

154
src/components/CreateBudgetModal.vue
View File

@@ -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>

1
src/components/CreateLocationModal.vue
View File

@@ -126,7 +126,6 @@
icon: 'error'
})
}
console.log(locationForm);
}
}

5
src/components/ui/Cities.vue
View File

@@ -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"

5
src/components/ui/Products.vue
View File

@@ -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"

5
src/components/ui/TruckTypes.vue
View File

@@ -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')"

26
src/stores/company.js
View File

@@ -147,38 +147,40 @@ export const useCompanyStore = defineStore('company', () => {
}
}
const updateBudgetCompany = async(id, formData) => {
const updateBudgetCompany = async(id, formData, localData) => {
try {
const data = await updateBudget(id, formData);
console.log(data);
console.log(localData);
if(data) {
const index = budgets.value.findIndex((budget) => budget._id === id);
budgets.value[index] = {
...budgets.value[index],
...data,
material: udgets.value[index].material
...localData
};
return data;
return 'success';
} else {
return null;
return 'No se pudo actualizar presupuesto, intente mas tarde';
}
} catch (error) {
return null;
return 'Algo salio mal, intente más tarde';
}
}
const createBudgetCompany = async(formData) => {
const createBudgetCompany = async(formData, localData) => {
try {
const data = await createBudget(formData);
console.log(data);
if(data) {
budgets.value.push(data);
return data;
budgets.value.push({
...data,
...localData
});
return 'success';
} else {
return null;
return 'No se pudo agregar presupuesto, intente mas tarde';
}
} catch (error) {
return null;
return 'Algo salio mal, intente más tarde';
}
}

14
src/views/CalculatorView.vue
View File

@@ -15,6 +15,7 @@
const query = ref('');
const currentBudget = ref(null);
const openModal = ref(false);
const printOpen = ref(false);
onMounted(() => {
getInitData();
@@ -60,14 +61,18 @@
}
}
const handleSetCurrentBudget = (budget) => {
const handleSetCurrentBudget = (data) => {
openModal.value = true;
currentBudget.value = budget;
currentBudget.value = data.budget;
if(data.print) {
printOpen.value = true
}
}
const handleResetCurrentBudget = () => {
openModal.value = false;
currentBudget.value = null;
printOpen.value = false;
}
</script>
@@ -76,6 +81,7 @@
<CreateBudgetModal
v-if="openModal === true"
:budget="currentBudget"
:is-print="printOpen"
@reset-budget="handleResetCurrentBudget"
/>
<div>
@@ -93,7 +99,7 @@
<button
class="btn-primary-sm radius-sm"
data-toggle="modal" data-target="#budgetModal"
@click="handleSetCurrentBudget(null)"
@click="handleSetCurrentBudget({budget: null, print: false})"
><i class="fa-solid fa-plus"></i> <span class="clear-sm"> Crear</span><span class="clear-md"> presupuesto</span></button>
</div>
<Spiner v-if="loading"/>
@@ -102,7 +108,7 @@
v-if="companyStore.budgets.length > 0"
v-for="budget in companyStore.budgets"
:budget="budget"
@set-budget="handleSetCurrentBudget(budget)"
@set-budget="handleSetCurrentBudget"
/>
<CardEmpty
v-else