verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 86 Releases Wiki Activity

ref #5417 fix filters and view #97

Merged
jorgep merged 12 commits from 5417-fixCustomerPayments into dev 2023-10-18 07:25:29 +00:00
Conversation 0 Commits 12 Files Changed 5 +165 -25
5 changed files with 165 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -20,6 +20,10 @@ const props = defineProps({
required: false,
default: null,
},
showAll: {
type: Boolean,
default: true,
},
});
const emit = defineEmits(['refresh', 'clear']);
@ -29,31 +33,34 @@ const store = arrayData.store;
const userParams = ref({});
onMounted(() => {
if (props.params) userParams.value = props.params;
const params = store.userParams;
if (Object.keys(params).length > 0) {
userParams.value = Object.assign({}, params);
if (props.params) userParams.value = JSON.parse(JSON.stringify(props.params));
if (Object.keys(store.userParams).length > 0) {
userParams.value = JSON.parse(JSON.stringify(store.userParams));
}
});
const isLoading = ref(false);
async function search() {
const params = userParams.value;
const params = JSON.parse(JSON.stringify(userParams.value));
for (const param in params) {
if (params[param] === '' || params[param] === null) {
delete userParams.value[param];
delete store.userParams[param];
}
}
isLoading.value = true;
await arrayData.addFilter({ params });
if (!props.showAll && !Object.values(params).length) store.data = [];
jorgep marked this conversation as resolved
jorgep commented 2023-10-11 08:57:59 +00:00
Review
Copy Link

Por algún motivo, no se eliminan params.from ni params.to. Solo se elimina su valor, aunque se haga el delete, en la store.userParams si que se eliminan. @alexm

Por algún motivo, no se eliminan params.from ni params.to. Solo se elimina su valor, aunque se haga el delete, en la store.userParams si que se eliminan. @alexm
isLoading.value = false;
}
async function reload() {
isLoading.value = true;
const params = Object.values(userParams.value).filter((param) => param);
jorgep commented 2023-10-11 10:36:03 +00:00
Review
Copy Link

He probado a copiar el objeto con JSON.parse pero no funciona en este caso. @alexm

He probado a copiar el objeto con JSON.parse pero no funciona en este caso. @alexm
await arrayData.fetch({ append: false });
if (!props.showAll && !params.length) store.data = [];
isLoading.value = false;
emit('refresh');
}
@ -62,6 +69,7 @@ async function clearFilters() {
userParams.value = {};
isLoading.value = true;
await arrayData.applyFilter({ params: {} });
if (!props.showAll) store.data = [];
isLoading.value = false;
emit('clear');

2
src/composables/useArrayData.js
View File

@ -136,7 +136,7 @@ export function useArrayData(key, userOptions) {
}
async function refresh() {
await fetch({ append: false });
if (Object.values(store.userParams).length) await fetch({ append: false });
jorgep marked this conversation as resolved Outdated
jgallego commented 2023-10-02 05:33:33 +00:00
Outdated
Review
Copy Link

!showAll sobraria no?

!showAll sobraria no?
}
function updateStateParams() {

51
src/pages/Customer/CustomerPayments.vue
View File

@ -110,12 +110,18 @@ function stateColor(row) {
</div>
</Teleport>
</template>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QDrawer
v-model="stateStore.rightDrawer"
side="right"
:width="256"
show-if-above
:breakpoint="1600"
>
<QScrollArea class="fit text-grey-8">
<CustomerPaymentsFilter data-key="CustomerTransactions" />
</QScrollArea>
</QDrawer>
<QPage class="column items-center q-pa-md">
<QPage class="column items-center q-pa-md customer-payments">
<div class="card-list">
<QToolbar class="q-pa-none">
<QToolbarTitle>{{ t('Web Payments') }}</QToolbarTitle>
@ -138,7 +144,7 @@ function stateColor(row) {
order="created DESC"
:limit="20"
:offset="50"
auto-load
:auto-load="!!$route?.query.params"
>
<template #body="{ rows }">
<QTable
@ -148,7 +154,7 @@ function stateColor(row) {
row-key="id"
:pagination="{ rowsPerPage: 0 }"
:grid="grid || $q.screen.lt.sm"
class="q-mt-xs"
class="q-mt-xs custom-table"
hide-pagination
>
<template #body-cell-actions="{ row }">
@ -167,6 +173,13 @@ function stateColor(row) {
</QBtn>
</QTd>
</template>
<template #body-cell-id="{ row }">
<QTd auto-width align="right">
<span>
{{ row.id }}
</span>
</QTd>
</template>
<template #body-cell-customerId="{ row }">
<QTd align="right">
<span class="link">
@ -175,6 +188,13 @@ function stateColor(row) {
</span>
</QTd>
</template>
<template #body-cell-customer="{ row }">
<QTd auto-width align="left" :title="row.customerName">
<span>
{{ row.customerName }}
</span>
</QTd>
</template>
<template #body-cell-state="{ row }">
<QTd auto-width class="text-center">
<QBadge :color="stateColor(row)">
@ -188,9 +208,9 @@ function stateColor(row) {
</template>
<template #item="{ cols, row }">
<div class="q-mb-md col-12">
<QCard>
<QCard class="q-pa-none">
<QItem class="q-pa-none items-start">
<QItemSection class="q-pa-md">
<QItemSection class="q-pa-none">
<QList>
<template
v-for="col of cols"
@ -257,10 +277,21 @@ function stateColor(row) {
</QPage>
</template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
<style lang="scss">
.customer-payments {
.card-list {
width: 100%;
max-width: 60em;
.q-table--dense .q-table th:first-child {
padding-left: 0;
}
td {
max-width: 130px;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style>

107
src/pages/Customer/CustomerPaymentsFilter.vue
View File

@ -9,10 +9,14 @@ const props = defineProps({
required: true,
},
});
function isValidNumber(value) {
return /^(\d|\d+(\.|,)?\d+)$/.test(value);
}
</script>
<template>
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
<VnFilterPanel :data-key="props.dataKey" :search-button="true" :show-all="false">
<template #tags="{ tag, formatFn }">
<div class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong>
@ -49,9 +53,99 @@ const props = defineProps({
</QItem>
<QItem>
<QItemSection>
<QInput :label="t('Amount')" v-model="params.amount" lazy-rules>
<QInput
:label="t('Amount')"
v-model="params.amount"
lazy-rules
@update:model-value="
(value) => {
if (value.includes(','))
params.amount = params.amount.replace(',', '.');
}
"
:rules="[
(val) =>
isValidNumber(val) || !val || 'Please type a number',
]"
>
<template #prepend>
<QIcon name="euro" size="sm"></QIcon>
<QIcon name="euro" size="sm" />
</template>
</QInput>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<QInput
v-model="params.from"
:label="t('From')"
mask="date"
placeholder="yyyy/mm/dd"
>
<template #append>
<QIcon name="event" class="cursor-pointer">
<QPopupProxy
cover
transition-show="scale"
transition-hide="scale"
>
<QDate v-model="params.from" landscape>
<div
class="row items-center justify-end q-gutter-sm"
>
<QBtn
:label="t('globals.cancel')"
color="primary"
flat
v-close-popup
/>
<QBtn
:label="t('globals.confirm')"
color="primary"
flat
v-close-popup
/>
</div>
</QDate>
</QPopupProxy>
</QIcon>
</template>
</QInput>
</QItemSection>
<QItemSection>
<QInput
v-model="params.to"
:label="t('To')"
mask="date"
placeholder="yyyy/mm/dd"
>
<template #append>
<QIcon name="event" class="cursor-pointer">
<QPopupProxy
cover
transition-show="scale"
transition-hide="scale"
>
<QDate v-model="params.to" landscape>
<div
class="row items-center justify-end q-gutter-sm"
>
<QBtn
:label="t('globals.cancel')"
color="primary"
flat
v-close-popup
/>
<QBtn
:label="t('globals.confirm')"
color="primary"
flat
v-close-popup
/>
</div>
</QDate>
</QPopupProxy>
</QIcon>
</template>
</QInput>
</QItemSection>
@ -67,12 +161,19 @@ en:
orderFk: Order
clientFk: Customer
amount: Amount
from: From
to: To
es:
params:
orderFk: Pedido
clientFk: Cliente
amount: Importe
from: Desde
to: Hasta
Order ID: ID pedido
Customer ID: ID cliente
Amount: Importe
Please type a number: Por favor, escriba un número
From: Desde
To: Hasta
</i18n>

10
test/cypress/integration/workerList.spec.js
View File

@ -8,18 +8,18 @@ describe('WorkerList', () => {
it('should load workers', () => {
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(0)
.should('have.text', 'victorvd');
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(1)
.should('have.text', 'JessicaJones');
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(2)
.eq(1)
.should('have.text', 'BruceBanner');
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(2)
.should('have.text', 'CharlesXavier');
});
it('should open the worker summary', () => {
cy.get('.card-list-body .actions .q-btn:nth-child(2)').eq(1).click();
cy.get('.summaryHeader div').should('have.text', '1110 - Jessica Jones');
cy.get('.summaryHeader div').should('have.text', '1109 - Bruce Banner');
cy.get('.summary .header').eq(0).invoke('text').should('include', 'Basic data');
cy.get('.summary .header').eq(1).should('have.text', 'User data');
});