Alexandr SaVBaD Waltz
129ad1a6fa
Fixes: None; Extra: 1) Create Pinia stores for app, user, category, and company management; 2) Add utility functions for error handling and category slug lookups; 3) Include German locale file and robots.txt for improved SEO and accessibility; 4) Add SVG assets and improve general folder structure for better maintainability.
69 lines
No EOL
1.5 KiB
TypeScript
69 lines
No EOL
1.5 KiB
TypeScript
import { GET_PRODUCTS } from '~/graphql/queries/standalone/products';
|
|
import type {IProductResponse} from '~/types';
|
|
|
|
interface ProdVars {
|
|
first: number,
|
|
categoriesSlugs: string,
|
|
attributes?: string,
|
|
orderBy?: string,
|
|
minPrice?: number,
|
|
maxPrice?: number,
|
|
productAfter?: string
|
|
}
|
|
|
|
export async function useStore(
|
|
slug: string,
|
|
attributes?: string,
|
|
orderBy?: string,
|
|
minPrice?: number,
|
|
maxPrice?: number,
|
|
productAfter?: string
|
|
) {
|
|
const prodVars = reactive<ProdVars>({
|
|
first: 15,
|
|
categoriesSlugs: slug,
|
|
attributes,
|
|
orderBy,
|
|
minPrice,
|
|
maxPrice,
|
|
productAfter
|
|
});
|
|
|
|
const { pending, data, error, refresh } = await useAsyncQuery<IProductResponse>(GET_PRODUCTS, prodVars);
|
|
|
|
const products = ref(data.value?.products.edges ?? []);
|
|
const pageInfo = computed(() => data.value?.products.pageInfo ?? null);
|
|
|
|
watch(error, e => e && console.error('useStore products error', e));
|
|
|
|
watch(
|
|
() => prodVars.productAfter,
|
|
async (newCursor, oldCursor) => {
|
|
if (!newCursor || newCursor === oldCursor) return;
|
|
await refresh();
|
|
const newEdges = data.value?.products.edges ?? [];
|
|
products.value.push(...newEdges);
|
|
}
|
|
);
|
|
|
|
watch(
|
|
[
|
|
() => prodVars.attributes,
|
|
() => prodVars.orderBy,
|
|
() => prodVars.minPrice,
|
|
() => prodVars.maxPrice
|
|
],
|
|
async () => {
|
|
prodVars.productAfter = '';
|
|
await refresh();
|
|
products.value = data.value?.products.edges ?? [];
|
|
}
|
|
);
|
|
|
|
return {
|
|
pending,
|
|
products,
|
|
pageInfo,
|
|
prodVars
|
|
};
|
|
} |