Small changes

This commit is contained in:
William Buezas 2024-08-18 20:10:57 -03:00
parent 95a2bfb69c
commit 17a519e2ee
14 changed files with 100 additions and 33 deletions

View File

@ -227,7 +227,9 @@ defineExpose({
no-caps no-caps
flat flat
v-close-popup v-close-popup
/> >
<QTooltip>{{ t('cancel') }}</QTooltip>
</QBtn>
<QBtn <QBtn
v-if="defaultActions" v-if="defaultActions"
:label="t('save')" :label="t('save')"
@ -237,7 +239,9 @@ defineExpose({
flat flat
:disabled="!showBottomActions && !updatedColumns.length" :disabled="!showBottomActions && !updatedColumns.length"
@click="submit()" @click="submit()"
/> >
<QTooltip>{{ t('save') }}</QTooltip>
</QBtn>
<slot name="actions" :data="formData" /> <slot name="actions" :data="formData" />
</component> </component>
</QForm> </QForm>

View File

@ -4,6 +4,8 @@ import { useAppStore } from 'stores/app';
import ImageEditor from 'src/components/ui/ImageEditor.vue'; import ImageEditor from 'src/components/ui/ImageEditor.vue';
import { useI18n } from 'vue-i18n';
const props = defineProps({ const props = defineProps({
baseURL: { baseURL: {
type: String, type: String,
@ -60,6 +62,8 @@ const props = defineProps({
} }
}); });
const { t } = useI18n();
const app = useAppStore(); const app = useAppStore();
const showZoom = ref(false); const showZoom = ref(false);
const showEditForm = ref(false); const showEditForm = ref(false);
@ -77,7 +81,9 @@ const url = computed(() => {
round round
text-color="black" text-color="black"
@click.stop.prevent="showEditForm = !showEditForm" @click.stop.prevent="showEditForm = !showEditForm"
/> >
<QTooltip>{{ t('addOrEditImage') }}</QTooltip>
</QBtn>
<QImg <QImg
:class="{ :class="{
zoomIn: props.zoomSize, zoomIn: props.zoomSize,
@ -160,3 +166,16 @@ const url = computed(() => {
border-radius: 0%; border-radius: 0%;
} }
</style> </style>
<i18n lang="yaml">
en-US:
addOrEditImage: Add or update an image
es-ES:
addOrEditImage: Añadir o actualizar imagen
ca-ES:
addOrEditImage: Afegir o actualitzar Imatge
fr-FR:
addOrEditImage: Ajouter our mettre à jour l'image
pt-PT:
addOrEditImage: Adicionar ou atualizar imagem
</i18n>

View File

@ -68,10 +68,10 @@ onMounted(() => {
@keyup.enter="search()" @keyup.enter="search()"
:placeholder="props.placeholder || t('search')" :placeholder="props.placeholder || t('search')"
bg-color="white" bg-color="white"
isOutlined is-outlined
:clearable="false" :clearable="false"
> >
<template #append> <template #prepend>
<QIcon name="search" class="cursor-pointer" @click="search()" /> <QIcon name="search" class="cursor-pointer" @click="search()" />
</template> </template>
</VnInput> </VnInput>

View File

@ -62,5 +62,6 @@ export default {
// //
orderLoadedIntoBasket: 'Comanda carregada a la cistella!', orderLoadedIntoBasket: 'Comanda carregada a la cistella!',
at: 'a les', at: 'a les',
back: 'Tornar' back: 'Tornar',
remove: 'Esborrar'
}; };

View File

@ -76,6 +76,7 @@ export default {
orderLoadedIntoBasket: 'Order loaded into basket!', orderLoadedIntoBasket: 'Order loaded into basket!',
at: 'at', at: 'at',
back: 'Back', back: 'Back',
remove: 'Remove',
orders: 'Orders', orders: 'Orders',
order: 'Pending order', order: 'Pending order',

View File

@ -82,6 +82,7 @@ export default {
orderLoadedIntoBasket: '¡Pedido cargado en la cesta!', orderLoadedIntoBasket: '¡Pedido cargado en la cesta!',
at: 'a las', at: 'a las',
back: 'Volver', back: 'Volver',
remove: 'Borrar',
orders: 'Pedidos', orders: 'Pedidos',
order: 'Pedido pendiente', order: 'Pedido pendiente',

View File

@ -62,5 +62,6 @@ export default {
// //
orderLoadedIntoBasket: 'Commande chargée dans le panier!', orderLoadedIntoBasket: 'Commande chargée dans le panier!',
at: 'à', at: 'à',
back: 'Retour' back: 'Retour',
remove: 'Effacer'
}; };

View File

@ -63,5 +63,6 @@ export default {
// //
orderLoadedIntoBasket: 'Pedido carregado na cesta!', orderLoadedIntoBasket: 'Pedido carregado na cesta!',
at: 'às', at: 'às',
back: 'Voltar' back: 'Voltar',
remove: 'Eliminar'
}; };

View File

@ -14,6 +14,18 @@ export function date(val, format) {
return qdate.formatDate(val, format, i18n.global.tm('date')); return qdate.formatDate(val, format, i18n.global.tm('date'));
} }
export const formatDate = (timeStamp, format = 'YYYY-MM-DD') => {
if (!timeStamp) return '';
const { messages, locale } = i18n.global;
return qdate.formatDate(timeStamp, format, {
days: messages.value[locale.value].date.days,
months: messages.value[locale.value].date.months,
daysShort: messages.value[locale.value].date.daysShort,
monthsShort: messages.value[locale.value].date.monthsShort
});
};
/** /**
* @param {Date} timeStamp - La marca de tiempo que se va a formatear. Si no se proporciona, la función devolverá una cadena vacía. * @param {Date} timeStamp - La marca de tiempo que se va a formatear. Si no se proporciona, la función devolverá una cadena vacía.
* @param {Object} options - Un objeto que contiene las opciones de formato. * @param {Object} options - Un objeto que contiene las opciones de formato.
@ -22,24 +34,23 @@ export function date(val, format) {
* @param {boolean} options.shortDay - Indica si se debe usar una versión corta del día (por ejemplo, "Mon" en lugar de "Monday"). * @param {boolean} options.shortDay - Indica si se debe usar una versión corta del día (por ejemplo, "Mon" en lugar de "Monday").
* @returns {string} La fecha formateada como un título. * @returns {string} La fecha formateada como un título.
*/ */
export const formatStringDate = (timeStamp, options) => { export const formatDateTitle = (
timeStamp,
options = { showTime: false, showSeconds: false, shortDay: false }
) => {
if (!timeStamp) return ''; if (!timeStamp) return '';
const { t } = i18n.global;
const { t, messages, locale } = i18n.global;
const timeFormat = options.showTime const timeFormat = options.showTime
? options.showSeconds ? options.showSeconds
? ` [${t('at')}] hh:mm:ss` ? ` [${t('at')}] HH:mm:ss`
: ` [${t('at')}] hh:mm` : ` [${t('at')}] HH:mm`
: ''; : '';
const day = options.shortDay ? 'dd' : 'dddd'; const day = options.shortDay ? 'dd' : 'dddd';
const formatString = `${day}, D [${t('of')}] MMMM [${t('of')}] YYYY${timeFormat}`; const formatString = `${day}, D [${t('of')}] MMMM [${t('of')}] YYYY${timeFormat}`;
const formattedString = qdate.formatDate(timeStamp, formatString, { const formattedString = formatDate(timeStamp, formatString);
days: messages.value[locale.value].date.days,
months: messages.value[locale.value].date.months
});
return formattedString; return formattedString;
}; };

View File

@ -69,7 +69,11 @@ onBeforeUnmount(() => clearInterval(intervalId.value));
rounded rounded
no-caps no-caps
class="q-mr-sm" class="q-mr-sm"
/> >
<QTooltip>
{{ t('refresh') }}
</QTooltip>
</QBtn>
<QBadge class="q-pa-sm" v-if="connections.length" color="blue"> <QBadge class="q-pa-sm" v-if="connections.length" color="blue">
{{ connections?.length }} {{ t('connections') }} {{ connections?.length }} {{ t('connections') }}
</QBadge> </QBadge>
@ -121,7 +125,11 @@ onBeforeUnmount(() => clearInterval(intervalId.value));
flat flat
rounded rounded
@click="supplantUser(connection.user)" @click="supplantUser(connection.user)"
/> >
<QTooltip>
{{ t('supplantUser') }}
</QTooltip>
</QBtn>
</template> </template>
</CardList> </CardList>
</QList> </QList>
@ -132,16 +140,21 @@ onBeforeUnmount(() => clearInterval(intervalId.value));
en-US: en-US:
refresh: Refresh refresh: Refresh
connections: Connections connections: Connections
supplantUser: Supplant user
es-ES: es-ES:
refresh: Actualizar refresh: Actualizar
connections: Conexiones connections: Conexiones
supplantUser: Suplantar usuario
ca-ES: ca-ES:
refresh: Actualitzar refresh: Actualitzar
connections: Connexions connections: Connexions
supplantUser: Suplantar usuari
fr-FR: fr-FR:
refresh: Rafraîchir refresh: Rafraîchir
connections: Connexions connections: Connexions
supplantUser: Supplanter l'utilisateur
pt-PT: pt-PT:
refresh: Atualizar refresh: Atualizar
connections: Conexões connections: Conexões
supplantUser: Suplantar usuário
</i18n> </i18n>

View File

@ -21,13 +21,13 @@ onMounted(async () => getLinks());
<template> <template>
<QPage> <QPage>
<QList class="flex justify-center"> <QList class="flex justify-center q-gutter-md">
<QItem <QItem
v-for="(link, index) in links" v-for="(link, index) in links"
:key="index" :key="index"
:href="link.link" :href="link.link"
target="_blank" target="_blank"
class="flex" class="flex no-padding"
> >
<QCard class="card-container"> <QCard class="card-container">
<QImg <QImg

View File

@ -69,7 +69,9 @@ onMounted(async () => {
rounded rounded
no-caps no-caps
@click="goBack()" @click="goBack()"
/> >
<QTooltip>{{ t('back') }}</QTooltip>
</QBtn>
</Teleport> </Teleport>
<VnForm <VnForm
ref="vnFormRef" ref="vnFormRef"
@ -88,15 +90,16 @@ onMounted(async () => {
> >
<template #form="{ data }"> <template #form="{ data }">
<VnImg <VnImg
storage="catalog" :id="data.image"
:edit-image-name="data.image"
storage="news"
edit-schema="news"
size="200x200" size="200x200"
width="80px" width="80px"
height="80px" height="80px"
class="full-width" class="full-width"
:id="data.image"
rounded rounded
editable editable
edit-schema="catalog"
always-show-edit-button always-show-edit-button
/> />
<VnInput <VnInput

View File

@ -61,7 +61,9 @@ onMounted(async () => getNews());
:to="{ name: 'adminNewsDetails' }" :to="{ name: 'adminNewsDetails' }"
rounded rounded
no-caps no-caps
/> >
<QTooltip>{{ t('addNew') }}</QTooltip>
</QBtn>
</Teleport> </Teleport>
<QPage class="vn-w-xs"> <QPage class="vn-w-xs">
<QList class="flex justify-center"> <QList class="flex justify-center">
@ -80,15 +82,15 @@ onMounted(async () => getNews());
<template #prepend> <template #prepend>
<VnImg <VnImg
:id="newsItem.image" :id="newsItem.image"
:edit-image-name="newsItem.image"
storage="news" storage="news"
editSchema="news" edit-schema="news"
size="200x200" size="200x200"
width="80px" width="80px"
height="80px" height="80px"
class="q-mr-md" class="q-mr-md"
rounded rounded
editable editable
:editImageName="newsItem.image"
/> />
</template> </template>
<template #content> <template #content>
@ -108,7 +110,9 @@ onMounted(async () => getNews());
() => deleteNew(newsItem.id, index) () => deleteNew(newsItem.id, index)
) )
" "
/> >
<QTooltip>{{ t('remove') }}</QTooltip>
</QBtn>
</template> </template>
</CardList> </CardList>
</QList> </QList>

View File

@ -6,7 +6,7 @@ import { date as qdate } from 'quasar';
import VnInputDate from 'src/components/common/VnInputDate.vue'; import VnInputDate from 'src/components/common/VnInputDate.vue';
import { formatStringDate } from 'src/lib/filters.js'; import { formatDateTitle } from 'src/lib/filters.js';
import { useAppStore } from 'stores/app'; import { useAppStore } from 'stores/app';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
@ -79,14 +79,22 @@ watch(
rounded rounded
no-caps no-caps
class="q-mr-sm" class="q-mr-sm"
/> >
<QTooltip>
{{ t('refresh') }}
</QTooltip>
</QBtn>
<QBtn <QBtn
:label="t('connections')" :label="t('connections')"
icon="visibility" icon="visibility"
rounded rounded
no-caps no-caps
:to="{ name: 'adminConnections' }" :to="{ name: 'adminConnections' }"
/> >
<QTooltip>
{{ t('connections') }}
</QTooltip>
</QBtn>
</Teleport> </Teleport>
<QPage class="vn-w-xs column"> <QPage class="vn-w-xs column">
<QCard class="column q-pa-lg q-mb-md"> <QCard class="column q-pa-lg q-mb-md">
@ -112,7 +120,7 @@ watch(
<span>{{ visitsCardText }}</span> <span>{{ visitsCardText }}</span>
<span v-if="visitsData"> <span v-if="visitsData">
{{ {{
formatStringDate(visitsData.lastVisit, { formatDateTitle(visitsData.lastVisit, {
showTime: true, showTime: true,
showSeconds: true, showSeconds: true,
shortDay: true shortDay: true