add: translation budgets
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import Swal from 'sweetalert2';
|
import Swal from 'sweetalert2';
|
||||||
import { useCompanyStore } from '../stores/company';
|
import { useCompanyStore } from '../stores/company';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
budget: {
|
budget: {
|
||||||
@@ -13,20 +14,22 @@
|
|||||||
|
|
||||||
const companyStore = useCompanyStore();
|
const companyStore = useCompanyStore();
|
||||||
|
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
const handleDeleteBudget = async() => {
|
const handleDeleteBudget = async() => {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
title: 'Eliminar Presupuesto!',
|
title: t('calculator.titleDel'),
|
||||||
text: '¿Estás seguro de eliminar este presupuesto?',
|
text: t('calculator.textDel'),
|
||||||
icon: 'warning',
|
icon: 'warning',
|
||||||
showCancelButton: true,
|
showCancelButton: true,
|
||||||
cancelButtonColor: "#d33",
|
cancelButtonColor: "#d33",
|
||||||
confirmButtonText: 'Eliminar',
|
confirmButtonText: t('buttons.delete'),
|
||||||
cancelButtonText: 'Cancelar',
|
cancelButtonText: t('buttons.cancel'),
|
||||||
}).then(async(result) => {
|
}).then(async(result) => {
|
||||||
if(result.isConfirmed) {
|
if(result.isConfirmed) {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
title: 'Por favor espere!',
|
title: t('messages.loading'),
|
||||||
html: 'Eliminando presupuesto...',// add html attribute if you want or remove
|
html: t('calculator.loadingDel'),// add html attribute if you want or remove
|
||||||
allowOutsideClick: false,
|
allowOutsideClick: false,
|
||||||
didOpen: () => {
|
didOpen: () => {
|
||||||
Swal.showLoading()
|
Swal.showLoading()
|
||||||
@@ -36,14 +39,14 @@
|
|||||||
Swal.close();
|
Swal.close();
|
||||||
if(resp !== null) {
|
if(resp !== null) {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
title: "Presupuesto eliminado!",
|
title: t('calculator.msgTitleDel'),
|
||||||
text: "Tu presupuesto ha sido eliminado exitosamente.",
|
text: t('calculator.msgDel'),
|
||||||
icon: "success"
|
icon: "success"
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
title: "No eliminado!",
|
title: t('calculator.msgTitleNotDel'),
|
||||||
text: "Tu presupuesto no se pudo eliminar, intente más tarde.",
|
text: t('calculator.msgNotDel'),
|
||||||
icon: "error"
|
icon: "error"
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -59,21 +62,21 @@
|
|||||||
<div>
|
<div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-6 col-md-6 col-sm-12">
|
<div class="col-lg-6 col-md-6 col-sm-12">
|
||||||
<p><span>Cliente:</span> {{budget.client}}</p>
|
<p><span>{{ t('calculator.client') }}:</span> {{budget.client}}</p>
|
||||||
<p v-if="budget.material"><span>Material:</span> {{budget.material.name}}</p>
|
<p v-if="budget.material"><span>{{ t('loads.product') }}:</span> {{budget.material.name}}</p>
|
||||||
<p><span>Origen:</span> {{budget.origin}}</p>
|
<p><span>{{ t('loads.origin') }}:</span> {{budget.origin}}</p>
|
||||||
<p><span>Destino:</span> {{budget.destination}}</p>
|
<p><span>{{ t('loads.destination') }}:</span> {{budget.destination}}</p>
|
||||||
<p><span>Tipo de camión:</span> {{budget.truck_type}}</p>
|
<p><span>{{ t('loads.truckType') }}:</span> {{budget.truck_type}}</p>
|
||||||
<p><span>Total KM recorridos:</span> {{budget.total_km_travel}}</p>
|
<p><span>{{ t('calculator.totalkm') }}:</span> {{budget.total_km_travel}}</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-6 col-md-6 col-sm-12">
|
<div class="col-lg-6 col-md-6 col-sm-12">
|
||||||
<p><span>Total Litros De Diesel Consumidos: </span> {{parseFloat( budget.total_fuel_consumed).toFixed(2)}}</p>
|
<p><span>{{ t('calculator.totallt') }}: </span> {{parseFloat( budget.total_fuel_consumed).toFixed(2)}}</p>
|
||||||
<p><span>Total Costo Del Diesel:</span> {{"$" + parseFloat( budget.total_cost_fuel).toFixed(2)}}</p>
|
<p><span>{{ t('calculator.totalcostDiesel') }}:</span> {{"$" + parseFloat( budget.total_cost_fuel).toFixed(2)}}</p>
|
||||||
<p><span>Total Antes De Iva:</span> ${{budget.total_before_tax}}</p>
|
<p><span>{{ t('calculator.totalBeforeIva') }}:</span> ${{budget.total_before_tax}}</p>
|
||||||
<p><span>Total Utilidad Por Kilometro:</span> {{"$" + parseFloat( budget.total_utility_per_km).toFixed(2)}}</p>
|
<p><span>{{ t('calculator.totalUtityByKm') }}:</span> {{"$" + parseFloat( budget.total_utility_per_km).toFixed(2)}}</p>
|
||||||
<p><span>Total Utilidad:</span> {{"$" + parseFloat( budget.total_profit).toFixed(2)}}</p>
|
<p><span>{{ t('calculator.totalUtity') }}:</span> {{"$" + parseFloat( budget.total_profit).toFixed(2)}}</p>
|
||||||
<!-- <p>{{ $t('CALCULATOR.PROFIT_PERCENTAGE') }}: {{budget.profit_percentage}}%</p> -->
|
<!-- <p>{{ $t('CALCULATOR.PROFIT_PERCENTAGE') }}: {{budget.profit_percentage}}%</p> -->
|
||||||
<p><span>Porcentaje De Utilidad:</span> {{parseFloat(budget.profit_percentage).toFixed(2) + "%"}}</p>
|
<p><span>{{ t('calculator.percentUtility') }}:</span> {{parseFloat(budget.profit_percentage).toFixed(2) + "%"}}</p>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -83,14 +86,14 @@
|
|||||||
class="btn btn-danger 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">{{ t('buttons.delete') }}</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
class="btn-primary-sm radius-sm"
|
class="btn-primary-sm radius-sm"
|
||||||
@click="$emit('set-budget', {budget: budget, print: false})"
|
@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">{{ t('buttons.edit') }}</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -98,7 +101,7 @@
|
|||||||
@click="$emit('set-budget', {budget: budget, print: true})"
|
@click="$emit('set-budget', {budget: budget, print: true})"
|
||||||
data-toggle="modal" data-target="#budgetModal"
|
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">{{ t('calculator.print') }}</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -9,6 +9,8 @@
|
|||||||
import Spiner from './ui/Spiner.vue';
|
import Spiner from './ui/Spiner.vue';
|
||||||
import Cities from './ui/Cities.vue';
|
import Cities from './ui/Cities.vue';
|
||||||
import html2pdf from 'html2pdf.js';
|
import html2pdf from 'html2pdf.js';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
budget: {
|
budget: {
|
||||||
@@ -27,6 +29,8 @@
|
|||||||
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
|
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
console.log(props.budget);
|
console.log(props.budget);
|
||||||
if(props.budget) {
|
if(props.budget) {
|
||||||
@@ -197,7 +201,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
let result = 'error';
|
let result = 'error';
|
||||||
let action = 'Creado';
|
let action = t('calculator.msgCreate');
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
|
|
||||||
const localData = {
|
const localData = {
|
||||||
@@ -206,17 +210,17 @@
|
|||||||
|
|
||||||
if(props.budget !== null) { // update
|
if(props.budget !== null) { // update
|
||||||
result = await companyStore.updateBudgetCompany(props.budget._id, budgetData, localData);
|
result = await companyStore.updateBudgetCompany(props.budget._id, budgetData, localData);
|
||||||
action = 'actualizado';
|
action = t('calculator.msgUpdate');
|
||||||
} else { // create
|
} else { // create
|
||||||
result = await companyStore.createBudgetCompany(budgetData);
|
result = await companyStore.createBudgetCompany(budgetData);
|
||||||
action = 'agregado';
|
action = t('calculator.msgCreate');
|
||||||
}
|
}
|
||||||
|
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
if(result === 'success') {
|
if(result === 'success') {
|
||||||
document.getElementById('btnClosebudgetModal').click();
|
document.getElementById('btnClosebudgetModal').click();
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
title: `<strong>Presupuesto ${action} con éxito!</strong>`,
|
title: action,
|
||||||
icon: 'success'
|
icon: 'success'
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
@@ -229,7 +233,7 @@
|
|||||||
|
|
||||||
const validations = () => {
|
const validations = () => {
|
||||||
errors.value = {
|
errors.value = {
|
||||||
client: budgetForm.client?.length < 2 ? 'Ingrese nombre del cliente' : null,
|
client: budgetForm.client?.length < 2 ? t('errors.customer') : null,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -253,7 +257,8 @@
|
|||||||
<div class="modal-dialog modal-dialog-centered modal-xl" role="document">
|
<div class="modal-dialog modal-dialog-centered modal-xl" role="document">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<h2 class="title mt-2 mb-3">Calculadora</h2>
|
<!-- <h2 class="title mt-2 mb-3">Calculadora</h2> -->
|
||||||
|
<div></div>
|
||||||
<button
|
<button
|
||||||
id="btnClosebudgetModal"
|
id="btnClosebudgetModal"
|
||||||
type="button"
|
type="button"
|
||||||
@@ -267,16 +272,16 @@
|
|||||||
<form action="" @submit.prevent="saveBudget" autocomplete="off" method="post" ref="pdfContent">
|
<form action="" @submit.prevent="saveBudget" autocomplete="off" method="post" ref="pdfContent">
|
||||||
<div class="calculator-card">
|
<div class="calculator-card">
|
||||||
<div class="calculator-card__title">
|
<div class="calculator-card__title">
|
||||||
<h2>CALCULADOR DE TARIFAS</h2>
|
<h2>{{ t('calculator.titleDoc') }}</h2>
|
||||||
<img src="/images/logo-eta.png" alt="Eta viaporte" width="110">
|
<img src="/images/logo-eta.png" alt="Eta viaporte" width="110">
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__subtitle">
|
<div class="calculator-card__subtitle">
|
||||||
<h4>DATOS DE CARGA</h4>
|
<h4>{{ t('calculator.loadData') }}</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__body">
|
<div class="calculator-card__body">
|
||||||
<div class="calculator-card__loads_data">
|
<div class="calculator-card__loads_data">
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="CLIENTE*"
|
:label="t('calculator.client') + '*'"
|
||||||
type="text"
|
type="text"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="client"
|
name="client"
|
||||||
@@ -285,35 +290,35 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<div class="mb-4 mt-3">
|
<div class="mb-4 mt-3">
|
||||||
<label class="custom-label">MATERIAL</label>
|
<label class="custom-label">{{ t('loads.product') }}</label>
|
||||||
<Products
|
<Products
|
||||||
v-model="budgetForm.budgetproduct"
|
v-model="budgetForm.budgetproduct"
|
||||||
:disabled="isPrint"
|
:disabled="isPrint"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-4 mt-3">
|
<div class="mb-4 mt-3">
|
||||||
<label class="custom-label">ORIGEN</label>
|
<label class="custom-label">{{ t('loads.origin') }}</label>
|
||||||
<Cities
|
<Cities
|
||||||
v-model="budgetForm.origin"
|
v-model="budgetForm.origin"
|
||||||
:disabled="isPrint"
|
:disabled="isPrint"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-4 mt-3">
|
<div class="mb-4 mt-3">
|
||||||
<label class="custom-label">DESTINO</label>
|
<label class="custom-label">{{ t('loads.destination') }}</label>
|
||||||
<Cities
|
<Cities
|
||||||
v-model="budgetForm.destination"
|
v-model="budgetForm.destination"
|
||||||
:disabled="isPrint"
|
:disabled="isPrint"
|
||||||
/>
|
/>
|
||||||
</div>
|
</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">{{ t('loads.truckType') }}</label>
|
||||||
<TruckTypes
|
<TruckTypes
|
||||||
v-model="budgetForm.budgetTrucktypes"
|
v-model="budgetForm.budgetTrucktypes"
|
||||||
:disabled="isPrint"
|
:disabled="isPrint"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="TONELADAS"
|
:label="t('labels.tons')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="num_tons"
|
name="num_tons"
|
||||||
@@ -321,7 +326,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="PRECIO POR TONELADA"
|
:label="t('labels.priceTons')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="price_per_ton"
|
name="price_per_ton"
|
||||||
@@ -331,12 +336,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__subtitle">
|
<div class="calculator-card__subtitle">
|
||||||
<h4>TARIFA / KILOMETRAJE</h4>
|
<h4>{{ t('calculator.ratekm') }}</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__body">
|
<div class="calculator-card__body">
|
||||||
<div class="calculator-card__loads_data">
|
<div class="calculator-card__loads_data">
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="TONELAJE APROXIMADO DE CARGA"
|
:label="t('labels.tonLoad')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="tonnage"
|
name="tonnage"
|
||||||
@@ -344,7 +349,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="PRECIO POR TONELADA"
|
:label="t('labels.priceTons')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="price_per_ton"
|
name="price_per_ton"
|
||||||
@@ -352,7 +357,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="ORIGEN DEL CAMION AL ORIGEN DE CARGA(KM)"
|
:label="t('labels.originTruckKm1')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="pickup_distance"
|
name="pickup_distance"
|
||||||
@@ -360,7 +365,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="ORIGEN DE CARGA A DESTINO DE DESCARGA(KM)"
|
:label="t('labels.originTruckKm2')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="delivery_distance"
|
name="delivery_distance"
|
||||||
@@ -368,7 +373,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="DESTINO DE DESCARGA AL PATIO-BASE (KM)"
|
:label="t('labels.destinationTruck1')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="warehouse_distance"
|
name="warehouse_distance"
|
||||||
@@ -377,7 +382,7 @@
|
|||||||
/>
|
/>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>TOTAL KM RECORRIDOS</h6>
|
<h6>{{ t('calculator.totalkm').toUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalTravel }}
|
{{ totalTravel }}
|
||||||
@@ -386,12 +391,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__subtitle">
|
<div class="calculator-card__subtitle">
|
||||||
<h4>COSTOS DIRECTOS CAMION</h4>
|
<h4>{{ t('calculator.costTruck') }}</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__body">
|
<div class="calculator-card__body">
|
||||||
<div class="calculator-card__loads_data">
|
<div class="calculator-card__loads_data">
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="RENDIMIENTO CAMION - LITROS POR KILOMETRO RECORRIDO"
|
:label="t('calculator.truckCost1')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="cost_per_liter"
|
name="cost_per_liter"
|
||||||
@@ -399,7 +404,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="PRECIO DEL DIESEL POR LITRO"
|
:label="t('calculator.truckCost2')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="fuel_price_per_liter"
|
name="fuel_price_per_liter"
|
||||||
@@ -407,7 +412,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="OTROS GASTOS"
|
:label="t('calculator.otherSpends')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="other_fuel_expenses"
|
name="other_fuel_expenses"
|
||||||
@@ -416,7 +421,7 @@
|
|||||||
/>
|
/>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>TOTAL LITROS DE DIESEL CONSUMIDOS</h6>
|
<h6>{{ t('calculator.totallt').toLocaleUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalFuel }}
|
{{ totalFuel }}
|
||||||
@@ -424,7 +429,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>TOTAL COSTO DEL DIESEL</h6>
|
<h6>{{ t('calculator.truckCost4').toLocaleUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalFuelCost }}
|
{{ totalFuelCost }}
|
||||||
@@ -433,12 +438,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__subtitle">
|
<div class="calculator-card__subtitle">
|
||||||
<h4>SUELDO OPERADOR</h4>
|
<h4>{{ t('calculator.operatorSalary') }}</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__body">
|
<div class="calculator-card__body">
|
||||||
<div class="calculator-card__loads_data">
|
<div class="calculator-card__loads_data">
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="GASTOS ADMINISTRATIVOS"
|
:label="t('calculator.salaryAdmin')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="driver_salary"
|
name="driver_salary"
|
||||||
@@ -446,7 +451,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="CASETAS"
|
:label="t('calculator.stands')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="accomadation_allowance"
|
name="accomadation_allowance"
|
||||||
@@ -454,7 +459,7 @@
|
|||||||
:readonly="isPrint"
|
:readonly="isPrint"
|
||||||
/>
|
/>
|
||||||
<CustomInput
|
<CustomInput
|
||||||
label="OTROS GASTOS"
|
:label="t('calculator.otherSpends')"
|
||||||
type="number"
|
type="number"
|
||||||
:filled="false"
|
:filled="false"
|
||||||
name="other_administrative_expenses"
|
name="other_administrative_expenses"
|
||||||
@@ -463,7 +468,7 @@
|
|||||||
/>
|
/>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>GASTOS ADMINISTRATIVOS TOTALES</h6>
|
<h6>{{ t('calculator.spendsAdminTotal').toUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalAdminExpenses }}
|
{{ totalAdminExpenses }}
|
||||||
@@ -472,13 +477,13 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__subtitle">
|
<div class="calculator-card__subtitle">
|
||||||
<h4>UTILIDAD / PERDIDA</h4>
|
<h4>{{ t('calculator.utilityLoss') }}</h4>
|
||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__body">
|
<div class="calculator-card__body">
|
||||||
<div class="calculator-card__loads_data">
|
<div class="calculator-card__loads_data">
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>TOTAL ANTES DE IVA</h6>
|
<h6>{{ t('calculator.totalBeforeIva').toUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalBeforeTax }}
|
{{ totalBeforeTax }}
|
||||||
@@ -486,7 +491,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>TOTAL UTILIDAD POR KILOMETRO</h6>
|
<h6>{{ t('calculator.totalUtityByKm').toUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalUtilityPerKm }}
|
{{ totalUtilityPerKm }}
|
||||||
@@ -494,7 +499,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>TOTAL UTILIDAD</h6>
|
<h6>{{ t('calculator.totalUtity').toUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalProfit }}
|
{{ totalProfit }}
|
||||||
@@ -502,7 +507,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="calculator-card__totals">
|
<div class="calculator-card__totals">
|
||||||
<div>
|
<div>
|
||||||
<h6>PORCENTAJE DE UTILIDAD</h6>
|
<h6>{{ t('calculator.percentUtility').toUpperCase() }}</h6>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
{{ totalPercentage }}
|
{{ totalPercentage }}
|
||||||
@@ -513,7 +518,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="mt-4 text-center" v-if="!isPrint">
|
<div class="mt-4 text-center" v-if="!isPrint">
|
||||||
<Spiner v-if="loading"/>
|
<Spiner v-if="loading"/>
|
||||||
<button v-else class="btn-primary-sm radius-sm" type="submit">Guardar</button>
|
<button v-else class="btn-primary-sm radius-sm" type="submit">{{ t('buttons.save') }}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
<div class="mt-4 text-center" v-if="isPrint">
|
<div class="mt-4 text-center" v-if="isPrint">
|
||||||
@@ -521,7 +526,7 @@
|
|||||||
class="btn-primary-sm radius-sm"
|
class="btn-primary-sm radius-sm"
|
||||||
@click="downloadPdf"
|
@click="downloadPdf"
|
||||||
type="button">
|
type="button">
|
||||||
Descargar
|
{{ t('buttons.download') }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -58,6 +58,12 @@ const en = {
|
|||||||
operator: 'Operator',
|
operator: 'Operator',
|
||||||
vehicle: 'Vehicle',
|
vehicle: 'Vehicle',
|
||||||
comment: 'Comment',
|
comment: 'Comment',
|
||||||
|
tons: "Tons",
|
||||||
|
priceTons: "Price per ton",
|
||||||
|
tonLoad: "Approximate load tonnage",
|
||||||
|
originTruckKm1: "Truck origin to load origin(KM)",
|
||||||
|
originTruckKm2: "Loading origin to unloading destination(KM)",
|
||||||
|
destinationTruck1: "Unloading destination to base-yard(KM)",
|
||||||
},
|
},
|
||||||
buttons: {
|
buttons: {
|
||||||
enter: "Enter here",
|
enter: "Enter here",
|
||||||
@@ -84,7 +90,8 @@ const en = {
|
|||||||
confirm: 'Confirm',
|
confirm: 'Confirm',
|
||||||
search: 'Search',
|
search: 'Search',
|
||||||
profile: 'View profile',
|
profile: 'View profile',
|
||||||
send: 'Send'
|
send: 'Send',
|
||||||
|
download: 'Download'
|
||||||
},
|
},
|
||||||
errors: {
|
errors: {
|
||||||
required: 'Field is required',
|
required: 'Field is required',
|
||||||
@@ -120,6 +127,7 @@ const en = {
|
|||||||
map: 'Could not be loaded',
|
map: 'Could not be loaded',
|
||||||
vehicle: 'Select a vehicle',
|
vehicle: 'Select a vehicle',
|
||||||
comment: 'Add comment',
|
comment: 'Add comment',
|
||||||
|
customer: 'Enter customer name'
|
||||||
},
|
},
|
||||||
messages: {
|
messages: {
|
||||||
sendCode: 'We send you a code to the email, entered!',
|
sendCode: 'We send you a code to the email, entered!',
|
||||||
@@ -396,6 +404,45 @@ const en = {
|
|||||||
searchShipper: "Search by shipper",
|
searchShipper: "Search by shipper",
|
||||||
empty: 'No uploads published'
|
empty: 'No uploads published'
|
||||||
},
|
},
|
||||||
|
calculator: {
|
||||||
|
title: 'Budget calculator',
|
||||||
|
querySearch: 'Search by customer',
|
||||||
|
empty: 'There are no records',
|
||||||
|
create: '<i class="fa-solid fa-plus"></i> <span class="clear-sm"> Create</span><span class="clear-md"> budget</span>',
|
||||||
|
client: 'Customer',
|
||||||
|
totalkm: 'Total km traveled',
|
||||||
|
totallt: 'Total liters of diesel consumed',
|
||||||
|
totalcostDiesel: 'Total diesel cost',
|
||||||
|
totalBeforeIva: 'Total before VAT',
|
||||||
|
totalUtityByKm: 'Total utility per km',
|
||||||
|
totalUtity: 'Total Utility',
|
||||||
|
percentUtility: 'Utility Percentage',
|
||||||
|
print: 'Print',
|
||||||
|
|
||||||
|
titleDoc: 'RATE CALCULATOR',
|
||||||
|
loadData: 'LOAD DATA',
|
||||||
|
ratekm: 'RATE / MILEAGE',
|
||||||
|
costTruck: 'DIRECT TRUCK COSTS',
|
||||||
|
operatorSalary: 'OPERATOR SALARY',
|
||||||
|
utilityLoss: 'UTILITY / LOSS',
|
||||||
|
|
||||||
|
titleDel: 'Delete Budget!',
|
||||||
|
textDel: 'Are you sure you want to delete this budget?',
|
||||||
|
loadingDel: 'Deleting budget...',
|
||||||
|
msgTitleDel: 'Budget Deleted!',
|
||||||
|
msgDel: 'Your budget has been successfully deleted.',
|
||||||
|
msgTitleNotDel: 'Not Deleted!',
|
||||||
|
msgNotDel: 'Your budget could not be deleted, please try again later.',
|
||||||
|
truckCost1: "Truck performance - Liters per kilometer traveled",
|
||||||
|
truckCost2: "Diesel price per liter",
|
||||||
|
otherSpends: "Other expenses",
|
||||||
|
truckCost4: "Total diesel cost",
|
||||||
|
salaryAdmin: "Administrative expenses",
|
||||||
|
stands: "Toll booths",
|
||||||
|
spendsAdminTotal: "Total administrative expenses",
|
||||||
|
msgUpdate: "<strong>Budget successfully updated!</strong>",
|
||||||
|
msgCreate: "<strong>Budget successfully created!</strong>",
|
||||||
|
},
|
||||||
calendar: {
|
calendar: {
|
||||||
title: 'Calendar',
|
title: 'Calendar',
|
||||||
helpText: 'Load status indicators',
|
helpText: 'Load status indicators',
|
||||||
|
|||||||
@@ -60,6 +60,12 @@ const es = {
|
|||||||
operator: 'Operador',
|
operator: 'Operador',
|
||||||
vehicle: 'Vehiculo',
|
vehicle: 'Vehiculo',
|
||||||
comment: 'Comentario',
|
comment: 'Comentario',
|
||||||
|
tons: "Toneladas",
|
||||||
|
priceTons: "Precio por toneladas",
|
||||||
|
tonLoad: "Tonelaje aproximado de carga",
|
||||||
|
originTruckKm1: "Origen del camión al origin de carga(KM)",
|
||||||
|
originTruckKm2: "Origen de carga a destino de descarga(KM)",
|
||||||
|
destinationTruck1: "Destino de descarga al patio-base(KM)"
|
||||||
},
|
},
|
||||||
buttons: {
|
buttons: {
|
||||||
enter: "Ingresa aqui",
|
enter: "Ingresa aqui",
|
||||||
@@ -87,6 +93,7 @@ const es = {
|
|||||||
search: 'Buscar',
|
search: 'Buscar',
|
||||||
profile: 'Ver perfil',
|
profile: 'Ver perfil',
|
||||||
send: 'Enviar',
|
send: 'Enviar',
|
||||||
|
download: 'Descargar'
|
||||||
},
|
},
|
||||||
errors: {
|
errors: {
|
||||||
required: 'Campo es requerido',
|
required: 'Campo es requerido',
|
||||||
@@ -122,6 +129,7 @@ const es = {
|
|||||||
map: "No se pudo cargar mapa",
|
map: "No se pudo cargar mapa",
|
||||||
vehicle: 'Selecciona un vehiculo',
|
vehicle: 'Selecciona un vehiculo',
|
||||||
comment: 'Agrega comentario',
|
comment: 'Agrega comentario',
|
||||||
|
customer: 'Ingrese nombre del cliente'
|
||||||
},
|
},
|
||||||
messages: {
|
messages: {
|
||||||
sendCode: 'Te enviamos un código al correo, ingresado!',
|
sendCode: 'Te enviamos un código al correo, ingresado!',
|
||||||
@@ -397,12 +405,52 @@ const es = {
|
|||||||
carriers: {
|
carriers: {
|
||||||
title: 'Directorio de <span class="title-main">Transportistas</span>',
|
title: 'Directorio de <span class="title-main">Transportistas</span>',
|
||||||
searchByCarrier: 'Buscar por transportista',
|
searchByCarrier: 'Buscar por transportista',
|
||||||
empty: 'No hay registros'
|
empty: 'No hay registros',
|
||||||
},
|
},
|
||||||
shippers: {
|
shippers: {
|
||||||
searchShipper: "Buscar por embarcador",
|
searchShipper: "Buscar por embarcador",
|
||||||
empty: 'No hay cargas publicadas'
|
empty: 'No hay cargas publicadas'
|
||||||
},
|
},
|
||||||
|
calculator: {
|
||||||
|
title: 'Calculator de presupuesto',
|
||||||
|
querySearch: 'Buscar por cliente',
|
||||||
|
empty: 'No hay registros',
|
||||||
|
create: '<i class="fa-solid fa-plus"></i> <span class="clear-sm"> Crear</span><span class="clear-md"> presupuesto</span>',
|
||||||
|
client: 'Cliente',
|
||||||
|
totalkm: 'Total km recorridos',
|
||||||
|
totallt: 'Total litros de diesel consumidos',
|
||||||
|
totalcostDiesel: 'Costo total del diesel',
|
||||||
|
totalBeforeIva: 'Total antes de IVA',
|
||||||
|
totalUtityByKm: 'Utilidad total por km',
|
||||||
|
totalUtity: 'Utilidad total',
|
||||||
|
percentUtility: 'Porcentaje de utilidad',
|
||||||
|
print: 'Imprimir',
|
||||||
|
|
||||||
|
titleDoc: 'CALCULADORA DE TARIFAS',
|
||||||
|
loadData: 'DATOS DE CARGA',
|
||||||
|
ratekm: 'TARIFA / KILOMETRAJE',
|
||||||
|
costTruck: 'COSTOS DIRECTOS CAMION',
|
||||||
|
operatorSalary: 'SUELDO OPERADOR',
|
||||||
|
utilityLoss: 'UTILIDAD / PERDIDA',
|
||||||
|
|
||||||
|
titleDel: '¡Eliminar Presupuesto!',
|
||||||
|
textDel: '¿Estás seguro de eliminar este presupuesto?',
|
||||||
|
loadingDel: 'Eliminando presupuesto...',
|
||||||
|
msgTitleDel: 'Presupuesto eliminada!',
|
||||||
|
msgDel: 'Tu presupuesto ha sido eliminado exitosamente.',
|
||||||
|
msgTitleNotDel: 'No eliminado!',
|
||||||
|
msgNotDel: 'Tu presupuesto no se pudo eliminar, intente más tarde.',
|
||||||
|
truckCost1: "Rendimiento camión - Litros por kilometro recorrido",
|
||||||
|
truckCost2: "Precio del diesel por litro",
|
||||||
|
otherSpends: "Otros gastos",
|
||||||
|
truckCost4: "Total costo del diesel",
|
||||||
|
salaryAdmin: "Gastas administrativos",
|
||||||
|
stands: "Casetas",
|
||||||
|
spendsAdminTotal: "Gastos administrativos totales",
|
||||||
|
msgUpdate: "<strong>Presupuesto actualizado con éxito!</strong>",
|
||||||
|
msgCreate: "<strong>Presupuesto creado con éxito!</strong>",
|
||||||
|
|
||||||
|
},
|
||||||
calendar: {
|
calendar: {
|
||||||
title: 'Calendario',
|
title: 'Calendario',
|
||||||
helpText: 'Indicadores de estado de la carga',
|
helpText: 'Indicadores de estado de la carga',
|
||||||
|
|||||||
@@ -7,6 +7,7 @@
|
|||||||
import CardEmpty from '../components/CardEmpty.vue';
|
import CardEmpty from '../components/CardEmpty.vue';
|
||||||
import CreateBudgetModal from '../components/CreateBudgetModal.vue';
|
import CreateBudgetModal from '../components/CreateBudgetModal.vue';
|
||||||
import Pagination from '../components/Pagination.vue';
|
import Pagination from '../components/Pagination.vue';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
const companyStore = useCompanyStore();
|
const companyStore = useCompanyStore();
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
@@ -19,6 +20,8 @@
|
|||||||
const printOpen = ref(false);
|
const printOpen = ref(false);
|
||||||
const limit = 10;
|
const limit = 10;
|
||||||
|
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getInitData();
|
getInitData();
|
||||||
})
|
})
|
||||||
@@ -107,22 +110,23 @@
|
|||||||
@reset-budget="handleResetCurrentBudget"
|
@reset-budget="handleResetCurrentBudget"
|
||||||
/>
|
/>
|
||||||
<div>
|
<div>
|
||||||
<h2 class="title my-2">Calculadora</h2>
|
<h2 class="title my-2">{{t('calculator.title')}}</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="box-filters">
|
<div class="box-filters">
|
||||||
<div class="box-search">
|
<div class="box-search">
|
||||||
<input class="form-control custom-search" type="search" name="" placeholder="Buscar por cliente" id="" @:input="search()" v-model="query" aria-label="Search">
|
<input class="form-control custom-search" type="search" name="" :placeholder="t('calculator.querySearch')" id="" @:input="search()" v-model="query" aria-label="Search">
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
class="btn btn-danger bg-dark" type="button" @click="clearFilter">
|
class="btn btn-danger bg-dark" type="button" @click="clearFilter">
|
||||||
<i class="fa-solid fa-arrow-rotate-right"></i>
|
<i class="fa-solid fa-arrow-rotate-right"></i>
|
||||||
<span class="clear-sm"> Reset</span><span class="clear-md"> filtros</span>
|
<span class="clear-sm"> Reset </span><span class="clear-md"> {{ t('labels.filters') }}</span>
|
||||||
</button>
|
</button>
|
||||||
<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({budget: null, print: false})"
|
@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>
|
v-html="t('calculator.create')"
|
||||||
|
></button>
|
||||||
</div>
|
</div>
|
||||||
<Spiner v-if="loading"/>
|
<Spiner v-if="loading"/>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
@@ -155,7 +159,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.box-search {
|
.box-search {
|
||||||
width: 60%;
|
flex: 1;
|
||||||
}
|
}
|
||||||
.custom-search {
|
.custom-search {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@@ -163,9 +167,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1024px) {
|
@media (max-width: 1024px) {
|
||||||
.box-search {
|
|
||||||
width: 60%;
|
|
||||||
}
|
|
||||||
.box-filters {
|
.box-filters {
|
||||||
gap: .4rem;
|
gap: .4rem;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user