surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- caaloghi, categorie

Browse Source
This commit is contained in:
Surya Paolo
2024-05-08 16:07:42 +02:00
parent 84e7f6e9f4
commit 58f53f8c52
20 changed files with 704 additions and 415 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
_ALL_SITES/gruppomacro.app/package.json
View File

@@ -1,8 +1,8 @@
{
"name": "riso",
"name": "gruppomacro",
"version": "0.6.1",
"description": "Siamo la Rete Italiana di Scambio Orizzontale, abbiamo creato questa piattaforma per metterla al servizio di chi vuole riscoprire il valore della condivisione e della cooperazione. Valori semplici e profondi che ci aiutano a ritrovare il Senso della Vita, perduto in questa società consumista, e riporti quei Sani Pricìpi Naturali ed Umani di Fratellanza che intere popolazioni antiche conoscevano bene.",
"productName": "Riso",
"description": "Gruppo Macro Editori",
"productName": "Gruppo Macro",
"author": "Paolo Arena",
"private": true,
"keywords": [],

2
now.txt
View File

@@ -1 +1 @@
TERMINA DI LAVORARE SU gruppomacro.app: (Sovrascrivo !)
TERMINA DI LAVORARE SU riso.app: (Sovrascrivo !)

2
src/common/shared_vuejs.ts
View File

@@ -2124,7 +2124,7 @@ export const shared_consts = {
{
label: 'Usato',
value: 2,
color: 'warning',
color: 'orange-9',
},
{
label: 'Download',

126
src/components/CCatalogoCard/CCatalogoCard.scss
View File

@@ -10,35 +10,6 @@
place-content: center;
}
.prod_price {
font-size: 1.1rem;
font-style: bold;
@media (max-width: 718px) {
font-size: 1rem;
}
}
.prod_sale_price {
font-size: 1.10rem;
font-style: bold;
@media (max-width: 718px) {
font-size: 1.05rem;
}
}
.prod_off_price {
font-size: 1rem;
@media (max-width: 718px) {
font-size: 0.85rem;
}
color: gray;
text-decoration: line-through;
padding-left: 5px;
}
.prod_disp {
font-size: 1.2rem;
@@ -136,18 +107,6 @@
height: 70px;
}
.image-container {
width: 300px;
height: 300px;
position: relative;
overflow: hidden;
@media (max-width: 718px) {
width: 200px;
height: 200px;
}
}
.book-image-fixed{
max-width: 300px;
max-height: 600px;
@@ -168,12 +127,6 @@
}
.book-card {
width: 300px;
background-color: #f8f8f8;
}
.book-card {
width: 300px;
background-color: #f8f8f8;
}
@@ -198,19 +151,32 @@
padding: 20px;
}
.book-title {
margin: 8px;
font-family: 'Poppins,sans-serif';
font-size: 1.15rem;
line-height: 20px;
font-weight: bold;
color: #333;
display: block;
text-align: center;
text-shadow: 1px 1px 1px #555;
}
.book-title[data-col=c1] {
font-size: 1.15rem;
line-height: 20px;
}
.book-title[data-col=c2] {
font-size: 1rem;
line-height: 19px;
}
.book-author {
font-size: 1.1em; /* Dimensione del font leggermente più grande per enfatizzare l'importanza del nome dell'autore */
color: grey; /* Colore scuro per garantire una buona leggibilità */
}
.author{
color: darkblue; /* Colore scuro per garantire una buona leggibilità */
text-transform: capitalize; /* Capitalizzazione delle iniziali per ogni parola del nome */
background-color: #f9f9f9; /* Sfondo leggermente diverso per evidenziare il nome */
@@ -219,6 +185,30 @@
font-style: italic; /* Stile del testo in corsivo per evidenziare l'autore */
}
.author[data-col=c1]{
font-size: 1.1em; /* Dimensione del font leggermente più grande per enfatizzare l'importanza del nome dell'autore */
}
.author[data-col=c2]{
font-size: 1em; /* Dimensione del font leggermente più grande per enfatizzare l'importanza del nome dell'autore */
}
.book-category {
font-size: 1em; /* Dimensione del font leggermente più grande per enfatizzare l'importanza del nome dell'autore */
color: grey; /* Colore scuro per garantire una buona leggibilità */
}
.category{
font-size: 1.0em; /* Dimensione del font leggermente più grande per enfatizzare l'importanza del nome dell'autore */
color: green; /* Colore scuro per garantire una buona leggibilità */
text-transform: capitalize; /* Capitalizzazione delle iniziali per ogni parola del nome */
background-color: #f9f9f9; /* Sfondo leggermente diverso per evidenziare il nome */
border-radius: 2px; /* Bordi arrotondati per un aspetto più soft-edged */
display: inline-block; /* Tratta il blocco come elementi inline-block per adattarlo al contenuto */
font-style: italic; /* Stile del testo in corsivo per evidenziare l'autore */
box-shadow: 0 0 5px gray;
}
.book-description {
font-size: 0.85rem;
color: #777;
@@ -226,12 +216,23 @@
.block-variazione {
border: 1px solid gray;
margin: auto;
// effetto 3d
box-shadow: 0 0 5px gray;
border-radius: 5px;
padding: 2px;
margin: 2px;
padding: 4px;
cursor: pointer;
.q-badge {
font-size: 1rem;
padding: 4px 6px;
}
}
.colfix_prodotti_1 {
width: 350px;
}
.colfix_prodotti_2 {
width: 175px;
}
.block-variazione-selected {
@@ -279,4 +280,23 @@
@media (max-width: 718px) {
margin-left: 5px;
}
}
}
.book-3d:hover img {
transform: translateZ(50px) rotateY(-20deg); /* Applica la trasformazione 3D quando si passa con il mouse sopra */
}
// Contenitore del libro, con effetto 3d, ed animazione 3D
.book-3d {
perspective: 1000px;
transform-style: preserve-3d;
transition: transform 0.5s ease-in-out;
transform-origin: center center;
img {
transform-origin: center center;
transition: transform 0.5s ease-in-out;
}
}

114
src/components/CCatalogoCard/CCatalogoCard.ts
View File

@@ -8,6 +8,7 @@ import { CTitleBanner } from '../CTitleBanner'
import { CCardState } from '../CCardState'
import { CCopyBtn } from '../CCopyBtn'
import { CMyValueDb } from '../CMyValueDb'
import { CPrice } from '../CPrice'
import { func_tools, toolsext } from '@store/Modules/toolsext'
@@ -48,8 +49,13 @@ export default defineComponent({
required: false,
default: false,
},
options: {
type: Object,
required: false,
default: () => { }
}
},
components: { CTitleBanner, CCardState, CCopyBtn, CMyValueDb, VuePdfApp },
components: { CTitleBanner, CCardState, CCopyBtn, CMyValueDb, VuePdfApp, CPrice },
setup(props, { emit }) {
const $q = useQuasar()
const { t } = useI18n()
@@ -91,7 +97,7 @@ export default defineComponent({
const openlistorders = ref(false)
const endload = ref(false)
const myproduct = ref(<IProduct>{})
const myproduct = ref(<IProduct | null>{})
const isFullScreen = ref(false)
const imageSrc = ref('URL_DEL_TUO_FILE_IMMAGINE')
@@ -129,10 +135,12 @@ export default defineComponent({
return false
}
const ris = await products.addtoCartBase({ $q, t, id: myproduct.value._id, order: myorder, addqty: add })
updateproduct()
if (ris && ris.myord) {
if (myproduct.value) {
const ris = await products.addtoCartBase({ $q, t, id: myproduct.value._id, order: myorder, addqty: add })
updateproduct()
if (ris && ris.myord) {
}
}
}
@@ -148,6 +156,9 @@ export default defineComponent({
function getSingleStorehouse() {
try {
if (!myproduct.value)
return ''
const mystore = myproduct.value.storehouses[0]
if (mystore)
return mystore.name + ' (' + mystore.city + ')'
@@ -183,28 +194,30 @@ export default defineComponent({
}
function updateproduct() {
async function updateproduct() {
myproduct.value = products.getProductById(props.id)
myproduct.value = null;
myproduct.value = await products.getProductById(props.id)
// products.updateQuantityAvailable(myproduct.value._id)
}
async function ricarica() {
endload.value = false
const prod = await products.loadProductById(myproduct.value._id)
if (prod) {
myproduct.value = prod
if (myproduct.value) {
const prod = await products.loadProductById(myproduct.value._id)
if (prod) {
myproduct.value = prod
}
}
load()
endload.value = true
await load()
}
function updateproductmodif() {
async function updateproductmodif() {
try {
myproduct.value = products.getProductById(props.id)
myproduct.value = await products.getProductById(props.id)
updateLabel()
} catch (e) {
@@ -256,9 +269,9 @@ export default defineComponent({
return ''
}
watch(() => props.id, (newval, oldval) => {
watch(() => props.id, async (newval, oldval) => {
// console.log('change code')
load()
await load()
})
watch(() => storeSelected.value, (newval, oldval) => {
@@ -289,12 +302,8 @@ export default defineComponent({
updateTimerLabel()
}
function mounted() {
load()
if (props.complete && myproduct.value && myproduct.value.arrvariazioni) {
indvariazSel.value = 0
}
async function mounted() {
await load()
// Start the timer when the component is mounted
startTimer();
@@ -306,15 +315,18 @@ export default defineComponent({
}
function updateTimerLabel() {
if (myproduct.value && myproduct.value.gasordine && myproduct.value.gasordine._id && myproduct.value.gasordine.dataora_chiusura_ordini)
if (myproduct.value && (myproduct.value.gasordine && myproduct.value.gasordine._id && myproduct.value.gasordine.dataora_chiusura_ordini))
timerLabelScadenza.value = tools.getCountDown(myproduct.value.gasordine.dataora_chiusura_ordini)
else
timerLabelScadenza.value = ''
}
function isOrdineChiuso() {
return myproduct.value.gasordine && myproduct.value.gasordine.dataora_chiusura_ordini &&
tools.getCountDown(myproduct.value.gasordine.dataora_chiusura_ordini) === ''
if (myproduct.value) {
return myproduct.value.gasordine && myproduct.value.gasordine.dataora_chiusura_ordini &&
tools.getCountDown(myproduct.value.gasordine.dataora_chiusura_ordini) === ''
} else
return false
}
function startTimer() {
@@ -322,17 +334,18 @@ export default defineComponent({
timerInterval.value = setInterval(() => updateTimerLabel(), 60000);
}
function load() {
async function load() {
indvariazSel.value = -1
initproduct()
updateproduct()
await updateproduct()
labelDataArrivoMerce.value = ''
labelDataRitiro.value = ''
// console.log('Load', myproduct.value.name)
arrordersCart.value = products.getOrdersCartInAttesaByIdProduct(myproduct.value._id)
if (!!myproduct.value) {
arrordersCart.value = products.getOrdersCartInAttesaByIdProduct(myproduct.value._id)
if (myproduct.value.storehouses && myproduct.value.storehouses.length === 1) {
// Se solo 1 presente, metto fisso l'unico negozio !
myorder.idStorehouse = myproduct.value.storehouses[0]._id
@@ -356,6 +369,13 @@ export default defineComponent({
updateLabel()
// console.log('myproduct', myproduct.value, 'arrvariaz', myproduct.value.arrvariazioni, 'compl', props.complete)
if (props.complete && myproduct.value && myproduct.value.arrvariazioni) {
// console.log('ENTRATO')
indvariazSel.value = 0
}
// console.log('°°° ENDLOAD °°°')
endload.value = true
}
@@ -366,25 +386,35 @@ export default defineComponent({
function visuListDisponibili() {
openlistorders.value = true
sumval.value = products.getSumQtyOrderProductInOrdersCart(myproduct.value._id)
if (myproduct.value) {
openlistorders.value = true
sumval.value = products.getSumQtyOrderProductInOrdersCart(myproduct.value._id)
listord.value = arrordersCart.value.filter((orderscart: IOrderCart) => orderscart.items!.reduce((accumulator, item) => {
return accumulator + item.order.quantity
}, 0))
listord.value = arrordersCart.value.filter((orderscart: IOrderCart) => orderscart.items!.reduce((accumulator, item) => {
return accumulator + item.order.quantity
}, 0))
} else
return false
}
function visuListBookable() {
openlistorders.value = true
sumval.value = products.getSumQtyPreOrderInOrdersCart(myproduct.value._id)
if (myproduct.value) {
openlistorders.value = true
sumval.value = products.getSumQtyPreOrderInOrdersCart(myproduct.value._id)
listord.value = arrordersCart.value.filter((orderscart: IOrderCart) => orderscart.items!.reduce((accumulator, item) => {
return accumulator + item.order.quantitypreordered
}, 0))
listord.value = arrordersCart.value.filter((orderscart: IOrderCart) => orderscart.items!.reduce((accumulator, item) => {
return accumulator + item.order.quantitypreordered
}, 0))
} else {
return ''
}
}
function isOrdGas(): boolean {
return (myproduct.value && !!myproduct.value.idGasordine && myproduct.value.gasordine! && myproduct.value.gasordine.active)
if (myproduct.value)
return (myproduct.value && !!myproduct.value.idGasordine && myproduct.value.gasordine! && myproduct.value.gasordine.active)
else
return false
}
function getpercqtaraggiunta(): number {
@@ -436,8 +466,10 @@ export default defineComponent({
function setvariazioneSelected(indvariaz: number) {
if (indvariazSel.value === indvariaz)
indvariazSel.value = -1
else
else {
indvariazSel.value = -1
indvariazSel.value = indvariaz
}
}
onMounted(mounted)

473
src/components/CCatalogoCard/CCatalogoCard.vue
View File

@@ -1,11 +1,17 @@
<template>
<div class="row items-start q-gutter-sm">
<div
:class="{
'row items-start q-gutter-sm': true,
}"
>
<q-spinner v-if="!endload" color="primary" size="3em" :thickness="2" />
<div
v-if="!!myproduct && !!myproduct.productInfo"
:class="{
'my-card-big': complete,
'book-card book-details': !complete,
'my-card-big book-details': complete,
'book-card': !complete,
colfix_prodotti_1: options.quante_col == 'c1',
colfix_prodotti_2: options.quante_col == 'c2',
}"
>
<q-toggle
@@ -18,7 +24,10 @@
>
</q-toggle>
<q-card-section>
<div class="flex" style="place-content: center">
<div
:class="{ 'flex q-pa-sm': true, 'shadow-2': options.in_3d }"
style="place-content: center"
>
<q-img
:src="
myproduct.productInfo.img
@@ -29,6 +38,7 @@
:class="{
'book-image-fixed': complete,
'cursor-pointer': !complete,
'shadow-4': true,
}"
@click="
complete
@@ -36,48 +46,82 @@
: naviga(`/catalogo/` + myproduct._id + '/' + cosa)
"
>
<div
class="absolute transparent"
style="left: 90%; top: 0; transform: translateX(-50%)"
>
<q-btn
color="blue"
class="semi-transparent"
round
icon="search"
@click="toggleFullScreen"
size="md"
/>
</div>
</q-img>
<q-btn
color="blue"
round
icon="search"
class="absolute semi-transparent ingrandisci"
size="md"
@click="toggleFullScreen"
style="left: 55%; top: 5px; transform: translateX(-50%)"
/>
<div class="scheda-book">
<q-card-title class="book-title"
>{{ myproduct.productInfo.name }}
<q-card-title>
<span class="book-title" :data-col="options.quante_col">{{
myproduct.productInfo.name
}}</span>
</q-card-title>
<q-card-subtitle
v-if="myproduct.productInfo.authors"
class="book-author"
:data-col="options.quante_col"
>
di
<span
v-for="author in myproduct.productInfo.authors"
v-for="(author, index) in myproduct.productInfo.authors"
:key="author._id"
>
{{ author.name }} {{ author.surname }}
<span class="author"
>{{ author.name }} {{ author.surname }}</span
>
<span v-if="index > 0">, </span>
</span>
</q-card-subtitle>
<q-card-subtitle
v-if="myproduct.productInfo.catprods && options.show_cat"
class="book-category"
>
<div
v-for="catprod in myproduct.productInfo.catprods"
:key="catprod._id"
>
<q-chip
dense
color="primary"
text-color="white"
icon="category"
>
{{ catprod.name }}
</q-chip>
</div>
</q-card-subtitle>
<q-card-main
v-if="myproduct.productInfo.short_descr"
v-if="
options.show_short_descr && myproduct.productInfo.short_descr
"
class="book-short-descr"
>{{
tools.firstchars(myproduct.productInfo.short_descr, 200, true)
}}</q-card-main
>
<div v-if="myproduct.isbn" class="book-isbn">
ISBN: {{ myproduct.isbn }}
</div>
<div v-if="myproduct.productInfo.numpages" class="book-pages">
<div
v-if="myproduct.productInfo.numpages && complete"
class="book-pages"
>
Pagine: {{ myproduct.productInfo.numpages }}
</div>
<div v-if="myproduct.productInfo.publisher" class="book-pages">
Casa Editrice: {{ myproduct.productInfo.publisher }}
</div>
<div
v-if="myproduct.productInfo.date_publishing"
v-if="myproduct.productInfo.date_publishing && complete"
class="book-data-pub"
>
Data Pubblicazione:
@@ -86,222 +130,185 @@
<q-separator class="q-my-sm"></q-separator>
<div
:class="
`row items-center q-pa-nome block-variazione ` +
(indvariazSel == index ? 'block-variazione-selected' : '')
"
v-for="(variazione, index) of myproduct.arrvariazioni"
:key="index"
@click="setvariazioneSelected(index)"
>
<div class="flex justify-between items-center q-mx-sm">
<q-badge
v-if="variazione.versione > 0"
:color="
shared_consts.VERSIONI_PRODOTTO[variazione.versione].color
"
>{{
shared_consts.VERSIONI_PRODOTTO[variazione.versione].label
}}</q-badge
>
<div v-if="variazione.formato && false">
formato: {{ variazione.formato }}
</div>
<div v-if="variazione.tipologia && false">
tipologia: {{ variazione.tipologia }}
</div>
<div v-if="variazione.edizione && false">
edizione: {{ variazione.edizione }}
</div>
<div v-if="variazione.status && false">
status: {{ variazione.status }}
</div>
<div v-if="variazione.preOrderDate">
preOrderDate: {{ variazione.preOrderDate }}
</div>
</div>
<q-item-section>
<q-item-label>
<span class="prod_sale_price" v-if="!!variazione.sale_price"
>{{
variazione.sale_price
? variazione.sale_price.toFixed(2)
: 0
}}
€</span
>
<span
:class="
variazione.sale_price ? 'prod_off_price' : 'prod_price'
"
v-if="!!variazione.price"
>{{ variazione.price ? variazione.price.toFixed(2) : 0 }} €
</span>
<span v-if="!!myproduct.after_price">{{
myproduct.after_price
}}</span>
</q-item-label>
<q-item-label
v-if="
myproduct.scontisticas && myproduct.scontisticas.length > 0
"
>
<div
class="prod_sconti"
v-for="(sconti, index) of myproduct.scontisticas"
:key="index"
>
{{ sconti.description }}
</div>
</q-item-label>
</q-item-section>
<q-item-section side v-if="!!variazione.quantita">
<q-icon
v-if="variazione.quantita > 10"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-check"
/>
<q-icon
v-else-if="
variazione.quantita > 3 && variazione.quantita <= 10
"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-exclamation"
/>
<q-icon
v-else-if="
variazione.quantita > 0 && variazione.quantita <= 3
"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-exclamation"
/>
<q-icon
v-else-if="variazione.quantita === 0"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-times"
/>
</q-item-section>
</div>
<q-slide-transition>
<div v-if="indvariazSel >= 0">
<div
v-if="
indvariazSel >= 0 &&
tools.disponibStr(
myproduct.arrvariazioni[indvariazSel].quantita
)
"
class="row justify-center q-mt-sm vertical-middle"
style="align-items: center"
>
<span class="q-mr-sm"
>{{ $t('ecomm.disponibilita') }}:&nbsp;</span
>
<q-chip
size="md"
dense
text-color="white"
:color="
tools.colordisponib(
myproduct.arrvariazioni[indvariazSel].quantita
)
"
>{{
tools.disponibStr(
myproduct.arrvariazioni[indvariazSel].quantita
)
}}</q-chip
>
</div>
<div
v-if="indvariazSel >= 0"
class="row justify-center vertical-middle"
style="align-items: center"
>
<span class="q-mr-sm">{{ $t('products.price') }}:</span>
<span
class="prod_sale_price text-bold"
v-if="!!myproduct.arrvariazioni[indvariazSel].sale_price"
>{{
myproduct.arrvariazioni[indvariazSel].sale_price
? myproduct.arrvariazioni[
indvariazSel
].sale_price.toFixed(2)
: 0
}}
€</span
>
<span
:class="
myproduct.arrvariazioni[indvariazSel].sale_price
? 'prod_off_price'
: 'prod_price'
"
v-if="!!myproduct.arrvariazioni[indvariazSel].price"
>{{
myproduct.arrvariazioni[indvariazSel].price
? myproduct.arrvariazioni[indvariazSel].price.toFixed(2)
: 0
}}
€
</span>
<span v-if="!!myproduct.after_price">{{
myproduct.after_price
}}</span>
</div>
<div
v-if="
indvariazSel >= 0 &&
!!myproduct.arrvariazioni[indvariazSel].formato
"
class="row justify-center q-ma-sm vertical-middle"
style="align-items: center"
>
<span class="q-mr-sm">{{ $t('products.formato') }}:</span>
<div v-if="options.show_price">
<div
:class="{
'row items-center q-pa-nome block-variazione': true,
'block-variazione-selected': indvariazSel == index,
}"
v-for="(variazione, index) of myproduct.arrvariazioni"
:key="index"
@click="setvariazioneSelected(index)"
>
<div class="flex justify-between items-center q-mx-sm">
<q-badge
v-if="myproduct.arrvariazioni[indvariazSel].versione > 0"
class="q-badge--large"
:color="
shared_consts.VERSIONI_PRODOTTO[
myproduct.arrvariazioni[indvariazSel].versione
].color
shared_consts.VERSIONI_PRODOTTO[variazione.versione].color
"
>{{
myproduct.arrvariazioni[indvariazSel].formato
}}</q-badge
>
<q-icon
v-if="variazione.versione > 0"
:name="tools.getIconByVersione(variazione.versione)"
color="white"
></q-icon
>&nbsp;
{{
shared_consts.VERSIONI_PRODOTTO[variazione.versione].label
}}
</q-badge>
<div v-if="variazione.formato && false">
formato: {{ variazione.formato }}
</div>
<div v-if="variazione.tipologia && false">
tipologia: {{ variazione.tipologia }}
</div>
<div v-if="variazione.edizione && false">
edizione: {{ variazione.edizione }}
</div>
<div v-if="variazione.status && false">
status: {{ variazione.status }}
</div>
<div v-if="variazione.preOrderDate">
preOrderDate: {{ variazione.preOrderDate }}
</div>
</div>
<div
v-if="indvariazSel >= 0"
class="row justify-center q-mt-sm"
>
<q-btn
<q-item-section>
<q-item-label>
<CPrice
:sale_price="variazione.sale_price"
:price="variazione.price"
></CPrice>
<span v-if="!!myproduct.after_price">{{
myproduct.after_price
}}</span>
</q-item-label>
<q-item-label
v-if="
myproduct.arrvariazioni[indvariazSel].addtocart_link &&
true
myproduct.scontisticas &&
myproduct.scontisticas.length > 0
"
:href="myproduct.arrvariazioni[indvariazSel].addtocart_link"
target="_blank"
color="primary"
icon="fas fa-cart-plus"
no-caps
:label="$t('products.addtocart_ext')"
></q-btn>
<q-btn
v-if="myproduct.productInfo.checkout_link && true"
:href="myproduct.productInfo.checkout_link"
target="_blank"
color="white"
icon="fas fa-shopping-cart"
outline
text-color="black"
no-caps
:label="$t('ecomm.carrello')"
></q-btn>
>
<div
class="prod_sconti"
v-for="(sconti, index) of myproduct.scontisticas"
:key="index"
>
{{ sconti.description }}
</div>
</q-item-label>
</q-item-section>
<q-item-section side v-if="!!variazione.quantita">
<q-icon
v-if="variazione.quantita > 10"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-check"
/>
<q-icon
v-else-if="
variazione.quantita > 3 && variazione.quantita <= 10
"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-exclamation"
/>
<q-icon
v-else-if="
variazione.quantita > 0 && variazione.quantita <= 3
"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-exclamation"
/>
<q-icon
v-else-if="variazione.quantita === 0"
:color="tools.colordisponib(variazione.quantita)"
name="fas fa-times"
/>
</q-item-section>
</div>
<div
v-for="(variazione, index) of myproduct.arrvariazioni"
:key="index"
>
<div v-show="indvariazSel == index">
<div
v-show="
indvariazSel >= 0 &&
tools.disponibStr(variazione.quantita)
"
class="row justify-center q-mt-sm vertical-middle"
style="align-items: center"
>
<span class="q-mr-sm"
>{{ $t('ecomm.disponibilita') }}:&nbsp;</span
>
<q-chip
size="md"
dense
text-color="white"
:color="tools.colordisponib(variazione.quantita)"
>{{ tools.disponibStr(variazione.quantita) }}</q-chip
>
</div>
<div
v-show="indvariazSel >= 0"
class="row justify-center vertical-middle"
style="align-items: center"
>
<span class="q-mr-sm">{{ $t('products.price') }}:</span>
<CPrice
:sale_price="variazione.sale_price"
:price="variazione.price"
bold="true"
></CPrice>
<span v-show="!!myproduct.after_price">{{
myproduct.after_price
}}</span>
</div>
<div
v-show="indvariazSel >= 0 && !!variazione.formato"
class="row justify-center q-ma-sm vertical-middle"
style="align-items: center"
>
<span class="q-mr-sm">{{ $t('products.formato') }}:</span>
<q-badge
v-show="variazione.versione > 0"
:color="
shared_consts.VERSIONI_PRODOTTO[variazione.versione]
.color
"
>{{ variazione.formato }}</q-badge
>
</div>
<div class="row justify-center q-mt-sm">
<q-btn
v-if="
indVariazSel >= 0 && variazione.addtocart_link && true
"
:href="variazione.addtocart_link"
target="_blank"
color="primary"
icon="fas fa-cart-plus"
class="q-mr-sm"
no-caps
:label="$t('products.addtocart_ext')"
></q-btn>
<q-btn
v-if="myproduct.productInfo.checkout_link && true"
:href="myproduct.productInfo.checkout_link"
target="_blank"
class="q-ml-sm"
color="white"
icon="fas fa-shopping-cart"
outline
text-color="black"
no-caps
:label="$t('ecomm.carrello')"
></q-btn>
</div>
</div>
</div>
</q-slide-transition>
</div>
</div>
</div>
</q-card-section>
@@ -490,12 +497,14 @@
: myproduct.productInfo.image_link
"
:alt="myproduct.productInfo.name"
:fit="tools.isMobile() ? 'fill' : 'none'"
:fit="tools.isMobile() ? 'fill' : 'contain'"
class="fullscreen-image"
@touchstart="onTouchStart"
@touchmove="onTouchMove"
@touchend="onTouchEnd"
ref="fullscreenImage"
/>
>
</q-img>
<br />
</div>
<div class="text-center">

103
src/components/CPrice/CPrice.scss Executable file
View File

@@ -0,0 +1,103 @@
.prod_price {
font-size: 1.1rem;
font-style: bold;
@media (max-width: 718px) {
font-size: 1rem;
}
}
.prod_sale_price {
font-size: 1.10rem;
font-style: bold;
@media (max-width: 718px) {
font-size: 1.05rem;
}
}
.prod_off_price {
font-size: 1rem;
@media (max-width: 718px) {
font-size: 0.85rem;
}
color: gray;
text-decoration: line-through;
padding-left: 8px;
}
/* ******** */
.a-price {
text-decoration: none;
position: relative;
line-height: normal
}
.a-price[data-a-strike=true]:after {
border-top: .1rem solid;
position: absolute;
content: "";
right: 0;
top: 50%;
left: 0
}
.a-price .a-price-fraction+.a-price-symbol {
left: .2em
}
.a-price .a-offscreen {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.a-price[data-a-size=mini][data-a-strike=true],.a-price[data-a-size="s"][data-a-strike=true],.a-price[data-a-size="b"][data-a-strike=true] {
display: inline-block;
text-decoration: inherit
}
.a-price[data-a-color=base] {
color: #0F1111
}
.a-price[data-a-color=price] {
color: #B12704
}
.a-price[data-a-color=secondary] {
color: #565959
}
.a-price[data-a-color=tertiary] {
color: #767676
}
.a-price[data-a-size$=plus] .a-price-fraction,.a-price[data-a-size$=plus] .a-price-symbol,.a-price[data-a-size$=l] .a-price-fraction,.a-price[data-a-size$=l] .a-price-symbol {
position: relative
}
.a-price[data-a-size$=plus] .a-price-decimal,.a-price[data-a-size$=l] .a-price-decimal {
position: absolute;
opacity: 0
}
.a-price[data-a-size=l] {
font-size: 1.3rem
}
.a-price[data-a-size=l] .a-price-symbol {
font-size: 1.1rem
}
.a-price[data-a-size=l] .a-price-fraction {
top: -.5em;
font-size: 0.8rem
}
.a-text-price {
color: inherit
}

37
src/components/CPrice/CPrice.ts Executable file
View File

@@ -0,0 +1,37 @@
import { defineComponent, onMounted, ref, toRef, watch } from 'vue'
import { tools } from '@store/Modules/tools'
export default defineComponent({
name: 'CPrice',
props: {
sale_price: {
type: Number,
},
price: {
type: Number,
},
bold: {
type: Boolean,
default: false,
},
},
setup(props) {
const real_price = ref(0)
onMounted(() => {
if (props.sale_price)
real_price.value = props.sale_price
else
real_price.value = props.price ? props.price : 0
})
return {
tools,
real_price,
}
},
})

25
src/components/CPrice/CPrice.vue Executable file
View File

@@ -0,0 +1,25 @@
<template>
<span class="a-price" data-a-size="l" data-a-color="base">
<span aria-hidden="true" v-if="!!real_price">
<span class="a-price-whole">{{ tools.getIntPart(real_price) }}</span>
<span class="a-price-decimal">,</span>
<span class="a-price-fraction">{{
tools.getDecPart2Digit(real_price)
}}</span>
<span class="a-price-symbol">€</span>
</span>
</span>
<span v-if="!!sale_price && !bold" :class="sale_price ? 'prod_off_price' : ''"
>{{ price ? price.toFixed(2) : 0 }} €
</span>
</template>
<script lang="ts" src="./CPrice.ts">
</script>
<style lang="scss" scoped>
@import './CPrice.scss';
</style>

1
src/components/CPrice/index.ts Executable file
View File

@@ -0,0 +1 @@
export { default as CPrice } from './CPrice.vue'

24
src/components/CProductCard/CProductCard.ts
View File

@@ -181,9 +181,9 @@ export default defineComponent({
}
function updateproduct() {
async function updateproduct() {
myproduct.value = products.getProductById(props.id)
myproduct.value = await products.getProductById(props.id)
// products.updateQuantityAvailable(myproduct.value._id)
}
@@ -194,15 +194,15 @@ export default defineComponent({
if (prod) {
myproduct.value = prod
}
load()
await load()
endload.value = true
}
function updateproductmodif() {
async function updateproductmodif() {
try {
myproduct.value = products.getProductById(props.id)
myproduct.value = await products.getProductById(props.id)
updateLabel()
} catch (e) {
@@ -250,16 +250,16 @@ export default defineComponent({
return ''
}
watch(() => props.id, (newval, oldval) => {
watch(() => props.id, async (newval, oldval) => {
// console.log('change code')
load()
await load()
})
watch(() => storeSelected.value, (newval, oldval) => {
myorder.idStorehouse = newval
})
function updateLabel() {
function updateLabel() {
let dataArrivoMerce = ''
let dataRitiro = ''
try {
@@ -283,8 +283,8 @@ export default defineComponent({
updateTimerLabel()
}
function mounted() {
load()
async function mounted() {
await load()
// Start the timer when the component is mounted
startTimer();
@@ -312,9 +312,9 @@ export default defineComponent({
timerInterval.value = setInterval(() => updateTimerLabel(), 60000);
}
function load() {
async function load() {
initproduct()
updateproduct()
await updateproduct()
labelDataArrivoMerce.value = ''
labelDataRitiro.value = ''

3
src/components/CProductCard/CProductCard.vue
View File

@@ -997,7 +997,8 @@
<q-img
:src="myproduct.productInfo.img ? `` + myproduct.productInfo.img : myproduct.productInfo.image_link"
:alt="myproduct.productInfo.name"
:fit="tools.isMobile() ? 'fill' : 'none'"
:fit="tools.isMobile() ? 'fill' : 'cover'"
class="fullscreen-image"
@touchstart="onTouchStart"
@touchmove="onTouchMove"
@touchend="onTouchEnd"

11
src/model/Products.ts
View File

@@ -31,9 +31,11 @@ export interface IProductInfo {
link?: string
link_scheda?: string
checkout_link?: string
idAuthors?: string[]
authors?: string[]
collezione?: string
publisher?: string
idPublisher?: string
publisher?: IPublisher
date_publishing?: Date
numpages?: number
productType?: number
@@ -191,6 +193,13 @@ export interface IQueryAI {
color?: string,
}
export interface IPublisher {
_id?: any
idapp?: string
name?: string
link?: string
}
export interface ISubCatProd {
_id?: any
idCatProd: string

4
src/statics/lang/it.js
View File

File diff suppressed because one or more lines are too long

35
src/store/Modules/tools.ts
View File

@@ -8582,8 +8582,41 @@ export const tools = {
}
return color
}
},
getIconByVersione (versione: number ) {
let str = ''
if (versione === shared_consts.VERSIONE.NUOVO)
str = 'fas fa-book'
else if (versione === shared_consts.VERSIONE.USATO)
// Versione Libro usato
str = 'fas fa-book-open'
else if (versione === shared_consts.VERSIONE.DOWNLOAD)
str = 'fas fa-file-download'
else if (versione === shared_consts.VERSIONE.DVD)
str = 'fas fa-film'
else if (versione === shared_consts.VERSIONE.PDF)
str = 'fas fa-file-pdf'
else if (versione === shared_consts.VERSIONE.EPUB)
// Libro elettronico EPUB
str = 'fas fa-book-open-reader'
else if (versione === shared_consts.VERSIONE.DVD)
str = 'fas fa-video'
else if (versione === shared_consts.VERSIONE.STREAMING)
str = 'fas fa-stream'
return str
},
// get the integer part, no round, of a decimal number
getIntPart(number: number) {
return Math.trunc(number)
},
// get the last 2 digit fraction part, of a decimal number
getDecPart2Digit(number: number) {
return Math.round(number * 100) % 100
}
// FINE !

21
src/store/Products.ts
View File

@@ -172,12 +172,6 @@ export const useProducts = defineStore('Products', {
}
},
getProductById: (state: IProductsState) => (id: string): IProduct => {
const prod = state.products.find((prod: IProduct) => prod._id === id)
return prod ? prod : getRecordProductEmpty()
},
getProductByCode: (state: IProductsState) => (code: string): IProduct => {
if (!code) {
return getRecordProductEmpty()
@@ -410,6 +404,19 @@ export const useProducts = defineStore('Products', {
this.products = [...arrprod]
},*/
async getProductById (id: string): Promise<IProduct> {
let prod = null
if (!this.products) {
// Se non lo carico all'avvio, allora fai la chiamata al server
prod = await this.loadProductById(id)
} else {
prod = this.products.find((prod: IProduct) => prod._id === id)
}
return prod ? prod : getRecordProductEmpty()
},
async loadProducts() {
const userStore = useUserStore()
@@ -882,7 +889,7 @@ export const useProducts = defineStore('Products', {
return ris
},
async addtoCartBase({ $q, t, id, order, addqty }: { $q: any, t: any, id: string, order: IOrder, addqty: boolean }) {
let product = this.getProductById(id)
let product = await this.getProductById(id)
return await this.addToCart({ product, order, addqty })
.then((ris) => {

39
src/views/ecommerce/catalogo/catalogo.scss
View File

@@ -4,14 +4,14 @@ $heightBtn: 100%;
height: 300px;
}
.container{
.container {
margin-top: 4px;
margin-bottom: 4px;
}
.prod_trov{
.prod_trov {
font-style: italic;
color: blue;
color: grey;
}
.fixed-group {
@@ -19,7 +19,36 @@ $heightBtn: 100%;
top: 0;
left: 0;
width: 100%;
background-color: #ffffff; /* Customize the background color as needed */
z-index: 1000; /* Adjust the z-index to ensure it's above other elements */
background-color: #ffffff;
/* Customize the background color as needed */
z-index: 1000;
/* Adjust the z-index to ensure it's above other elements */
transition: all 1s ease;
}
// Underline like a href
.category {
color: darkblue;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 19px;
cursor: pointer;
}
.category_sel {
color: white !important;
background: #5c8ef4 !important;
padding: 2px;
}
.category-title{
font-weight: bold;
font-size: 1.1rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
color: black;
text-align: center;
}

10
src/views/ecommerce/catalogo/catalogo.ts
View File

@@ -28,7 +28,7 @@ export default defineComponent({
const { t } = useI18n()
const search = ref('')
const filter = ref(<any>{
author: '',
publisher: '',
@@ -121,12 +121,12 @@ export default defineComponent({
// Use a regular expression to match whole words
let codeMatch = new RegExp(`\\b${lowerSearchText}\\b`, 'i');
let nameMatch = new RegExp(`\\b${lowerSearchText}`, 'i');
let nameMatch = new RegExp(`\\b(?=.*\\b${lowerSearchText.split(/\s+/).map(word => `(${word})\\b`).join('.*\\b')}\\b)`, 'i');
// Check if any word in lowerName starts with lowerSearchText
let anyWordStartsWithSearch = lowerName.split(/\s+/).some(word => nameMatch.test(word));
// Check if all words in lowerSearchText are present in lowerName
let allWordsPresent = lowerSearchText.split(/\s+/).every(word => new RegExp(`\\b${word}\\b`, 'i').test(lowerName));
return (codeMatch.test(product.productInfo.code!) || anyWordStartsWithSearch) && hasCategoria && productgassel;
return (codeMatch.test(product.productInfo.code!) || allWordsPresent) && hasCategoria && productgassel;
}
});
}

69
src/views/ecommerce/catalogo/catalogo.vue
View File

@@ -4,51 +4,7 @@
<q-spinner v-if="!loadpage" color="primary" size="3em" :thickness="2" />
</div>
<div v-if="loadpage" class="panel">
<div v-if="true">
<!--<CSelectUserActive></CSelectUserActive>-->
<!-- <div class="text-center text-h7 text-blue">Filtra Prodotti per:</div>
<div class="text-center">
<q-btn-toggle
v-model="cosa"
push
:size="tools.isMobile() ? '0.75rem' : '1rem'"
rounded
glossy
toggle-color="primary"
:options="[
{ value: shared_consts.PROD.GAS, slot: 'gas' },
{ value: shared_consts.PROD.BOTTEGA, slot: 'bottega' },
]"
>
<template v-slot:tutti>
<div class="row items-center no-wrap">
<div class="text-center">
{{ t('ecomm.tutti') }}
</div>
<q-icon right name="fas fa-check-square" />
</div>
</template>
<template v-slot:gas>
<div class="row items-center no-wrap">
<div class="text-center">
{{ t('gas.ordina_sul_gas') }}
</div>
<q-icon right name="fas fa-user-friends" />
</div>
</template>
<template v-slot:bottega>
<div class="row items-center no-wrap">
<div class="text-center">
{{ t('gas.bottega') }}
</div>
<q-icon right name="fas fa-store" />
</div>
</template>
</q-btn-toggle>
</div> -->
</div>
<div v-if="true"></div>
<div class="container">
<q-slide-transition>
@@ -163,9 +119,19 @@
</div>
</div>
<div v-else>
<div class="row q-gutter-xs justify-center q-mx-auto">
<div class="category-title">Categorie</div>
<div class="row q-gutter-xs justify-center q-mx-auto bg-blue-1">
<div v-for="(reccat, index) in getCatProds()" :key="index">
<q-btn
<span
:class="{
category: true,
category_sel: cat === reccat.value,
}"
@click="cat = reccat.value"
>{{ reccat.label }}
</span>
|
<!--<q-btn
:push="cat === reccat.value"
dense
:size="tools.isMobile() ? '0.70rem' : '1rem'"
@@ -176,7 +142,7 @@
:label="reccat.label"
@click="cat = reccat.value"
>
</q-btn>
</q-btn>-->
</div>
</div>
<div class="text-center q-py-sm prod_trov">
@@ -264,6 +230,13 @@
:id="product._id"
:complete="false"
:cosa="cosa"
:options="{
show_short_descr: false,
show_price: false,
show_cat: false,
quante_col: 'c2',
in_3d: false,
}"
/>
<CProductCard
v-else-if="product.active || show_hide"

14
src/views/ecommerce/catalogoInfo/catalogoInfo.vue
View File

@@ -3,7 +3,18 @@
<div class="panel">
<div class="container">
<div class="row justify-center">
<CCatalogoCard :id="id" :cosa="cosa" :complete="true"/>
<CCatalogoCard
:id="id"
:cosa="cosa"
:complete="true"
:options="{
show_short_descr: true,
show_price: true,
show_cat: true,
quante_col: 'c1',
in_3d: true,
}"
/>
</div>
</div>
</div>
@@ -11,7 +22,6 @@
</template>
<script lang="ts" src="./catalogoInfo.ts">
</script>
<style lang="scss" scoped>