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>
import { ref } from 'vue';
import { useDialogPluginComponent } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useDialogPluginComponent } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
const props = defineProps({
data: {
@ -51,7 +53,7 @@ async function confirm() {
{{ t('The notification will be sent to the following address') }}
</QCardSection>
<QCardSection class="q-pt-none">
<QInput dense v-model="address" rounded outlined autofocus />
<VnInput v-model="address" is-outlined autofocus />
</QCardSection>
<QCardActions align="right">
<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>

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

@ -1,7 +1,9 @@
<script setup>
import { ref, computed } from 'vue';
import { useDialogPluginComponent } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useDialogPluginComponent } from 'quasar';
import VnInput from 'src/components/common/VnInput.vue';
const { dialogRef, onDialogOK } = useDialogPluginComponent();
const { t, availableLocales } = useI18n();
@ -117,24 +119,10 @@ async function send() {
/>
</QCardSection>
<QCardSection class="q-pb-xs">
<QInput
:label="t('Phone')"
v-model="phone"
rounded
outlined
autofocus
dense
/>
<VnInput :label="t('Phone')" v-model="phone" is-outlined />
</QCardSection>
<QCardSection class="q-pb-xs">
<QInput
:label="t('Subject')"
v-model="subject"
rounded
outlined
autofocus
dense
/>
<VnInput v-model="subject" :label="t('Subject')" is-outlined />
</QCardSection>
<QCardSection class="q-mb-md" q-input>
<QInput

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

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

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

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

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

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

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

@ -2,10 +2,13 @@
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import axios from 'axios';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'src/composables/useArrayData';
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 { t } = useI18n();
@ -65,7 +68,7 @@ async function remove({ id }) {
<QPageSticky expand position="top" :offset="[16, 16]">
<QCard class="card q-pa-md">
<QForm @submit="submit">
<QInput
<VnInput
ref="input"
v-model="newRma.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 FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
const route = useRoute();
const { t } = useI18n();
@ -64,7 +65,7 @@ const filterOptions = {
<template #form="{ data, validate, filter }">
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QInput
<VnInput
v-model="data.socialName"
:label="t('customer.basicData.socialName')"
:rules="validate('client.socialName')"
@ -87,7 +88,7 @@ const filterOptions = {
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QInput
<VnInput
v-model="data.contact"
:label="t('customer.basicData.contact')"
:rules="validate('client.contact')"
@ -95,7 +96,7 @@ const filterOptions = {
/>
</div>
<div class="col">
<QInput
<VnInput
v-model="data.email"
type="email"
:label="t('customer.basicData.email')"
@ -106,7 +107,7 @@ const filterOptions = {
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QInput
<VnInput
v-model="data.phone"
:label="t('customer.basicData.phone')"
:rules="validate('client.phone')"
@ -114,7 +115,7 @@ const filterOptions = {
/>
</div>
<div class="col">
<QInput
<VnInput
v-model="data.mobile"
:label="t('customer.basicData.mobile')"
:rules="validate('client.mobile')"

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

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

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

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

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

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

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

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

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

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

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

@ -3,12 +3,13 @@ import { ref } from 'vue';
import { Notify, useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import axios from 'axios';
import { useSession } from 'src/composables/useSession';
import { useLogin } from 'src/composables/useLogin';
import VnLogo from 'components/ui/VnLogo.vue';
import VnInput from 'src/components/common/VnInput.vue';
import axios from 'axios';
const quasar = useQuasar();
const session = useSession();
@ -68,13 +69,14 @@ async function onSubmit() {
<template>
<QForm @submit="onSubmit" class="q-gutter-y-md q-pa-lg formCard">
<VnLogo alt="Logo" fit="contain" :ratio="16 / 9" class="q-mb-md" />
<QInput
<VnInput
v-model="username"
:label="t('login.username')"
lazy-rules
:rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
/>
<QInput
<VnInput
type="password"
v-model="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" />
<h5 class="text-center q-my-md">{{ t('twoFactor.insert') }}</h5>
</div>
<QInput
<VnInput
v-model="code"
:hint="t('twoFactor.explanation')"
mask="# # # # # #"
@ -64,7 +64,7 @@ async function onSubmit() {
<template #prepend>
<QIcon name="lock" />
</template>
</QInput>
</VnInput>
<div class="q-mt-xl">
<QBtn
:label="t('twoFactor.validate')"

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

@ -28,15 +28,14 @@ const countries = ref();
<QList dense>
<QItem>
<QItemSection>
<QInput
<VnInput
:label="t('route.cmr.list.cmrFk')"
v-model="params.cmrFk"
lazy-rules
>
<template #prepend>
<QIcon name="article" size="sm"></QIcon>
</template>
</QInput>
</VnInput>
</QItemSection>
</QItem>
<QItem>
@ -50,41 +49,38 @@ const countries = ref();
</QItem>
<QItem>
<QItemSection>
<QInput
<VnInput
:label="t('route.cmr.list.ticketFk')"
v-model="params.ticketFk"
lazy-rules
>
<template #prepend>
<QIcon name="vn:ticket" size="sm"></QIcon>
</template>
</QInput>
</VnInput>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<QInput
<VnInput
:label="t('route.cmr.list.routeFk')"
v-model="params.routeFk"
lazy-rules
>
<template #prepend>
<QIcon name="vn:delivery" size="sm"></QIcon>
</template>
</QInput>
</VnInput>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<QInput
<VnInput
:label="t('route.cmr.list.clientFk')"
v-model="params.clientFk"
lazy-rules
>
<template #prepend>
<QIcon name="vn:client" size="sm"></QIcon>
</template>
</QInput>
</VnInput>
</QItemSection>
</QItem>
<QItem>

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

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

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

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

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

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

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

@ -1,16 +1,19 @@
<script setup>
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 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 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 { t } = useI18n();
@ -281,7 +284,7 @@ onMounted(async () => {
label-set="Save"
label-cancel="Close"
>
<QInput
<VnInput
v-model="rows[props.pageIndex][col.field]"
dense
autofocus

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

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

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

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

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

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

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

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

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

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

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

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