wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Translations & fixes

This commit is contained in:
Joan Sanchez 2023-02-23 15:01:40 +01:00
parent 42cef8ff0b
commit 48c4eccc08
10 changed files with 178 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/ui/VnFilterPanel.vue
View File

@ -29,6 +29,7 @@ onMounted(() => {
} }
}); });
const isLoading = ref(false);
async function search() { async function search() {
const params = userParams.value; const params = userParams.value;
for (const param in params) { for (const param in params) {
@ -38,18 +39,23 @@ async function search() {
} }
} }
isLoading.value = true;
await arrayData.addFilter({ params }); await arrayData.addFilter({ params });
isLoading.value = false;
} }
async function reload() { async function reload() {
isLoading.value = true;
await arrayData.fetch({ append: false }); await arrayData.fetch({ append: false });
isLoading.value = false;
emit('refresh'); emit('refresh');
} }
async function clearFilters() { async function clearFilters() {
userParams.value = {}; userParams.value = {};
isLoading.value = true;
await arrayData.applyFilter({ params: {} }); await arrayData.applyFilter({ params: {} });
await reload(); isLoading.value = false;
emit('clear'); emit('clear');
} }
@ -74,7 +80,7 @@ async function remove(key) {
} }
</script> </script>
<template> <template>
<q-form @submit="search" @keyup.enter="search"> <q-form @submit="search">
<q-list dense> <q-list dense>
<q-item class="q-mt-xs"> <q-item class="q-mt-xs">
<q-item-section top> <q-item-section top>
@ -160,13 +166,18 @@ async function remove(key) {
<slot name="body" :params="userParams" :search-fn="search"></slot> <slot name="body" :params="userParams" :search-fn="search"></slot>
</q-list> </q-list>
</q-form> </q-form>
<q-inner-loading
:showing="isLoading"
:label="t('globals.pleaseWait')"
color="primary"
/>
</template> </template>
<i18n> <i18n>
es: es:
You didn't enter any filter: No has introducido ningún filtro You didn't enter any filter: No has introducido ningún filtro
Applied filters: Filtros aplicados Applied filters: Filtros aplicados
Remove filters: Eliminar filtros Remove filters: Eliminar filtros
Refresh: Refrescar Refresh: Refrescar
Search: Buscar Search: Buscar
</i18n> </i18n>

2
src/components/ui/VnSearchbar.vue
View File

@ -24,7 +24,7 @@ const router = useRouter();
const route = useRoute(); const route = useRoute();
const arrayData = useArrayData(props.dataKey); const arrayData = useArrayData(props.dataKey);
const store = arrayData.store; const store = arrayData.store;
const searchText = ref(); const searchText = ref('');
onMounted(() => { onMounted(() => {
const params = store.userParams; const params = store.userParams;

49
src/composables/useArrayData.js
View File

@ -16,6 +16,7 @@ export function useArrayData(key, userOptions) {
const hasMoreData = ref(false); const hasMoreData = ref(false);
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
let canceller = null;
const page = ref(1); const page = ref(1);
@ -48,6 +49,9 @@ export function useArrayData(key, userOptions) {
async function fetch({ append = false }) { async function fetch({ append = false }) {
if (!store.url) return; if (!store.url) return;
cancelRequest();
canceller = new AbortController();
const filter = { const filter = {
order: store.order, order: store.order,
limit: store.limit, limit: store.limit,
@ -65,7 +69,10 @@ export function useArrayData(key, userOptions) {
Object.assign(params, store.userParams); Object.assign(params, store.userParams);
const response = await axios.get(store.url, { params }); const response = await axios.get(store.url, {
signal: canceller.signal,
params,
});
const { limit } = filter; const { limit } = filter;
@ -80,25 +87,34 @@ export function useArrayData(key, userOptions) {
updateStateParams(); updateStateParams();
} }
canceller = null;
} }
async function request({ userFilter }) { function cancelRequest() {
if (!store.url) return; if (canceller) {
canceller.abort();
const filter = { canceller = null;
order: store.order, }
limit: store.limit,
skip: store.skip,
};
Object.assign(filter, userFilter);
const requestOptions = { params: { filter: filter } };
const response = await axios.get(store.url, requestOptions);
return response.data;
} }
// async function request({ userFilter }) {
// if (!store.url) return;
// const filter = {
// order: store.order,
// limit: store.limit,
// skip: store.skip,
// };
// Object.assign(filter, userFilter);
// const requestOptions = { params: { filter: filter } };
// const response = await axios.get(store.url, requestOptions);
// return response.data;
// }
async function applyFilter({ filter, params }) { async function applyFilter({ filter, params }) {
if (filter) store.userFilter = filter; if (filter) store.userFilter = filter;
if (params) store.userParams = Object.assign({}, params); if (params) store.userParams = Object.assign({}, params);
@ -145,7 +161,6 @@ export function useArrayData(key, userOptions) {
applyFilter, applyFilter,
addFilter, addFilter,
refresh, refresh,
request,
loadMore, loadMore,
store, store,
hasMoreData, hasMoreData,

10
src/filters/toDate.js
View File

@ -3,10 +3,14 @@ import { useI18n } from 'vue-i18n';
export default function (value, options = {}) { export default function (value, options = {}) {
if (!value) return; if (!value) return;
if (!options.dateStyle) options.dateStyle = 'short'; if (!options.dateStyle) {
options.day = '2-digit';
options.month = '2-digit';
options.year = 'numeric';
}
const { locale } = useI18n(); const { locale } = useI18n();
const date = new Date(value); const date = new Date(value);
return new Intl.DateTimeFormat(locale.value, options).format(date) return new Intl.DateTimeFormat(locale.value, options).format(date);
} }

15
src/pages/Customer/Card/CustomerCard.vue
View File

@ -11,7 +11,10 @@ const { t } = useI18n();
</script> </script>
<template> <template>
<teleport-slot to="#searchbar"> <teleport-slot to="#searchbar">
<VnSearchbar data-key="CustomerList" :label="t('searchLabel')" /> <VnSearchbar
data-key="CustomerList"
:label="t('Search by customer id or name')"
/>
</teleport-slot> </teleport-slot>
<q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500"> <q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
<q-scroll-area class="fit"> <q-scroll-area class="fit">
@ -28,12 +31,6 @@ const { t } = useI18n();
</template> </template>
<i18n> <i18n>
{ es:
"en": { Search by customer id or name: Buscar por id o nombre del cliente
"searchLabel": "Search by customer id or name"
},
"es": {
"searchLabel": "Buscar por id o nombre del cliente"
}
}
</i18n> </i18n>

68
src/pages/Customer/CustomerFilter.vue
View File

@ -177,40 +177,42 @@ function setWorkers(data) {
<i18n> <i18n>
en: en:
params: params:
fi: FI search: Contains
name: Name fi: FI
socialName: Social Name name: Name
salesPersonFk: Salesperson socialName: Social Name
provinceFk: Province salesPersonFk: Salesperson
city: City provinceFk: Province
phone: Phone city: City
email: Email phone: Phone
zoneFk: Zone email: Email
postcode: Postcode zoneFk: Zone
postcode: Postcode
es: es:
params: params:
fi: NIF search: Contiene
name: Nombre fi: NIF
socialName: Razón Social name: Nombre
salesPersonFk: Comercial socialName: Razón Social
provinceFk: Provincia salesPersonFk: Comercial
city: Ciudad provinceFk: Provincia
phone: Teléfono city: Ciudad
email: Email phone: Teléfono
zoneFk: Zona email: Email
postcode: CP zoneFk: Zona
FI: NIF postcode: CP
Name: Nombre FI: NIF
Social Name: Razón social Name: Nombre
Salesperson: Comercial Social Name: Razón social
Province: Provincia Salesperson: Comercial
City: Ciudad Province: Provincia
More options: Más opciones City: Ciudad
Phone: Teléfono More options: Más opciones
Email: Email Phone: Teléfono
Zone: Zona Email: Email
Postcode: Código postal Zone: Zona
Postcode: Código postal
</i18n> </i18n>
<!-- <i18n> <!-- <i18n>

33
src/pages/Customer/CustomerList.vue
View File

@ -35,7 +35,10 @@ function viewSummary(id) {
<template> <template>
<teleport-slot to="#searchbar"> <teleport-slot to="#searchbar">
<VnSearchbar data-key="CustomerList" :label="t('searchLabel')" /> <VnSearchbar
data-key="CustomerList"
:label="t('Search by customer id or name')"
/>
</teleport-slot> </teleport-slot>
<teleport-slot to="#rightPanel"> <teleport-slot to="#rightPanel">
<CustomerFilter data-key="CustomerList" /> <CustomerFilter data-key="CustomerList" />
@ -64,9 +67,9 @@ function viewSummary(id) {
</q-item> </q-item>
<q-item class="q-pa-none"> <q-item class="q-pa-none">
<q-item-section> <q-item-section>
<q-item-label caption>{{ <q-item-label caption>
t('customer.list.phone') {{ t('customer.list.phone') }}
}}</q-item-label> </q-item-label>
<q-item-label>{{ row.phone }}</q-item-label> <q-item-label>{{ row.phone }}</q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>
@ -101,9 +104,9 @@ function viewSummary(id) {
icon="arrow_circle_right" icon="arrow_circle_right"
@click="navigate(row.id)" @click="navigate(row.id)"
> >
<q-tooltip>{{ <q-tooltip>
t('components.smartCard.openCard') {{ t('components.smartCard.openCard') }}
}}</q-tooltip> </q-tooltip>
</q-btn> </q-btn>
<q-btn <q-btn
flat flat
@ -112,9 +115,9 @@ function viewSummary(id) {
icon="preview" icon="preview"
@click="viewSummary(row.id)" @click="viewSummary(row.id)"
> >
<q-tooltip>{{ <q-tooltip>
t('components.smartCard.openSummary') {{ t('components.smartCard.openSummary') }}
}}</q-tooltip> </q-tooltip>
</q-btn> </q-btn>
<!-- <q-btn flat round color="grey-7" icon="vn:ticket"> <!-- <q-btn flat round color="grey-7" icon="vn:ticket">
<q-tooltip>{{ t('customer.list.customerOrders') }}</q-tooltip> <q-tooltip>{{ t('customer.list.customerOrders') }}</q-tooltip>
@ -128,12 +131,6 @@ function viewSummary(id) {
</template> </template>
<i18n> <i18n>
{ es:
"en": { Search by customer id or name: Buscar por id o nombre del cliente
"searchLabel": "Search by customer id or name"
},
"es": {
"searchLabel": "Buscar por id o nombre del cliente"
}
}
</i18n> </i18n>

9
src/pages/Ticket/Card/TicketCard.vue
View File

@ -1,4 +1,5 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n';
import { useState } from 'src/composables/useState'; import { useState } from 'src/composables/useState';
import TicketDescriptor from './TicketDescriptor.vue'; import TicketDescriptor from './TicketDescriptor.vue';
import LeftMenu from 'components/LeftMenu.vue'; import LeftMenu from 'components/LeftMenu.vue';
@ -6,10 +7,11 @@ import TeleportSlot from 'components/ui/TeleportSlot.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
const state = useState(); const state = useState();
const { t } = useI18n();
</script> </script>
<template> <template>
<teleport-slot to="#searchbar"> <teleport-slot to="#searchbar">
<VnSearchbar data-key="TicketList" /> <VnSearchbar data-key="TicketList" :label="t('Search by ticket id or alias')" />
</teleport-slot> </teleport-slot>
<q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500"> <q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
<q-scroll-area class="fit"> <q-scroll-area class="fit">
@ -53,3 +55,8 @@ const state = useState();
} }
} }
</style> </style>
<i18n>
es:
Search by ticket id or alias: Buscar por id o nombre del ticket
</i18n>

85
src/pages/Ticket/TicketFilter.vue
View File

@ -3,6 +3,7 @@ import { ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue'; import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import toDate from 'filters/toDate';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -25,11 +26,15 @@ function setWorkers(data) {
} }
function formatValue(value) { function formatValue(value) {
console.log(value instanceof Boolean); console.log(typeof value);
if (typeof value === 'boolean') { if (typeof value === 'boolean') {
return value ? t('Yes') : t('No'); return value ? t('Yes') : t('No');
} }
//if (value)
if (isNaN(value) && !isNaN(Date.parse(value))) {
return toDate(value);
}
return `"${value}"`; return `"${value}"`;
} }
</script> </script>
@ -161,7 +166,7 @@ function formatValue(value) {
<q-item-section> <q-item-section>
<q-input <q-input
v-model="params.refFk" v-model="params.refFk"
:label="t('Invoice Out')" :label="t('Invoice Ref.')"
lazy-rules lazy-rules
/> />
</q-item-section> </q-item-section>
@ -262,39 +267,49 @@ function formatValue(value) {
en: en:
params: params:
search: Contains search: Contains
clientFk: Customer
orderFK: Order
dateFrom: From
dateTo: To
salesPersonFk: Salesperson
stateFk: State
refFk: Invoice Ref.
myTeam: My team
pending: Pending
hasInvoice: Invoiced
hasRoute: Routed
es: es:
params: params:
search: Contiene search: Contiene
clientFk: Cliente clientFk: Cliente
orderFK: Pedido orderFK: Pedido
dateFrom: Desde dateFrom: Desde
dateTo: Hasta dateTo: Hasta
salesPersonFk: Comercial salesPersonFk: Comercial
stateFk: Estado stateFk: Estado
refFk: Ref. Factura refFk: Ref. Factura
myTeam: Mi equipo myTeam: Mi equipo
pending: Pendiente pending: Pendiente
hasInvoice: Facturado hasInvoice: Facturado
hasRoute: Enrutado hasRoute: Enrutado
Customer ID: ID Cliente Customer ID: ID Cliente
Order ID: ID Pedido Order ID: ID Pedido
From: Desde From: Desde
To: Hasta To: Hasta
Salesperson: Comercial Salesperson: Comercial
State: Estado State: Estado
Invoice Out: Ref. Factura Invoice Ref.: Ref. Factura
My team: Mi equipo My team: Mi equipo
Pending: Pendiente Pending: Pendiente
With problems: Con problemas With problems: Con problemas
Invoiced: Facturado Invoiced: Facturado
Routed: Enrutado Routed: Enrutado
More options: Más opciones More options: Más opciones
Province: Provincia Province: Provincia
Agency: Agencia Agency: Agencia
Warehouse: Almacén Warehouse: Almacén
Yes: Si
Yes: Si No: No
No: No
</i18n> </i18n>
<!-- <i18n> <!-- <i18n>

7
src/pages/Ticket/TicketList.vue
View File

@ -72,7 +72,7 @@ function viewSummary(id) {
<template> <template>
<teleport-slot to="#searchbar"> <teleport-slot to="#searchbar">
<VnSearchbar data-key="TicketList" label="Search by ticket id or alias" /> <VnSearchbar data-key="TicketList" :label="t('Search by ticket id or alias')" />
</teleport-slot> </teleport-slot>
<teleport-slot to="#rightPanel"> <teleport-slot to="#rightPanel">
<TicketFilter data-key="TicketList" /> <TicketFilter data-key="TicketList" />
@ -187,3 +187,8 @@ function viewSummary(id) {
</paginate> </paginate>
</q-page> </q-page>
</template> </template>
<i18n>
es:
Search by ticket id or alias: Buscar por id o nombre del ticket
</i18n>