Move template tag
gitea/hedera-web/pipeline/pr-beta This commit looks good
Details
gitea/hedera-web/pipeline/pr-beta This commit looks good
Details
This commit is contained in:
parent
ad767ecd2b
commit
a227bc34fa
|
@ -1,308 +1,3 @@
|
||||||
<template>
|
|
||||||
<Teleport v-if="isHeaderMounted" to="#actions">
|
|
||||||
<div class="row">
|
|
||||||
<VnSearchBar
|
|
||||||
@on-search-error="
|
|
||||||
() => {
|
|
||||||
items = [];
|
|
||||||
search = '';
|
|
||||||
}
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
<QBtn
|
|
||||||
:icon="viewTypeButtonContent.icon"
|
|
||||||
:label="viewTypeButtonContent.label"
|
|
||||||
@click="onViewModeClick()"
|
|
||||||
rounded
|
|
||||||
no-caps
|
|
||||||
>
|
|
||||||
<QTooltip>
|
|
||||||
{{ viewTypeButtonContent.label }}
|
|
||||||
</QTooltip>
|
|
||||||
</QBtn>
|
|
||||||
<QBtn
|
|
||||||
icon="shopping_cart_checkout"
|
|
||||||
:label="t('shoppingCart')"
|
|
||||||
@click="redirectToBasket()"
|
|
||||||
rounded
|
|
||||||
no-caps
|
|
||||||
data-cy="catalogGoToBasketButton"
|
|
||||||
>
|
|
||||||
<QTooltip>
|
|
||||||
{{ t('shoppingCart') }}
|
|
||||||
</QTooltip>
|
|
||||||
</QBtn>
|
|
||||||
<QBtn
|
|
||||||
v-if="!isDesktop"
|
|
||||||
flat
|
|
||||||
dense
|
|
||||||
round
|
|
||||||
icon="menu"
|
|
||||||
aria-label="Menu"
|
|
||||||
@click="toggleRightDrawer()"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</Teleport>
|
|
||||||
<div>
|
|
||||||
<QDrawer v-model="rightDrawerOpen" side="right" :width="250" persistent>
|
|
||||||
<div class="q-pa-md">
|
|
||||||
<div class="basket-info q-gutter-y-sm">
|
|
||||||
<span v-if="order?.nickname">{{ order.nickname }}</span>
|
|
||||||
<span v-if="order?.sent">
|
|
||||||
{{
|
|
||||||
formatDateTitle(order.sent, {
|
|
||||||
shortDay: true,
|
|
||||||
shortMonth: true,
|
|
||||||
includeOfString: true
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
</span>
|
|
||||||
<QBtn
|
|
||||||
rounded
|
|
||||||
no-caps
|
|
||||||
@click="redirectToCheckout()"
|
|
||||||
data-cy="orderModifyButton"
|
|
||||||
color="light-green-7"
|
|
||||||
unelevated
|
|
||||||
text-color="white"
|
|
||||||
>
|
|
||||||
{{ t('modify') }}
|
|
||||||
</QBtn>
|
|
||||||
</div>
|
|
||||||
<div class="q-mt-md">
|
|
||||||
<div class="q-mb-xs text-grey-7">
|
|
||||||
{{ t('category') }}
|
|
||||||
<QIcon
|
|
||||||
v-if="category"
|
|
||||||
style="font-size: 1.3em"
|
|
||||||
name="cancel"
|
|
||||||
class="cursor-pointer"
|
|
||||||
:title="t('deleteFilter')"
|
|
||||||
@click="removeCategory()"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="categories">
|
|
||||||
<QBtn
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
class="category q-pa-sm"
|
|
||||||
v-for="cat in categories"
|
|
||||||
:class="{ active: category == cat.id }"
|
|
||||||
:key="cat.id"
|
|
||||||
@click="selectedCategory = cat.id"
|
|
||||||
data-cy="catalogCategoryButton"
|
|
||||||
>
|
|
||||||
<img :src="`statics/category/${cat.icon}.svg`" />
|
|
||||||
<QTooltip>{{ cat.name }}</QTooltip>
|
|
||||||
</QBtn>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="q-mt-md" v-if="selectedCategory">
|
|
||||||
<div class="q-mb-xs text-grey-7">
|
|
||||||
{{ t('filterBy') }}
|
|
||||||
</div>
|
|
||||||
<VnSelect
|
|
||||||
v-model="selectedType"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:options="itemFamilies"
|
|
||||||
:disable="!category"
|
|
||||||
:label="t('family')"
|
|
||||||
data-cy="catalogFamilySelect"
|
|
||||||
/>
|
|
||||||
<VnSelect
|
|
||||||
v-model="selectedColor"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:options="itemColors"
|
|
||||||
:disable="!category"
|
|
||||||
:label="t('color')"
|
|
||||||
/>
|
|
||||||
<VnSelect
|
|
||||||
v-model="selectedProducer"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:options="itemProducers"
|
|
||||||
:disable="!category"
|
|
||||||
:label="t('producer')"
|
|
||||||
/>
|
|
||||||
<VnSelect
|
|
||||||
v-model="selectedOrigin"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:options="itemOrigins"
|
|
||||||
:disable="!category"
|
|
||||||
:label="t('origin')"
|
|
||||||
/>
|
|
||||||
<VnSelect
|
|
||||||
v-model="selectedSubcategory"
|
|
||||||
option-value="id"
|
|
||||||
option-label="name"
|
|
||||||
:options="itemSubcategories"
|
|
||||||
:disable="!category"
|
|
||||||
:label="t('category')"
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
v-if="isSomeFilterSelected"
|
|
||||||
class="q-mt-md text-grey-7"
|
|
||||||
>
|
|
||||||
{{ t('orderBy') }}
|
|
||||||
</div>
|
|
||||||
<VnSelect
|
|
||||||
v-if="isSomeFilterSelected"
|
|
||||||
v-model="selectedOrderBy"
|
|
||||||
:options="orderByOptions"
|
|
||||||
option-value="value"
|
|
||||||
option-label="label"
|
|
||||||
:is-clearable="false"
|
|
||||||
:label="t('sort')"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<span
|
|
||||||
v-else
|
|
||||||
class="flex full-width justify-center q-pt-lg text-h6 text-grey-7"
|
|
||||||
>
|
|
||||||
{{ t('chooseCategory') }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</QDrawer>
|
|
||||||
<div
|
|
||||||
:class="
|
|
||||||
viewMode === 'grid'
|
|
||||||
? ' row justify-center q-gutter-md'
|
|
||||||
: 'column items-center'
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<QSpinner
|
|
||||||
v-if="loading"
|
|
||||||
color="primary"
|
|
||||||
size="3em"
|
|
||||||
:thickness="2"
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
v-else-if="!items || !items.length || !isSomeFilterSelected"
|
|
||||||
class="text-subtitle1 text-grey-7 q-pa-md"
|
|
||||||
>
|
|
||||||
<span>{{ t('pleaseSetFilter') }}</span>
|
|
||||||
</div>
|
|
||||||
<CatalogCard
|
|
||||||
v-else
|
|
||||||
v-for="_item in items"
|
|
||||||
:key="_item.id"
|
|
||||||
:item="_item"
|
|
||||||
:view-mode="viewMode"
|
|
||||||
@click="showItem(_item)"
|
|
||||||
data-cy="catalogCardElement"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<QDialog v-model="showItemDialog" @hide="resetAmounts()">
|
|
||||||
<QCard v-if="selectedItem" style="width: 25em" class="column">
|
|
||||||
<div class="q-pa-md relative-position">
|
|
||||||
<div class="q-mb-md" style="display: flex">
|
|
||||||
<VnImg
|
|
||||||
storage="catalog"
|
|
||||||
size="200x200"
|
|
||||||
:id="selectedItem.image"
|
|
||||||
width="112px"
|
|
||||||
height="112px"
|
|
||||||
rounded="bottom"
|
|
||||||
class="q-mr-md"
|
|
||||||
/>
|
|
||||||
<div class="column">
|
|
||||||
<div class="text-subtitle2">
|
|
||||||
{{ selectedItem.name }}
|
|
||||||
</div>
|
|
||||||
<span
|
|
||||||
class="text-subtitle2 text-grey-7 text-uppercase"
|
|
||||||
>
|
|
||||||
{{ selectedItem.subName }}
|
|
||||||
</span>
|
|
||||||
<span class="text-grey-7">
|
|
||||||
#{{ selectedItem.id }}</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="text-caption">
|
|
||||||
<div
|
|
||||||
v-for="(tag, index) in selectedItem.tags"
|
|
||||||
:key="index"
|
|
||||||
class="row"
|
|
||||||
>
|
|
||||||
<span class="text-grey-7" style="width: 35%">
|
|
||||||
{{ tag.name }}
|
|
||||||
</span>
|
|
||||||
<span>{{ tag.value }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-if="selectedItem.minQuantity"
|
|
||||||
class="row justify-end q-px-md absolute-bottom-right q-pa-md"
|
|
||||||
>
|
|
||||||
<QIcon
|
|
||||||
name="production_quantity_limits"
|
|
||||||
size="xs"
|
|
||||||
color="negative"
|
|
||||||
>
|
|
||||||
<QTooltip>
|
|
||||||
{{ t('minQuantity') }}
|
|
||||||
</QTooltip>
|
|
||||||
</QIcon>
|
|
||||||
<span class="text-negative text-caption">{{
|
|
||||||
selectedItem.minQuantity
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-for="(lot, index) in selectedItem.lots"
|
|
||||||
:key="index"
|
|
||||||
class="column"
|
|
||||||
>
|
|
||||||
<QSeparator />
|
|
||||||
<div class="row items-center q-px-md q-py-xs">
|
|
||||||
<span class="col">{{ currency(lot.price) }}</span>
|
|
||||||
<span class="col"> x{{ lot.grouping }}</span>
|
|
||||||
<QBtn
|
|
||||||
icon="add"
|
|
||||||
round
|
|
||||||
flat
|
|
||||||
dense
|
|
||||||
@click="onAddLotClick(lot)"
|
|
||||||
data-cy="addItemQuantityButton"
|
|
||||||
>
|
|
||||||
<QTooltip>{{ t('add') }}</QTooltip>
|
|
||||||
</QBtn>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row items-center justify-between q-pa-md bg-black">
|
|
||||||
<QBtn
|
|
||||||
icon="delete"
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
flat
|
|
||||||
color="white"
|
|
||||||
@click="resetAmounts()"
|
|
||||||
>
|
|
||||||
<QTooltip>{{ t('delete') }}</QTooltip>
|
|
||||||
</QBtn>
|
|
||||||
<span class="text-center text-white">{{ amount }}</span>
|
|
||||||
<QBtn
|
|
||||||
icon="check"
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
flat
|
|
||||||
color="white"
|
|
||||||
@click="onConfirmClick()"
|
|
||||||
data-cy="catalogAddToBasketButton"
|
|
||||||
>
|
|
||||||
<QTooltip>{{ t('confirm') }}</QTooltip>
|
|
||||||
</QBtn>
|
|
||||||
</div>
|
|
||||||
</QCard>
|
|
||||||
<QSpinner v-else color="primary" size="3em" :thickness="5" />
|
|
||||||
</QDialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import {
|
import {
|
||||||
|
@ -1055,6 +750,311 @@ onBeforeMount(async () => {
|
||||||
onBeforeUnmount(() => appStore.resetCustomTitle());
|
onBeforeUnmount(() => appStore.resetCustomTitle());
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Teleport v-if="isHeaderMounted" to="#actions">
|
||||||
|
<div class="row">
|
||||||
|
<VnSearchBar
|
||||||
|
@on-search-error="
|
||||||
|
() => {
|
||||||
|
items = [];
|
||||||
|
search = '';
|
||||||
|
}
|
||||||
|
"
|
||||||
|
/>
|
||||||
|
<QBtn
|
||||||
|
:icon="viewTypeButtonContent.icon"
|
||||||
|
:label="viewTypeButtonContent.label"
|
||||||
|
@click="onViewModeClick()"
|
||||||
|
rounded
|
||||||
|
no-caps
|
||||||
|
>
|
||||||
|
<QTooltip>
|
||||||
|
{{ viewTypeButtonContent.label }}
|
||||||
|
</QTooltip>
|
||||||
|
</QBtn>
|
||||||
|
<QBtn
|
||||||
|
icon="shopping_cart_checkout"
|
||||||
|
:label="t('shoppingCart')"
|
||||||
|
@click="redirectToBasket()"
|
||||||
|
rounded
|
||||||
|
no-caps
|
||||||
|
data-cy="catalogGoToBasketButton"
|
||||||
|
>
|
||||||
|
<QTooltip>
|
||||||
|
{{ t('shoppingCart') }}
|
||||||
|
</QTooltip>
|
||||||
|
</QBtn>
|
||||||
|
<QBtn
|
||||||
|
v-if="!isDesktop"
|
||||||
|
flat
|
||||||
|
dense
|
||||||
|
round
|
||||||
|
icon="menu"
|
||||||
|
aria-label="Menu"
|
||||||
|
@click="toggleRightDrawer()"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Teleport>
|
||||||
|
<div>
|
||||||
|
<QDrawer v-model="rightDrawerOpen" side="right" :width="250" persistent>
|
||||||
|
<div class="q-pa-md">
|
||||||
|
<div class="basket-info q-gutter-y-sm">
|
||||||
|
<span v-if="order?.nickname">{{ order.nickname }}</span>
|
||||||
|
<span v-if="order?.sent">
|
||||||
|
{{
|
||||||
|
formatDateTitle(order.sent, {
|
||||||
|
shortDay: true,
|
||||||
|
shortMonth: true,
|
||||||
|
includeOfString: true
|
||||||
|
})
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<QBtn
|
||||||
|
rounded
|
||||||
|
no-caps
|
||||||
|
@click="redirectToCheckout()"
|
||||||
|
data-cy="orderModifyButton"
|
||||||
|
color="light-green-7"
|
||||||
|
unelevated
|
||||||
|
text-color="white"
|
||||||
|
>
|
||||||
|
{{ t('modify') }}
|
||||||
|
</QBtn>
|
||||||
|
</div>
|
||||||
|
<div class="q-mt-md">
|
||||||
|
<div class="q-mb-xs text-grey-7">
|
||||||
|
{{ t('category') }}
|
||||||
|
<QIcon
|
||||||
|
v-if="category"
|
||||||
|
style="font-size: 1.3em"
|
||||||
|
name="cancel"
|
||||||
|
class="cursor-pointer"
|
||||||
|
:title="t('deleteFilter')"
|
||||||
|
@click="removeCategory()"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="categories">
|
||||||
|
<QBtn
|
||||||
|
flat
|
||||||
|
round
|
||||||
|
class="category q-pa-sm"
|
||||||
|
v-for="cat in categories"
|
||||||
|
:class="{ active: category == cat.id }"
|
||||||
|
:key="cat.id"
|
||||||
|
@click="selectedCategory = cat.id"
|
||||||
|
data-cy="catalogCategoryButton"
|
||||||
|
>
|
||||||
|
<img :src="`statics/category/${cat.icon}.svg`" />
|
||||||
|
<QTooltip>{{ cat.name }}</QTooltip>
|
||||||
|
</QBtn>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="q-mt-md" v-if="selectedCategory">
|
||||||
|
<div class="q-mb-xs text-grey-7">
|
||||||
|
{{ t('filterBy') }}
|
||||||
|
</div>
|
||||||
|
<VnSelect
|
||||||
|
v-model="selectedType"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
:options="itemFamilies"
|
||||||
|
:disable="!category"
|
||||||
|
:label="t('family')"
|
||||||
|
data-cy="catalogFamilySelect"
|
||||||
|
/>
|
||||||
|
<VnSelect
|
||||||
|
v-model="selectedColor"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
:options="itemColors"
|
||||||
|
:disable="!category"
|
||||||
|
:label="t('color')"
|
||||||
|
/>
|
||||||
|
<VnSelect
|
||||||
|
v-model="selectedProducer"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
:options="itemProducers"
|
||||||
|
:disable="!category"
|
||||||
|
:label="t('producer')"
|
||||||
|
/>
|
||||||
|
<VnSelect
|
||||||
|
v-model="selectedOrigin"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
:options="itemOrigins"
|
||||||
|
:disable="!category"
|
||||||
|
:label="t('origin')"
|
||||||
|
/>
|
||||||
|
<VnSelect
|
||||||
|
v-model="selectedSubcategory"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
:options="itemSubcategories"
|
||||||
|
:disable="!category"
|
||||||
|
:label="t('category')"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
v-if="isSomeFilterSelected"
|
||||||
|
class="q-mt-md text-grey-7"
|
||||||
|
>
|
||||||
|
{{ t('orderBy') }}
|
||||||
|
</div>
|
||||||
|
<VnSelect
|
||||||
|
v-if="isSomeFilterSelected"
|
||||||
|
v-model="selectedOrderBy"
|
||||||
|
:options="orderByOptions"
|
||||||
|
option-value="value"
|
||||||
|
option-label="label"
|
||||||
|
:is-clearable="false"
|
||||||
|
:label="t('sort')"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<span
|
||||||
|
v-else
|
||||||
|
class="flex full-width justify-center q-pt-lg text-h6 text-grey-7"
|
||||||
|
>
|
||||||
|
{{ t('chooseCategory') }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</QDrawer>
|
||||||
|
<div
|
||||||
|
:class="
|
||||||
|
viewMode === 'grid'
|
||||||
|
? ' row justify-center q-gutter-md'
|
||||||
|
: 'column items-center'
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<QSpinner
|
||||||
|
v-if="loading"
|
||||||
|
color="primary"
|
||||||
|
size="3em"
|
||||||
|
:thickness="2"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
v-else-if="!items || !items.length || !isSomeFilterSelected"
|
||||||
|
class="text-subtitle1 text-grey-7 q-pa-md"
|
||||||
|
>
|
||||||
|
<span>{{ t('pleaseSetFilter') }}</span>
|
||||||
|
</div>
|
||||||
|
<CatalogCard
|
||||||
|
v-else
|
||||||
|
v-for="_item in items"
|
||||||
|
:key="_item.id"
|
||||||
|
:item="_item"
|
||||||
|
:view-mode="viewMode"
|
||||||
|
@click="showItem(_item)"
|
||||||
|
data-cy="catalogCardElement"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<QDialog v-model="showItemDialog" @hide="resetAmounts()">
|
||||||
|
<QCard v-if="selectedItem" style="width: 25em" class="column">
|
||||||
|
<div class="q-pa-md relative-position">
|
||||||
|
<div class="q-mb-md" style="display: flex">
|
||||||
|
<VnImg
|
||||||
|
storage="catalog"
|
||||||
|
size="200x200"
|
||||||
|
:id="selectedItem.image"
|
||||||
|
width="112px"
|
||||||
|
height="112px"
|
||||||
|
rounded="bottom"
|
||||||
|
class="q-mr-md"
|
||||||
|
/>
|
||||||
|
<div class="column">
|
||||||
|
<div class="text-subtitle2">
|
||||||
|
{{ selectedItem.name }}
|
||||||
|
</div>
|
||||||
|
<span
|
||||||
|
class="text-subtitle2 text-grey-7 text-uppercase"
|
||||||
|
>
|
||||||
|
{{ selectedItem.subName }}
|
||||||
|
</span>
|
||||||
|
<span class="text-grey-7">
|
||||||
|
#{{ selectedItem.id }}</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text-caption">
|
||||||
|
<div
|
||||||
|
v-for="(tag, index) in selectedItem.tags"
|
||||||
|
:key="index"
|
||||||
|
class="row"
|
||||||
|
>
|
||||||
|
<span class="text-grey-7" style="width: 35%">
|
||||||
|
{{ tag.name }}
|
||||||
|
</span>
|
||||||
|
<span>{{ tag.value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
v-if="selectedItem.minQuantity"
|
||||||
|
class="row justify-end q-px-md absolute-bottom-right q-pa-md"
|
||||||
|
>
|
||||||
|
<QIcon
|
||||||
|
name="production_quantity_limits"
|
||||||
|
size="xs"
|
||||||
|
color="negative"
|
||||||
|
>
|
||||||
|
<QTooltip>
|
||||||
|
{{ t('minQuantity') }}
|
||||||
|
</QTooltip>
|
||||||
|
</QIcon>
|
||||||
|
<span class="text-negative text-caption">{{
|
||||||
|
selectedItem.minQuantity
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
v-for="(lot, index) in selectedItem.lots"
|
||||||
|
:key="index"
|
||||||
|
class="column"
|
||||||
|
>
|
||||||
|
<QSeparator />
|
||||||
|
<div class="row items-center q-px-md q-py-xs">
|
||||||
|
<span class="col">{{ currency(lot.price) }}</span>
|
||||||
|
<span class="col"> x{{ lot.grouping }}</span>
|
||||||
|
<QBtn
|
||||||
|
icon="add"
|
||||||
|
round
|
||||||
|
flat
|
||||||
|
dense
|
||||||
|
@click="onAddLotClick(lot)"
|
||||||
|
data-cy="addItemQuantityButton"
|
||||||
|
>
|
||||||
|
<QTooltip>{{ t('add') }}</QTooltip>
|
||||||
|
</QBtn>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row items-center justify-between q-pa-md bg-black">
|
||||||
|
<QBtn
|
||||||
|
icon="delete"
|
||||||
|
round
|
||||||
|
dense
|
||||||
|
flat
|
||||||
|
color="white"
|
||||||
|
@click="resetAmounts()"
|
||||||
|
>
|
||||||
|
<QTooltip>{{ t('delete') }}</QTooltip>
|
||||||
|
</QBtn>
|
||||||
|
<span class="text-center text-white">{{ amount }}</span>
|
||||||
|
<QBtn
|
||||||
|
icon="check"
|
||||||
|
round
|
||||||
|
dense
|
||||||
|
flat
|
||||||
|
color="white"
|
||||||
|
@click="onConfirmClick()"
|
||||||
|
data-cy="catalogAddToBasketButton"
|
||||||
|
>
|
||||||
|
<QTooltip>{{ t('confirm') }}</QTooltip>
|
||||||
|
</QBtn>
|
||||||
|
</div>
|
||||||
|
</QCard>
|
||||||
|
<QSpinner v-else color="primary" size="3em" :thickness="5" />
|
||||||
|
</QDialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.basket-info {
|
.basket-info {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
Loading…
Reference in New Issue