connected to new url param
This commit is contained in:
@@ -14,16 +14,15 @@ definePageMeta({
|
||||
|
||||
import { usePushNotifications } from "~/composables/global/usePushNotifications";
|
||||
import useSubscribeNotification from "~/composables/api/notifications/useSubscribeNotification";
|
||||
import useGetAllNotifications, {
|
||||
type GetAllNotificationsRequest,
|
||||
} from "~/composables/api/account/useGetAllNotifications";
|
||||
import useGetAllNotifications from "~/composables/api/account/useGetAllNotifications";
|
||||
import { useAppParams } from "~/composables/global/useAppParams";
|
||||
|
||||
// state
|
||||
|
||||
const params: GetAllNotificationsRequest = useUrlSearchParams("history");
|
||||
|
||||
const subscribe = ref(false);
|
||||
|
||||
const { status, sort } = useAppParams();
|
||||
|
||||
const sortFilters = ref([
|
||||
{
|
||||
title: "اخبار",
|
||||
@@ -59,17 +58,9 @@ const { isPending: subscribeNotificationIsPending } = useSubscribeNotification()
|
||||
|
||||
// computeds
|
||||
|
||||
const filters = computed(() => {
|
||||
return {
|
||||
sort: params.sort ?? "created_at",
|
||||
status: params.status ?? "",
|
||||
page: params.page ?? 1,
|
||||
};
|
||||
});
|
||||
|
||||
const hasNotifications = computed(() => data.value && data.value.count > 0);
|
||||
|
||||
const { data, isLoading: notificationsIsLoading } = useGetAllNotifications(filters);
|
||||
const { data, isLoading: notificationsIsLoading } = useGetAllNotifications();
|
||||
|
||||
const notifications = computed(() => {
|
||||
return data.value?.results.flat();
|
||||
@@ -136,7 +127,7 @@ watch(
|
||||
<span class="text-xs lg:text-sm">فیلتر بر اساس</span>
|
||||
|
||||
<Select
|
||||
v-model="params.sort!"
|
||||
v-model="sort"
|
||||
triggerRootClass="!py-2.5"
|
||||
class="w-[6rem]"
|
||||
>
|
||||
@@ -169,7 +160,7 @@ watch(
|
||||
<span class="text-xs lg:text-sm">وضعیت</span>
|
||||
|
||||
<Select
|
||||
v-model="params.status!"
|
||||
v-model="status"
|
||||
triggerRootClass="!py-2.5"
|
||||
class="w-[6rem]"
|
||||
>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import useGetAllOrders, { type GetAllOrdersRequest } from "~/composables/api/orders/useGetAllOrders";
|
||||
import { useAppParams } from "~/composables/global/useAppParams";
|
||||
|
||||
// meta
|
||||
|
||||
@@ -14,15 +15,9 @@ definePageMeta({
|
||||
|
||||
// state
|
||||
|
||||
const params = useUrlSearchParams("history") as GetAllOrdersRequest;
|
||||
const route = useRoute();
|
||||
|
||||
const filters = computed(() => {
|
||||
return {
|
||||
sort: params.sort ?? "created_at",
|
||||
status: params.status ?? "",
|
||||
page: params.page ?? 1,
|
||||
};
|
||||
});
|
||||
const { sort, status } = useAppParams();
|
||||
|
||||
const tableHeads = ref(["شماره سفارش", "تاریخ ثبت", "تعداد اقلام", "مبلغ", "وضعیت", "عملیات"]);
|
||||
|
||||
@@ -72,13 +67,9 @@ const statusFilters = ref([
|
||||
},
|
||||
]);
|
||||
|
||||
// provide / inject
|
||||
|
||||
provide("params", params);
|
||||
|
||||
// queries
|
||||
|
||||
const { data, isPending: purchasesIsPending } = useGetAllOrders(filters);
|
||||
const { data, isPending: purchasesIsPending } = useGetAllOrders();
|
||||
|
||||
// computed
|
||||
|
||||
@@ -89,9 +80,9 @@ const purchases = computed(() => {
|
||||
const hasPurchases = computed(() => data.value && data.value.count > 0);
|
||||
|
||||
const hasFilters = computed(() =>
|
||||
Object.keys(params)
|
||||
Object.keys(route.query)
|
||||
.filter((key) => key != "page")
|
||||
.some((key) => (params as any)[key] != undefined)
|
||||
.some((key) => (route.query as any)[key] != undefined)
|
||||
);
|
||||
|
||||
const paginationData = computed(() => {
|
||||
@@ -103,8 +94,8 @@ const paginationData = computed(() => {
|
||||
// methods
|
||||
|
||||
const clearFilters = () => {
|
||||
params.sort = undefined;
|
||||
params.status = undefined;
|
||||
sort.value = "";
|
||||
status.value = "";
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -123,7 +114,7 @@ const clearFilters = () => {
|
||||
>
|
||||
<span class="text-xs lg:text-sm">ترتیب بر اساس</span>
|
||||
<Select
|
||||
v-model="params.sort!"
|
||||
v-model="sort"
|
||||
triggerRootClass="!py-2.5"
|
||||
class="w-[6rem]"
|
||||
>
|
||||
@@ -156,7 +147,7 @@ const clearFilters = () => {
|
||||
>
|
||||
<span class="text-xs lg:text-sm">وضعیت</span>
|
||||
<Select
|
||||
v-model="params.status!"
|
||||
v-model="status"
|
||||
triggerRootClass="!py-2.5"
|
||||
class="w-[6rem]"
|
||||
>
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
// imports
|
||||
|
||||
import useGetAllTickets, { type GetAllTicketsRequest } from "~/composables/api/tickets/useGetAllTickets";
|
||||
import useGetAllTickets from "~/composables/api/tickets/useGetAllTickets";
|
||||
import { useAppParams } from "~/composables/global/useAppParams";
|
||||
|
||||
// meta
|
||||
|
||||
@@ -16,20 +17,9 @@ definePageMeta({
|
||||
|
||||
// state
|
||||
|
||||
const params: GetAllTicketsRequest = useUrlSearchParams("history", {
|
||||
initialValue: {
|
||||
page: 1,
|
||||
},
|
||||
writeMode: "push",
|
||||
});
|
||||
const route = useRoute();
|
||||
|
||||
const filters = computed(() => {
|
||||
return {
|
||||
sort: params.sort ?? "created_at",
|
||||
status: params.status ?? "",
|
||||
page: params.page ?? 1,
|
||||
};
|
||||
});
|
||||
const { sort, status } = useAppParams();
|
||||
|
||||
const tableHeads = ref(["دسته بندی", "موضوع", "تاریخ ایجاد و بروز رسانی", "وضعیت", "عملیات"]);
|
||||
|
||||
@@ -59,13 +49,9 @@ const statusFilters = ref([
|
||||
},
|
||||
]);
|
||||
|
||||
// provide / inject
|
||||
|
||||
provide("params", params);
|
||||
|
||||
// queries
|
||||
|
||||
const { data, isPending: ticketsIsPending } = useGetAllTickets(filters);
|
||||
const { data, isPending: ticketsIsPending } = useGetAllTickets();
|
||||
|
||||
// computed
|
||||
|
||||
@@ -76,9 +62,9 @@ const tickets = computed(() => {
|
||||
const hasTickets = computed(() => data.value && data.value.count > 0);
|
||||
|
||||
const hasFilters = computed(() =>
|
||||
Object.keys(params)
|
||||
Object.keys(route.query)
|
||||
.filter((key) => key != "page")
|
||||
.some((key) => (params as any)[key] != undefined)
|
||||
.some((key) => (route.query as any)[key] != undefined)
|
||||
);
|
||||
|
||||
const paginationData = computed(() => {
|
||||
@@ -90,8 +76,8 @@ const paginationData = computed(() => {
|
||||
// methods
|
||||
|
||||
const clearFilters = () => {
|
||||
params.sort = undefined;
|
||||
params.status = undefined;
|
||||
sort.value = "";
|
||||
status.value = "";
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -110,7 +96,7 @@ const clearFilters = () => {
|
||||
>
|
||||
<span class="text-xs lg:text-sm">ترتیب بر اساس</span>
|
||||
<Select
|
||||
v-model="params.sort!"
|
||||
v-model="sort"
|
||||
triggerRootClass="!py-2.5"
|
||||
class="w-[6rem]"
|
||||
>
|
||||
@@ -143,7 +129,7 @@ const clearFilters = () => {
|
||||
>
|
||||
<span class="text-xs lg:text-sm">وضعیت</span>
|
||||
<Select
|
||||
v-model="params.status!"
|
||||
v-model="status"
|
||||
triggerRootClass="!py-2.5"
|
||||
class="w-[6rem]"
|
||||
>
|
||||
|
||||
@@ -1,76 +1,46 @@
|
||||
<script setup lang="ts">
|
||||
// import
|
||||
|
||||
import useGetResellersProducts, {
|
||||
type GetResellersProductsFilters,
|
||||
} from "~/composables/api/resellers/useGetResellersProducts";
|
||||
import { PRODUCT_RANGE } from "~/constants";
|
||||
|
||||
// state
|
||||
|
||||
const route = useRoute();
|
||||
|
||||
useSeoMeta({
|
||||
title: "محصولات",
|
||||
});
|
||||
// meta
|
||||
|
||||
definePageMeta({
|
||||
validate: (route) => {
|
||||
if (Array.isArray(route.params.slug)) {
|
||||
return route.params.slug.length === 2 && route.params.slug[0] === "category";
|
||||
return route.params.slug.length === 2 && route.params.slug[0].startsWith("category");
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
});
|
||||
|
||||
const params: GetResellersProductsFilters = useUrlSearchParams("history", {
|
||||
removeFalsyValues: true,
|
||||
removeNullishValues: true,
|
||||
});
|
||||
// import
|
||||
|
||||
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: Array.isArray(route.params.slug) ? route.params.slug[1] ?? undefined : undefined,
|
||||
page: params.page ?? 1,
|
||||
};
|
||||
});
|
||||
import { useAppParams } from "~/composables/global/useAppParams";
|
||||
import useGetResellersProducts from "~/composables/api/resellers/useGetResellersProducts";
|
||||
|
||||
const search = ref(params.search ?? "");
|
||||
const searchDebounced = refDebounced(search, 1000);
|
||||
// state
|
||||
|
||||
// provide / inject
|
||||
|
||||
provide("params", params);
|
||||
const { search } = useAppParams();
|
||||
|
||||
// queries
|
||||
|
||||
const { data, isLoading: productsIsLoading } = useGetResellersProducts(filters);
|
||||
const { data, isLoading: productsIsLoading } = useGetResellersProducts();
|
||||
|
||||
// computed
|
||||
|
||||
const products = computed(() => {
|
||||
return data.value?.results.flat();
|
||||
});
|
||||
|
||||
const paginationData = computed(() => {
|
||||
return data!.value?.results.map((_, i: number) => {
|
||||
return data.value?.results.map((_, i: number) => {
|
||||
return { type: "page", value: i };
|
||||
});
|
||||
});
|
||||
|
||||
// watch
|
||||
// seo
|
||||
|
||||
watch(
|
||||
() => searchDebounced.value,
|
||||
(newValue) => {
|
||||
params.search = newValue;
|
||||
}
|
||||
);
|
||||
useSeoMeta({
|
||||
title: "محصولات",
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
Reference in New Issue
Block a user