aa1
This commit is contained in:
Surya Paolo
@@ -1,79 +1,100 @@
|
||||
<template>
|
||||
<q-card :class="getmycardcl()" v-if="!!myproduct">
|
||||
<q-img
|
||||
:src="`` + myproduct.img"
|
||||
:alt="myproduct.name"
|
||||
:class="getclimg()"
|
||||
></q-img>
|
||||
<div class="q-pa-md row items-start q-gutter-md">
|
||||
<q-card :class="getmycardcl()" v-if="!!myproduct" bordered>
|
||||
<!--<q-img :src="`` + myproduct.img" :alt="myproduct.name" :class="getclimg()"></q-img>-->
|
||||
<img src="https://cdn.quasar.dev/img/parallax2.jpg">
|
||||
|
||||
<q-card-section>
|
||||
<q-btn
|
||||
v-if="!complete"
|
||||
fab
|
||||
color="primary"
|
||||
icon="fas fa-info"
|
||||
class="absolute"
|
||||
style="top: 0; right: 12px; transform: translateY(-50%)"
|
||||
:to="`/product/` + myproduct.code"
|
||||
/>
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-btn v-if="!complete" fab color="primary" icon="fas fa-info" class="absolute"
|
||||
style="top: 0; right: 12px; transform: translateY(-50%)" :to="`/product/` + myproduct.code" />
|
||||
|
||||
<div class="row items-center centeritems">
|
||||
<div class="text-h7 boldhigh">
|
||||
{{ myproduct.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="complete" class="row items-center">
|
||||
<div class="text-title text-grey-9">
|
||||
<span class="text-grey-7" v-html="myproduct.description"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row items-center centeritems">
|
||||
<div class="text-h7 boldhigh">
|
||||
{{ myproduct.name }}
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<div v-if="complete" class="row items-center">
|
||||
<div class="text-title text-grey-9">
|
||||
<span class="text-grey-7" v-html="myproduct.description"></span>
|
||||
</div>
|
||||
</div>
|
||||
</q-item>
|
||||
<q-item clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon color="moneygreen" name="fas fa-euro-sign" />
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
{{ t('products.price') }}
|
||||
</q-item-label>
|
||||
<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-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
<div>
|
||||
<div v-if="complete && myproduct.producer.city">
|
||||
<div v-if="complete && myproduct.producer && myproduct.producer.city">
|
||||
<div class="text-grey text-title row items-center q-mt-sm">
|
||||
<q-icon name="map" class="q-mr-xs" />
|
||||
{{ t('products.origine') }}:
|
||||
<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.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>
|
||||
<div
|
||||
v-if="complete && myproduct.weight"
|
||||
class="text-grey text-title row items-center"
|
||||
>
|
||||
<div v-if="complete && myproduct.weight" class="text-grey text-title row items-center">
|
||||
<q-icon name="fas fa-balance-scale" class="q-mr-xs" />
|
||||
{{ t('products.weight') }}:
|
||||
<span class="text-black q-ml-xs text-h8">
|
||||
{{ myproduct.weight }}
|
||||
{{ tools.getUnitsMeasure(myproduct.unit, true) }}</span
|
||||
>
|
||||
{{ tools.getUnitsMeasure(myproduct.unit, true) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--<q-rating v-model="myproduct.stars" :max="5" size="32px" readonly/>-->
|
||||
|
||||
<div class="row q-mb-sm no-wrap items-center centeritems">
|
||||
<div class="text-price no-wrap">
|
||||
<span v-if="!!myproduct.price"
|
||||
>€ {{ myproduct.price ? myproduct.price.toFixed(2) : 0 }}</span
|
||||
>
|
||||
<span v-if="!!myproduct.after_price">{{
|
||||
myproduct.after_price
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section avatar>
|
||||
<q-icon color="green" name="fas fa-store" />
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
{{ t('ecomm.available') }}
|
||||
</q-item-label>
|
||||
<q-item-label>
|
||||
<span class="prod_disp">
|
||||
{{ getQtyAvailable() }}
|
||||
</span>
|
||||
<span class="prod_qtywarn">
|
||||
{{ getQtyWarn() }}
|
||||
</span>
|
||||
</q-item-label>
|
||||
<q-item-label>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
</q-list>
|
||||
<div class="row q-mb-sm no-wrap items-center centeritems">
|
||||
<!--<q-btn
|
||||
round
|
||||
@@ -83,23 +104,12 @@
|
||||
@click="decqty()"
|
||||
></q-btn>-->
|
||||
|
||||
<q-btn
|
||||
icon="fas fa-cart-arrow-down"
|
||||
:color="enableSubQty() ? 'negative' : 'grey'"
|
||||
:disable="checkifCartDisable() || !enableSubQty()"
|
||||
rounded
|
||||
size="md"
|
||||
:label="t('products.subcart', { qta: 1 })"
|
||||
@click="addtoCart(false)"
|
||||
>
|
||||
<q-btn icon="fas fa-cart-arrow-down" :color="enableSubQty() ? 'negative' : 'grey'"
|
||||
:disable="checkifCartDisable() || !enableSubQty()" rounded size="md" :label="t('products.subcart', { qta: 1 })"
|
||||
@click="addtoCart(false)">
|
||||
</q-btn>
|
||||
|
||||
<q-field
|
||||
outlined
|
||||
dense
|
||||
style="width: 40px; height: 30px"
|
||||
class="q-mx-xs"
|
||||
>
|
||||
<q-field outlined dense style="width: 40px; height: 30px" class="q-mx-xs">
|
||||
<template v-slot:control>
|
||||
<div class="self-center no-outline" tabindex="0">
|
||||
{{ myorder.quantity }}
|
||||
@@ -108,15 +118,8 @@
|
||||
</q-field>
|
||||
|
||||
<!--<q-btn round size="xs" text-color="grey" icon="fas fa-plus" @click="addqty()"></q-btn>-->
|
||||
<q-btn
|
||||
icon-right="fas fa-cart-plus"
|
||||
color="positive"
|
||||
:disable="checkifCartDisable()"
|
||||
rounded
|
||||
size="md"
|
||||
:label="t('products.addcart', { qta: 1 })"
|
||||
@click="addtoCart(true)"
|
||||
>
|
||||
<q-btn icon-right="fas fa-cart-plus" color="positive" :disable="checkifCartDisable() || !enableAddQty()" rounded
|
||||
size="md" :label="t('products.addcart', { qta: 1 })" @click="addtoCart(true)">
|
||||
</q-btn>
|
||||
</div>
|
||||
<div v-if="complete || getnumstore() > 1">
|
||||
@@ -124,19 +127,10 @@
|
||||
<q-icon size="sm" name="fas fa-shipping-fast" 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>
|
||||
@@ -146,26 +140,17 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions vertical align="center">
|
||||
<q-btn
|
||||
v-if="myorder.quantity > 0"
|
||||
rounded
|
||||
icon="fas fa-shopping-cart"
|
||||
color="green"
|
||||
:label="$t('ecomm.btn_cassa')"
|
||||
class="q-mb-sm"
|
||||
to="/checkout"
|
||||
></q-btn>
|
||||
<!--
|
||||
<q-card-actions vertical align="center">
|
||||
<q-btn v-if="myorder.quantity > 0" rounded icon="fas fa-shopping-cart" color="primary"
|
||||
:label="$t('ecomm.btn_cassa')" class="q-mb-sm" to="/checkout"></q-btn>
|
||||
<!--
|
||||
<q-btn :icon="iconWhishlist(myproduct)" flat color="primary" rounded label="Lista Desideri">
|
||||
</q-btn>
|
||||
-->
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./CProductCard.ts">
|
||||
|
||||
Reference in New Issue
Block a user