forked from verdnatura/salix-front
more filters adaptations
This commit is contained in:
parent
b3e0f4979a
commit
d369ce7152
|
@ -36,7 +36,7 @@ const states = ref();
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #body="{ params, searchFn }">
|
<template #body="{ params, searchFn }">
|
||||||
<QList dense style="max-width: 256px" class="list">
|
<QList dense class="list">
|
||||||
<QItem class="q-my-sm">
|
<QItem class="q-my-sm">
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<VnInput
|
<VnInput
|
||||||
|
@ -184,6 +184,9 @@ const states = ref();
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.list {
|
||||||
|
width: 256px;
|
||||||
|
}
|
||||||
.list * {
|
.list * {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -37,7 +37,7 @@ const zones = ref();
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #body="{ params, searchFn }">
|
<template #body="{ params, searchFn }">
|
||||||
<QList dense style="max-width: 256px" class="list">
|
<QList dense class="list">
|
||||||
<QItem class="q-my-sm">
|
<QItem class="q-my-sm">
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<VnInput :label="t('FI')" v-model="params.fi" is-outlined>
|
<VnInput :label="t('FI')" v-model="params.fi" is-outlined>
|
||||||
|
@ -176,6 +176,9 @@ const zones = ref();
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.list {
|
||||||
|
width: 256px;
|
||||||
|
}
|
||||||
.list * {
|
.list * {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,9 +1,12 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
||||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'components/FetchData.vue';
|
||||||
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
|
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
@ -33,28 +36,32 @@ const suppliersRef = ref();
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #body="{ params, searchFn }">
|
<template #body="{ params, searchFn }">
|
||||||
<QList dense>
|
<QList dense class="list q-gutter-y-sm q-mt-sm">
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput :label="t('Id or Supplier')" v-model="params.search">
|
<VnInput
|
||||||
|
:label="t('Id or Supplier')"
|
||||||
|
v-model="params.search"
|
||||||
|
is-outlined
|
||||||
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="badge" size="sm"></QIcon>
|
<QIcon name="badge" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput
|
<VnInput
|
||||||
:label="t('params.supplierRef')"
|
:label="t('params.supplierRef')"
|
||||||
v-model="params.supplierRef"
|
v-model="params.supplierRef"
|
||||||
@input.
|
is-outlined
|
||||||
lazy-rules
|
lazy-rules
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="vn:client" size="sm"></QIcon>
|
<QIcon name="vn:client" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
|
@ -66,52 +73,67 @@ const suppliersRef = ref();
|
||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="nickname"
|
option-label="nickname"
|
||||||
@input-value="suppliersRef.fetch()"
|
@input-value="suppliersRef.fetch()"
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
rounded
|
||||||
>
|
>
|
||||||
</VnSelectFilter>
|
</VnSelectFilter>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput :label="t('params.fi')" v-model="params.fi" lazy-rules>
|
<VnInput
|
||||||
|
:label="t('params.fi')"
|
||||||
|
v-model="params.fi"
|
||||||
|
is-outlined
|
||||||
|
lazy-rules
|
||||||
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="badge" size="sm"></QIcon>
|
<QIcon name="badge" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput
|
<VnInput
|
||||||
:label="t('params.serialNumber')"
|
:label="t('params.serialNumber')"
|
||||||
v-model="params.serialNumber"
|
v-model="params.serialNumber"
|
||||||
|
is-outlined
|
||||||
lazy-rules
|
lazy-rules
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="badge" size="sm"></QIcon>
|
<QIcon name="badge" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput
|
<VnInput
|
||||||
:label="t('params.serial')"
|
:label="t('params.serial')"
|
||||||
v-model="params.serial"
|
v-model="params.serial"
|
||||||
|
is-outlined
|
||||||
lazy-rules
|
lazy-rules
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="badge" size="sm"></QIcon>
|
<QIcon name="badge" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput :label="t('Amount')" v-model="params.amount" lazy-rules>
|
<VnInput
|
||||||
|
:label="t('Amount')"
|
||||||
|
v-model="params.amount"
|
||||||
|
is-outlined
|
||||||
|
lazy-rules
|
||||||
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="euro" size="sm"></QIcon>
|
<QIcon name="euro" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem class="q-mb-md">
|
<QItem class="q-mb-md">
|
||||||
|
@ -127,137 +149,57 @@ const suppliersRef = ref();
|
||||||
<QExpansionItem :label="t('More options')" expand-separator>
|
<QExpansionItem :label="t('More options')" expand-separator>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput
|
<VnInput
|
||||||
:label="t('params.awb')"
|
:label="t('params.awb')"
|
||||||
v-model="params.awbCode"
|
v-model="params.awbCode"
|
||||||
|
is-outlined
|
||||||
lazy-rules
|
lazy-rules
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="badge" size="sm"></QIcon>
|
<QIcon name="badge" size="sm"></QIcon>
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput
|
<VnInput
|
||||||
:label="t('params.account')"
|
:label="t('params.account')"
|
||||||
v-model="params.account"
|
v-model="params.account"
|
||||||
|
is-outlined
|
||||||
lazy-rules
|
lazy-rules
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="person" size="sm" />
|
<QIcon name="person" size="sm" />
|
||||||
</template>
|
</template>
|
||||||
</QInput>
|
</VnInput>
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput :label="t('From')" v-model="params.from" mask="date">
|
<VnInputDate
|
||||||
<template #append>
|
:label="t('From')"
|
||||||
<QIcon name="event" class="cursor-pointer">
|
v-model="params.from"
|
||||||
<QPopupProxy
|
is-outlined
|
||||||
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
|
|
||||||
@click="save"
|
|
||||||
v-close-popup
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</QDate>
|
|
||||||
</QPopupProxy>
|
|
||||||
</QIcon>
|
|
||||||
</template>
|
|
||||||
</QInput>
|
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput :label="t('To')" v-model="params.to" mask="date">
|
<VnInputDate
|
||||||
<template #append>
|
:label="t('To')"
|
||||||
<QIcon name="event" class="cursor-pointer">
|
v-model="params.to"
|
||||||
<QPopupProxy
|
is-outlined
|
||||||
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
|
|
||||||
@click="save"
|
|
||||||
v-close-popup
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</QDate>
|
|
||||||
</QPopupProxy>
|
|
||||||
</QIcon>
|
|
||||||
</template>
|
|
||||||
</QInput>
|
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<QInput
|
<VnInputDate
|
||||||
:label="t('Issued')"
|
:label="t('Issued')"
|
||||||
v-model="params.issued"
|
v-model="params.issued"
|
||||||
mask="date"
|
is-outlined
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QIcon name="event" class="cursor-pointer">
|
|
||||||
<QPopupProxy
|
|
||||||
cover
|
|
||||||
transition-show="scale"
|
|
||||||
transition-hide="scale"
|
|
||||||
>
|
|
||||||
<QDate v-model="params.issued" 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
|
|
||||||
@click="save"
|
|
||||||
v-close-popup
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</QDate>
|
|
||||||
</QPopupProxy>
|
|
||||||
</QIcon>
|
|
||||||
</template>
|
|
||||||
</QInput>
|
|
||||||
</QItemSection>
|
</QItemSection>
|
||||||
</QItem>
|
</QItem>
|
||||||
</QExpansionItem>
|
</QExpansionItem>
|
||||||
|
@ -266,6 +208,15 @@ const suppliersRef = ref();
|
||||||
</VnFilterPanel>
|
</VnFilterPanel>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.list {
|
||||||
|
width: 256px;
|
||||||
|
}
|
||||||
|
.list * {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<i18n>
|
<i18n>
|
||||||
en:
|
en:
|
||||||
params:
|
params:
|
||||||
|
|
|
@ -28,12 +28,13 @@ const countries = ref();
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #body="{ params }">
|
<template #body="{ params }">
|
||||||
<QList dense>
|
<QList dense class="q-gutter-y-sm q-mt-sm">
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<VnInput
|
<VnInput
|
||||||
:label="t('route.cmr.list.cmrFk')"
|
:label="t('route.cmr.list.cmrFk')"
|
||||||
v-model="params.cmrFk"
|
v-model="params.cmrFk"
|
||||||
|
is-outlined
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="article" size="sm"></QIcon>
|
<QIcon name="article" size="sm"></QIcon>
|
||||||
|
@ -55,6 +56,7 @@ const countries = ref();
|
||||||
<VnInput
|
<VnInput
|
||||||
:label="t('route.cmr.list.ticketFk')"
|
:label="t('route.cmr.list.ticketFk')"
|
||||||
v-model="params.ticketFk"
|
v-model="params.ticketFk"
|
||||||
|
is-outlined
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="vn:ticket" size="sm"></QIcon>
|
<QIcon name="vn:ticket" size="sm"></QIcon>
|
||||||
|
@ -67,6 +69,7 @@ const countries = ref();
|
||||||
<VnInput
|
<VnInput
|
||||||
:label="t('route.cmr.list.routeFk')"
|
:label="t('route.cmr.list.routeFk')"
|
||||||
v-model="params.routeFk"
|
v-model="params.routeFk"
|
||||||
|
is-outlined
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="vn:delivery" size="sm"></QIcon>
|
<QIcon name="vn:delivery" size="sm"></QIcon>
|
||||||
|
@ -79,6 +82,7 @@ const countries = ref();
|
||||||
<VnInput
|
<VnInput
|
||||||
:label="t('route.cmr.list.clientFk')"
|
:label="t('route.cmr.list.clientFk')"
|
||||||
v-model="params.clientFk"
|
v-model="params.clientFk"
|
||||||
|
is-outlined
|
||||||
>
|
>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
<QIcon name="vn:client" size="sm"></QIcon>
|
<QIcon name="vn:client" size="sm"></QIcon>
|
||||||
|
|
|
@ -72,7 +72,7 @@ const decrement = (paramsObj, key) => {
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #body="{ params }">
|
<template #body="{ params }">
|
||||||
<QList dense style="max-width: 256px" class="list q-gutter-y-sm q-mt-sm">
|
<QList dense class="list q-gutter-y-sm q-mt-sm">
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<VnInput label="id" v-model="params.id" is-outlined />
|
<VnInput label="id" v-model="params.id" is-outlined />
|
||||||
|
@ -217,6 +217,9 @@ const decrement = (paramsObj, key) => {
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.list {
|
||||||
|
width: 256px;
|
||||||
|
}
|
||||||
.list * {
|
.list * {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -67,7 +67,7 @@ const decrement = (paramsObj, key) => {
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #body="{ params }">
|
<template #body="{ params }">
|
||||||
<QList dense style="max-width: 256px" class="list q-gutter-y-sm q-mt-sm">
|
<QList dense class="list q-gutter-y-sm q-mt-sm">
|
||||||
<QItem>
|
<QItem>
|
||||||
<QItemSection>
|
<QItemSection>
|
||||||
<VnInput
|
<VnInput
|
||||||
|
@ -270,6 +270,9 @@ const decrement = (paramsObj, key) => {
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.list {
|
||||||
|
width: 256px;
|
||||||
|
}
|
||||||
.list * {
|
.list * {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue