Added claim & invoice out filters
gitea/salix-front/pipeline/head This commit looks good Details

This commit is contained in:
Joan Sanchez 2023-02-28 11:31:24 +01:00
parent a1f7fdfb37
commit a5f83b553b
8 changed files with 523 additions and 352 deletions

View File

@ -176,8 +176,8 @@ function formatValue(value) {
</q-item>
<q-separator />
</template>
<slot name="body" :params="userParams" :search-fn="search"></slot>
</q-list>
<slot name="body" :params="userParams" :search-fn="search"></slot>
</q-form>
<q-inner-loading
:showing="isLoading"
@ -193,4 +193,6 @@ es:
Remove filters: Eliminar filtros
Refresh: Refrescar
Search: Buscar
Yes: Si
No: No
</i18n>

View File

@ -79,6 +79,7 @@ export function useArrayData(key, userOptions) {
canceller = null;
}
function clear() {
if (arrayDataStore.get(key)) {
arrayDataStore.clear(key);

View File

@ -38,7 +38,7 @@ function setWorkers(data) {
</div>
</template>
<template #body="{ params, searchFn }">
<q-list>
<q-list dense>
<q-item>
<q-item-section>
<q-input
@ -54,7 +54,11 @@ function setWorkers(data) {
</q-item>
<q-item>
<q-item-section>
<q-input :label="t('Name')" v-model="params.name" lazy-rules />
<q-input
:label="t('Client Name')"
v-model="params.clientName"
lazy-rules
/>
</q-item-section>
</q-item>
<q-item>
@ -73,17 +77,7 @@ function setWorkers(data) {
map-options
use-input
:input-debounce="0"
>
<template #prepend>
<q-avatar color="orange" size="xs">
<q-img
v-if="params.salesPersonFk"
:src="`/api/Images/user/160x160/${params.salesPersonFk}/download?access_token=${token}`"
spinner-color="white"
/>
</q-avatar>
</template>
</q-select>
</q-item-section>
</q-item>
<q-item>
@ -106,10 +100,29 @@ function setWorkers(data) {
</q-item-section>
</q-item>
<q-item>
<q-item-section v-if="!workers">
<q-skeleton type="QInput" class="full-width" />
</q-item-section>
<q-item-section v-if="workers">
<q-select
:label="t('Responsible')"
v-model="params.claimResponsibleFk"
@update:model-value="searchFn()"
:options="workers"
option-value="id"
option-label="name"
emit-value
map-options
use-input
:input-debounce="0"
/>
</q-item-section>
</q-item>
<q-item class="q-mb-md">
<q-item-section>
<q-select
:label="t('State')"
v-model="params.stateFk"
v-model="params.claimStateFk"
@update:model-value="searchFn()"
:options="states"
option-value="id"
@ -119,6 +132,8 @@ function setWorkers(data) {
/>
</q-item-section>
</q-item>
<q-separator />
<q-expansion-item :label="t('More options')" expand-separator>
<q-item>
<q-item-section>
<q-select
@ -132,65 +147,37 @@ function setWorkers(data) {
/>
</q-item-section>
</q-item>
<q-item class="q-mb-md">
<q-item-section>
<q-input :label="t('City')" v-model="params.city" lazy-rules />
</q-item-section>
</q-item>
<q-separator />
<q-expansion-item :label="t('More options')" expand-separator>
<q-item>
<q-item-section>
<q-input
:label="t('Phone')"
v-model="params.phone"
lazy-rules
v-model="params.created"
:label="t('Created')"
autofocus
readonly
>
<template #prepend>
<q-icon name="phone" size="sm"></q-icon>
<template #append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
cover
transition-show="scale"
transition-hide="scale"
>
<q-date v-model="params.created">
<div class="row items-center justify-end">
<q-btn
v-close-popup
label="Close"
color="primary"
flat
/>
</div>
</q-date>
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
:label="t('Email')"
v-model="params.email"
lazy-rules
>
<template #prepend>
<q-icon name="email" size="sm"></q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section v-if="!zones">
<q-skeleton type="QInput" class="full-width" />
</q-item-section>
<q-item-section v-if="zones">
<q-select
:label="t('Zone')"
v-model="params.zoneFk"
@update:model-value="searchFn()"
:options="zones"
option-value="id"
option-label="name"
emit-value
map-options
/>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
:label="t('Postcode')"
v-model="params.postcode"
lazy-rules
/>
</q-item-section>
</q-item>
</q-expansion-item>
</q-list>
</template>
@ -201,59 +188,30 @@ function setWorkers(data) {
en:
params:
search: Contains
fi: FI
name: Name
socialName: Social Name
clientFk: Customer
clientName: Customer
salesPersonFk: Salesperson
provinceFk: Province
city: City
phone: Phone
email: Email
zoneFk: Zone
postcode: Postcode
attenderFk: Attender
claimResponsibleFk: Responsible
claimStateFk: State
created: Created
es:
params:
search: Contiene
fi: NIF
name: Nombre
socialName: Razón Social
clientFk: Cliente
clientName: Cliente
salesPersonFk: Comercial
provinceFk: Provincia
city: Ciudad
phone: Teléfono
email: Email
zoneFk: Zona
postcode: CP
FI: NIF
Name: Nombre
Social Name: Razón social
attenderFk: Asistente
claimResponsibleFk: Responsable
claimStateFk: Estado
created: Creada
Customer ID: ID cliente
Client Name: Nombre del cliente
Salesperson: Comercial
Province: Provincia
City: Ciudad
Attender: Asistente
Responsible: Responsable
State: Estado
Item: Artículo
Created: Creada
More options: Más opciones
Phone: Teléfono
Email: Email
Zone: Zona
Postcode: Código postal
</i18n>
<!-- <i18n>
{
"en": {
"fi": "Fiscal ID",
"name": "Name",
"socialName": "Social Name",
"salesPersonFk": "Salesperson",
"provinceFk": "Province",
"city": "City",
"zoneFk": "Zone",
"postcode": "Postcode"
},
"es": {
"fi": "NIF",
"name": "Nombre",
"socialName": "Razón social",
"salesPersonFk": "Comercial"
}
}
</i18n> -->

View File

@ -59,9 +59,6 @@ function viewSummary(id) {
<q-item-section class="q-pa-md" @click="navigate(row.id)">
<div class="text-h6 link">
{{ row.clientName }}
<q-popup-proxy>
<customer-descriptor-popover :customer="row.client" />
</q-popup-proxy>
</div>
<q-item-label caption>#{{ row.id }}</q-item-label>
<q-list>
@ -154,7 +151,7 @@ function viewSummary(id) {
{{ t('components.smartCard.viewDescription') }}
</q-tooltip>
<q-popup-proxy>
<customer-descriptor-popover :customer="row.client" />
<CustomerDescriptorPopover :id="row.clientFk" />
</q-popup-proxy>
</q-btn>
</q-card-actions>

View File

@ -40,7 +40,7 @@ function setWorkers(data) {
</div>
</template>
<template #body="{ params, searchFn }">
<q-list>
<q-list dense>
<q-item>
<q-item-section>
<q-input :label="t('FI')" v-model="params.fi" lazy-rules>
@ -214,24 +214,3 @@ es:
Zone: Zona
Postcode: Código postal
</i18n>
<!-- <i18n>
{
"en": {
"fi": "Fiscal ID",
"name": "Name",
"socialName": "Social Name",
"salesPersonFk": "Salesperson",
"provinceFk": "Province",
"city": "City",
"zoneFk": "Zone",
"postcode": "Postcode"
},
"es": {
"fi": "NIF",
"name": "Nombre",
"socialName": "Razón social",
"salesPersonFk": "Comercial"
}
}
</i18n> -->

View File

@ -0,0 +1,246 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
const { t } = useI18n();
const props = defineProps({
dataKey: {
type: String,
required: true,
},
});
const workers = ref();
const workersCopy = ref();
const states = ref();
function setWorkers(data) {
workers.value = data;
workersCopy.value = data;
}
</script>
<template>
<fetch-data url="ClaimStates" @on-fetch="(data) => (states = data)" auto-load />
<fetch-data
url="Workers/activeWithInheritedRole"
:filter="{ where: { role: 'salesPerson' } }"
@on-fetch="setWorkers"
auto-load
/>
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
<template #tags="{ tag, formatFn }">
<div class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong>
<span>{{ formatFn(tag.value) }}</span>
</div>
</template>
<template #body="{ params, searchFn }">
<q-list dense>
<q-item>
<q-item-section>
<q-input
:label="t('Customer ID')"
v-model="params.clientFk"
lazy-rules
>
<template #prepend>
<q-icon name="vn:client" size="sm"></q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input :label="t('FI')" v-model="params.fi" lazy-rules>
<template #prepend>
<q-icon name="badge" size="sm"></q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input :label="t('Amount')" v-model="params.amount" lazy-rules>
<template #prepend>
<q-icon name="euro" size="sm"></q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
:label="t('Min')"
type="number"
v-model.number="params.min"
lazy-rules
>
<template #prepend>
<q-icon name="euro" size="sm"></q-icon>
</template>
</q-input>
</q-item-section>
<q-item-section>
<q-input
:label="t('Max')"
type="number"
v-model.number="params.max"
lazy-rules
>
<template #prepend>
<q-icon name="euro" size="sm"></q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item class="q-mb-md">
<q-item-section>
<q-checkbox
v-model="params.hasPdf"
@update:model-value="searchFn()"
:label="t('Has PDF')"
toggle-indeterminate
/>
</q-item-section>
</q-item>
<q-separator />
<q-expansion-item :label="t('More options')" expand-separator>
<q-item>
<q-item-section>
<q-input
:label="t('Issued')"
v-model="params.issued"
@update:model-value="searchFn()"
type="date"
stack-label
>
<template #append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
cover
transition-show="scale"
transition-hide="scale"
>
<q-date v-model="params.issued">
<div class="row items-center justify-end">
<q-btn
v-close-popup
label="Close"
color="primary"
flat
/>
</div>
</q-date>
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
:label="t('Created')"
v-model="params.created"
@update:model-value="searchFn()"
type="date"
stack-label
>
<template #append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
cover
transition-show="scale"
transition-hide="scale"
>
<q-date v-model="params.created">
<div class="row items-center justify-end">
<q-btn
v-close-popup
label="Close"
color="primary"
flat
/>
</div>
</q-date>
</q-popup-proxy>
</q-icon>
</template>
</q-input>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
:label="t('Dued')"
v-model="params.dued"
@update:model-value="searchFn()"
type="date"
stack-label
>
<!-- <template #append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
cover
transition-show="scale"
transition-hide="scale"
>
<q-date v-model="params.dued">
<div class="row items-center justify-end">
<q-btn
v-close-popup
label="Close"
color="primary"
flat
/>
</div>
</q-date>
</q-popup-proxy>
</q-icon>
</template> -->
</q-input>
</q-item-section>
</q-item>
</q-expansion-item>
</q-list>
</template>
</VnFilterPanel>
</template>
<i18n>
en:
params:
search: Contains
clientFk: Customer
fi: FI
amount: Amount
max: Max
min: Min
hasPdf: Has PDF
issued: Issued
created: Created
dued: Dued
es:
params:
search: Contiene
clientFk: Cliente
fi: CIF
amount: Importe
max: Max
min: Min
hasPdf: Tiene PDF
issued: Emitida
created: Creada
dued: Vencida
Customer ID: ID cliente
FI: CIF
Amount: Importe
Has PDF: Tiene PDF
Issued: Fecha emisión
Created: Fecha creación
Dued: Fecha vencimiento
More options: Más opciones
</i18n>

View File

@ -1,18 +1,24 @@
<script setup>
import { onMounted, onUnmounted } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import { useQuasar } from 'quasar';
import { useStateStore } from 'stores/useStateStore';
import Paginate from 'src/components/PaginateData.vue';
import InvoiceOutSummaryDialog from './Card/InvoiceOutSummaryDialog.vue';
import { toDate, toCurrency } from 'src/filters/index';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import TeleportSlot from 'components/ui/TeleportSlot.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import InvoiceOutFilter from './InvoiceOutFilter.vue';
const state = useStateStore();
const router = useRouter();
const quasar = useQuasar();
const { t } = useI18n();
onMounted(() => state.toggleRightDrawer());
onUnmounted(() => state.toggleRightDrawer());
function navigate(id) {
router.push({ path: `/invoiceOut/${id}` });
}
@ -34,6 +40,9 @@ function viewSummary(id) {
:label="t('Search by invoice id or reference')"
/>
</teleport-slot>
<teleport-slot to="#rightPanel">
<InvoiceOutFilter data-key="InvoiceOutList" />
</teleport-slot>
<q-page class="q-pa-md">
<paginate
data-key="InvoiceOutList"

View File

@ -38,27 +38,26 @@ const warehouses = ref([]);
</div>
</template>
<template #body="{ params, searchFn }">
<q-list dense>
<q-item>
<q-item-section>
<q-input
v-model="params.clientFk"
:label="t('Customer ID')"
lazy-rules
autofocus
/>
</q-item-section>
<q-item-section>
<q-input v-model="params.orderFk" :label="t('Order ID')" lazy-rules />
<q-input
v-model="params.orderFk"
:label="t('Order ID')"
lazy-rules
/>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
v-model="params.dateFrom"
:label="t('From')"
autofocus
readonly
>
<q-input v-model="params.dateFrom" :label="t('From')" readonly>
<template #append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
@ -82,7 +81,7 @@ const warehouses = ref([]);
</q-input>
</q-item-section>
<q-item-section>
<q-input v-model="params.dateTo" :label="t('To')" autofocus readonly>
<q-input v-model="params.dateTo" :label="t('To')" readonly>
<template #append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy
@ -245,6 +244,7 @@ const warehouses = ref([]);
</q-item-section>
</q-item>
</q-expansion-item>
</q-list>
</template>
</VnFilterPanel>
</template>
@ -300,24 +300,3 @@ es:
Yes: Si
No: No
</i18n>
<!-- <i18n>
{
"en": {
"search": "Contains",
"clientFk": 'Customer',
"orderFk": 'Order',
"dateFrom": 'From',
"dateTo": 'To',
"salesPersonFk": "Sales Person"
},
"es": {
"search": "Contiene",
"clientFk": 'Cliente',
"orderFk": 'Pedido',
"dateFrom": 'Desde',
"dateTo": 'Hasta',
"salesPersonFk": "Comercial"
}
}
</i18n> -->