0
0
Fork 0

Translations

This commit is contained in:
Joan Sanchez 2022-10-20 07:14:39 +02:00
parent 17b3e73d21
commit e6419af4e8
5 changed files with 132 additions and 34 deletions

View File

@ -65,13 +65,46 @@ export default {
claims: 'Claims',
list: 'List',
createClaim: 'Create claim',
summary: 'Summary',
basicData: 'Basic Data'
},
list: {
customer: 'Customer',
assigned: 'Assigned',
assignedTo: 'Assigned',
created: 'Created',
state: 'State'
},
card: {
claimId: 'Claim ID',
assignedTo: 'Assigned',
created: 'Created',
state: 'State',
ticketId: 'Ticket ID',
customerSummary: 'Customer summary',
claimedTicket: 'Claimed ticket'
},
basicData: {
customer: 'Customer',
assignedTo: 'Assigned',
created: 'Created',
state: 'State',
packages: 'Packages',
picked: 'Picked',
},
summary: {
customer: 'Customer',
assignedTo: 'Assigned',
attendedBy: 'Attended by',
created: 'Created',
state: 'State',
details: {
title: 'Details',
columns: {
item: 'Item',
landed: 'Delivered',
quantity: 'Quantity'
}
},
}
},
components: {

View File

@ -13,7 +13,8 @@ export default {
logOut: 'Cerrar sesión',
dataSaved: 'Datos guardados',
save: 'Guardar',
reset: 'Restaurar'
reset: 'Restaurar',
noChanges: 'Sin cambios que guardar'
},
moduleIndex: {
allModules: 'Todos los módulos'
@ -60,6 +61,53 @@ export default {
basicData: 'Datos básicos'
}
},
claim: {
pageTitles: {
claims: 'Reclamaciones',
list: 'Listado',
createClaim: 'Crear reclamación',
summary: 'Resumen',
basicData: 'Datos básicos'
},
list: {
customer: 'Cliente',
assignedTo: 'Asignada a',
created: 'Creada',
state: 'Estado'
},
card: {
claimId: 'ID reclamación',
assignedTo: 'Asignada a',
created: 'Creada',
state: 'Estado',
ticketId: 'ID ticket',
customerSummary: 'Resumen del cliente',
claimedTicket: 'Ticket reclamado'
},
basicData: {
customer: 'Cliente',
assignedTo: 'Asignada a',
created: 'Creada',
state: 'Estado',
packages: 'Bultos',
picked: 'Recogida',
},
summary: {
customer: 'Cliente',
assignedTo: 'Asignada a',
attendedBy: 'Atendida por',
created: 'Creada',
state: 'Estado',
details: {
title: 'Detalles',
columns: {
item: 'Artículo2',
landed: 'Entregado',
quantity: 'Cantidad'
}
},
}
},
components: {
topbar: {},
userPanel: {

View File

@ -1,7 +1,8 @@
<script setup>
import { ref, onMounted } from 'vue';
import { ref, onMounted, watch } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import axios from 'axios';
import { useSession } from 'src/composables/useSession';
import { useValidator } from 'src/composables/useValidator';
@ -13,6 +14,7 @@ onMounted(() => {
});
const route = useRoute();
const quasar = useQuasar();
const { t } = useI18n();
const { validate } = useValidator();
const session = useSession();
@ -20,6 +22,8 @@ const token = session.getToken();
const claim = ref(null);
const claimCopy = ref(null);
const hasChanges = ref(false);
function fetch() {
const id = route.params.id;
const filter = {
@ -36,6 +40,8 @@ function fetch() {
axios.get(`Claims/${id}`, options).then(({ data }) => {
claim.value = data;
claimCopy.value = Object.assign({}, data);
watch(claim.value, () => (hasChanges.value = true));
});
}
@ -109,11 +115,19 @@ function save() {
const id = route.params.id;
const formData = claim.value;
axios.patch(`Claims/${id}`, formData);
if (!hasChanges.value) {
return quasar.notify({
type: 'negative',
message: t('globals.noChanges'),
});
}
axios.patch(`Claims/${id}`, formData).then((hasChanges.value = false));
}
function onReset() {
claim.value = claimCopy.value;
hasChanges.value = false;
}
</script>
<template>
@ -123,7 +137,7 @@ function onReset() {
<q-form v-if="claim" @submit="save" @reset="onReset" greedy>
<div class="row q-gutter-md q-mb-md">
<div class="col">
<q-input v-model="claim.client.name" label="Client" disable />
<q-input v-model="claim.client.name" :label="t('claim.basicData.customer')" disable />
</div>
<div class="col">
<q-input v-model="claim.created" mask="####-##-##" fill-mask="_">
@ -149,7 +163,7 @@ function onReset() {
option-value="id"
option-label="name"
emit-value
label="Assigned"
:label="t('claim.basicData.assignedTo')"
map-options
use-input
@filter="filterWorkers"
@ -174,7 +188,7 @@ function onReset() {
option-value="id"
option-label="description"
emit-value
label="State"
:label="t('claim.basicData.state')"
map-options
use-input
@filter="filterStates"
@ -186,12 +200,16 @@ function onReset() {
</div>
<div class="row q-gutter-md q-mb-md">
<div class="col">
<q-input v-model="claim.packages" label="Packages" :rules="validate('claim.packages')" />
<q-input
v-model="claim.packages"
:label="t('claim.basicData.packages')"
:rules="validate('claim.packages')"
/>
</div>
</div>
<div class="row q-gutter-md q-mb-md">
<div class="col">
<q-checkbox v-model="claim.hasToPickUp" label="Picked" />
<q-checkbox v-model="claim.hasToPickUp" :label="t('claim.basicData.picked')" />
</div>
</div>
<div>

View File

@ -1,13 +1,13 @@
<script setup>
import { ref, onMounted } from 'vue';
import { useRoute } from 'vue-router';
// import { useI18n } from 'vue-i18n';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
import { useState } from 'src/composables/useState';
import { toDate } from 'src/filters/index';
const route = useRoute();
// const { t } = useI18n();
const { t } = useI18n();
const state = useState();
onMounted(async () => {
@ -55,7 +55,7 @@ function stateColor(code) {
</router-link>
<router-link :to="{ name: 'ClaimSummary', params: { id: route.params.id } }">
<q-btn round flat dense size="md" icon="launch" color="white">
<q-tooltip>Claim preview</q-tooltip>
<q-tooltip>Claim summary</q-tooltip>
</q-btn>
</router-link>
@ -75,21 +75,21 @@ function stateColor(code) {
<q-list>
<q-item>
<q-item-section>
<q-item-label caption>Claim ID</q-item-label>
<q-item-label caption>{{ t('claim.card.claimId') }}</q-item-label>
<q-item-label>#{{ claim.id }}</q-item-label>
</q-item-section>
<q-item-section>
<q-item-label caption>Created</q-item-label>
<q-item-label caption>{{ t('claim.card.created') }}</q-item-label>
<q-item-label>{{ toDate(claim.created) }}</q-item-label>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-item-label caption>Assigned</q-item-label>
<q-item-label caption>{{ t('claim.card.assignedTo') }}</q-item-label>
<q-item-label>{{ claim.worker.user.name }}</q-item-label>
</q-item-section>
<q-item-section>
<q-item-label caption>State</q-item-label>
<q-item-label caption>{{ t('claim.card.state') }}</q-item-label>
<q-item-label>
<q-chip :color="stateColor(claim.claimState.code)" dense>
{{ claim.claimState.description }}
@ -99,7 +99,7 @@ function stateColor(code) {
</q-item>
<q-item>
<q-item-section>
<q-item-label caption>Ticket ID</q-item-label>
<q-item-label caption>{{ t('claim.card.ticketId') }}</q-item-label>
<q-item-label>{{ claim.ticketFk }}</q-item-label>
</q-item-section>
</q-item>
@ -111,7 +111,7 @@ function stateColor(code) {
color="primary"
:to="{ name: 'CustomerCard', params: { id: claim.clientFk } }"
>
<q-tooltip>Client preview</q-tooltip>
<q-tooltip>{{ t('claim.card.customerSummary') }}</q-tooltip>
</q-btn>
<q-btn
size="md"
@ -119,7 +119,7 @@ function stateColor(code) {
color="primary"
:to="{ name: 'TicketCard', params: { id: claim.ticketFk } }"
>
<q-tooltip>Claimed ticket</q-tooltip>
<q-tooltip>{{ t('claim.card.claimedTicket') }}</q-tooltip>
</q-btn>
</q-card-actions>
</div>
@ -148,7 +148,7 @@ function stateColor(code) {
<q-item-section avatar>
<q-icon name="vn:settings" />
</q-item-section>
<q-item-section>Basic data</q-item-section>
<q-item-section>{{ t('claim.pageTitles.basicData') }}</q-item-section>
</q-item>
</q-list>
</q-scroll-area>

View File

@ -1,15 +1,14 @@
<script setup>
import { onMounted, defineProps, ref, computed } from 'vue';
import { useRoute } from 'vue-router';
// import { useI18n } from 'vue-i18n';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
import { toDate } from 'src/filters';
onMounted(() => {
fetch();
});
onMounted(() => fetch());
const route = useRoute();
const { t } = useI18n();
const $props = defineProps({
claimId: {
@ -30,23 +29,23 @@ function fetch() {
});
}
const detailsColumns = [
const detailsColumns = ref([
{
name: 'item',
label: 'Item',
label: t('claim.summary.details.columns.item'),
field: (row) => row.sale.itemFk,
sortable: true,
},
{
name: 'landed',
label: 'Landed',
label: t('claim.summary.details.columns.landed'),
field: (row) => row.sale.ticket.landed,
format: (value) => toDate(value),
sortable: true,
},
{
name: 'quantity',
label: 'Quantity',
label: t('claim.summary.details.columns.quantity'),
field: (row) => row.sale.quantity,
sortable: true,
},
@ -80,7 +79,7 @@ const detailsColumns = [
field: ({ sale }) => sale.quantity * sale.price * ((100 - sale.discount) / 100),
sortable: true,
},
];
]);
function stateColor(code) {
if (code === 'pending') return 'green';
@ -97,11 +96,11 @@ function stateColor(code) {
<q-list>
<q-item>
<q-item-section>
<q-item-label caption>Created</q-item-label>
<q-item-label caption>{{ t('claim.summary.created') }}</q-item-label>
<q-item-label>{{ toDate(claim.created) }}</q-item-label>
</q-item-section>
<q-item-section>
<q-item-label caption>State</q-item-label>
<q-item-label caption>{{ t('claim.summary.state') }}</q-item-label>
<q-item-label>
<q-chip :color="stateColor(claim.claimState.code)" dense>
{{ claim.claimState.description }}
@ -111,17 +110,17 @@ function stateColor(code) {
</q-item>
<q-item>
<q-item-section>
<q-item-label caption>Assigned</q-item-label>
<q-item-label caption>{{ t('claim.summary.assignedTo') }}</q-item-label>
<q-item-label>{{ claim.worker.user.nickname }}</q-item-label>
</q-item-section>
<q-item-section>
<q-item-label caption>Attended by</q-item-label>
<q-item-label caption>{{ t('claim.summary.attendedBy') }}</q-item-label>
<q-item-label>{{ claim.client.salesPersonUser.name }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
<q-card-section class="q-pa-md">
<h6>Details</h6>
<h6>{{ t('claim.summary.details.title') }}</h6>
<q-table :columns="detailsColumns" :rows="salesClaimed" flat></q-table>
</q-card-section>
<q-card-section class="q-pa-md">