From 2a5e38f4882aa72c7b236fed7a7177d618440f6f Mon Sep 17 00:00:00 2001 From: Ruslan Bakiev Date: Sat, 4 Apr 2026 13:45:39 +0700 Subject: [PATCH] Fix order detail routing and loading --- app/composables/graphql/generated.ts | 59 +++++++++++++++++++ app/pages/client-orders/[id].vue | 16 ++--- app/pages/orders/[id].vue | 14 +++-- app/pages/{orders.vue => orders/index.vue} | 0 .../operations/orders/order-detail.graphql | 21 +++++++ graphql/schema.graphql | 1 + 6 files changed, 98 insertions(+), 13 deletions(-) rename app/pages/{orders.vue => orders/index.vue} (100%) create mode 100644 graphql/operations/orders/order-detail.graphql diff --git a/app/composables/graphql/generated.ts b/app/composables/graphql/generated.ts index 3c4a146..4664448 100644 --- a/app/composables/graphql/generated.ts +++ b/app/composables/graphql/generated.ts @@ -536,6 +536,7 @@ export type Query = { myMessengerConnections: Array; myNotificationHistory: Array; myOrders: Array; + order?: Maybe; referralStats: ReferralStats; registrationRequests: Array; }; @@ -565,6 +566,11 @@ export type QueryMyNotificationHistoryArgs = { }; +export type QueryOrderArgs = { + id: Scalars['ID']['input']; +}; + + export type QueryRegistrationRequestsArgs = { status?: InputMaybe; }; @@ -954,6 +960,13 @@ export type MyOrdersQueryVariables = Exact<{ [key: string]: never; }>; export type MyOrdersQuery = { __typename?: 'Query', myOrders: Array<{ __typename?: 'Order', id: string, code: string, kind: OrderKind, status: OrderStatus, deliveryAddress?: string | null, totalPrice?: number | null, deliveryTerms?: string | null, deliveryFee?: number | null, createdAt: any, items: Array<{ __typename?: 'OrderItem', id: string, productName: string, quantity: number, unitPrice?: number | null, lineTotal?: number | null }> }> }; +export type OrderDetailQueryVariables = Exact<{ + id: Scalars['ID']['input']; +}>; + + +export type OrderDetailQuery = { __typename?: 'Query', order?: { __typename?: 'Order', id: string, code: string, kind: OrderKind, status: OrderStatus, customerId: string, deliveryAddress?: string | null, deliveryTerms?: string | null, deliveryFee?: number | null, totalPrice?: number | null, createdAt: any, items: Array<{ __typename?: 'OrderItem', id: string, productName: string, quantity: number, unitPrice?: number | null, lineTotal?: number | null }> } | null }; + export type SubmitCalculationOrderMutationVariables = Exact<{ input: SubmitCalculationOrderInput; }>; @@ -2301,6 +2314,52 @@ export function useMyOrdersLazyQuery(options: VueApolloComposable.UseQueryOption return VueApolloComposable.useLazyQuery(MyOrdersDocument, {}, options); } export type MyOrdersQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn; +export const OrderDetailDocument = gql` + query OrderDetail($id: ID!) { + order(id: $id) { + id + code + kind + status + customerId + deliveryAddress + deliveryTerms + deliveryFee + totalPrice + createdAt + items { + id + productName + quantity + unitPrice + lineTotal + } + } +} + `; + +/** + * __useOrderDetailQuery__ + * + * To run a query within a Vue component, call `useOrderDetailQuery` and pass it any options that fit your needs. + * When your component renders, `useOrderDetailQuery` returns an object from Apollo Client that contains result, loading and error properties + * you can use to render your UI. + * + * @param variables that will be passed into the query + * @param options that will be passed into the query, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/query.html#options; + * + * @example + * const { result, loading, error } = useOrderDetailQuery({ + * id: // value for 'id' + * }); + */ +export function useOrderDetailQuery(variables: OrderDetailQueryVariables | VueCompositionApi.Ref | ReactiveFunction, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useQuery(OrderDetailDocument, variables, options); +} +export function useOrderDetailLazyQuery(variables?: OrderDetailQueryVariables | VueCompositionApi.Ref | ReactiveFunction, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useLazyQuery(OrderDetailDocument, variables, options); +} +export type OrderDetailQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn; export const SubmitCalculationOrderDocument = gql` mutation SubmitCalculationOrder($input: SubmitCalculationOrderInput!) { submitCalculationOrder(input: $input) { diff --git a/app/pages/client-orders/[id].vue b/app/pages/client-orders/[id].vue index cb65cac..2b4573b 100644 --- a/app/pages/client-orders/[id].vue +++ b/app/pages/client-orders/[id].vue @@ -4,10 +4,10 @@ import { BlockOrderDocument, CompleteOrderDocument, ManagerFinalizeOrderDocument, - ManagerOrdersDocument, ManagerSetOrderOfferDocument, + OrderDetailDocument, StartOrderWorkDocument, - type ManagerOrdersQuery, + type OrderDetailQuery, } from '~/composables/graphql/generated'; import { formatPrice, @@ -23,9 +23,11 @@ definePageMeta({ const route = useRoute(); const orderId = computed(() => String(route.params.id || '')); -type ManagerOrderItem = ManagerOrdersQuery['managerOrders'][number]; +type ManagerOrderItem = NonNullable; -const ordersQuery = useQuery(ManagerOrdersDocument, { status: null }); +const orderQuery = useQuery(OrderDetailDocument, () => ({ + id: orderId.value, +})); const finalizeMutation = useMutation(ManagerFinalizeOrderDocument); const blockMutation = useMutation(BlockOrderDocument); @@ -38,7 +40,7 @@ const deliveryTermsDraft = ref(''); const deliveryFeeDraft = ref(''); const currentOrder = computed(() => - (ordersQuery.result.value?.managerOrders ?? []).find((item: ManagerOrderItem) => item.id === orderId.value) ?? null, + orderQuery.result.value?.order ?? null, ); watch( @@ -120,7 +122,7 @@ const offerTotal = computed(() => { }); async function refetchOrder() { - await ordersQuery.refetch({ status: null }); + await orderQuery.refetch({ id: orderId.value }); } async function saveOffer() { @@ -197,7 +199,7 @@ async function completeOrder() {
← Назад к заказам клиентов -
+
Загружаем заказ...
diff --git a/app/pages/orders/[id].vue b/app/pages/orders/[id].vue index 3cb14b1..2ef1615 100644 --- a/app/pages/orders/[id].vue +++ b/app/pages/orders/[id].vue @@ -1,8 +1,8 @@ @@ -25,7 +27,7 @@ const currentOrder = computed(() =>
← Назад к моим заказам -
+
Загружаем заказ...
diff --git a/app/pages/orders.vue b/app/pages/orders/index.vue similarity index 100% rename from app/pages/orders.vue rename to app/pages/orders/index.vue diff --git a/graphql/operations/orders/order-detail.graphql b/graphql/operations/orders/order-detail.graphql new file mode 100644 index 0000000..dd302e1 --- /dev/null +++ b/graphql/operations/orders/order-detail.graphql @@ -0,0 +1,21 @@ +query OrderDetail($id: ID!) { + order(id: $id) { + id + code + kind + status + customerId + deliveryAddress + deliveryTerms + deliveryFee + totalPrice + createdAt + items { + id + productName + quantity + unitPrice + lineTotal + } + } +} diff --git a/graphql/schema.graphql b/graphql/schema.graphql index 34a1c30..4303961 100644 --- a/graphql/schema.graphql +++ b/graphql/schema.graphql @@ -334,6 +334,7 @@ type Query { myNotificationHistory(channel: MessengerType!, limit: Int = 50): [NotificationHistoryItem!]! managerNotificationHistory(userId: ID!, channel: MessengerType!, limit: Int = 50): [NotificationHistoryItem!]! clientProducts: [Product!]! + order(id: ID!): Order myOrders: [Order!]! myCurrentOrders: [Order!]! managerUsers: [ManagerUser!]!