From 0d8c2780548039bd2adfe0770bb53779c2c035b4 Mon Sep 17 00:00:00 2001 From: Mamalizz Date: Fri, 3 Oct 2025 21:38:44 +0330 Subject: [PATCH 01/15] added vueuse router --- frontend/package-lock.json | 29 +++++++++++++++++++++++++++++ frontend/package.json | 1 + 2 files changed, 30 insertions(+) diff --git a/frontend/package-lock.json b/frontend/package-lock.json index df1c583..34e8f26 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -20,6 +20,7 @@ "@vuelidate/validators": "^2.0.4", "@vueuse/integrations": "^12.7.0", "@vueuse/nuxt": "^13.3.0", + "@vueuse/router": "^13.9.0", "animate.css": "^4.1.1", "axios": "^1.8.1", "date-fns-jalali": "^4.1.0-0", @@ -5997,6 +5998,34 @@ "node": ">=18.12.0" } }, + "node_modules/@vueuse/router": { + "version": "13.9.0", + "resolved": "https://registry.npmjs.org/@vueuse/router/-/router-13.9.0.tgz", + "integrity": "sha512-7AYay8Pv/0fC4D0eygbIyZuLyVs+9D7dsnO5D8aqat9qcOz91v/XFWR667WE1+p+OkU0ib+FjQUdnTVBNoIw8g==", + "license": "MIT", + "dependencies": { + "@vueuse/shared": "13.9.0" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "vue": "^3.5.0", + "vue-router": "^4.0.0" + } + }, + "node_modules/@vueuse/router/node_modules/@vueuse/shared": { + "version": "13.9.0", + "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-13.9.0.tgz", + "integrity": "sha512-e89uuTLMh0U5cZ9iDpEI2senqPGfbPRTHM/0AaQkcxnpqjkZqDYP8rpfm7edOz8s+pOCOROEy1PIveSW8+fL5g==", + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "vue": "^3.5.0" + } + }, "node_modules/@vueuse/shared": { "version": "12.8.2", "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-12.8.2.tgz", diff --git a/frontend/package.json b/frontend/package.json index 030da0b..f682ace 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -28,6 +28,7 @@ "@vuelidate/validators": "^2.0.4", "@vueuse/integrations": "^12.7.0", "@vueuse/nuxt": "^13.3.0", + "@vueuse/router": "^13.9.0", "animate.css": "^4.1.1", "axios": "^1.8.1", "date-fns-jalali": "^4.1.0-0", From 74039c8dedb1bf148f266e9601f05f1ca26b04a4 Mon Sep 17 00:00:00 2001 From: Mamalizz Date: Fri, 3 Oct 2025 21:39:01 +0330 Subject: [PATCH 02/15] added product link for cart item --- frontend/components/cart/index/CartItem.vue | 36 ++++++++++++++++++--- 1 file changed, 32 insertions(+), 4 deletions(-) diff --git a/frontend/components/cart/index/CartItem.vue b/frontend/components/cart/index/CartItem.vue index d1793a3..85276eb 100644 --- a/frontend/components/cart/index/CartItem.vue +++ b/frontend/components/cart/index/CartItem.vue @@ -36,7 +36,7 @@ const { isLoading: cartImageIsLoading } = useImage({ const { mutateAsync: deleteCartItem, isPending: deleteCartItemIsPending } = useDeleteCartItem(); -const { mutateAsync: addCartItem } = useAddCartItem(); +const { mutateAsync: addCartItem, isPending: addItemInCartQuantityIsPending } = useAddCartItem(); // methods @@ -153,7 +153,7 @@ watch( {{ data.product.title }} @@ -196,7 +196,22 @@ watch( /> -
{{ counter }}
+
+ +
+ +
+ {{ counter }} +
-
+
+ +
+ +
{{ counter }}
From 81ade1b8660dc5fea0f951dd9c8a55c2810aea84 Mon Sep 17 00:00:00 2001 From: Mamalizz Date: Fri, 3 Oct 2025 21:39:12 +0330 Subject: [PATCH 03/15] new changes --- frontend/components/global/Input.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/components/global/Input.vue b/frontend/components/global/Input.vue index c6710c2..0d210a8 100644 --- a/frontend/components/global/Input.vue +++ b/frontend/components/global/Input.vue @@ -5,7 +5,7 @@ type Props = { error?: boolean; message?: string; placeholder?: string; - modelValue: string; + modelValue: string | undefined; }; // props From af0352cce77a0dca445659873c2636e0fd9d2562 Mon Sep 17 00:00:00 2001 From: Mamalizz Date: Fri, 3 Oct 2025 21:39:45 +0330 Subject: [PATCH 04/15] connected to new url param --- frontend/components/global/Pagination.vue | 21 ++------------------- 1 file changed, 2 insertions(+), 19 deletions(-) diff --git a/frontend/components/global/Pagination.vue b/frontend/components/global/Pagination.vue index 9283789..ba04d08 100644 --- a/frontend/components/global/Pagination.vue +++ b/frontend/components/global/Pagination.vue @@ -1,6 +1,7 @@ From 20280b319b721dc85c5195af320c76c365a01299 Mon Sep 17 00:00:00 2001 From: Mamalizz Date: Fri, 3 Oct 2025 21:40:34 +0330 Subject: [PATCH 08/15] connected to new url param --- .../resellers/FilterResellersProducts.vue | 144 ++++++------------ 1 file changed, 50 insertions(+), 94 deletions(-) diff --git a/frontend/components/resellers/FilterResellersProducts.vue b/frontend/components/resellers/FilterResellersProducts.vue index fadaa12..24ee557 100644 --- a/frontend/components/resellers/FilterResellersProducts.vue +++ b/frontend/components/resellers/FilterResellersProducts.vue @@ -2,62 +2,44 @@ // imports import useGetResellersCategories from "~/composables/api/resellers/useGetResellersCategories"; -import useGetResellersProducts, { - type GetResellersProductsFilters, -} from "~/composables/api/resellers/useGetResellersProducts"; -import { PRODUCT_RANGE } from "~/constants"; +import useGetResellersProducts from "~/composables/api/resellers/useGetResellersProducts"; +import { useAppParams } from "~/composables/global/useAppParams"; +import { PRODUCT_RANGE, PRODUCTS_SORTS } from "~/constants"; // state const route = useRoute(); const router = useRouter(); -const params = inject("params") as GetResellersProductsFilters; +const { sort, in_stock, has_discount, price_gte, price_lte, search, page, slug } = useAppParams(); + +const isSideShow = useState("side-modal-resellers-product-filters"); const currentCategory = computed({ get: () => { - return Array.isArray(route.params.slug) ? route.params.slug[1] ?? undefined : undefined; + return Array.isArray(slug.value) ? slug.value[1] ?? undefined : undefined; }, set: (newValue) => { - router.push({ path: `/resellers/category/${newValue}`, query: { ...route.query } }); + isSideShow.value = false; + router.push({ + name: "resellers-slug", + params: { slug: ["category", `${newValue}`] }, + query: { ...route.query }, + }); }, }); -const sort_filter = ref([ - { title: "جدیدترین ها", value: "newest" }, - { title: "گران ترین ها", value: "price" }, - { title: "ارزان ترین ها", value: "-price" }, -]); - -const sliderValue = ref([params.price_gte ?? PRODUCT_RANGE.min, params.price_lte ?? PRODUCT_RANGE.max]); - -const has_discount = ref(Boolean(params.has_discount) ?? false); -const in_stock = ref(Boolean(params.in_stock) ?? false); +const sliderValue = ref([price_gte.value ?? PRODUCT_RANGE.min, price_lte.value ?? PRODUCT_RANGE.max]); const sliderValueDebounced = refDebounced(sliderValue, 1000); -const filtersSuccessMessage = ref<{ title: string; status: string } | null>(null); - // queries -const filters = computed(() => { - return { - sort: params.sort ?? "newest", - search: params.search ?? "", - price_gte: params.price_gte ?? PRODUCT_RANGE.min, - price_lte: params.price_lte ?? PRODUCT_RANGE.max, - in_stock: params.in_stock ?? false, - has_discount: params.has_discount ?? false, - category: currentCategory.value, - page: params.page ?? 1, - }; -}); - const { data: categories, suspense } = useGetResellersCategories(); await suspense(); -const { isPending: productsIsPending, status: productsStatus } = useGetResellersProducts(filters); +const { isPending: productsIsPending } = useGetResellersProducts(); // computed @@ -70,48 +52,23 @@ const allCategories = computed(() => { // methods const resetFilters = () => { - params.search = ""; - params.sort = ""; + search.value = ""; + sort.value = ""; sliderValue.value = [PRODUCT_RANGE.min, PRODUCT_RANGE.max]; - has_discount.value = false; - in_stock.value = false; + has_discount.value = "false"; + in_stock.value = "false"; + page.value = 1; - router.push({ path: `/resellers/`, query: { ...route.query } }); + isSideShow.value = false; }; +// watch + watch( () => sliderValueDebounced.value, (newValue) => { - params.price_gte = newValue[0]; - params.price_lte = newValue[1]; - } -); - -watch( - () => [has_discount.value, in_stock.value], - ([newHasDiscount, newInStock]) => { - params.has_discount = newHasDiscount; - params.in_stock = newInStock; - } -); - -watch( - () => productsStatus.value, - (nv) => { - if (nv == "success") { - filtersSuccessMessage.value = { - title: "فیلتر اعمال شد", - status: nv, - }; - } else if (nv == "error") { - filtersSuccessMessage.value = { - title: "خطایی در اعمال فیلتر رخ داد", - status: nv, - }; - } - setTimeout(() => { - filtersSuccessMessage.value = null; - }, 4000); + price_gte.value = newValue[0]; + price_lte.value = newValue[1]; } ); @@ -129,13 +86,13 @@ watch(
@@ -209,32 +166,31 @@ watch( -
- +