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

15
src/components/CardBudget.vue
View File

@@ -2,7 +2,7 @@
import Swal from 'sweetalert2'; import Swal from 'sweetalert2';
import { useCompanyStore } from '../stores/company'; import { useCompanyStore } from '../stores/company';
defineProps({ const props = defineProps({
budget: { budget: {
type: Object, type: Object,
required: true required: true
@@ -34,7 +34,7 @@ import { useCompanyStore } from '../stores/company';
}); });
const resp = await companyStore.deleteBudgetCompany(props.budget._id); const resp = await companyStore.deleteBudgetCompany(props.budget._id);
Swal.close(); Swal.close();
if(resp != null) { if(resp !== null) {
Swal.fire({ Swal.fire({
title: "Presupuesto eliminado!", title: "Presupuesto eliminado!",
text: "Tu presupuesto ha sido eliminado exitosamente.", text: "Tu presupuesto ha sido eliminado exitosamente.",
@@ -80,19 +80,24 @@ import { useCompanyStore } from '../stores/company';
</div> </div>
<div class="card-footer"> <div class="card-footer">
<button <button
class="btn-primary-sm radius-sm" class="btn btn-danger radius-sm"
@click="handleDeleteBudget" @click="handleDeleteBudget"
> >
<i class="fa-solid fa-trash" /> <span class="clear-xsm">Eliminar</span> <i class="fa-solid fa-trash" /> <span class="clear-xsm">Eliminar</span>
</button> </button>
<button <button
class="btn-primary-sm radius-sm" class="btn-primary-sm radius-sm"
@click="$emit('set-budget')" @click="$emit('set-budget', {budget: budget, print: false})"
data-toggle="modal" data-target="#budgetModal" data-toggle="modal" data-target="#budgetModal"
> >
<i class="fa-solid fa-pen-to-square" /> <span class="clear-xsm">Editar</span> <i class="fa-solid fa-pen-to-square" /> <span class="clear-xsm">Editar</span>
</button> </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> <i class="fa-solid fa-print" /> <span class="clear-xsm">Imprimir</span>
</button> </button>
</div> </div>

150
src/components/CreateBudgetModal.vue
View File

@@ -1,44 +1,51 @@
<script setup> <script setup>
import { computed, onMounted, reactive } from 'vue'; import { computed, onMounted, reactive, ref } from 'vue';
import CustomInput from './ui/CustomInput.vue'; import CustomInput from './ui/CustomInput.vue';
import Products from './ui/Products.vue'; import Products from './ui/Products.vue';
import TruckTypes from './ui/TruckTypes.vue'; import TruckTypes from './ui/TruckTypes.vue';
import { useAuthStore } from '../stores/auth'; import { useAuthStore } from '../stores/auth';
import { useCompanyStore } from '../stores/company'; import { useCompanyStore } from '../stores/company';
import Swal from 'sweetalert2';
import Spiner from './ui/Spiner.vue';
import Cities from './ui/Cities.vue';
const props = defineProps({ const props = defineProps({
budget: { budget: {
type: Object, type: Object,
required: false required: false
},
isPrint: {
type: Boolean,
default: false
} }
}) })
const authStore = useAuthStore(); const authStore = useAuthStore();
const companyStore = useCompanyStore(); const companyStore = useCompanyStore();
const loading = ref(false);
onMounted(() => { onMounted(() => {
console.log('entra onmounted')
console.log(props.budget); console.log(props.budget);
if(props.budget) { if(props.budget) {
budgetForm.budget_id = props.budget._id; budgetForm.budget_id = props.budget._id;
budgetForm.client = props.budget.client; budgetForm.client = props.budget.client;
budgetForm.material = props.budget.material._id; budgetForm.material = props.material?._id;
budgetForm.origin = props.budget.origin; budgetForm.origin = {
budgetForm.destination = props.budget.destination; city_name: props.budget.origin
};
// let product = props.budget.material.name; budgetForm.destination = {
// budgetForm.budgetproduct = { city_name: props.budget.destination
// name: product };
// } budgetForm.budgetproduct = {
budgetForm.budgetproduct = props.budget.material name: props.budget.material?.name
};
budgetForm.budgetTrucktypes = props.budget.truck_type
// let truck_type = props.budget.truck_type;
// budgetForm.budgetTrucktypes = {
// meta_value: truck_type
// }
budgetForm.budgetTrucktypes = {
meta_value: props.budget.truck_type
}
budgetForm.num_tons = props.budget.num_tons; budgetForm.num_tons = props.budget.num_tons;
budgetForm.price_per_ton = props.budget.price_per_ton; budgetForm.price_per_ton = props.budget.price_per_ton;
budgetForm.tonnage = props.budget.tonnage; budgetForm.tonnage = props.budget.tonnage;
@@ -99,6 +106,10 @@
...initalState ...initalState
}) })
const errors = ref({
client: null
})
// const total = computed(() => { // const total = computed(() => {
// }); // });
@@ -148,12 +159,14 @@
}); });
const saveBudget = async() => { const saveBudget = async() => {
validations();
if(errors.value.client) return;
let budgetData ={ let budgetData ={
client: budgetForm.client, client: budgetForm.client,
material: budgetForm.budgetproduct.length <= 0 ? null : budgetForm.budgetproduct, material: budgetForm.budgetproduct ? budgetForm.budgetproduct._id : null,
origin: budgetForm.origin, origin: budgetForm.origin ? budgetForm.origin.city_name : null,
destination: budgetForm.destination, destination: budgetForm.destination ? budgetForm.destination.city_name : null,
truck_type: budgetForm.budgetTrucktypes.length <= 0 ? null : budgetForm.budgetTrucktypes, truck_type: budgetForm.budgetTrucktypes ? budgetForm.budgetTrucktypes.meta_value : null,
num_tons: budgetForm.num_tons, num_tons: budgetForm.num_tons,
price_per_ton: budgetForm.price_per_ton, price_per_ton: budgetForm.price_per_ton,
@@ -181,13 +194,41 @@
company: authStore.user.company, company: authStore.user.company,
} }
if(props.budget !== null) { // update let result = 'error';
const result = companyStore.updateBudgetCompany(props.budget._id, budgetData); let action = 'Creado';
console.log(result) loading.value = true;
} else { // create
const result = companyStore.createBudgetCompany(budgetData); const localData = {
console.log(result) 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> </script>
@@ -223,34 +264,36 @@
type="text" type="text"
:filled="false" :filled="false"
name="client" name="client"
:required="true" :error="errors.client"
:error="(!budgetForm.client) ? 'Cliente es requerido' : null"
v-model:field="budgetForm.client" v-model:field="budgetForm.client"
:readonly="isPrint"
/> />
<div class="mb-4 mt-3"> <div class="mb-4 mt-3">
<label class="custom-label">MATERIAL</label> <label class="custom-label">MATERIAL</label>
<Products <Products
v-model="budgetForm.budgetproduct" v-model="budgetForm.budgetproduct"
:disabled="isPrint"
/> />
</div> </div>
<CustomInput <div class="mb-4 mt-3">
label="ORIGEN" <label class="custom-label">ORIGEN</label>
type="text" <Cities
:filled="false" v-model="budgetForm.origin"
name="origin" :disabled="isPrint"
v-model:field="budgetForm.origin"
/> />
<CustomInput </div>
label="DESTINO" <div class="mb-4 mt-3">
type="text" <label class="custom-label">DESTINO</label>
:filled="false" <Cities
name="destination" v-model="budgetForm.destination"
v-model:field="budgetForm.destination" :disabled="isPrint"
/> />
</div>
<div class="mb-4 mt-3"> <div class="mb-4 mt-3">
<label class="custom-label">TIPO DE CAMIÓN</label> <label class="custom-label">TIPO DE CAMIÓN</label>
<TruckTypes <TruckTypes
v-model="budgetForm.budgetTrucktypes" v-model="budgetForm.budgetTrucktypes"
:disabled="isPrint"
/> />
</div> </div>
<CustomInput <CustomInput
@@ -259,6 +302,7 @@
:filled="false" :filled="false"
name="num_tons" name="num_tons"
v-model:field="budgetForm.num_tons" v-model:field="budgetForm.num_tons"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="PRECIO POR TONELADA" label="PRECIO POR TONELADA"
@@ -266,6 +310,7 @@
:filled="false" :filled="false"
name="price_per_ton" name="price_per_ton"
v-model:field="budgetForm.price_per_ton" v-model:field="budgetForm.price_per_ton"
:readonly="isPrint"
/> />
</div> </div>
</div> </div>
@@ -280,6 +325,7 @@
:filled="false" :filled="false"
name="tonnage" name="tonnage"
v-model:field="budgetForm.tonnage" v-model:field="budgetForm.tonnage"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="PRECIO POR TONELADA" label="PRECIO POR TONELADA"
@@ -287,6 +333,7 @@
:filled="false" :filled="false"
name="price_per_ton" name="price_per_ton"
v-model:field="budgetForm.price_per_ton" v-model:field="budgetForm.price_per_ton"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="ORIGEN DEL CAMION AL ORIGEN DE CARGA(KM)" label="ORIGEN DEL CAMION AL ORIGEN DE CARGA(KM)"
@@ -294,6 +341,7 @@
:filled="false" :filled="false"
name="pickup_distance" name="pickup_distance"
v-model:field="budgetForm.pickup_distance" v-model:field="budgetForm.pickup_distance"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="ORIGEN DE CARGA A DESTINO DE DESCARGA(KM)" label="ORIGEN DE CARGA A DESTINO DE DESCARGA(KM)"
@@ -301,6 +349,7 @@
:filled="false" :filled="false"
name="delivery_distance" name="delivery_distance"
v-model:field="budgetForm.delivery_distance" v-model:field="budgetForm.delivery_distance"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="DESTINO DE DESCARGA AL PATIO-BASE (KM)" label="DESTINO DE DESCARGA AL PATIO-BASE (KM)"
@@ -308,6 +357,7 @@
:filled="false" :filled="false"
name="warehouse_distance" name="warehouse_distance"
v-model:field="budgetForm.warehouse_distance" v-model:field="budgetForm.warehouse_distance"
:readonly="isPrint"
/> />
<div class="calculator-card__totals"> <div class="calculator-card__totals">
<div> <div>
@@ -330,6 +380,7 @@
:filled="false" :filled="false"
name="cost_per_liter" name="cost_per_liter"
v-model:field="budgetForm.cost_per_liter" v-model:field="budgetForm.cost_per_liter"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="PRECIO DEL DIESEL POR LITRO" label="PRECIO DEL DIESEL POR LITRO"
@@ -337,6 +388,7 @@
:filled="false" :filled="false"
name="fuel_price_per_liter" name="fuel_price_per_liter"
v-model:field="budgetForm.fuel_price_per_liter" v-model:field="budgetForm.fuel_price_per_liter"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="OTROS GASTOS" label="OTROS GASTOS"
@@ -344,6 +396,7 @@
:filled="false" :filled="false"
name="other_fuel_expenses" name="other_fuel_expenses"
v-model:field="budgetForm.other_fuel_expenses" v-model:field="budgetForm.other_fuel_expenses"
:readonly="isPrint"
/> />
<div class="calculator-card__totals"> <div class="calculator-card__totals">
<div> <div>
@@ -374,6 +427,7 @@
:filled="false" :filled="false"
name="driver_salary" name="driver_salary"
v-model:field="budgetForm.driver_salary" v-model:field="budgetForm.driver_salary"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="CASETAS" label="CASETAS"
@@ -381,6 +435,7 @@
:filled="false" :filled="false"
name="accomadation_allowance" name="accomadation_allowance"
v-model:field="budgetForm.accomadation_allowance" v-model:field="budgetForm.accomadation_allowance"
:readonly="isPrint"
/> />
<CustomInput <CustomInput
label="OTROS GASTOS" label="OTROS GASTOS"
@@ -388,6 +443,7 @@
:filled="false" :filled="false"
name="other_administrative_expenses" name="other_administrative_expenses"
v-model:field="budgetForm.other_administrative_expenses" v-model:field="budgetForm.other_administrative_expenses"
:readonly="isPrint"
/> />
<div class="calculator-card__totals"> <div class="calculator-card__totals">
<div> <div>
@@ -439,19 +495,13 @@
</div> </div>
</div> </div>
</div> </div>
<div class="mt-4 text-center"> <div class="mt-4 text-center" v-if="!isPrint">
<button class="btn btn-primary myshipper-btn" type="submit">Guardar</button> <Spiner v-if="loading"/>
<button v-else class="btn-primary-sm radius-sm" type="submit">Guardar</button>
</div> </div>
</form> </form>
</div> </div>
</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> </div>
</div> </div>

1
src/components/CreateLocationModal.vue
View File

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

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

@@ -14,6 +14,10 @@
multiple: { multiple: {
type: Boolean, type: Boolean,
default: false default: false
},
disabled: {
type: Boolean,
default: false
} }
}); });
defineEmits(['update:selectedCities', 'clear-option']) defineEmits(['update:selectedCities', 'clear-option'])
@@ -35,6 +39,7 @@
:searchable="true" :searchable="true"
:loading="isLoading" :loading="isLoading"
:close-on-select="true" :close-on-select="true"
:disabled="disabled"
@search-change="searchState" @search-change="searchState"
@remove="$emit('clear-option')" @remove="$emit('clear-option')"
placeholder="Busca por ciudad" placeholder="Busca por ciudad"

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

@@ -14,6 +14,10 @@
multiple: { multiple: {
type: Boolean, type: Boolean,
default: false default: false
},
disabled: {
type: Boolean,
default: false
} }
}); });
defineEmits(['update:selectedProduct', 'clear-option']) defineEmits(['update:selectedProduct', 'clear-option'])
@@ -36,6 +40,7 @@
:searchable="true" :searchable="true"
:loading="isLoading" :loading="isLoading"
:close-on-select="true" :close-on-select="true"
:disabled="disabled"
@search-change="searchProductFn" @search-change="searchProductFn"
@remove="$emit('clear-option')" @remove="$emit('clear-option')"
placeholder="Busca por producto" placeholder="Busca por producto"

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

@@ -14,6 +14,10 @@
multiple: { multiple: {
type: Boolean, type: Boolean,
default: false default: false
},
disabled: {
type: Boolean,
default: false
} }
}); });
defineEmits(['update:selectedTruckType', 'clear-option']) defineEmits(['update:selectedTruckType', 'clear-option'])
@@ -38,6 +42,7 @@
:multiple="multiple" :multiple="multiple"
:loading="isLoading" :loading="isLoading"
:searchable="true" :searchable="true"
:disabled="disabled"
:close-on-select="true" :close-on-select="true"
@search-change="getTruckTypesQuery" @search-change="getTruckTypesQuery"
@remove="$emit('clear-option')" @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 { try {
const data = await updateBudget(id, formData); const data = await updateBudget(id, formData);
console.log(data); console.log(localData);
if(data) { if(data) {
const index = budgets.value.findIndex((budget) => budget._id === id); const index = budgets.value.findIndex((budget) => budget._id === id);
budgets.value[index] = { budgets.value[index] = {
...budgets.value[index], ...budgets.value[index],
...data, ...data,
material: udgets.value[index].material ...localData
}; };
return data; return 'success';
} else { } else {
return null; return 'No se pudo actualizar presupuesto, intente mas tarde';
} }
} catch (error) { } catch (error) {
return null; return 'Algo salio mal, intente más tarde';
} }
} }
const createBudgetCompany = async(formData) => { const createBudgetCompany = async(formData, localData) => {
try { try {
const data = await createBudget(formData); const data = await createBudget(formData);
console.log(data);
if(data) { if(data) {
budgets.value.push(data); budgets.value.push({
return data; ...data,
...localData
});
return 'success';
} else { } else {
return null; return 'No se pudo agregar presupuesto, intente mas tarde';
} }
} catch (error) { } 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 query = ref('');
const currentBudget = ref(null); const currentBudget = ref(null);
const openModal = ref(false); const openModal = ref(false);
const printOpen = ref(false);
onMounted(() => { onMounted(() => {
getInitData(); getInitData();
@@ -60,14 +61,18 @@
} }
} }
const handleSetCurrentBudget = (budget) => { const handleSetCurrentBudget = (data) => {
openModal.value = true; openModal.value = true;
currentBudget.value = budget; currentBudget.value = data.budget;
if(data.print) {
printOpen.value = true
}
} }
const handleResetCurrentBudget = () => { const handleResetCurrentBudget = () => {
openModal.value = false; openModal.value = false;
currentBudget.value = null; currentBudget.value = null;
printOpen.value = false;
} }
</script> </script>
@@ -76,6 +81,7 @@
<CreateBudgetModal <CreateBudgetModal
v-if="openModal === true" v-if="openModal === true"
:budget="currentBudget" :budget="currentBudget"
:is-print="printOpen"
@reset-budget="handleResetCurrentBudget" @reset-budget="handleResetCurrentBudget"
/> />
<div> <div>
@@ -93,7 +99,7 @@
<button <button
class="btn-primary-sm radius-sm" class="btn-primary-sm radius-sm"
data-toggle="modal" data-target="#budgetModal" 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> ><i class="fa-solid fa-plus"></i> <span class="clear-sm"> Crear</span><span class="clear-md"> presupuesto</span></button>
</div> </div>
<Spiner v-if="loading"/> <Spiner v-if="loading"/>
@@ -102,7 +108,7 @@
v-if="companyStore.budgets.length > 0" v-if="companyStore.budgets.length > 0"
v-for="budget in companyStore.budgets" v-for="budget in companyStore.budgets"
:budget="budget" :budget="budget"
@set-budget="handleSetCurrentBudget(budget)" @set-budget="handleSetCurrentBudget"
/> />
<CardEmpty <CardEmpty
v-else v-else