Updated filter panels
This commit is contained in:
parent
a5f83b553b
commit
2000081a61
|
|
@ -13,13 +13,7 @@ const props = defineProps({
|
|||
});
|
||||
|
||||
const workers = ref();
|
||||
const workersCopy = ref();
|
||||
const states = ref();
|
||||
|
||||
function setWorkers(data) {
|
||||
workers.value = data;
|
||||
workersCopy.value = data;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -27,7 +21,7 @@ function setWorkers(data) {
|
|||
<fetch-data
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
@on-fetch="setWorkers"
|
||||
@on-fetch="(data) => (workers = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
|
|
@ -119,7 +113,10 @@ function setWorkers(data) {
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item class="q-mb-md">
|
||||
<q-item-section>
|
||||
<q-item-section v-if="!states">
|
||||
<q-skeleton type="QInput" class="full-width" />
|
||||
</q-item-section>
|
||||
<q-item-section v-if="states">
|
||||
<q-select
|
||||
:label="t('State')"
|
||||
v-model="params.claimStateFk"
|
||||
|
|
@ -134,19 +131,22 @@ function setWorkers(data) {
|
|||
</q-item>
|
||||
<q-separator />
|
||||
<q-expansion-item :label="t('More options')" expand-separator>
|
||||
<q-item>
|
||||
<!-- <q-item>
|
||||
<q-item-section>
|
||||
<q-select
|
||||
:label="t('Item')"
|
||||
v-model="params.itemFk"
|
||||
:options="items"
|
||||
:loading="loading"
|
||||
@filter="filterFn"
|
||||
@virtual-scroll="onScroll"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-item> -->
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-input
|
||||
|
|
|
|||
|
|
@ -14,13 +14,7 @@ const props = defineProps({
|
|||
|
||||
const provinces = ref();
|
||||
const workers = ref();
|
||||
const workersCopy = ref();
|
||||
const zones = ref();
|
||||
|
||||
function setWorkers(data) {
|
||||
workers.value = data;
|
||||
workersCopy.value = data;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -29,7 +23,7 @@ function setWorkers(data) {
|
|||
<fetch-data
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
@on-fetch="setWorkers"
|
||||
@on-fetch="(data) => (workers = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
|
|
@ -80,17 +74,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>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ const { t } = useI18n();
|
|||
<teleport-slot to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="InvoiceOutList"
|
||||
:label="t('Search by invoice id or reference')"
|
||||
:label="t('Search by invoice reference')"
|
||||
/>
|
||||
</teleport-slot>
|
||||
<q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
|
||||
|
|
@ -32,5 +32,5 @@ const { t } = useI18n();
|
|||
|
||||
<i18n>
|
||||
es:
|
||||
Search by invoice id or reference: Buscar por id o referencia de la factura
|
||||
Search by invoice reference: Buscar referencia de la factura
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -113,9 +113,7 @@ function setWorkers(data) {
|
|||
<q-input
|
||||
:label="t('Issued')"
|
||||
v-model="params.issued"
|
||||
@update:model-value="searchFn()"
|
||||
type="date"
|
||||
stack-label
|
||||
mask="date"
|
||||
>
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
|
|
@ -124,13 +122,22 @@ function setWorkers(data) {
|
|||
transition-show="scale"
|
||||
transition-hide="scale"
|
||||
>
|
||||
<q-date v-model="params.issued">
|
||||
<div class="row items-center justify-end">
|
||||
<q-date v-model="params.issued" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
<q-btn
|
||||
v-close-popup
|
||||
label="Close"
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</q-date>
|
||||
|
|
@ -145,9 +152,7 @@ function setWorkers(data) {
|
|||
<q-input
|
||||
:label="t('Created')"
|
||||
v-model="params.created"
|
||||
@update:model-value="searchFn()"
|
||||
type="date"
|
||||
stack-label
|
||||
mask="date"
|
||||
>
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
|
|
@ -156,13 +161,22 @@ function setWorkers(data) {
|
|||
transition-show="scale"
|
||||
transition-hide="scale"
|
||||
>
|
||||
<q-date v-model="params.created">
|
||||
<div class="row items-center justify-end">
|
||||
<q-date v-model="params.created" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
<q-btn
|
||||
v-close-popup
|
||||
label="Close"
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</q-date>
|
||||
|
|
@ -174,33 +188,36 @@ function setWorkers(data) {
|
|||
</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-input :label="t('Dued')" v-model="params.dued" mask="date">
|
||||
<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-date v-model="params.dued" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
<q-btn
|
||||
v-close-popup
|
||||
label="Close"
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</q-date>
|
||||
</q-popup-proxy>
|
||||
</q-icon>
|
||||
</template> -->
|
||||
</template>
|
||||
</q-input>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
|
@ -217,8 +234,8 @@ en:
|
|||
clientFk: Customer
|
||||
fi: FI
|
||||
amount: Amount
|
||||
max: Max
|
||||
min: Min
|
||||
max: Max
|
||||
hasPdf: Has PDF
|
||||
issued: Issued
|
||||
created: Created
|
||||
|
|
@ -229,8 +246,8 @@ es:
|
|||
clientFk: Cliente
|
||||
fi: CIF
|
||||
amount: Importe
|
||||
max: Max
|
||||
min: Min
|
||||
max: Max
|
||||
hasPdf: Tiene PDF
|
||||
issued: Emitida
|
||||
created: Creada
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ function viewSummary(id) {
|
|||
<teleport-slot to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="InvoiceOutList"
|
||||
:label="t('Search by invoice id or reference')"
|
||||
:label="t('Search by invoice reference')"
|
||||
/>
|
||||
</teleport-slot>
|
||||
<teleport-slot to="#rightPanel">
|
||||
|
|
@ -149,5 +149,5 @@ function viewSummary(id) {
|
|||
|
||||
<i18n>
|
||||
es:
|
||||
Search by invoice id or reference: Buscar por id o referencia de la factura
|
||||
Search by invoice reference: Buscar por referencia de la factura
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -12,11 +12,11 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const workers = ref([]);
|
||||
const provinces = ref([]);
|
||||
const states = ref([]);
|
||||
const agencies = ref([]);
|
||||
const warehouses = ref([]);
|
||||
const workers = ref();
|
||||
const provinces = ref();
|
||||
const states = ref();
|
||||
const agencies = ref();
|
||||
const warehouses = ref();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -27,7 +27,7 @@ const warehouses = ref([]);
|
|||
<fetch-data
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
@on-fetch="setWorkers"
|
||||
@on-fetch="(data) => (workers = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
|
|
@ -57,7 +57,7 @@ const warehouses = ref([]);
|
|||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-input v-model="params.dateFrom" :label="t('From')" readonly>
|
||||
<q-input v-model="params.dateFrom" :label="t('From')" mask="date">
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
<q-popup-proxy
|
||||
|
|
@ -65,13 +65,22 @@ const warehouses = ref([]);
|
|||
transition-show="scale"
|
||||
transition-hide="scale"
|
||||
>
|
||||
<q-date v-model="params.dateFrom">
|
||||
<div class="row items-center justify-end">
|
||||
<q-date v-model="params.dateFrom" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
<q-btn
|
||||
v-close-popup
|
||||
label="Close"
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</q-date>
|
||||
|
|
@ -81,7 +90,7 @@ const warehouses = ref([]);
|
|||
</q-input>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-input v-model="params.dateTo" :label="t('To')" readonly>
|
||||
<q-input v-model="params.dateTo" :label="t('To')" mask="date">
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
<q-popup-proxy
|
||||
|
|
@ -89,13 +98,22 @@ const warehouses = ref([]);
|
|||
transition-show="scale"
|
||||
transition-hide="scale"
|
||||
>
|
||||
<q-date v-model="params.dateTo">
|
||||
<div class="row items-center justify-end">
|
||||
<q-date v-model="params.dateTo" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
<q-btn
|
||||
v-close-popup
|
||||
label="Close"
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</q-date>
|
||||
|
|
@ -106,7 +124,10 @@ const warehouses = ref([]);
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<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('Salesperson')"
|
||||
v-model="params.salesPersonFk"
|
||||
|
|
@ -117,21 +138,14 @@ const warehouses = ref([]);
|
|||
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>
|
||||
<q-item-section>
|
||||
<q-item-section v-if="!states">
|
||||
<q-skeleton type="QInput" class="full-width" />
|
||||
</q-item-section>
|
||||
<q-item-section v-if="states">
|
||||
<q-select
|
||||
:label="t('State')"
|
||||
v-model="params.stateFk"
|
||||
|
|
@ -202,7 +216,10 @@ const warehouses = ref([]);
|
|||
<q-separator />
|
||||
<q-expansion-item :label="t('More options')" expand-separator>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-section v-if="!provinces">
|
||||
<q-skeleton type="QInput" class="full-width" />
|
||||
</q-item-section>
|
||||
<q-item-section v-if="provinces">
|
||||
<q-select
|
||||
:label="t('Province')"
|
||||
v-model="params.provinceFk"
|
||||
|
|
@ -216,7 +233,10 @@ const warehouses = ref([]);
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-section v-if="!states">
|
||||
<q-skeleton type="QInput" class="full-width" />
|
||||
</q-item-section>
|
||||
<q-item-section v-if="!states">
|
||||
<q-select
|
||||
:label="t('Agency')"
|
||||
v-model="params.agencyModeFk"
|
||||
|
|
@ -230,7 +250,10 @@ const warehouses = ref([]);
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-section v-if="!warehouses">
|
||||
<q-skeleton type="QInput" class="full-width" />
|
||||
</q-item-section>
|
||||
<q-item-section v-if="warehouses">
|
||||
<q-select
|
||||
:label="t('Warehouse')"
|
||||
v-model="params.warehouseFk"
|
||||
|
|
|
|||
Loading…
Reference in New Issue