0
0
Fork 0
This commit is contained in:
Joan Sanchez 2023-03-13 10:08:04 +01:00
commit e2f47ab9ca
12 changed files with 112 additions and 32 deletions

View File

@ -29,7 +29,7 @@ module.exports = configure(function (/* ctx */) {
// app boot file (/src/boot) // app boot file (/src/boot)
// --> boot files are part of "main.js" // --> boot files are part of "main.js"
// https://v2.quasar.dev/quasar-cli/boot-files // https://v2.quasar.dev/quasar-cli/boot-files
boot: ['i18n', 'axios'], boot: ['i18n', 'axios', 'vnDate'],
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
css: ['app.scss'], css: ['app.scss'],

18
src/boot/vnDate.js Normal file
View File

@ -0,0 +1,18 @@
import { boot } from 'quasar/wrappers';
export default boot(() => {
Date.vnUTC = () => {
const env = process.env.NODE_ENV;
if (!env || env === 'development') return new Date(Date.UTC(2001, 0, 1, 11));
return new Date();
};
Date.vnNew = () => {
return new Date(Date.vnUTC());
};
Date.vnNow = () => {
return new Date(Date.vnUTC()).getTime();
};
});

View File

@ -38,6 +38,10 @@ const props = defineProps({
type: Number, type: Number,
default: 10, default: 10,
}, },
userParams: {
type: Object,
default: null,
},
offset: { offset: {
type: Number, type: Number,
default: 500, default: 500,
@ -58,6 +62,7 @@ const arrayData = useArrayData(props.dataKey, {
where: props.where, where: props.where,
limit: props.limit, limit: props.limit,
order: props.order, order: props.order,
userParams: props.userParams
}); });
const store = arrayData.store; const store = arrayData.store;
@ -123,12 +128,20 @@ async function onLoad(...params) {
<template> <template>
<div> <div>
<div
v-if="!props.autoLoad && !store.data && !isLoading"
class="info-row q-pa-md text-center"
>
<h5>
{{ t('No data to display') }}
</h5>
</div>
<div <div
v-if="store.data && store.data.length === 0 && !isLoading" v-if="store.data && store.data.length === 0 && !isLoading"
class="info-row q-pa-md text-center" class="info-row q-pa-md text-center"
> >
<h5> <h5>
{{ t('components.smartCard.noData') }} {{ t('No results found') }}
</h5> </h5>
</div> </div>
<div v-if="props.autoLoad && !store.data" class="card-list q-gutter-y-md"> <div v-if="props.autoLoad && !store.data" class="card-list q-gutter-y-md">
@ -160,9 +173,6 @@ async function onLoad(...params) {
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
// .q-infinite-scroll {
// width: 100%;
// }
.info-row { .info-row {
width: 100%; width: 100%;
@ -171,3 +181,9 @@ async function onLoad(...params) {
} }
} }
</style> </style>
<i18n>
es:
No data to display: Sin datos que mostrar
No results found: No se han encontrado resultados
</i18n>

View File

@ -15,17 +15,23 @@ const props = defineProps({
required: false, required: false,
default: false, default: false,
}, },
params: {
type: Object,
required: false,
default: null,
},
}); });
const emit = defineEmits(['refresh', 'clear']); const emit = defineEmits(['refresh', 'clear']);
const arrayData = useArrayData(props.dataKey); const arrayData = useArrayData(props.dataKey);
const store = arrayData.store; const store = arrayData.store;
const userParams = ref({}); const userParams = ref(props.params);
onMounted(() => { onMounted(() => {
const params = store.userParams; const params = store.userParams;
if (params) {
if (Object.keys(params).length > 0) {
userParams.value = Object.assign({}, params); userParams.value = Object.assign({}, params);
} }
}); });

View File

@ -20,20 +20,27 @@ export function useArrayData(key, userOptions) {
const page = ref(1); const page = ref(1);
if (typeof userOptions === 'object') {
if (userOptions.filter) store.filter = userOptions.filter;
if (userOptions.url) store.url = userOptions.url;
if (userOptions.limit) store.limit = userOptions.limit;
if (userOptions.order) store.order = userOptions.order;
}
onMounted(() => { onMounted(() => {
setOptions()
const query = route.query; const query = route.query;
if (query.params) { if (query.params) {
store.userParams = JSON.parse(query.params); store.userParams = JSON.parse(query.params);
} }
}); });
function setOptions() {
if (typeof userOptions === 'object') {
for (const option in userOptions) {
if (userOptions[option] == null) continue
if (Object.prototype.hasOwnProperty.call(store, option)) {
store[option] = userOptions[option];
}
}
}
}
async function fetch({ append = false }) { async function fetch({ append = false }) {
if (!store.url) return; if (!store.url) return;

View File

@ -1,5 +1,6 @@
import toLowerCase from './toLowerCase'; import toLowerCase from './toLowerCase';
import toDate from './toDate'; import toDate from './toDate';
import toDateString from './toDateString';
import toCurrency from './toCurrency'; import toCurrency from './toCurrency';
import toPercentage from './toPercentage'; import toPercentage from './toPercentage';
import toLowerCamel from './toLowerCamel'; import toLowerCamel from './toLowerCamel';
@ -9,6 +10,7 @@ export {
toLowerCase, toLowerCase,
toLowerCamel, toLowerCamel,
toDate, toDate,
toDateString,
toCurrency, toCurrency,
toPercentage, toPercentage,
dashIfEmpty, dashIfEmpty,

View File

@ -0,0 +1,10 @@
export default function toDateString(date) {
let day = date.getDate();
let month = date.getMonth() + 1;
let year = date.getFullYear();
if (day < 10) day = `0${day}`;
if (month < 10) month = `0${month}`;
return `${year}-${month}-${day}`
}

View File

@ -393,7 +393,6 @@ export default {
logOut: 'Log Out', logOut: 'Log Out',
}, },
smartCard: { smartCard: {
noData: 'No data to display',
openCard: 'View card', openCard: 'View card',
openSummary: 'Open summary', openSummary: 'Open summary',
viewDescription: 'View description', viewDescription: 'View description',

View File

@ -393,7 +393,6 @@ export default {
logOut: 'Cerrar sesión', logOut: 'Cerrar sesión',
}, },
smartCard: { smartCard: {
noData: 'Sin datos que mostrar',
openCard: 'Ver ficha', openCard: 'Ver ficha',
openSummary: 'Abrir detalles', openSummary: 'Abrir detalles',
viewDescription: 'Ver descripción', viewDescription: 'Ver descripción',

View File

@ -16,7 +16,7 @@ const input = ref();
const newRma = ref({ const newRma = ref({
code: '', code: '',
crated: new Date(), crated: Date.vnNew(),
}); });
function onInputUpdate(value) { function onInputUpdate(value) {
@ -35,7 +35,7 @@ async function submit() {
newRma.value = { newRma.value = {
code: '', code: '',
created: new Date(), created: Date.vnNew(),
}; };
} }

View File

@ -3,6 +3,7 @@ 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 toDateString from 'filters/toDateString';
const { t } = useI18n(); const { t } = useI18n();
const props = defineProps({ const props = defineProps({
@ -12,6 +13,15 @@ const props = defineProps({
}, },
}); });
const from = Date.vnNew()
const to = Date.vnNew();
to.setDate(to.getDate() + 1)
const defaultParams = {
from: toDateString(from),
to: toDateString(to),
};
const workers = ref(); const workers = ref();
const provinces = ref(); const provinces = ref();
const states = ref(); const states = ref();
@ -30,7 +40,11 @@ const warehouses = ref();
@on-fetch="(data) => (workers = data)" @on-fetch="(data) => (workers = data)"
auto-load auto-load
/> />
<VnFilterPanel :data-key="props.dataKey" :search-button="true"> <VnFilterPanel
:data-key="props.dataKey"
:params="defaultParams"
:search-button="true"
>
<template #tags="{ tag, formatFn }"> <template #tags="{ tag, formatFn }">
<div class="q-gutter-x-xs"> <div class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong> <strong>{{ t(`params.${tag.label}`) }}: </strong>
@ -57,7 +71,7 @@ const warehouses = ref();
</q-item> </q-item>
<q-item> <q-item>
<q-item-section> <q-item-section>
<q-input v-model="params.dateFrom" :label="t('From')" mask="date"> <q-input v-model="params.from" :label="t('From')" mask="date">
<template #append> <template #append>
<q-icon name="event" class="cursor-pointer"> <q-icon name="event" class="cursor-pointer">
<q-popup-proxy <q-popup-proxy
@ -65,7 +79,7 @@ const warehouses = ref();
transition-show="scale" transition-show="scale"
transition-hide="scale" transition-hide="scale"
> >
<q-date v-model="params.dateFrom" landscape> <q-date v-model="params.from" landscape>
<div <div
class="row items-center justify-end q-gutter-sm" class="row items-center justify-end q-gutter-sm"
> >
@ -79,7 +93,6 @@ const warehouses = ref();
:label="t('globals.confirm')" :label="t('globals.confirm')"
color="primary" color="primary"
flat flat
@click="save"
v-close-popup v-close-popup
/> />
</div> </div>
@ -90,7 +103,7 @@ const warehouses = ref();
</q-input> </q-input>
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-input v-model="params.dateTo" :label="t('To')" mask="date"> <q-input v-model="params.to" :label="t('To')" mask="date">
<template #append> <template #append>
<q-icon name="event" class="cursor-pointer"> <q-icon name="event" class="cursor-pointer">
<q-popup-proxy <q-popup-proxy
@ -98,7 +111,7 @@ const warehouses = ref();
transition-show="scale" transition-show="scale"
transition-hide="scale" transition-hide="scale"
> >
<q-date v-model="params.dateTo" landscape> <q-date v-model="params.to" landscape>
<div <div
class="row items-center justify-end q-gutter-sm" class="row items-center justify-end q-gutter-sm"
> >
@ -278,8 +291,8 @@ en:
search: Contains search: Contains
clientFk: Customer clientFk: Customer
orderFK: Order orderFK: Order
dateFrom: From from: From
dateTo: To to: To
salesPersonFk: Salesperson salesPersonFk: Salesperson
stateFk: State stateFk: State
refFk: Invoice Ref. refFk: Invoice Ref.
@ -295,8 +308,8 @@ es:
search: Contiene search: Contiene
clientFk: Cliente clientFk: Cliente
orderFK: Pedido orderFK: Pedido
dateFrom: Desde from: Desde
dateTo: Hasta to: Hasta
salesPersonFk: Comercial salesPersonFk: Comercial
stateFk: Estado stateFk: Estado
refFk: Ref. Factura refFk: Ref. Factura

View File

@ -5,7 +5,7 @@ import { useQuasar } from 'quasar';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import Paginate from 'src/components/PaginateData.vue'; import Paginate from 'src/components/PaginateData.vue';
import { toDate, toCurrency } from 'src/filters/index'; import { toDate, toDateString, toCurrency } from 'src/filters/index';
import TicketSummaryDialog from './Card/TicketSummaryDialog.vue'; import TicketSummaryDialog from './Card/TicketSummaryDialog.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import TicketFilter from './TicketFilter.vue'; import TicketFilter from './TicketFilter.vue';
@ -46,6 +46,15 @@ const filter = {
], ],
}; };
const from = Date.vnNew();
const to = Date.vnNew();
to.setDate(to.getDate() + 1);
const userParams = {
from: toDateString(from),
to: toDateString(to),
};
function stateColor(row) { function stateColor(row) {
if (row.alertLevelCode === 'OK') return 'green'; if (row.alertLevelCode === 'OK') return 'green';
if (row.alertLevelCode === 'FREE') return 'blue-3'; if (row.alertLevelCode === 'FREE') return 'blue-3';
@ -104,6 +113,7 @@ function viewSummary(id) {
data-key="TicketList" data-key="TicketList"
url="Tickets/filter" url="Tickets/filter"
:filter="filter" :filter="filter"
:user-params="userParams"
order="id DESC" order="id DESC"
auto-load auto-load
> >
@ -123,9 +133,9 @@ function viewSummary(id) {
<q-item-label caption> <q-item-label caption>
{{ t('ticket.list.nickname') }} {{ t('ticket.list.nickname') }}
</q-item-label> </q-item-label>
<q-item-label>{{ <q-item-label>
row.nickname {{ row.nickname }}
}}</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-item-label caption> <q-item-label caption>