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

Input text refactor

This commit is contained in:
William Buezas 2023-12-06 13:23:32 -03:00
parent 0dbb23075b
commit baca1281bf
26 changed files with 390 additions and 244 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/common/SendEmailDialog.vue
View File

@ -1,7 +1,9 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref } from 'vue';
import { useDialogPluginComponent } from 'quasar';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useDialogPluginComponent } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
const props = defineProps({ const props = defineProps({
data: { data: {
@ -51,7 +53,7 @@ async function confirm() {
{{ t('The notification will be sent to the following address') }} {{ t('The notification will be sent to the following address') }}
</QCardSection> </QCardSection>
<QCardSection class="q-pt-none"> <QCardSection class="q-pt-none">
<QInput dense v-model="address" rounded outlined autofocus /> <VnInput v-model="address" is-outlined autofocus />
</QCardSection> </QCardSection>
<QCardActions align="right"> <QCardActions align="right">
<QBtn :label="t('globals.cancel')" color="primary" flat v-close-popup /> <QBtn :label="t('globals.cancel')" color="primary" flat v-close-popup />

51
src/components/common/VnInput.vue Normal file
View File

@ -0,0 +1,51 @@
<script setup>
import { computed } from 'vue';
const emit = defineEmits(['update:modelValue', 'update:options']);
const $props = defineProps({
modelValue: {
type: [String, Number],
default: null,
},
isOutlined: {
type: Boolean,
default: false,
},
});
const value = computed({
get() {
return $props.modelValue;
},
set(value) {
emit('update:modelValue', value);
},
});
const styleAttrs = computed(() => {
return $props.isOutlined
? {
dense: true,
outlined: true,
rounded: true,
}
: {};
});
</script>
<template>
<QInput
ref="vnInputRef"
v-model="value"
v-bind="{ ...$attrs, ...styleAttrs }"
type="text"
>
<template v-if="$slots.prepend" #prepend>
<slot name="prepend" />
</template>
<template v-if="$slots.append" #append>
<slot name="append" />
</template>
</QInput>
</template>

28
src/components/common/VnSmsDialog.vue
View File

@ -1,7 +1,9 @@
<script setup> <script setup>
import { ref, computed } from 'vue'; import { ref, computed } from 'vue';
import { useDialogPluginComponent } from 'quasar';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useDialogPluginComponent } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
const { dialogRef, onDialogOK } = useDialogPluginComponent(); const { dialogRef, onDialogOK } = useDialogPluginComponent();
const { t, availableLocales } = useI18n(); const { t, availableLocales } = useI18n();
@ -117,24 +119,10 @@ async function send() {
/> />
</QCardSection> </QCardSection>
<QCardSection class="q-pb-xs"> <QCardSection class="q-pb-xs">
<QInput <VnInput :label="t('Phone')" v-model="phone" is-outlined />
:label="t('Phone')"
v-model="phone"
rounded
outlined
autofocus
dense
/>
</QCardSection> </QCardSection>
<QCardSection class="q-pb-xs"> <QCardSection class="q-pb-xs">
<QInput <VnInput v-model="subject" :label="t('Subject')" is-outlined />
:label="t('Subject')"
v-model="subject"
rounded
outlined
autofocus
dense
/>
</QCardSection> </QCardSection>
<QCardSection class="q-mb-md" q-input> <QCardSection class="q-mb-md" q-input>
<QInput <QInput
@ -198,7 +186,7 @@ async function send() {
en: en:
CustomerDefaultLanguage: This customer uses <strong>{locale}</strong> as their default language CustomerDefaultLanguage: This customer uses <strong>{locale}</strong> as their default language
templates: templates:
pendingPayment: 'Your order is pending of payment. pendingPayment: 'Your order is pending of payment.
Please, enter the website and make the payment with a credit card. Thank you.' Please, enter the website and make the payment with a credit card. Thank you.'
minAmount: 'A minimum amount of 50€ (VAT excluded) is required for your order minAmount: 'A minimum amount of 50€ (VAT excluded) is required for your order
{ orderId } of { shipped } to receive it without additional shipping costs.' { orderId } of { shipped } to receive it without additional shipping costs.'
@ -215,7 +203,7 @@ es:
Subject: Asunto Subject: Asunto
Message: Mensaje Message: Mensaje
templates: templates:
pendingPayment: 'Su pedido está pendiente de pago. pendingPayment: 'Su pedido está pendiente de pago.
Por favor, entre en la página web y efectue el pago con tarjeta. Muchas gracias.' Por favor, entre en la página web y efectue el pago con tarjeta. Muchas gracias.'
minAmount: 'Es necesario un importe mínimo de 50€ (Sin IVA) en su pedido minAmount: 'Es necesario un importe mínimo de 50€ (Sin IVA) en su pedido
{ orderId } del día { shipped } para recibirlo sin portes adicionales.' { orderId } del día { shipped } para recibirlo sin portes adicionales.'
@ -249,7 +237,7 @@ pt:
Subject: Assunto Subject: Assunto
Message: Mensagem Message: Mensagem
templates: templates:
pendingPayment: 'Seu pedido está pendente de pagamento. pendingPayment: 'Seu pedido está pendente de pagamento.
Por favor, acesse o site e faça o pagamento com cartão. Muito obrigado.' Por favor, acesse o site e faça o pagamento com cartão. Muito obrigado.'
minAmount: 'É necessário um valor mínimo de 50€ (sem IVA) em seu pedido minAmount: 'É necessário um valor mínimo de 50€ (sem IVA) em seu pedido
{ orderId } do dia { shipped } para recebê-lo sem custos de envio adicionais.' { orderId } do dia { shipped } para recebê-lo sem custos de envio adicionais.'

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

@ -1,8 +1,12 @@
<script setup> <script setup>
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import { useRouter, useRoute } from 'vue-router'; import { useRouter, useRoute } from 'vue-router';
import { useArrayData } from 'composables/useArrayData';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
import { useArrayData } from 'composables/useArrayData';
const quasar = useQuasar(); const quasar = useQuasar();
const props = defineProps({ const props = defineProps({
@ -86,7 +90,7 @@ async function search() {
<template> <template>
<QForm @submit="search"> <QForm @submit="search">
<QInput <VnInput
id="searchbar" id="searchbar"
v-model="searchText" v-model="searchText"
:placeholder="props.label" :placeholder="props.label"
@ -113,7 +117,7 @@ async function search() {
<QTooltip>{{ props.info }}</QTooltip> <QTooltip>{{ props.info }}</QTooltip>
</QIcon> </QIcon>
</template> </template>
</QInput> </VnInput>
</QForm> </QForm>
</template> </template>

8
src/pages/Claim/Card/ClaimBasicData.vue
View File

@ -3,10 +3,12 @@ import { ref } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useSession } from 'src/composables/useSession';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
import { useSession } from 'src/composables/useSession';
const route = useRoute(); const route = useRoute();
const { t } = useI18n(); const { t } = useI18n();
@ -101,7 +103,7 @@ const statesFilter = {
<template #form="{ data, validate, filter }"> <template #form="{ data, validate, filter }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.client.name" v-model="data.client.name"
:label="t('claim.basicData.customer')" :label="t('claim.basicData.customer')"
disable disable
@ -190,7 +192,7 @@ const statesFilter = {
/> />
</div> </div>
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.rma" v-model="data.rma"
:label="t('claim.basicData.returnOfMaterial')" :label="t('claim.basicData.returnOfMaterial')"
:rules="validate('claim.rma')" :rules="validate('claim.rma')"

52
src/pages/Claim/ClaimFilter.vue
View File

@ -1,9 +1,11 @@
<script setup> <script setup>
import { ref } from 'vue'; 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 VnSelectFilter from 'components/common/VnSelectFilter.vue'; import VnSelectFilter from 'components/common/VnSelectFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -33,30 +35,31 @@ const states = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense> <QList dense style="max-width: 256px" class="list">
<QItem> <QItem class="q-my-sm">
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Customer ID')" :label="t('Customer ID')"
v-model="params.clientFk" v-model="params.clientFk"
lazy-rules lazy-rules
is-outlined
> >
<template #prepend> <template #prepend>
<QIcon name="badge" size="sm"></QIcon> <QIcon name="badge" size="xs"></QIcon> </template
</template> ></VnInput>
</QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Client Name')" :label="t('Client Name')"
v-model="params.clientName" v-model="params.clientName"
lazy-rules lazy-rules
is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection v-if="!workers"> <QItemSection v-if="!workers">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
</QItemSection> </QItemSection>
@ -71,11 +74,15 @@ const states = ref();
emit-value emit-value
map-options map-options
use-input use-input
hide-selected
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection v-if="!workers"> <QItemSection v-if="!workers">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
</QItemSection> </QItemSection>
@ -90,11 +97,15 @@ const states = ref();
emit-value emit-value
map-options map-options
use-input use-input
hide-selected
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection v-if="!workers"> <QItemSection v-if="!workers">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
</QItemSection> </QItemSection>
@ -109,11 +120,15 @@ const states = ref();
emit-value emit-value
map-options map-options
use-input use-input
hide-selected
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-md"> <QItem class="q-mb-sm">
<QItemSection v-if="!states"> <QItemSection v-if="!states">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
</QItemSection> </QItemSection>
@ -127,6 +142,10 @@ const states = ref();
option-label="description" option-label="description"
emit-value emit-value
map-options map-options
hide-selected
dense
outlined
rounded
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
@ -155,6 +174,9 @@ const states = ref();
:label="t('Created')" :label="t('Created')"
autofocus autofocus
readonly readonly
dense
outlined
rounded
> >
<template #append> <template #append>
<QIcon name="event" class="cursor-pointer"> <QIcon name="event" class="cursor-pointer">
@ -185,6 +207,12 @@ const states = ref();
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

9
src/pages/Claim/ClaimRmaList.vue
View File

@ -2,10 +2,13 @@
import { ref } from 'vue'; import { ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import axios from 'axios';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'src/composables/useArrayData';
import VnConfirm from 'src/components/ui/VnConfirm.vue'; import VnConfirm from 'src/components/ui/VnConfirm.vue';
import VnInput from 'src/components/common/VnInput.vue';
import { useArrayData } from 'src/composables/useArrayData';
import axios from 'axios';
const quasar = useQuasar(); const quasar = useQuasar();
const { t } = useI18n(); const { t } = useI18n();
@ -65,7 +68,7 @@ async function remove({ id }) {
<QPageSticky expand position="top" :offset="[16, 16]"> <QPageSticky expand position="top" :offset="[16, 16]">
<QCard class="card q-pa-md"> <QCard class="card q-pa-md">
<QForm @submit="submit"> <QForm @submit="submit">
<QInput <VnInput
ref="input" ref="input"
v-model="newRma.code" v-model="newRma.code"
:label="t('claim.rmaList.code')" :label="t('claim.rmaList.code')"

11
src/pages/Customer/Card/CustomerBasicData.vue
View File

@ -7,6 +7,7 @@ import { useSession } from 'src/composables/useSession';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
const route = useRoute(); const route = useRoute();
const { t } = useI18n(); const { t } = useI18n();
@ -64,7 +65,7 @@ const filterOptions = {
<template #form="{ data, validate, filter }"> <template #form="{ data, validate, filter }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.socialName" v-model="data.socialName"
:label="t('customer.basicData.socialName')" :label="t('customer.basicData.socialName')"
:rules="validate('client.socialName')" :rules="validate('client.socialName')"
@ -87,7 +88,7 @@ const filterOptions = {
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.contact" v-model="data.contact"
:label="t('customer.basicData.contact')" :label="t('customer.basicData.contact')"
:rules="validate('client.contact')" :rules="validate('client.contact')"
@ -95,7 +96,7 @@ const filterOptions = {
/> />
</div> </div>
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.email" v-model="data.email"
type="email" type="email"
:label="t('customer.basicData.email')" :label="t('customer.basicData.email')"
@ -106,7 +107,7 @@ const filterOptions = {
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.phone" v-model="data.phone"
:label="t('customer.basicData.phone')" :label="t('customer.basicData.phone')"
:rules="validate('client.phone')" :rules="validate('client.phone')"
@ -114,7 +115,7 @@ const filterOptions = {
/> />
</div> </div>
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.mobile" v-model="data.mobile"
:label="t('customer.basicData.mobile')" :label="t('customer.basicData.mobile')"
:rules="validate('client.mobile')" :rules="validate('client.mobile')"

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

@ -1,9 +1,11 @@
<script setup> <script setup>
import { ref } from 'vue'; 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 VnSelectFilter from 'components/common/VnSelectFilter.vue'; import VnSelectFilter from 'components/common/VnSelectFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -35,31 +37,31 @@ const zones = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense> <QList dense style="max-width: 256px" class="list">
<QItem> <QItem class="q-my-sm">
<QItemSection> <QItemSection>
<QInput :label="t('FI')" v-model="params.fi" lazy-rules> <VnInput :label="t('FI')" v-model="params.fi" is-outlined>
<template #prepend> <template #prepend>
<QIcon name="badge" size="sm"></QIcon> <QIcon name="badge" size="xs" />
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection> <QItemSection>
<QInput :label="t('Name')" v-model="params.name" lazy-rules /> <VnInput :label="t('Name')" v-model="params.name" is-outlined />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Social Name')" :label="t('Social Name')"
v-model="params.socialName" v-model="params.socialName"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection v-if="!workers"> <QItemSection v-if="!workers">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
</QItemSection> </QItemSection>
@ -74,11 +76,15 @@ const zones = ref();
emit-value emit-value
map-options map-options
use-input use-input
hide-selected
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem class="q-mb-sm">
<QItemSection v-if="!provinces"> <QItemSection v-if="!provinces">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
</QItemSection> </QItemSection>
@ -92,33 +98,45 @@ const zones = ref();
option-label="name" option-label="name"
emit-value emit-value
map-options map-options
hide-selected
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-md"> <QItem class="q-mb-md">
<QItemSection> <QItemSection>
<QInput :label="t('City')" v-model="params.city" lazy-rules /> <VnInput :label="t('City')" v-model="params.city" is-outlined />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QSeparator /> <QSeparator />
<QExpansionItem :label="t('More options')" expand-separator> <QExpansionItem :label="t('More options')" expand-separator>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput :label="t('Phone')" v-model="params.phone" lazy-rules> <VnInput
:label="t('Phone')"
v-model="params.phone"
is-outlined
>
<template #prepend> <template #prepend>
<QIcon name="phone" size="sm"></QIcon> <QIcon name="phone" size="xs" />
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput :label="t('Email')" v-model="params.email" lazy-rules> <VnInput
:label="t('Email')"
v-model="params.email"
is-outlined
>
<template #prepend> <template #prepend>
<QIcon name="email" size="sm"></QIcon> <QIcon name="email" size="sm" />
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
@ -135,15 +153,19 @@ const zones = ref();
option-label="name" option-label="name"
emit-value emit-value
map-options map-options
hide-selected
dense
outlined
rounded
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Postcode')" :label="t('Postcode')"
v-model="params.postcode" v-model="params.postcode"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
@ -153,6 +175,12 @@ const zones = ref();
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

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

@ -1,6 +1,7 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue'; import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnInput from 'src/components/common/VnInput.vue';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -24,39 +25,39 @@ function isValidNumber(value) {
</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>
<QInput <VnInput
:label="t('Order ID')" :label="t('Order ID')"
v-model="params.orderFk" v-model="params.orderFk"
lazy-rules is-outlined
> >
<template #prepend> <template #prepend>
<QIcon name="vn:basket" size="sm"></QIcon> <QIcon name="vn:basket" size="xs" />
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Customer ID')" :label="t('Customer ID')"
v-model="params.clientFk" v-model="params.clientFk"
lazy-rules is-outlined
> >
<template #prepend> <template #prepend>
<QIcon name="vn:client" size="sm"></QIcon> <QIcon name="vn:client" size="xs" />
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Amount')" :label="t('Amount')"
v-model="params.amount" v-model="params.amount"
lazy-rules is-outlined
@update:model-value=" @update:model-value="
(value) => { (value) => {
if (value.includes(',')) if (value.includes(','))
@ -67,13 +68,15 @@ function isValidNumber(value) {
(val) => (val) =>
isValidNumber(val) || !val || 'Please type a number', isValidNumber(val) || !val || 'Please type a number',
]" ]"
lazy-rules
> >
<template #prepend> <template #prepend>
<QIcon name="euro" size="sm" /> <QIcon name="euro" size="sm" />
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
@ -81,6 +84,9 @@ function isValidNumber(value) {
:label="t('From')" :label="t('From')"
mask="date" mask="date"
placeholder="yyyy/mm/dd" placeholder="yyyy/mm/dd"
dense
outlined
rounded
> >
<template #append> <template #append>
<QIcon name="event" class="cursor-pointer"> <QIcon name="event" class="cursor-pointer">
@ -118,6 +124,9 @@ function isValidNumber(value) {
:label="t('To')" :label="t('To')"
mask="date" mask="date"
placeholder="yyyy/mm/dd" placeholder="yyyy/mm/dd"
dense
outlined
rounded
> >
<template #append> <template #append>
<QIcon name="event" class="cursor-pointer"> <QIcon name="event" class="cursor-pointer">

34
src/pages/InvoiceOut/InvoiceOutFilter.vue
View File

@ -1,8 +1,10 @@
<script setup> <script setup>
import { ref } from 'vue'; 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 VnInput from 'src/components/common/VnInput.vue';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -38,47 +40,31 @@ function setWorkers(data) {
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense> <QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Customer ID')" :label="t('Customer ID')"
class="q-mt-sm"
dense
lazy-rules
outlined
rounded
v-model="params.clientFk" v-model="params.clientFk"
is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput v-model="params.fi" :label="t('FI')" is-outlined />
:label="t('FI')"
class="q-mt-sm"
dense
lazy-rules
outlined
rounded
v-model="params.fi"
/>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Amount')" :label="t('Amount')"
class="q-mt-sm"
dense
lazy-rules
outlined
rounded
v-model="params.amount" v-model="params.amount"
is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mt-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
:label="t('Min')" :label="t('Min')"
@ -102,7 +88,7 @@ function setWorkers(data) {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-md"> <QItem>
<QItemSection> <QItemSection>
<QCheckbox <QCheckbox
:label="t('Has PDF')" :label="t('Has PDF')"

55
src/pages/InvoiceOut/InvoiceOutGlobalForm.vue
View File

@ -1,11 +1,13 @@
<script setup> <script setup>
import { onMounted, ref, computed } from 'vue'; import { onMounted, ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { toDate } from 'src/filters';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js';
import { toDate } from 'src/filters';
const { t } = useI18n(); const { t } = useI18n();
const invoiceOutGlobalStore = useInvoiceOutGlobalStore(); const invoiceOutGlobalStore = useInvoiceOutGlobalStore();
@ -84,7 +86,7 @@ onMounted(async () => {
class="form-container q-pa-md" class="form-container q-pa-md"
style="max-width: 256px" style="max-width: 256px"
> >
<div class="column q-gutter-y-md"> <div class="column q-gutter-y-sm">
<QRadio <QRadio
v-model="clientsToInvoice" v-model="clientsToInvoice"
dense dense
@ -98,6 +100,7 @@ onMounted(async () => {
val="one" val="one"
:label="t('oneClient')" :label="t('oneClient')"
:dark="true" :dark="true"
class="q-mb-sm"
/> />
<VnSelectFilter <VnSelectFilter
v-if="clientsToInvoice === 'one'" v-if="clientsToInvoice === 'one'"
@ -223,28 +226,24 @@ onMounted(async () => {
</style> </style>
<i18n> <i18n>
{ en:
"en": { invoiceDate: Invoice date
"invoiceDate": "Invoice date", maxShipped: Max date
"maxShipped": "Max date", allClients: All clients
"allClients": "All clients", oneClient: One client
"oneClient": "One client", company: Company
"company": "Company", printer: Printer
"printer": "Printer", invoiceOut: Invoice out
"invoiceOut": "Invoice out", client: Client
"client": "Client", stop: Stop
"stop": "Stop" es:
}, invoiceDate: Fecha de factura
"es": { maxShipped: Fecha límite
"invoiceDate": "Fecha de factura", allClients: Todos los clientes
"maxShipped": "Fecha límite", oneClient: Un solo cliente
"allClients": "Todos los clientes", company: Empresa
"oneClient": "Un solo cliente", printer: Impresora
"company": "Empresa", invoiceOut: Facturar
"printer": "Impresora", client: Cliente
"invoiceOut": "Facturar", stop: Parar
"client": "Cliente",
"stop": "Parar"
}
}
</i18n> </i18n>

11
src/pages/InvoiceOut/InvoiceOutNegativeBases.vue
View File

@ -1,11 +1,14 @@
<script setup> <script setup>
import { onMounted, ref, reactive } from 'vue'; import { onMounted, ref, reactive } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { QCheckbox, QBtn } from 'quasar';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue'; import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import VnInput from 'src/components/common/VnInput.vue';
import invoiceOutService from 'src/services/invoiceOut.service'; import invoiceOutService from 'src/services/invoiceOut.service';
import { toCurrency } from 'src/filters'; import { toCurrency } from 'src/filters';
import { QCheckbox, QBtn } from 'quasar';
import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js'; import { useInvoiceOutGlobalStore } from 'src/stores/invoiceOutGlobal.js';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
@ -331,19 +334,17 @@ onMounted(async () => {
<QTh v-for="col in props.cols" :key="col.name" :props="props"> <QTh v-for="col in props.cols" :key="col.name" :props="props">
<div class="column justify-start items-start full-height"> <div class="column justify-start items-start full-height">
{{ t(`invoiceOut.negativeBases.${col.label}`) }} {{ t(`invoiceOut.negativeBases.${col.label}`) }}
<QInput <VnInput
:class="{ :class="{
invisible: invisible:
col.field === 'isActive' || col.field === 'isActive' ||
col.field === 'hasToInvoice' || col.field === 'hasToInvoice' ||
col.field === 'isTaxDataChecked', col.field === 'isTaxDataChecked',
}" }"
dense
outlined
rounded
v-model="filter[col.field]" v-model="filter[col.field]"
type="text" type="text"
@keyup.enter="search()" @keyup.enter="search()"
is-outlined
/> />
</div> </div>
</QTh> </QTh>

8
src/pages/Login/LoginMain.vue
View File

@ -3,12 +3,13 @@ import { ref } from 'vue';
import { Notify, useQuasar } from 'quasar'; import { Notify, useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import axios from 'axios';
import { useSession } from 'src/composables/useSession'; import { useSession } from 'src/composables/useSession';
import { useLogin } from 'src/composables/useLogin'; import { useLogin } from 'src/composables/useLogin';
import VnLogo from 'components/ui/VnLogo.vue'; import VnLogo from 'components/ui/VnLogo.vue';
import VnInput from 'src/components/common/VnInput.vue';
import axios from 'axios';
const quasar = useQuasar(); const quasar = useQuasar();
const session = useSession(); const session = useSession();
@ -68,13 +69,14 @@ async function onSubmit() {
<template> <template>
<QForm @submit="onSubmit" class="q-gutter-y-md q-pa-lg formCard"> <QForm @submit="onSubmit" class="q-gutter-y-md q-pa-lg formCard">
<VnLogo alt="Logo" fit="contain" :ratio="16 / 9" class="q-mb-md" /> <VnLogo alt="Logo" fit="contain" :ratio="16 / 9" class="q-mb-md" />
<QInput
<VnInput
v-model="username" v-model="username"
:label="t('login.username')" :label="t('login.username')"
lazy-rules lazy-rules
:rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]" :rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
/> />
<QInput <VnInput
type="password" type="password"
v-model="password" v-model="password"
:label="t('login.password')" :label="t('login.password')"

4
src/pages/Login/TwoFactor.vue
View File

@ -53,7 +53,7 @@ async function onSubmit() {
<QIcon name="phonelink_lock" size="xl" color="primary" /> <QIcon name="phonelink_lock" size="xl" color="primary" />
<h5 class="text-center q-my-md">{{ t('twoFactor.insert') }}</h5> <h5 class="text-center q-my-md">{{ t('twoFactor.insert') }}</h5>
</div> </div>
<QInput <VnInput
v-model="code" v-model="code"
:hint="t('twoFactor.explanation')" :hint="t('twoFactor.explanation')"
mask="# # # # # #" mask="# # # # # #"
@ -64,7 +64,7 @@ async function onSubmit() {
<template #prepend> <template #prepend>
<QIcon name="lock" /> <QIcon name="lock" />
</template> </template>
</QInput> </VnInput>
<div class="q-mt-xl"> <div class="q-mt-xl">
<QBtn <QBtn
:label="t('twoFactor.validate')" :label="t('twoFactor.validate')"

22
src/pages/Route/Cmr/CmrFilter.vue
View File

@ -28,15 +28,14 @@ const countries = ref();
<QList dense> <QList dense>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('route.cmr.list.cmrFk')" :label="t('route.cmr.list.cmrFk')"
v-model="params.cmrFk" v-model="params.cmrFk"
lazy-rules
> >
<template #prepend> <template #prepend>
<QIcon name="article" size="sm"></QIcon> <QIcon name="article" size="sm"></QIcon>
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
@ -50,41 +49,38 @@ const countries = ref();
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('route.cmr.list.ticketFk')" :label="t('route.cmr.list.ticketFk')"
v-model="params.ticketFk" v-model="params.ticketFk"
lazy-rules
> >
<template #prepend> <template #prepend>
<QIcon name="vn:ticket" size="sm"></QIcon> <QIcon name="vn:ticket" size="sm"></QIcon>
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('route.cmr.list.routeFk')" :label="t('route.cmr.list.routeFk')"
v-model="params.routeFk" v-model="params.routeFk"
lazy-rules
> >
<template #prepend> <template #prepend>
<QIcon name="vn:delivery" size="sm"></QIcon> <QIcon name="vn:delivery" size="sm"></QIcon>
</template> </template>
</QInput> </VnInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('route.cmr.list.clientFk')" :label="t('route.cmr.list.clientFk')"
v-model="params.clientFk" v-model="params.clientFk"
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>
@ -156,7 +152,7 @@ const countries = ref();
country: Country country: Country
clientFk: Client id clientFk: Client id
shipped: Preparation date shipped: Preparation date
es: es:
params: params:
cmrFk: Id cmr cmrFk: Id cmr

8
src/pages/Shelving/Card/ShelvingForm.vue
View File

@ -1,8 +1,10 @@
<script setup> <script setup>
import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import { computed, ref } from 'vue'; import VnInput from 'src/components/common/VnInput.vue';
const props = defineProps({ const props = defineProps({
data: { data: {
@ -57,7 +59,7 @@ const parkingSelectFilter = {
/> />
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.code" v-model="data.code"
:label="t('shelving.basicData.code')" :label="t('shelving.basicData.code')"
:rules="props.validate('Shelving.code')" :rules="props.validate('Shelving.code')"
@ -83,7 +85,7 @@ const parkingSelectFilter = {
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.priority" v-model="data.priority"
:label="t('shelving.basicData.priority')" :label="t('shelving.basicData.priority')"
:rules="props.validate('Shelving.priority')" :rules="props.validate('Shelving.priority')"

7
src/pages/Supplier/SupplierCreate.vue
View File

@ -1,11 +1,12 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n';
import { reactive } from 'vue'; import { reactive } from 'vue';
import { useStateStore } from 'stores/useStateStore'; import { useI18n } from 'vue-i18n';
import VnSearchbar from 'components/ui/VnSearchbar.vue'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
import { useStateStore } from 'stores/useStateStore';
const { t } = useI18n(); const { t } = useI18n();
const stateStore = useStateStore(); const stateStore = useStateStore();
@ -39,7 +40,7 @@ const newSupplierForm = reactive({
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <VnInput
v-model="data.name" v-model="data.name"
:label="t('supplier.create.supplierName')" :label="t('supplier.create.supplierName')"
/> />

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

@ -1,8 +1,11 @@
<script setup> <script setup>
import { ref } from 'vue'; 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 VnInput from 'src/components/common/VnInput.vue';
import toDateString from 'filters/toDateString'; import toDateString from 'filters/toDateString';
const { t } = useI18n(); const { t } = useI18n();
@ -52,26 +55,33 @@ const warehouses = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense> <QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
v-model="params.clientFk" v-model="params.clientFk"
:label="t('Customer ID')" :label="t('Customer ID')"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
<QItemSection> <QItemSection>
<QInput <VnInput
v-model="params.orderFk" v-model="params.orderFk"
:label="t('Order ID')" :label="t('Order ID')"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput v-model="params.from" :label="t('From')" mask="date"> <QInput
v-model="params.from"
:label="t('From')"
mask="date"
dense
outlined
rounded
>
<template #append> <template #append>
<QIcon name="event" class="cursor-pointer"> <QIcon name="event" class="cursor-pointer">
<QPopupProxy <QPopupProxy
@ -103,7 +113,14 @@ const warehouses = ref();
</QInput> </QInput>
</QItemSection> </QItemSection>
<QItemSection> <QItemSection>
<QInput v-model="params.to" :label="t('To')" mask="date"> <QInput
v-model="params.to"
:label="t('To')"
mask="date"
dense
outlined
rounded
>
<template #append> <template #append>
<QIcon name="event" class="cursor-pointer"> <QIcon name="event" class="cursor-pointer">
<QPopupProxy <QPopupProxy
@ -150,6 +167,9 @@ const warehouses = ref();
emit-value emit-value
map-options map-options
use-input use-input
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
@ -168,15 +188,18 @@ const warehouses = ref();
option-label="name" option-label="name"
emit-value emit-value
map-options map-options
dense
outlined
rounded
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
v-model="params.refFk" v-model="params.refFk"
:label="t('Invoice Ref.')" :label="t('Invoice Ref.')"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
@ -290,7 +313,7 @@ en:
params: params:
search: Contains search: Contains
clientFk: Customer clientFk: Customer
orderFK: Order orderFk: Order
from: From from: From
to: To to: To
salesPersonFk: Salesperson salesPersonFk: Salesperson
@ -307,7 +330,7 @@ es:
params: params:
search: Contiene search: Contiene
clientFk: Cliente clientFk: Cliente
orderFK: Pedido orderFk: Pedido
from: Desde from: Desde
to: Hasta to: Hasta
salesPersonFk: Comercial salesPersonFk: Comercial

21
src/pages/Travel/ExtraCommunity.vue
View File

@ -1,16 +1,19 @@
<script setup> <script setup>
import { onMounted, ref, computed } from 'vue'; import { onMounted, ref, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { QBtn, QField, QPopupEdit } from 'quasar';
import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue'; import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue'; import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
import { QBtn, QField, QPopupEdit } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import { toCurrency } from 'src/filters';
import { useArrayData } from 'composables/useArrayData';
import { toDate } from 'src/filters';
import { usePrintService } from 'composables/usePrintService';
import travelService from 'src/services/travel.service';
import ExtraCommunityFilter from './ExtraCommunityFilter.vue'; import ExtraCommunityFilter from './ExtraCommunityFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
import { useStateStore } from 'stores/useStateStore';
import travelService from 'src/services/travel.service';
import { useArrayData } from 'composables/useArrayData';
import { usePrintService } from 'composables/usePrintService';
import { toDate } from 'src/filters';
import { toCurrency } from 'src/filters';
const stateStore = useStateStore(); const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
@ -281,7 +284,7 @@ onMounted(async () => {
label-set="Save" label-set="Save"
label-cancel="Close" label-cancel="Close"
> >
<QInput <VnInput
v-model="rows[props.pageIndex][col.field]" v-model="rows[props.pageIndex][col.field]"
dense dense
autofocus autofocus

43
src/pages/Travel/ExtraCommunityFilter.vue
View File

@ -1,9 +1,12 @@
<script setup> <script setup>
import { reactive } from 'vue'; import { reactive } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue'; import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue'; import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import FetchData from 'components/FetchData.vue'; import VnInput from 'src/components/common/VnInput.vue';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
const { t } = useI18n(); const { t } = useI18n();
@ -70,24 +73,22 @@ const decrement = (paramsObj, key) => {
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense style="max-width: 256px" class="list"> <QList dense style="max-width: 256px" class="list q-gutter-y-sm q-mt-sm">
<QItem class="q-my-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput label="id" dense outlined rounded v-model="params.id" /> <VnInput label="id" v-model="params.id" is-outlined />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-my-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('params.ref')" :label="t('params.reference')"
dense
outlined
rounded
v-model="params.reference" v-model="params.reference"
is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
v-model="params.totalEntries" v-model="params.totalEntries"
@ -118,7 +119,7 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.agencyModeFk')" :label="t('params.agencyModeFk')"
@ -133,7 +134,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
dense dense
@ -166,7 +167,7 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
dense dense
@ -199,7 +200,7 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.warehouseOutFk')" :label="t('params.warehouseOutFk')"
@ -214,7 +215,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.warehouseInFk')" :label="t('params.warehouseInFk')"
@ -229,7 +230,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('supplier.pageTitles.supplier')" :label="t('supplier.pageTitles.supplier')"
@ -244,7 +245,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.continent')" :label="t('params.continent')"
@ -283,7 +284,8 @@ const decrement = (paramsObj, key) => {
<i18n> <i18n>
en: en:
params: params:
ref: Reference id: Id
reference: Reference
totalEntries: Total entries totalEntries: Total entries
agencyModeFk: Agency agencyModeFk: Agency
warehouseInFk: Warehouse In warehouseInFk: Warehouse In
@ -294,7 +296,8 @@ en:
continent: Continent out continent: Continent out
es: es:
params: params:
ref: Referencia id: Id
reference: Referencia
totalEntries: Ent. totales totalEntries: Ent. totales
agencyModeFk: Agencia agencyModeFk: Agencia
warehouseInFk: Alm. entrada warehouseInFk: Alm. entrada

11
src/pages/Travel/TravelCreate.vue
View File

@ -1,14 +1,15 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { reactive, ref } from 'vue'; import { reactive, ref, onBeforeMount } from 'vue';
import FetchData from 'components/FetchData.vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import FetchData from 'components/FetchData.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue'; import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
import { toDate } from 'src/filters'; import VnInput from 'src/components/common/VnInput.vue';
import { onBeforeMount } from 'vue'; import { toDate } from 'src/filters';
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
@ -70,7 +71,7 @@ const onFetchWarehouses = (warehouses) => {
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput v-model="data.ref" :label="t('globals.reference')" /> <VnInput v-model="data.ref" :label="t('globals.reference')" />
</div> </div>
<div class="col"> <div class="col">
<VnSelectFilter <VnSelectFilter

31
src/pages/Travel/TravelFilter.vue
View File

@ -1,9 +1,12 @@
<script setup> <script setup>
import { reactive } from 'vue'; import { reactive } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue'; import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue'; import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
const { t } = useI18n(); const { t } = useI18n();
@ -64,19 +67,17 @@ const decrement = (paramsObj, key) => {
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense style="max-width: 256px" class="list"> <QList dense style="max-width: 256px" class="list q-gutter-y-sm q-mt-sm">
<QItem class="q-my-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('params.search')"
dense
outlined
rounded
v-model="params.search" v-model="params.search"
:label="t('params.search')"
is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.agencyModeFk')" :label="t('params.agencyModeFk')"
@ -91,7 +92,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.warehouseOutFk')" :label="t('params.warehouseOutFk')"
@ -106,7 +107,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.warehouseInFk')" :label="t('params.warehouseInFk')"
@ -121,7 +122,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
v-model="params.scopeDays" v-model="params.scopeDays"
@ -151,7 +152,7 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
dense dense
@ -184,7 +185,7 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
dense dense
@ -217,7 +218,7 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label="t('params.continent')" :label="t('params.continent')"
@ -232,7 +233,7 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-sm"> <QItem>
<QItemSection> <QItemSection>
<QInput <QInput
v-model="params.totalEntries" v-model="params.totalEntries"

11
src/pages/Wagon/Type/WagonTypeCreate.vue
View File

@ -1,9 +1,12 @@
<script setup> <script setup>
import axios from 'axios';
import { useQuasar } from 'quasar';
import { computed, ref, onMounted, onUpdated } from 'vue'; import { computed, ref, onMounted, onUpdated } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import { useQuasar } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
onMounted(() => fetch()); onMounted(() => fetch());
onUpdated(() => fetch()); onUpdated(() => fetch());
@ -241,7 +244,7 @@ function exceedMaxHeight(pos) {
<QPage class="q-pa-sm q-mx-xl"> <QPage class="q-pa-sm q-mx-xl">
<QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm"> <QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
<QCard class="q-pa-md"> <QCard class="q-pa-md">
<QInput <VnInput
filled filled
v-model="name" v-model="name"
:label="t('wagon.type.name')" :label="t('wagon.type.name')"

9
src/pages/Wagon/WagonCreate.vue
View File

@ -1,9 +1,12 @@
<script setup> <script setup>
import axios from 'axios';
import { QIcon, QInput, QItem, QItemSection, QSelect } from 'quasar';
import { computed, onMounted, onUpdated, ref } from 'vue'; import { computed, onMounted, onUpdated, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { QIcon, QInput, QItem, QItemSection, QSelect } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import axios from 'axios';
onMounted(() => fetch()); onMounted(() => fetch());
onUpdated(() => fetch()); onUpdated(() => fetch());
@ -100,7 +103,7 @@ function filterType(val, update) {
/> />
</div> </div>
<div class="col"> <div class="col">
<QInput <VnInput
filled filled
v-model="wagon.plate" v-model="wagon.plate"
:label="t('wagon.create.plate')" :label="t('wagon.create.plate')"

36
src/pages/Worker/WorkerFilter.vue
View File

@ -1,8 +1,10 @@
<script setup> <script setup>
import { ref } from 'vue'; 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 VnInput from 'src/components/common/VnInput.vue';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -25,40 +27,39 @@ const departments = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense> <QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput :label="t('FI')" v-model="params.fi" lazy-rules> <VnInput :label="t('FI')" v-model="params.fi" is-outlined
<template #prepend> ><template #prepend>
<QIcon name="badge" size="sm"></QIcon> <QIcon name="badge" size="xs"></QIcon> </template
</template> ></VnInput>
</QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('First Name')" :label="t('First Name')"
v-model="params.firstName" v-model="params.firstName"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Last Name')" :label="t('Last Name')"
v-model="params.lastName" v-model="params.lastName"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('User Name')" :label="t('User Name')"
v-model="params.userName" v-model="params.userName"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
@ -77,16 +78,19 @@ const departments = ref();
emit-value emit-value
map-options map-options
use-input use-input
dense
outlined
rounded
:input-debounce="0" :input-debounce="0"
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem class="q-mb-md"> <QItem>
<QItemSection> <QItemSection>
<QInput <VnInput
:label="t('Extension')" :label="t('Extension')"
v-model="params.extension" v-model="params.extension"
lazy-rules is-outlined
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
@ -104,6 +108,7 @@ en:
lastName: Last name lastName: Last name
userName: User userName: User
extension: Extension extension: Extension
departmentFk: Department
es: es:
params: params:
search: Contiene search: Contiene
@ -112,6 +117,7 @@ es:
lastName: Apellidos lastName: Apellidos
userName: Usuario userName: Usuario
extension: Extensión extension: Extensión
departmentFk: Departamento
FI: NIF FI: NIF
First Name: Nombre First Name: Nombre
Last Name: Apellidos Last Name: Apellidos