++ Cassa - parte 1

This commit is contained in:
Surya Paolo
2024-01-02 15:24:57 +01:00
parent a2cab9ca60
commit 89d095d1c9
18 changed files with 441 additions and 376 deletions

View File

@@ -1,163 +1,120 @@
<template>
<div class="row items-start q-gutter-md">
<q-spinner v-if="!endload" color="primary" size="3em" :thickness="2" />
<q-card
:class="{
'my-card-big': complete,
'my-card-prod': !complete,
'my-card-selected':
myorder && myorder.quantity + myorder.quantitypreordered > 0,
}"
v-if="!!myproduct && endload && !!myproduct.productInfo"
bordered
>
<q-card-section horizontal>
<q-img
:src="`` + myproduct.productInfo.img"
:alt="myproduct.productInfo.name"
class="col-7 cursor-pointer"
<q-card :class="{
'my-card-big': complete,
'my-card-prod': !complete,
'my-card-selected':
myorder && myorder.quantity + myorder.quantitypreordered > 0,
}" v-if="!!myproduct && endload && !!myproduct.productInfo" bordered>
<q-card-section horizontal class="image-section">
<div class="image-container">
<q-img :src="`` + myproduct.productInfo.img" :alt="myproduct.productInfo.name" class="cursor-pointer img-pic"
@click="complete ? toggleFullScreen : naviga(`/product/` + myproduct._id + '/' + cosa)"></q-img>
<q-btn color="primary" round icon="fas fa-eye" class="absolute semi-transparent" size="md"
@click="toggleFullScreen"
></q-img>
<q-btn
v-if="!complete"
fab
color="primary"
icon="fas fa-info"
class="absolute semi-transparent"
style="top: 0; right: 12px; transform: translateY(-90%)"
:to="`/product/` + myproduct._id + '/' + cosa"
/>
style="bottom: -10px; right: 0px; transform: translateY(-50%);" />
</div>
<q-btn v-if="!complete" fab color="primary" icon="fas fa-info" class="absolute semi-transparent"
style="top: 0; right: 12px; transform: translateY(-90%)" :to="`/product/` + myproduct._id + '/' + cosa" />
<q-list>
<q-item>
<q-item-section avatar>
<q-icon color="moneygreen" name="fas fa-euro-sign" class="icone_prod" />
</q-item-section>
<q-card-section>
<q-list>
<q-item>
<q-item-section avatar>
<q-icon
color="moneygreen"
name="fas fa-euro-sign"
class="icone_prod"
/>
</q-item-section>
<q-item-section>
<q-item-label>
<span class="prod_price" v-if="!!myproduct.price">{{
myproduct.price ? myproduct.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>
<q-item>
<q-item-section avatar v-if="myproduct.productInfo.weight">
<q-icon name="fas fa-balance-scale" class="icone_prod" />
</q-item-section>
<q-item-section v-if="myproduct.productInfo.weight">
<q-item-label>
<span class="text-black q-ml-xs text-h8" v-if="myproduct.productInfo.unit">
{{ myproduct.productInfo.weight }}
{{
tools.getUnitsMeasure(myproduct.productInfo.unit, true)
}}</span>
</q-item-label>
</q-item-section>
</q-item>
<q-item v-if="cosa === shared_consts.PROD.BOTTEGA ||
(cosa === shared_consts.PROD.GAS &&
products.getQtyAvailable(myproduct) > 0)
" :clickable="tools.isManager()" @click="
tools.isManager() &&
myproduct.QuantitaOrdinateInAttesa &&
myproduct.QuantitaOrdinateInAttesa > 0
? visuListDisponibili()
: null
">
<q-item-section avatar>
<q-icon color="green" name="fas fa-store" class="icone_prod" />
</q-item-section>
<q-item-section>
<q-item-label>
<span class="prod_price" v-if="!!myproduct.price">{{
myproduct.price ? myproduct.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>
<q-item>
<q-item-section avatar v-if="myproduct.productInfo.weight">
<q-icon name="fas fa-balance-scale" class="icone_prod" />
</q-item-section>
<q-item-section v-if="myproduct.productInfo.weight">
<q-item-label>
<span
class="text-black q-ml-xs text-h8"
v-if="myproduct.productInfo.unit"
>
{{ myproduct.productInfo.weight }}
<q-item-section>
<q-item-label class="subtit_prod">
{{ t('ecomm.available') }}
</q-item-label>
<q-item-label>
<span class="prod_disp">
{{ products.getQtyAvailable(myproduct) }}
</span>
<div class="prod_qtywarn">
<div v-if="tools.isManager() &&
!!myproduct.QuantitaOrdinateInAttesa
">
{{
tools.getUnitsMeasure(myproduct.productInfo.unit, true)
}}</span
>
</q-item-label>
</q-item-section>
</q-item>
<q-item
v-if="
cosa === shared_consts.PROD.BOTTEGA ||
(cosa === shared_consts.PROD.GAS &&
products.getQtyAvailable(myproduct) > 0)
"
:clickable="tools.isManager()"
@click="
tools.isManager() &&
myproduct.QuantitaOrdinateInAttesa &&
myproduct.QuantitaOrdinateInAttesa > 0
? visuListDisponibili()
: null
"
>
<q-item-section avatar>
<q-icon color="green" name="fas fa-store" class="icone_prod" />
</q-item-section>
<q-item-section>
<q-item-label class="subtit_prod">
{{ t('ecomm.available') }}
</q-item-label>
<q-item-label>
<span class="prod_disp">
{{ products.getQtyAvailable(myproduct) }}
</span>
<div class="prod_qtywarn">
<div
v-if="
tools.isManager() &&
!!myproduct.QuantitaOrdinateInAttesa
"
>
{{
t('ecomm.qta_in_attesa', {
qty: myproduct.QuantitaOrdinateInAttesa,
})
}}
</div>
t('ecomm.qta_in_attesa', {
qty: myproduct.QuantitaOrdinateInAttesa,
})
}}
</div>
</div>
</q-item-label>
</q-item-section>
<q-item-section v-if="tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
">
<q-item-section avatar>
<q-icon name="fas fa-store" style="padding-right: 16px !important" />
</q-item-section>
<q-item-section v-if="tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
">
<q-item-label> {{ t('ecomm.bloccati') }}: </q-item-label>
<q-item-label>
<span class="text-black q-ml-xs text-h8">
{{ products.getQtyBloccataAvailable(myproduct) }}</span>
</q-item-label>
</q-item-section>
<q-item-section
v-if="
tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
"
>
<q-item-section avatar>
<q-icon
name="fas fa-store"
style="padding-right: 16px !important"
/>
</q-item-section>
<q-item-section
v-if="
tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
"
>
<q-item-label> {{ t('ecomm.bloccati') }}: </q-item-label>
<q-item-label>
<span class="text-black q-ml-xs text-h8">
{{ products.getQtyBloccataAvailable(myproduct) }}</span
>
</q-item-label>
</q-item-section>
</q-item-section>
</q-item>
</q-list>
</q-card-section>
</q-item-section>
</q-item>
</q-list>
</q-card-section>
<q-card-section>
<div class="column items-center centeritems">
<div class="text-h7 boldhigh">
<div class="text-h7 boldhigh titolo_prod">
{{ myproduct.productInfo.name }}
</div>
<div class="product_code">
@@ -168,10 +125,29 @@
<q-card-section v-if="complete && myproduct.productInfo.description">
<div class="row items-center">
<div class="text-title text-grey-9">
<span
class="text-grey-7"
v-html="myproduct.productInfo.description"
></span>
<span class="text-grey-7" v-html="myproduct.productInfo.description"></span>
</div>
</div>
</q-card-section>
<q-card-section v-if="complete && myproduct.productInfo.ingredienti">
<div class="text-blue text-title row">
<q-icon size="sm" name="fas fa-list-ul" class="q-mr-sm" />
{{ t('products.ingredienti') }}
</div>
<div class="row items-center">
<div class="text-title text-grey-9">
<span class="text-grey-7" v-html="myproduct.productInfo.ingredienti"></span>
</div>
</div>
</q-card-section>
<q-card-section v-if="complete && myproduct.productInfo.valori_nutrizionali">
<div class="text-blue text-title row">
<q-icon size="sm" name="fas fa-info" class="q-mr-sm" />
{{ t('products.valori_nutrizionali') }}
</div>
<div class="row items-center">
<div class="text-title text-grey-9">
<span class="text-grey-7" v-html="myproduct.productInfo.valori_nutrizionali"></span>
</div>
</div>
</q-card-section>
@@ -180,19 +156,10 @@
<q-icon size="sm" name="fas fa-people-carry" class="q-mr-sm" />
{{ t('products.ritiro_presso') }}:
</div>
<div
class="text-green-6 text-title row items-center q-my-sm centeritems"
>
<div class="text-green-6 text-title row items-center q-my-sm centeritems">
<div v-if="getnumstore() > 1">
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
outlined
v-model="storeSelected"
:options="getStorehouses()"
:label="t('products.magazzino') + `:`"
emit-value
map-options
>
<q-select :behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'" outlined v-model="storeSelected"
:options="getStorehouses()" :label="t('products.magazzino') + `:`" emit-value map-options>
</q-select>
</div>
<div v-else>
@@ -202,9 +169,7 @@
</div>
</div>
</q-card-section>
<q-card-section
v-if="complete && myproduct.producer && myproduct.producer.city"
>
<q-card-section v-if="complete && myproduct.producer && myproduct.producer.city">
<div>
<div class="text-grey text-title row items-center q-mt-sm">
<q-icon name="map" class="q-mr-xs" />
@@ -212,19 +177,15 @@
<span class="text-blue q-ml-xs text-h8">
{{ myproduct.producer.city }} ({{
myproduct.producer.region
}})</span
>
}})</span>
</div>
</div>
<div
v-if="complete && myproduct.producer && myproduct.producer.name"
class="text-grey text-title row items-center"
>
<div v-if="complete && myproduct.producer && myproduct.producer.name"
class="text-grey text-title row items-center">
<q-icon name="place" class="q-mr-xs" />
{{ t('products.producer') }}:
<span class="text-black q-ml-xs text-h8">
{{ myproduct.producer.name }}</span
>
{{ myproduct.producer.name }}</span>
</div>
</q-card-section>
@@ -242,20 +203,15 @@
</q-item>
</q-card-section>
<q-card-section v-if="isOrdGas()">
<q-item
v-if="
products.getQtyBookableAvailable(myproduct) > 0 ||
myproduct.maxbookableGASQty > 0
"
:clickable="tools.isManager()"
@click="
tools.isManager() &&
myproduct.QuantitaPrenotateInAttesa &&
myproduct.QuantitaPrenotateInAttesa > 0
? visuListBookable()
: null
"
>
<q-item v-if="products.getQtyBookableAvailable(myproduct) > 0 ||
myproduct.maxbookableGASQty > 0
" :clickable="tools.isManager()" @click="
tools.isManager() &&
myproduct.QuantitaPrenotateInAttesa &&
myproduct.QuantitaPrenotateInAttesa > 0
? visuListBookable()
: null
">
<q-item-section avatar>
<q-icon color="blue" name="fas fa-edit" />
</q-item-section>
@@ -269,11 +225,8 @@
{{ products.getQtyBookableAvailable(myproduct) }}
</span>
<div class="prod_qtywarn">
<div
v-if="
tools.isManager() && !!myproduct.QuantitaPrenotateInAttesa
"
>
<div v-if="tools.isManager() && !!myproduct.QuantitaPrenotateInAttesa
">
{{
t('ecomm.qta_prenotate_in_attesa', {
qty: myproduct.QuantitaPrenotateInAttesa,
@@ -283,17 +236,11 @@
</div>
</q-item-label>
</q-item-section>
<q-item-section
v-if="
tools.isManager() &&
<q-item-section v-if="tools.isManager() &&
products.getQtyBloccataBookableAvailable(myproduct) > 0
"
>
">
<q-item-section avatar>
<q-icon
name="fas fa-store"
style="padding-right: 16px !important"
/>
<q-icon name="fas fa-store" style="padding-right: 16px !important" />
</q-item-section>
<q-item-section>
<q-item-label class="subtit_prod">
@@ -303,8 +250,7 @@
<span class="text-black q-ml-xs text-h8">
{{
products.getQtyBloccataBookableAvailable(myproduct)
}}</span
>
}}</span>
</q-item-label>
</q-item-section>
</q-item-section>
@@ -318,23 +264,13 @@
<q-item-label class="subtit_prod">
{{ t('products.gasordine') }}
</q-item-label>
<q-item-label
v-if="
tools.isArray(myproduct.gasordines) &&
myproduct.gasordines.length > 1 &&
(!myorder.idGasordine ||
myorder.quantity + myorder.quantitypreordered === 0)
"
>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
outlined
v-model="gasordineSelected"
:options="getGasordines()"
:label="t('products.select_gasordine') + `:`"
emit-value
map-options
>
<q-item-label v-if="tools.isArray(myproduct.gasordines) &&
myproduct.gasordines.length > 1 &&
(!myorder.idGasordine ||
myorder.quantity + myorder.quantitypreordered === 0)
">
<q-select :behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'" outlined v-model="gasordineSelected"
:options="getGasordines()" :label="t('products.select_gasordine') + `:`" emit-value map-options>
</q-select>
</q-item-label>
<q-item-label v-else>
@@ -345,40 +281,26 @@
</q-item-section>
</q-item>
<q-item
v-if="
tools.isManager() && products.getQtyBloccataAvailable(myproduct) > 0
"
>
<q-item v-if="tools.isManager() && products.getQtyBloccataAvailable(myproduct) > 0
">
<q-item-section>
<q-item-section avatar>
<q-icon
name="fas fa-store"
style="padding-right: 16px !important"
/>
<q-icon name="fas fa-store" style="padding-right: 16px !important" />
</q-item-section>
<q-item-section
v-if="
tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
"
>
<q-item-section v-if="tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
">
<q-item-label> {{ t('ecomm.bloccati') }}: </q-item-label>
<q-item-label>
<span class="text-black q-ml-xs text-h8">
{{ products.getQtyBloccataAvailable(myproduct) }}</span
>
{{ products.getQtyBloccataAvailable(myproduct) }}</span>
</q-item-label>
</q-item-section>
</q-item-section>
</q-item>
<q-item v-if="isOrdGas() && myproduct.qtyToReachForGas > 0">
<q-item-section avatar>
<q-icon
v-if="getpercqtaraggiunta() < 1"
color="orange"
name="fas fa-lightbulb"
/>
<q-icon v-if="getpercqtaraggiunta() < 1" color="orange" name="fas fa-lightbulb" />
<q-icon v-else color="green" name="fas fa-check" />
</q-item-section>
@@ -408,11 +330,8 @@
<q-linear-progress size="10px" :value="getpercqtaraggiunta()" />
</span>
<div class="prod_qtywarn">
<div
v-if="
tools.isManager() && !!myproduct.QuantitaOrdinateInAttesa
"
>
<div v-if="tools.isManager() && !!myproduct.QuantitaOrdinateInAttesa
">
{{
t('ecomm.qta_in_attesa', {
qty: myproduct.QuantitaOrdinateInAttesa,
@@ -422,29 +341,19 @@
</div>
</q-item-label>
</q-item-section>
<q-item-section
v-if="
tools.isManager() &&
<q-item-section v-if="tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
"
>
">
<q-item-section avatar>
<q-icon
name="fas fa-store"
style="padding-right: 16px !important"
/>
<q-icon name="fas fa-store" style="padding-right: 16px !important" />
</q-item-section>
<q-item-section
v-if="
tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
"
>
<q-item-section v-if="tools.isManager() &&
products.getQtyBloccataAvailable(myproduct) > 0
">
<q-item-label> {{ t('ecomm.bloccati') }}: </q-item-label>
<q-item-label>
<span class="text-black q-ml-xs text-h8">
{{ products.getQtyBloccataAvailable(myproduct) }}</span
>
{{ products.getQtyBloccataAvailable(myproduct) }}</span>
</q-item-label>
</q-item-section>
</q-item-section>
@@ -497,19 +406,11 @@
<q-card-section>
<div class="row justify-evenly">
<q-btn
icon="fas fa-cart-arrow-down"
:color="products.enableSubQty(myorder) ? 'negative' : 'grey'"
:disable="checkifCartDisable() || !products.enableSubQty(myorder)"
rounded
size="md"
:label="
t('products.subcart', {
qta: products.qtaNextSub(myorder, myproduct),
})
"
@click="addtoCart(false)"
>
<q-btn icon="fas fa-cart-arrow-down" :color="products.enableSubQty(myorder) ? 'negative' : 'grey'"
:disable="checkifCartDisable() || !products.enableSubQty(myorder)" rounded size="md" :label="t('products.subcart', {
qta: products.qtaNextSub(myorder, myproduct),
})
" @click="addtoCart(false)">
</q-btn>
<q-field outlined dense class="q-mx-xs">
@@ -520,31 +421,14 @@
</template>
</q-field>
<q-btn
icon-right="fas fa-cart-plus"
color="positive"
:disable="
checkifCartDisable() || !products.enableAddQty(myorder, myproduct)
"
rounded
size="md"
:label="
t('products.addcart', {
qta: products.qtaNextAdd(myorder, myproduct),
})
"
@click="addtoCart(true)"
>
<q-btn icon-right="fas fa-cart-plus" color="positive" :disable="checkifCartDisable() || !products.enableAddQty(myorder, myproduct)
" rounded size="md" :label="t('products.addcart', {
qta: products.qtaNextAdd(myorder, myproduct),
})
" @click="addtoCart(true)">
</q-btn>
<q-btn
v-if="myorder.quantity + myorder.quantitypreordered > 0"
rounded
icon="fas fa-shopping-cart"
color="primary"
:label="t('ecomm.btn_cassa')"
class="q-mb-xs q-mt-md"
to="/checkout"
></q-btn>
<q-btn v-if="myorder.quantity + myorder.quantitypreordered > 0" rounded icon="fas fa-shopping-cart"
color="primary" :label="t('ecomm.btn_cassa')" class="q-mb-xs q-mt-md" to="/checkout"></q-btn>
</div>
</q-card-section>
</q-card>
@@ -558,12 +442,7 @@
<q-btn flat round color="white" icon="close" v-close-popup></q-btn>
</q-toolbar>
<q-card-section class="q-pa-xs inset-shadow">
<q-markup-table
wrap-cells
bordered
separator="horizontal"
class="listaev__table"
>
<q-markup-table wrap-cells bordered separator="horizontal" class="listaev__table">
<thead>
<th>Data</th>
<th>Persona</th>
@@ -573,11 +452,7 @@
</thead>
<tbody>
<tr
v-for="(ordcart, index) of listord"
:key="index"
class="listaev listaev__table"
>
<tr v-for="(ordcart, index) of listord" :key="index" class="listaev listaev__table">
<td class="text-center">
<div>
{{ func_tools.getDateTimeShortStr(ordcart.created_at) }}
@@ -595,22 +470,14 @@
</td>
<td class="text-center">
<div v-for="(singleord, index) in ordcart.items" :key="index">
<span
v-if="
singleord.order.idProduct === myproduct._id &&
singleord.order.quantity > 0
"
>
{{ singleord.order.quantity }}</span
>
<span
v-if="
singleord.order.idProduct === myproduct._id &&
singleord.order.quantitypreordered > 0
"
>
{{ singleord.order.quantitypreordered }}</span
>
<span v-if="singleord.order.idProduct === myproduct._id &&
singleord.order.quantity > 0
">
{{ singleord.order.quantity }}</span>
<span v-if="singleord.order.idProduct === myproduct._id &&
singleord.order.quantitypreordered > 0
">
{{ singleord.order.quantitypreordered }}</span>
</div>
</td>
<td class="text-center">
@@ -632,38 +499,14 @@
</q-card>
</q-dialog>
<q-dialog
v-model="isFullScreen"
position="top"
:maximized="true"
class="q-pt-none"
>
<div
v-if="isFullScreen"
class="fullscreen-container"
@touchmove.prevent
@click="toggleFullScreen"
>
<img
:src="`` + myproduct.productInfo.img"
:alt="myproduct.productInfo.name"
class="fullscreen-image"
@touchstart="onTouchStart"
@touchmove="onTouchMove"
@touchend="onTouchEnd"
ref="fullscreenImage"
/>
<q-dialog v-model="isFullScreen" position="top" :maximized="true" class="q-pt-none">
<div v-if="isFullScreen" class="fullscreen-container" @touchmove.prevent @click="toggleFullScreen">
<q-img :src="`` + myproduct.productInfo.img" :alt="myproduct.productInfo.name" :fit="tools.isMobile() ? 'fill' : 'none'"
@touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="onTouchEnd" ref="fullscreenImage" />
<br />
</div>
<div class="text-center">
<q-btn
class="q-ma-md"
@click="isFullScreen = false"
label="Chiudi"
rounded
color="primary"
icon="close"
></q-btn>
<q-btn class="q-ma-md" @click="isFullScreen = false" label="Chiudi" rounded color="primary" icon="close"></q-btn>
</div>
</q-dialog>
</div>