100 lines
4.1 KiB
Vue
Executable File
100 lines
4.1 KiB
Vue
Executable File
<template>
|
|
<q-card :class="getmycardcl()" v-if="!!myproduct">
|
|
<div v-if="myorder">
|
|
myorder: {{ myorder }}
|
|
</div>
|
|
|
|
<q-img :src="`` + myproduct.img" :alt="myproduct.name" :class="getclimg()"></q-img>
|
|
|
|
<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" />
|
|
|
|
<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>
|
|
<div v-if="complete && 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>
|
|
</div>
|
|
|
|
</div>
|
|
<div v-if="complete && 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>
|
|
</div>
|
|
<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>
|
|
</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>
|
|
<div class="row q-mb-sm no-wrap items-center centeritems">
|
|
<q-btn round size="xs" text-color="grey" icon="fas fa-minus" @click="decqty()"></q-btn>
|
|
<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">{{ order.quantity }}</div>
|
|
</template>
|
|
</q-field>
|
|
<q-btn round size="xs" text-color="grey" icon="fas fa-plus" @click="addqty()"></q-btn>
|
|
</div>
|
|
<div v-if="complete || getnumstore() > 1">
|
|
<div class="text-blue text-title row items-center q-mr-md centeritems">
|
|
<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 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>
|
|
</div>
|
|
<div v-else>
|
|
<span class="text-title text-center">{{ getSingleStorehouse() }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-card-section>
|
|
|
|
<q-separator />
|
|
|
|
<q-card-actions vertical align="center">
|
|
<q-btn icon="fas fa-cart-plus" color="primary" :disable="checkifCartDisable()" rounded size="md"
|
|
:label="t('products.addcart', {qta: order.quantity})" @click="addtoCart()">
|
|
</q-btn>
|
|
<!--
|
|
<q-btn :icon="iconWhishlist(myproduct)" flat color="primary" rounded label="Lista Desideri">
|
|
</q-btn>
|
|
-->
|
|
</q-card-actions>
|
|
</q-card>
|
|
</template>
|
|
|
|
<script lang="ts" src="./CProductCard.ts">
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './CProductCard.scss';
|
|
</style>
|