From bb262a386fdc9cadfcd01e8ae6089c8b6da4591f Mon Sep 17 00:00:00 2001 From: admin Date: Sun, 12 Oct 2025 23:05:38 +0545 Subject: [PATCH] feat: brand page --- src/lib/utils/api.ts | 4 +- src/routes/brand/+page.server.ts | 29 ++ src/routes/brand/+page.svelte | 92 +++++ .../category/brand/[id]/+page.server.ts | 33 ++ src/routes/category/brand/[id]/+page.svelte | 317 ++++++++++++++++++ 5 files changed, 474 insertions(+), 1 deletion(-) create mode 100644 src/routes/brand/+page.server.ts create mode 100644 src/routes/category/brand/[id]/+page.server.ts create mode 100644 src/routes/category/brand/[id]/+page.svelte diff --git a/src/lib/utils/api.ts b/src/lib/utils/api.ts index f426d65..9d2a83f 100644 --- a/src/lib/utils/api.ts +++ b/src/lib/utils/api.ts @@ -15,7 +15,9 @@ export const endpoints = { category: { categories: '/category/', banner: '/category/banners', - search: (search: string) => `/category/search?${search}` + search: (search: string) => `/category/search?${search}`, + brands: '/category/brand', + brand: (id: string) => `/category/brand/show/${id}` }, cart: { getCart: '/cart/', diff --git a/src/routes/brand/+page.server.ts b/src/routes/brand/+page.server.ts new file mode 100644 index 0000000..11c410b --- /dev/null +++ b/src/routes/brand/+page.server.ts @@ -0,0 +1,29 @@ +import { VITE_BACKEND_URL } from '$env/static/private'; +import { endpoints } from '$lib/utils/api'; +import type { PageServerLoad } from './$types'; + +export const load: PageServerLoad = async ({ fetch }) => { + try { + const brand = await fetch(`${VITE_BACKEND_URL}${endpoints.category.brands}`, { + headers: { + Accept: 'application/json' + } + }); + if (!brand.ok) { + return { + status: 'error', + message: 'Unable to fetch brand' + }; + } + + return { + status: 'success', + brand: brand.json() + }; + } catch (err) { + return { + status: 'error', + error: err + }; + } +}; diff --git a/src/routes/brand/+page.svelte b/src/routes/brand/+page.svelte index e69de29..14f2388 100644 --- a/src/routes/brand/+page.svelte +++ b/src/routes/brand/+page.svelte @@ -0,0 +1,92 @@ + + +
+
+ + + {#each alphabets as letter} + + + b.name.slice(0, 1).toLowerCase() === letter)} + value={letter} + class="h-12 w-12 cursor-pointer rounded-sm bg-gray-100 data-[state=active]:bg-primary data-[state=active]:text-white" + >{letter.toUpperCase()} + + + {/each} + + {#each alphabets as letter} + {#each brands as brand} + {#if letter === brand?.name.slice(0, 1).toLowerCase()} + + +
+ {brand?.name} +

+ {brand?.name} +

+
+ + + {/if} + {/each} + {/each} + +
+
diff --git a/src/routes/category/brand/[id]/+page.server.ts b/src/routes/category/brand/[id]/+page.server.ts new file mode 100644 index 0000000..13f5020 --- /dev/null +++ b/src/routes/category/brand/[id]/+page.server.ts @@ -0,0 +1,33 @@ +import { VITE_BACKEND_URL } from '$env/static/private'; +import { endpoints } from '$lib/utils/api'; +import type { PageServerLoad } from './$types'; + +export const load: PageServerLoad = async ({ fetch, params, url }) => { + const brandId = params.id; + + // console.log(backendParams); + + try { + const brands = await fetch(`${VITE_BACKEND_URL}${endpoints.category.brand(brandId)}`, { + headers: { + Accept: 'application/json', + 'Content-Type': 'application/json' + } + }); + + // const response = await productCategory.text(); + + // console.log(response); + + return { + status: 'success', + brands: brands.json() + }; + } catch (err) { + return { + status: 'error', + message: 'Unable to fetch products', + error: err + }; + } +}; diff --git a/src/routes/category/brand/[id]/+page.svelte b/src/routes/category/brand/[id]/+page.svelte new file mode 100644 index 0000000..18aa4a3 --- /dev/null +++ b/src/routes/category/brand/[id]/+page.svelte @@ -0,0 +1,317 @@ + + +
+
+ {#await data?.productCategory} + + {:then category} +

{category?.category?.title}

+ {/await} +
+ +
+
+
+

Filter Options

+
+
+ {#each originalFilters as attribute} +
+

{attribute.title}

+
    + {#each attribute.values as value, index} +
  • + handleCheckboxChange('attributes[]', value.id, e)} + /> + +

    {value.value}

    + {#if !currentFilters.some((f) => f.title === attribute.title && f.values.some((v) => v.value === value.value))} + (0) + {/if} +
    • + {/each} +
+
+ {/each} +
+ +
+ +
+ + Filter + + + {#await data?.productCategory} +
+ {:then category} + {#if category?.attributes.length > 0} + {#each category?.attributes as attribute} + {attribute.title} + +
    + {#each attribute?.values as value} +
  • + +

    {value.value}

    +
    • + {/each} +
+ + {/each} + {/if} + {/await} + + + +
+ +
+
+ {#await data?.productCategory} + + {:then category} + {#if category?.products.length > 0} +

+ {category?.pagination.total_items} items found for "{page.url.searchParams.get('q') + ? category?.query || page.url.searchParams.get('q') + : page.url.searchParams.get('q') === '' + ? 'All' + : page.params.slug.replaceAll('-', ' ')} " +

+ {:else} +

0 items found for "{page.url.searchParams.get('q')}"

+ {/if} + {/await} +
+
+ {#await data?.productCategory} + {#each Array.from({ length: 15 })} + + {/each} + {:then category} + {#if category?.products.length > 0} + {#each category?.products as product} + + + {/each} + {:else} +
+

No Items available

+
+ {/if} + {/await} +
+ + {#await data?.productCategory then category} + + {#snippet children({ pages, currentPage })} + + + + + {#each pages as page (page.key)} + {#if page.type === 'ellipsis'} + + + + {:else} + + + {page.value} + + + {/if} + {/each} + + + + + {/snippet} + + {/await} +
+
+