Alexandr SaVBaD Waltz
40ae24a04c
Fixes: 1) Correct file path imports by removing `.js` extensions in GraphQL fragments; 2) Resolve typo in `usePromocodeStore` composables to ensure consistent store usage; 3) Add missing `:type="submit"` to login form button for proper form submission handling; Extra: 1) Remove unused `.idea` and `README.md` files for repository cleanup; 2) Delete extraneous dependencies from `package-lock.json` for streamlined package management; 3) Refactor category slug handling with improved composable logic for cleaner route parameters and SEO alignment.
79 lines
No EOL
1.7 KiB
Vue
79 lines
No EOL
1.7 KiB
Vue
<template>
|
|
<div class="collection">
|
|
<ui-title>{{ t('home.collection.title') }}</ui-title>
|
|
<div class="container">
|
|
<div class="collection__wrapper">
|
|
<div class="collection__inner">
|
|
<home-collection-inner
|
|
v-for="tag in tags"
|
|
:key="tag.node.uuid"
|
|
:tag="tag.node"
|
|
/>
|
|
<client-only>
|
|
<home-collection-inner
|
|
v-if="newProducts.length > 0"
|
|
:tag="newProductsTag"
|
|
/>
|
|
<home-collection-inner
|
|
v-if="priceProducts.length > 0"
|
|
:tag="priceProductsTag"
|
|
/>
|
|
</client-only>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type {IProduct, IProductTag} from "~/types";
|
|
|
|
const props = defineProps<{
|
|
tags: { node: IProductTag }[],
|
|
newProducts: { cursor: string; node: IProduct }[],
|
|
priceProducts: { cursor: string; node: IProduct }[]
|
|
}>()
|
|
|
|
const { t } = useI18n();
|
|
|
|
const newProductsTag = computed(() => {
|
|
return {
|
|
name: t('home.collection.newTag'),
|
|
tagName: t('home.collection.newTag'),
|
|
uuid: 'new-products',
|
|
productSet: {
|
|
edges: props.newProducts
|
|
}
|
|
}
|
|
});
|
|
|
|
const priceProductsTag = computed(() => {
|
|
return {
|
|
name: t('home.collection.cheapTag'),
|
|
tagName: t('home.collection.cheapTag'),
|
|
uuid: 'price-products',
|
|
productSet: {
|
|
edges: props.priceProducts
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.collection {
|
|
&__wrapper {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 50px;
|
|
}
|
|
|
|
&__inner {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
gap: 100px;
|
|
}
|
|
}
|
|
</style> |