Files
myprojplanet_vite/src/views/ecommerce/cash/cash.vue

118 lines
3.5 KiB
Vue
Executable File

<template>
<q-page>
<div class="text-center">
<q-spinner v-if="!loadpage" color="primary" size="3em" :thickness="2" />
</div>
<div v-if="loadpage" class="panel">
<div>
<div class="text-center">
<CSelectUserActive></CSelectUserActive>
<q-btn-toggle
v-model="cosa"
push
:size="tools.isMobile() ? '0.75rem' : '1rem'"
rounded
glossy
dense
toggle-color="purple"
:options="[
{ value: shared_consts.PROD.BOTTEGA, slot: 'bottega' },
{ value: shared_consts.PROD.GAS, slot: 'gas' },
]"
>
<template v-slot:gas>
<div class="row items-center no-wrap">
<div class="text-center">
{{ t('gas.ordina_sul_gas') }}
<br />
{{
t('gas.x_prodotti_gas', {
qta: productStore.getNumQtaGas(),
})
}}
</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') }}
<br />
{{
t('gas.x_prodotti_bottega', {
qta: productStore.getNumQtaBottega(),
})
}}
</div>
<q-icon right name="fas fa-store" />
</div>
</template>
</q-btn-toggle>
</div>
</div>
<div class="container">
<div
class="column text-center q-mx-auto q-py-sm q-mb-sm"
style="width: 350px; max-width: 100%"
>
<q-input
filled
stack-label
:dense="tools.isMobile() ? true : false"
:label="t('ecomm.code_o_text_search')"
v-model="search"
debounce="500"
class="q-ml-md"
>
<template v-slot:append>
<q-icon name="search" />
</template>
</q-input>
</div>
<div class="row q-gutter-xs justify-center q-mx-auto">
<div v-for="(reccat, index) in getCatProds()" :key="index">
<q-btn
:push="cat === reccat.value"
dense
:size="tools.isMobile() ? '0.70rem' : '1rem'"
:icon="reccat.icon ? reccat.icon : undefined"
:color="cat === reccat.value ? 'primary' : undefined"
:text-color="cat === reccat.value ? 'white' : 'black'"
rounded
:label="reccat.label"
@click="cat = reccat.value"
>
</q-btn>
</div>
</div>
<div class="text-center q-py-sm prod_trov">
{{
t('ecomm.prodotti_trovati', {
qta: getArrProducts.length,
qtatot: productStore.getNumProdTot(),
})
}}{{}}
</div>
<div class="row justify-around">
<div
class="q-pa-xs row items-start"
v-for="(product, index) in getArrProducts"
:key="index"
>
<CProductCard :id="product._id" :complete="false" :cosa="cosa" />
</div>
</div>
</div>
</div>
</q-page>
</template>
<script lang="ts" src="./cash.ts">
</script>
<style lang="scss" scoped>
@import './cash';
</style>