103 lines
2.4 KiB
Vue
103 lines
2.4 KiB
Vue
<script setup>
|
|
import { ref, onMounted, inject } from 'vue';
|
|
import VnImg from 'src/components/ui/VnImg.vue';
|
|
const jApi = inject('jApi');
|
|
const news = ref([]);
|
|
const showPreview = ref(false);
|
|
const selectedImageSrc = ref('');
|
|
|
|
const fetchData = async () => {
|
|
news.value = await jApi.query(
|
|
`SELECT title, text, image, id
|
|
FROM news
|
|
ORDER BY priority, created DESC`
|
|
);
|
|
};
|
|
|
|
onMounted(async () => await fetchData());
|
|
</script>
|
|
|
|
<template>
|
|
<div style="padding: 0">
|
|
<div class="q-pa-sm row items-start">
|
|
<div
|
|
class="new-card q-pa-sm"
|
|
v-for="myNew in news"
|
|
:key="myNew.id"
|
|
>
|
|
<QCard>
|
|
<VnImg
|
|
:id="myNew.image"
|
|
storage="news"
|
|
/>
|
|
|
|
<QCardSection>
|
|
<div class="text-h5">
|
|
{{ myNew.title }}
|
|
</div>
|
|
</QCardSection>
|
|
<QCardSection class="new-body">
|
|
<div
|
|
v-html="myNew.text"
|
|
class="card-text"
|
|
/>
|
|
</QCardSection>
|
|
</QCard>
|
|
</div>
|
|
</div>
|
|
<QPageSticky>
|
|
<QBtn
|
|
fab
|
|
icon="add_shopping_cart"
|
|
color="accent"
|
|
to="/ecomerce/catalog"
|
|
:title="$t('startOrder')"
|
|
/>
|
|
</QPageSticky>
|
|
</div>
|
|
<QDialog
|
|
v-model="showPreview"
|
|
@hide="selectedImageSrc = ''"
|
|
>
|
|
<QImg :src="selectedImageSrc" />
|
|
</QDialog>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.new-card {
|
|
width: 100%;
|
|
|
|
@media screen and (min-width: 800px) and (max-width: 1400px) {
|
|
width: 50%;
|
|
}
|
|
@media screen and (min-width: 1401px) and (max-width: 1920px) {
|
|
width: 33.33%;
|
|
}
|
|
@media screen and (min-width: 19021) {
|
|
width: 25%;
|
|
}
|
|
}
|
|
.new-body {
|
|
font-family: 'Open Sans';
|
|
}
|
|
|
|
.card-text {
|
|
:deep(a) {
|
|
color: $accent;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<i18n lang="yaml">
|
|
en-US:
|
|
startOrder: Start order
|
|
es-ES:
|
|
startOrder: Empezar pedido
|
|
ca-ES:
|
|
startOrder: Començar comanda
|
|
fr-FR:
|
|
startOrder: Lancer commande
|
|
pt-PT:
|
|
startOrder: Comece uma encomenda
|
|
</i18n>
|