diff --git a/app/assets/css/main.css b/app/assets/css/main.css index 5a07b4b..00480d5 100644 --- a/app/assets/css/main.css +++ b/app/assets/css/main.css @@ -114,6 +114,123 @@ body { box-shadow: 0 14px 32px rgba(24, 66, 44, 0.1); } +.surface-subcard { + border: 0; + border-radius: 1.5rem; + background: color-mix(in oklab, #ffffff 78%, var(--brand-surface)); +} + +.manager-hero { + display: flex; + flex-direction: column; + gap: 0.75rem; + max-width: 52rem; +} + +.manager-eyebrow { + font-size: 0.72rem; + font-weight: 800; + letter-spacing: 0.16em; + text-transform: uppercase; + color: color-mix(in oklab, var(--brand-primary) 76%, #355947); +} + +.manager-title { + font-size: clamp(2rem, 3.5vw, 3.35rem); + line-height: 1; + font-weight: 800; + letter-spacing: -0.04em; + color: var(--brand-ink); +} + +.manager-copy { + max-width: 42rem; + font-size: 1rem; + line-height: 1.65; + color: color-mix(in oklab, var(--brand-ink) 72%, #60786b); +} + +.manager-stat-card { + border: 0; + border-radius: 1.5rem; + background: #fff; + padding: 1rem 1.1rem; +} + +.manager-stat-label { + font-size: 0.8rem; + font-weight: 700; + color: #5c7b69; +} + +.manager-stat-value { + margin-top: 0.35rem; + font-size: 1.5rem; + line-height: 1; + font-weight: 800; + color: #123824; +} + +.manager-helper { + font-size: 0.9rem; + line-height: 1.55; + color: #5c7b69; +} + +.manager-field.input, +.manager-field.select, +.manager-field.textarea { + border: 0; + border-radius: 1.2rem; + background: color-mix(in oklab, white 76%, var(--brand-surface)); + box-shadow: none; +} + +.manager-field.input:focus, +.manager-field.select:focus, +.manager-field.textarea:focus, +.manager-field.input:focus-visible, +.manager-field.select:focus-visible, +.manager-field.textarea:focus-visible { + outline: 0; + box-shadow: 0 0 0 2px rgba(19, 153, 87, 0.16); +} + +.manager-mini-card { + border: 0; + border-radius: 1.2rem; + background: color-mix(in oklab, white 72%, var(--brand-muted)); + padding: 0.9rem 1rem; +} + +.manager-channel-chip { + display: inline-flex; + align-items: center; + gap: 0.55rem; + border-radius: 999px; + background: color-mix(in oklab, white 86%, var(--brand-surface)); + padding: 0.35rem 0.75rem 0.35rem 0.4rem; +} + +.manager-channel-dot { + display: inline-flex; + height: 2rem; + width: 2rem; + align-items: center; + justify-content: center; + border-radius: 999px; + font-size: 0.72rem; + font-weight: 800; + color: white; +} + +.manager-empty-state { + border-radius: 1.4rem; + background: color-mix(in oklab, white 70%, var(--brand-surface)); + padding: 1rem 1.1rem; + color: #557562; +} + .fregat-header-glass { background: transparent; } diff --git a/app/components/ui/AppHeader.vue b/app/components/ui/AppHeader.vue index 00693bb..5e0f836 100644 --- a/app/components/ui/AppHeader.vue +++ b/app/components/ui/AppHeader.vue @@ -1,4 +1,7 @@ diff --git a/app/composables/graphql/generated.ts b/app/composables/graphql/generated.ts index be10041..f74f436 100644 --- a/app/composables/graphql/generated.ts +++ b/app/composables/graphql/generated.ts @@ -622,7 +622,7 @@ export type ConsumeLoginTokenMutation = { __typename?: 'Mutation', consumeLoginT export type MeQueryVariables = Exact<{ [key: string]: never; }>; -export type MeQuery = { __typename?: 'Query', me?: { __typename?: 'User', id: string, email: string, fullName: string } | null }; +export type MeQuery = { __typename?: 'Query', me?: { __typename?: 'User', id: string, email: string, fullName: string, role: UserRole } | null }; export type RegisterSelfMutationVariables = Exact<{ input: RegisterSelfInput; @@ -650,6 +650,100 @@ export type ClientProductsQueryVariables = Exact<{ [key: string]: never; }>; export type ClientProductsQuery = { __typename?: 'Query', clientProducts: Array<{ __typename?: 'Product', id: string, sku: string, name: string, description?: string | null, productType?: string | null, widthMm?: number | null, lengthM?: number | null, thicknessMicron?: number | null, sleeveBrand?: string | null, quantityPerBox?: string | null, isCustomizable: boolean, availableInWarehouses: Array<{ __typename?: 'ProductWarehouseBalance', availableQty: number, warehouse: { __typename?: 'Warehouse', id: string, code: string, name: string } }> }> }; +export type AddBonusTransactionMutationVariables = Exact<{ + input: AddBonusTransactionInput; +}>; + + +export type AddBonusTransactionMutation = { __typename?: 'Mutation', addBonusTransaction: { __typename?: 'BonusTransaction', id: string, userId: string, amount: number, reason: string, createdAt: any } }; + +export type BlockOrderMutationVariables = Exact<{ + input: BlockOrderInput; +}>; + + +export type BlockOrderMutation = { __typename?: 'Mutation', blockOrder: { __typename?: 'Order', id: string, status: OrderStatus, blockReason?: string | null } }; + +export type CompleteOrderMutationVariables = Exact<{ + orderId: Scalars['ID']['input']; +}>; + + +export type CompleteOrderMutation = { __typename?: 'Mutation', completeOrder: { __typename?: 'Order', id: string, status: OrderStatus } }; + +export type CreateInvitationMutationVariables = Exact<{ + input: CreateInvitationInput; +}>; + + +export type CreateInvitationMutation = { __typename?: 'Mutation', createInvitation: { __typename?: 'Invitation', id: string, token: string, email: string, companyName: string, expiresAt: any } }; + +export type CreateReferralMutationVariables = Exact<{ + input: CreateReferralInput; +}>; + + +export type CreateReferralMutation = { __typename?: 'Mutation', createReferral: { __typename?: 'ReferralLink', id: string, referrerId: string, refereeId: string, createdAt: any } }; + +export type ManagerFinalizeOrderMutationVariables = Exact<{ + orderId: Scalars['ID']['input']; + decision: Decision; +}>; + + +export type ManagerFinalizeOrderMutation = { __typename?: 'Mutation', managerFinalizeOrder: { __typename?: 'Order', id: string, status: OrderStatus, managerApproved?: boolean | null } }; + +export type ManagerOrdersQueryVariables = Exact<{ + status?: InputMaybe; +}>; + + +export type ManagerOrdersQuery = { __typename?: 'Query', managerOrders: Array<{ __typename?: 'Order', id: string, code: string, status: OrderStatus, kind: OrderKind, 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 }> }> }; + +export type RegistrationRequestsQueryVariables = Exact<{ + status?: InputMaybe; +}>; + + +export type RegistrationRequestsQuery = { __typename?: 'Query', registrationRequests: Array<{ __typename?: 'RegistrationRequest', id: string, companyName: string, contactName: string, email: string, status: RegistrationStatus, createdAt: any }> }; + +export type ReviewRegistrationRequestMutationVariables = Exact<{ + input: ReviewRegistrationRequestInput; +}>; + + +export type ReviewRegistrationRequestMutation = { __typename?: 'Mutation', reviewRegistrationRequest: { __typename?: 'RegistrationRequest', id: string, status: RegistrationStatus, rejectionReason?: string | null, reviewedById?: string | null } }; + +export type ReviewRewardWithdrawalMutationVariables = Exact<{ + input: ReviewRewardWithdrawalInput; +}>; + + +export type ReviewRewardWithdrawalMutation = { __typename?: 'Mutation', reviewRewardWithdrawal: { __typename?: 'RewardWithdrawalRequest', id: string, status: WithdrawalStatus, reviewComment?: string | null, reviewedById?: string | null } }; + +export type ManagerSetOrderOfferMutationVariables = Exact<{ + input: SetOrderOfferInput; +}>; + + +export type ManagerSetOrderOfferMutation = { __typename?: 'Mutation', managerSetOrderOffer: { __typename?: 'Order', id: string, code: string, status: OrderStatus, deliveryTerms?: string | null, totalPrice?: number | null } }; + +export type StartOrderWorkMutationVariables = Exact<{ + orderId: Scalars['ID']['input']; +}>; + + +export type StartOrderWorkMutation = { __typename?: 'Mutation', startOrderWork: { __typename?: 'Order', id: string, status: OrderStatus } }; + +export type ManagerNotificationHistoryQueryVariables = Exact<{ + userId: Scalars['ID']['input']; + channel: MessengerType; + limit?: InputMaybe; +}>; + + +export type ManagerNotificationHistoryQuery = { __typename?: 'Query', managerNotificationHistory: Array<{ __typename?: 'NotificationHistoryItem', id: string, channel: MessengerType, title: string, message: string, createdAt: any, orderId?: string | null }> }; + export type MyMessengerConnectionsQueryVariables = Exact<{ [key: string]: never; }>; @@ -672,14 +766,6 @@ export type SendTestMessengerMessageMutationVariables = Exact<{ export type SendTestMessengerMessageMutation = { __typename?: 'Mutation', sendTestMessengerMessage: { __typename?: 'MessengerDispatchResult', type: MessengerType, channelId: string, success: boolean, detail: string, sentAt: any } }; -export type ClientReviewOrderMutationVariables = Exact<{ - orderId: Scalars['ID']['input']; - decision: Decision; -}>; - - -export type ClientReviewOrderMutation = { __typename?: 'Mutation', clientReviewOrder: { __typename?: 'Order', id: string, status: OrderStatus, clientApproved?: boolean | null, managerApproved?: boolean | null } }; - export type MyCurrentOrdersQueryVariables = Exact<{ [key: string]: never; }>; @@ -795,6 +881,7 @@ export const MeDocument = gql` id email fullName + role } } `; @@ -968,6 +1055,440 @@ export function useClientProductsLazyQuery(options: VueApolloComposable.UseQuery return VueApolloComposable.useLazyQuery(ClientProductsDocument, {}, options); } export type ClientProductsQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn; +export const AddBonusTransactionDocument = gql` + mutation AddBonusTransaction($input: AddBonusTransactionInput!) { + addBonusTransaction(input: $input) { + id + userId + amount + reason + createdAt + } +} + `; + +/** + * __useAddBonusTransactionMutation__ + * + * To run a mutation, you first call `useAddBonusTransactionMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useAddBonusTransactionMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useAddBonusTransactionMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useAddBonusTransactionMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(AddBonusTransactionDocument, options); +} +export type AddBonusTransactionMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const BlockOrderDocument = gql` + mutation BlockOrder($input: BlockOrderInput!) { + blockOrder(input: $input) { + id + status + blockReason + } +} + `; + +/** + * __useBlockOrderMutation__ + * + * To run a mutation, you first call `useBlockOrderMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useBlockOrderMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useBlockOrderMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useBlockOrderMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(BlockOrderDocument, options); +} +export type BlockOrderMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const CompleteOrderDocument = gql` + mutation CompleteOrder($orderId: ID!) { + completeOrder(orderId: $orderId) { + id + status + } +} + `; + +/** + * __useCompleteOrderMutation__ + * + * To run a mutation, you first call `useCompleteOrderMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useCompleteOrderMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useCompleteOrderMutation({ + * variables: { + * orderId: // value for 'orderId' + * }, + * }); + */ +export function useCompleteOrderMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(CompleteOrderDocument, options); +} +export type CompleteOrderMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const CreateInvitationDocument = gql` + mutation CreateInvitation($input: CreateInvitationInput!) { + createInvitation(input: $input) { + id + token + email + companyName + expiresAt + } +} + `; + +/** + * __useCreateInvitationMutation__ + * + * To run a mutation, you first call `useCreateInvitationMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useCreateInvitationMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useCreateInvitationMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useCreateInvitationMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(CreateInvitationDocument, options); +} +export type CreateInvitationMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const CreateReferralDocument = gql` + mutation CreateReferral($input: CreateReferralInput!) { + createReferral(input: $input) { + id + referrerId + refereeId + createdAt + } +} + `; + +/** + * __useCreateReferralMutation__ + * + * To run a mutation, you first call `useCreateReferralMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useCreateReferralMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useCreateReferralMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useCreateReferralMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(CreateReferralDocument, options); +} +export type CreateReferralMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const ManagerFinalizeOrderDocument = gql` + mutation ManagerFinalizeOrder($orderId: ID!, $decision: Decision!) { + managerFinalizeOrder(orderId: $orderId, decision: $decision) { + id + status + managerApproved + } +} + `; + +/** + * __useManagerFinalizeOrderMutation__ + * + * To run a mutation, you first call `useManagerFinalizeOrderMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useManagerFinalizeOrderMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useManagerFinalizeOrderMutation({ + * variables: { + * orderId: // value for 'orderId' + * decision: // value for 'decision' + * }, + * }); + */ +export function useManagerFinalizeOrderMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(ManagerFinalizeOrderDocument, options); +} +export type ManagerFinalizeOrderMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const ManagerOrdersDocument = gql` + query ManagerOrders($status: OrderStatus) { + managerOrders(status: $status) { + id + code + status + kind + customerId + deliveryAddress + deliveryTerms + deliveryFee + totalPrice + createdAt + items { + id + productName + quantity + } + } +} + `; + +/** + * __useManagerOrdersQuery__ + * + * To run a query within a Vue component, call `useManagerOrdersQuery` and pass it any options that fit your needs. + * When your component renders, `useManagerOrdersQuery` 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 } = useManagerOrdersQuery({ + * status: // value for 'status' + * }); + */ +export function useManagerOrdersQuery(variables: ManagerOrdersQueryVariables | VueCompositionApi.Ref | ReactiveFunction = {}, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useQuery(ManagerOrdersDocument, variables, options); +} +export function useManagerOrdersLazyQuery(variables: ManagerOrdersQueryVariables | VueCompositionApi.Ref | ReactiveFunction = {}, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useLazyQuery(ManagerOrdersDocument, variables, options); +} +export type ManagerOrdersQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn; +export const RegistrationRequestsDocument = gql` + query RegistrationRequests($status: RegistrationStatus) { + registrationRequests(status: $status) { + id + companyName + contactName + email + status + createdAt + } +} + `; + +/** + * __useRegistrationRequestsQuery__ + * + * To run a query within a Vue component, call `useRegistrationRequestsQuery` and pass it any options that fit your needs. + * When your component renders, `useRegistrationRequestsQuery` 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 } = useRegistrationRequestsQuery({ + * status: // value for 'status' + * }); + */ +export function useRegistrationRequestsQuery(variables: RegistrationRequestsQueryVariables | VueCompositionApi.Ref | ReactiveFunction = {}, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useQuery(RegistrationRequestsDocument, variables, options); +} +export function useRegistrationRequestsLazyQuery(variables: RegistrationRequestsQueryVariables | VueCompositionApi.Ref | ReactiveFunction = {}, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useLazyQuery(RegistrationRequestsDocument, variables, options); +} +export type RegistrationRequestsQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn; +export const ReviewRegistrationRequestDocument = gql` + mutation ReviewRegistrationRequest($input: ReviewRegistrationRequestInput!) { + reviewRegistrationRequest(input: $input) { + id + status + rejectionReason + reviewedById + } +} + `; + +/** + * __useReviewRegistrationRequestMutation__ + * + * To run a mutation, you first call `useReviewRegistrationRequestMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useReviewRegistrationRequestMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useReviewRegistrationRequestMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useReviewRegistrationRequestMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(ReviewRegistrationRequestDocument, options); +} +export type ReviewRegistrationRequestMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const ReviewRewardWithdrawalDocument = gql` + mutation ReviewRewardWithdrawal($input: ReviewRewardWithdrawalInput!) { + reviewRewardWithdrawal(input: $input) { + id + status + reviewComment + reviewedById + } +} + `; + +/** + * __useReviewRewardWithdrawalMutation__ + * + * To run a mutation, you first call `useReviewRewardWithdrawalMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useReviewRewardWithdrawalMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useReviewRewardWithdrawalMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useReviewRewardWithdrawalMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(ReviewRewardWithdrawalDocument, options); +} +export type ReviewRewardWithdrawalMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const ManagerSetOrderOfferDocument = gql` + mutation ManagerSetOrderOffer($input: SetOrderOfferInput!) { + managerSetOrderOffer(input: $input) { + id + code + status + deliveryTerms + totalPrice + } +} + `; + +/** + * __useManagerSetOrderOfferMutation__ + * + * To run a mutation, you first call `useManagerSetOrderOfferMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useManagerSetOrderOfferMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useManagerSetOrderOfferMutation({ + * variables: { + * input: // value for 'input' + * }, + * }); + */ +export function useManagerSetOrderOfferMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(ManagerSetOrderOfferDocument, options); +} +export type ManagerSetOrderOfferMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const StartOrderWorkDocument = gql` + mutation StartOrderWork($orderId: ID!) { + startOrderWork(orderId: $orderId) { + id + status + } +} + `; + +/** + * __useStartOrderWorkMutation__ + * + * To run a mutation, you first call `useStartOrderWorkMutation` within a Vue component and pass it any options that fit your needs. + * When your component renders, `useStartOrderWorkMutation` returns an object that includes: + * - A mutate function that you can call at any time to execute the mutation + * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return + * + * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; + * + * @example + * const { mutate, loading, error, onDone } = useStartOrderWorkMutation({ + * variables: { + * orderId: // value for 'orderId' + * }, + * }); + */ +export function useStartOrderWorkMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { + return VueApolloComposable.useMutation(StartOrderWorkDocument, options); +} +export type StartOrderWorkMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; +export const ManagerNotificationHistoryDocument = gql` + query ManagerNotificationHistory($userId: ID!, $channel: MessengerType!, $limit: Int) { + managerNotificationHistory(userId: $userId, channel: $channel, limit: $limit) { + id + channel + title + message + createdAt + orderId + } +} + `; + +/** + * __useManagerNotificationHistoryQuery__ + * + * To run a query within a Vue component, call `useManagerNotificationHistoryQuery` and pass it any options that fit your needs. + * When your component renders, `useManagerNotificationHistoryQuery` 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 } = useManagerNotificationHistoryQuery({ + * userId: // value for 'userId' + * channel: // value for 'channel' + * limit: // value for 'limit' + * }); + */ +export function useManagerNotificationHistoryQuery(variables: ManagerNotificationHistoryQueryVariables | VueCompositionApi.Ref | ReactiveFunction, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useQuery(ManagerNotificationHistoryDocument, variables, options); +} +export function useManagerNotificationHistoryLazyQuery(variables?: ManagerNotificationHistoryQueryVariables | VueCompositionApi.Ref | ReactiveFunction, options: VueApolloComposable.UseQueryOptions | VueCompositionApi.Ref> | ReactiveFunction> = {}) { + return VueApolloComposable.useLazyQuery(ManagerNotificationHistoryDocument, variables, options); +} +export type ManagerNotificationHistoryQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn; export const MyMessengerConnectionsDocument = gql` query MyMessengerConnections { myMessengerConnections { @@ -1072,39 +1593,6 @@ export function useSendTestMessengerMessageMutation(options: VueApolloComposable return VueApolloComposable.useMutation(SendTestMessengerMessageDocument, options); } export type SendTestMessengerMessageMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; -export const ClientReviewOrderDocument = gql` - mutation ClientReviewOrder($orderId: ID!, $decision: Decision!) { - clientReviewOrder(orderId: $orderId, decision: $decision) { - id - status - clientApproved - managerApproved - } -} - `; - -/** - * __useClientReviewOrderMutation__ - * - * To run a mutation, you first call `useClientReviewOrderMutation` within a Vue component and pass it any options that fit your needs. - * When your component renders, `useClientReviewOrderMutation` returns an object that includes: - * - A mutate function that you can call at any time to execute the mutation - * - Several other properties: https://v4.apollo.vuejs.org/api/use-mutation.html#return - * - * @param options that will be passed into the mutation, supported options are listed on: https://v4.apollo.vuejs.org/guide-composable/mutation.html#options; - * - * @example - * const { mutate, loading, error, onDone } = useClientReviewOrderMutation({ - * variables: { - * orderId: // value for 'orderId' - * decision: // value for 'decision' - * }, - * }); - */ -export function useClientReviewOrderMutation(options: VueApolloComposable.UseMutationOptions | ReactiveFunction> = {}) { - return VueApolloComposable.useMutation(ClientReviewOrderDocument, options); -} -export type ClientReviewOrderMutationCompositionFunctionResult = VueApolloComposable.UseMutationReturn; export const MyCurrentOrdersDocument = gql` query MyCurrentOrders { myCurrentOrders { diff --git a/app/middleware/manager-only.ts b/app/middleware/manager-only.ts new file mode 100644 index 0000000..baa1425 --- /dev/null +++ b/app/middleware/manager-only.ts @@ -0,0 +1,13 @@ +import { MeDocument } from '~/composables/graphql/generated'; + +export default defineNuxtRouteMiddleware(async () => { + const { client } = useApolloClient('default'); + const response = await client.query({ + query: MeDocument, + fetchPolicy: 'cache-first', + }); + + if (response.data.me?.role !== 'MANAGER') { + return navigateTo('/'); + } +}); diff --git a/app/pages/client-orders.vue b/app/pages/client-orders.vue new file mode 100644 index 0000000..5001004 --- /dev/null +++ b/app/pages/client-orders.vue @@ -0,0 +1,289 @@ + + + diff --git a/app/pages/clients.vue b/app/pages/clients.vue new file mode 100644 index 0000000..59f7d7e --- /dev/null +++ b/app/pages/clients.vue @@ -0,0 +1,391 @@ + + +