fregat/web-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Revert "Add catalog product images"

Browse Source 
This reverts commit 898171cb5f.
This commit is contained in:
Ruslan Bakiev
2026-05-16 17:16:24 +07:00
parent 898171cb5f
commit f9be58d061
19 changed files with 12 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
app/components/catalog/CatalogConfigurator.vue
View File

@@ -6,7 +6,6 @@ import {
type CatalogProductTypeSettingsQuery,
type ClientProductsQuery,
} from '~/composables/graphql/generated';
import { catalogProductImageSrc } from '~/utils/catalogProductImages';
import { useClientCart } from '~/composables/useClientCart';
const props = defineProps<{
@@ -129,10 +128,6 @@ function createProductCover(name: string, sku: string) {
return `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
}
function productImageSrc(name: string, sku: string) {
return catalogProductImageSrc(name) ?? createProductCover(name, sku);
}
function hydrateProduct(product: ProductNode): ParsedProduct {
const normalizedTags = product.tags.map((tag) => normalizeText(tag)).filter(Boolean).sort((a, b) => a.localeCompare(b, 'ru'));
@@ -638,9 +633,9 @@ function productDetailPath(group: ProductGroup) {
class="absolute left-[-212px] top-28 z-10 hidden w-44 rounded-[28px] border border-[#e6efe9] bg-white p-3 shadow-[0_20px_40px_rgba(18,56,36,0.08)] transition hover:-translate-x-2 hover:shadow-[0_28px_48px_rgba(18,56,36,0.12)] 2xl:block"
>
<img
:src="productImageSrc(previousGroup.typeLabel, previousGroup.key)"
:src="createProductCover(previousGroup.typeLabel, previousGroup.key)"
:alt="`Перейти к товару ${previousGroup.typeLabel}`"
class="aspect-square w-full rounded-[20px] bg-[#f7fbf8] object-contain"
class="aspect-square w-full rounded-[20px] object-cover"
loading="lazy"
>
<p class="mt-3 text-sm font-semibold leading-5 text-[#163624]">{{ previousGroup.typeLabel }}</p>
@@ -652,9 +647,9 @@ function productDetailPath(group: ProductGroup) {
class="absolute right-[-212px] top-28 z-10 hidden w-44 rounded-[28px] border border-[#e6efe9] bg-white p-3 shadow-[0_20px_40px_rgba(18,56,36,0.08)] transition hover:translate-x-2 hover:shadow-[0_28px_48px_rgba(18,56,36,0.12)] 2xl:block"
>
<img
:src="productImageSrc(nextGroup.typeLabel, nextGroup.key)"
:src="createProductCover(nextGroup.typeLabel, nextGroup.key)"
:alt="`Перейти к товару ${nextGroup.typeLabel}`"
class="aspect-square w-full rounded-[20px] bg-[#f7fbf8] object-contain"
class="aspect-square w-full rounded-[20px] object-cover"
loading="lazy"
>
<p class="mt-3 text-sm font-semibold leading-5 text-[#163624]">{{ nextGroup.typeLabel }}</p>
@@ -681,9 +676,9 @@ function productDetailPath(group: ProductGroup) {
class="flex items-center gap-3 rounded-[24px] border border-[#e6efe9] bg-white p-3 shadow-[0_14px_30px_rgba(18,56,36,0.06)]"
>
<img
:src="productImageSrc(previousGroup.typeLabel, previousGroup.key)"
:src="createProductCover(previousGroup.typeLabel, previousGroup.key)"
:alt="`Перейти к товару ${previousGroup.typeLabel}`"
class="h-16 w-16 rounded-2xl bg-[#f7fbf8] object-contain"
class="h-16 w-16 rounded-2xl object-cover"
loading="lazy"
>
<span class="text-sm font-semibold text-[#163624]">{{ previousGroup.typeLabel }}</span>
@@ -695,9 +690,9 @@ function productDetailPath(group: ProductGroup) {
class="flex items-center gap-3 rounded-[24px] border border-[#e6efe9] bg-white p-3 shadow-[0_14px_30px_rgba(18,56,36,0.06)]"
>
<img
:src="productImageSrc(nextGroup.typeLabel, nextGroup.key)"
:src="createProductCover(nextGroup.typeLabel, nextGroup.key)"
:alt="`Перейти к товару ${nextGroup.typeLabel}`"
class="h-16 w-16 rounded-2xl bg-[#f7fbf8] object-contain"
class="h-16 w-16 rounded-2xl object-cover"
loading="lazy"
>
<span class="text-sm font-semibold text-[#163624]">{{ nextGroup.typeLabel }}</span>
@@ -708,9 +703,9 @@ function productDetailPath(group: ProductGroup) {
<div class="space-y-3">
<div class="overflow-hidden rounded-[32px] border border-[#e6efe9] bg-white p-4 shadow-[0_20px_40px_rgba(18,56,36,0.06)]">
<img
:src="productImageSrc(selectedGroup.typeLabel, articleLabel(selectedGroup))"
:src="createProductCover(selectedGroup.typeLabel, articleLabel(selectedGroup))"
:alt="selectedGroup.typeLabel"
class="aspect-[5/4] w-full rounded-[26px] bg-[#f7fbf8] object-contain"
class="aspect-[5/4] w-full rounded-[26px] object-cover"
loading="lazy"
>
</div>

9
app/components/catalog/CatalogProductTypeList.vue
View File

@@ -4,7 +4,6 @@ import {
ClientProductsDocument,
type ClientProductsQuery,
} from '~/composables/graphql/generated';
import { catalogProductImageSrc } from '~/utils/catalogProductImages';
type ProductNode = ClientProductsQuery['clientProducts'][number];
type ProductTypeCard = {
@@ -61,10 +60,6 @@ function createProductCover(name: string, sku: string) {
return `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
}
function productImageSrc(name: string, sku: string) {
return catalogProductImageSrc(name) ?? createProductCover(name, sku);
}
const productTypeCards = computed<ProductTypeCard[]>(() => {
const products = productsQuery.result.value?.clientProducts ?? [];
const query = search.value.trim().toLowerCase();
@@ -115,9 +110,9 @@ const productTypeCards = computed<ProductTypeCard[]>(() => {
class="surface-card block rounded-3xl p-3 transition hover:-translate-y-0.5 hover:shadow-[0_22px_42px_rgba(18,56,36,0.12)]"
>
<img
:src="productImageSrc(card.typeLabel, card.key)"
:src="createProductCover(card.typeLabel, card.key)"
:alt="`Превью ${card.typeLabel}`"
class="aspect-square w-full rounded-[24px] bg-[#f7fbf8] object-contain"
class="aspect-square w-full rounded-[24px] object-cover"
loading="lazy"
>