Add client referral bonus manager flow

This commit is contained in:
Ruslan Bakiev
2026-04-04 14:59:02 +07:00
parent ad1f6b8a35
commit 540418c1dc
7 changed files with 262 additions and 15 deletions

View File

@@ -134,7 +134,9 @@ export type CreateMyDeliveryAddressInput = {
};
export type CreateReferralInput = {
bonusPercent: Scalars['Float']['input'];
refereeUserId: Scalars['ID']['input'];
referrerUserId: Scalars['ID']['input'];
};
export enum Decision {
@@ -185,6 +187,22 @@ export type ManagerBonusBalance = {
userId: Scalars['ID']['output'];
};
export type ManagerReferralLink = {
__typename?: 'ManagerReferralLink';
bonusPercent: Scalars['Float']['output'];
createdAt: Scalars['DateTime']['output'];
createdById: Scalars['ID']['output'];
id: Scalars['ID']['output'];
refereeCompanyName?: Maybe<Scalars['String']['output']>;
refereeEmail: Scalars['String']['output'];
refereeId: Scalars['ID']['output'];
refereeName: Scalars['String']['output'];
referrerCompanyName?: Maybe<Scalars['String']['output']>;
referrerEmail: Scalars['String']['output'];
referrerId: Scalars['ID']['output'];
referrerName: Scalars['String']['output'];
};
export type ManagerUser = {
__typename?: 'ManagerUser';
companyName?: Maybe<Scalars['String']['output']>;
@@ -526,6 +544,7 @@ export type Query = {
managerBonusBalances: Array<ManagerBonusBalance>;
managerNotificationHistory: Array<NotificationHistoryItem>;
managerOrders: Array<Order>;
managerReferralLinks: Array<ManagerReferralLink>;
managerUsers: Array<ManagerUser>;
managerWithdrawalRequests: Array<ManagerWithdrawalRequest>;
me?: Maybe<User>;
@@ -582,7 +601,9 @@ export type ReadyOrderItemInput = {
export type ReferralLink = {
__typename?: 'ReferralLink';
bonusPercent: Scalars['Float']['output'];
createdAt: Scalars['DateTime']['output'];
createdById: Scalars['ID']['output'];
id: Scalars['ID']['output'];
refereeId: Scalars['ID']['output'];
referrerId: Scalars['ID']['output'];
@@ -839,7 +860,7 @@ export type CreateReferralMutationVariables = Exact<{
}>;
export type CreateReferralMutation = { __typename?: 'Mutation', createReferral: { __typename?: 'ReferralLink', id: string, referrerId: string, refereeId: string, createdAt: any } };
export type CreateReferralMutation = { __typename?: 'Mutation', createReferral: { __typename?: 'ReferralLink', id: string, referrerId: string, refereeId: string, createdById: string, bonusPercent: number, createdAt: any } };
export type ManagerBonusBalancesQueryVariables = Exact<{ [key: string]: never; }>;
@@ -862,6 +883,11 @@ export type ManagerOrdersQueryVariables = Exact<{
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, unitPrice?: number | null, lineTotal?: number | null }> }> };
export type ManagerReferralLinksQueryVariables = Exact<{ [key: string]: never; }>;
export type ManagerReferralLinksQuery = { __typename?: 'Query', managerReferralLinks: Array<{ __typename?: 'ManagerReferralLink', id: string, referrerId: string, referrerName: string, referrerEmail: string, referrerCompanyName?: string | null, refereeId: string, refereeName: string, refereeEmail: string, refereeCompanyName?: string | null, createdById: string, bonusPercent: number, createdAt: any }> };
export type ManagerUsersDetailQueryVariables = Exact<{ [key: string]: never; }>;
@@ -870,7 +896,7 @@ export type ManagerUsersDetailQuery = { __typename?: 'Query', managerUsers: Arra
export type ManagerUsersQueryVariables = Exact<{ [key: string]: never; }>;
export type ManagerUsersQuery = { __typename?: 'Query', managerUsers: Array<{ __typename?: 'ManagerUser', id: string, fullName: string, telegramConnection?: { __typename?: 'MessengerConnection', id: string, type: MessengerType, channelId: string, displayName?: string | null, username?: string | null, avatarAvailable: boolean } | null }> };
export type ManagerUsersQuery = { __typename?: 'Query', managerUsers: Array<{ __typename?: 'ManagerUser', id: string, email: string, fullName: string, role: UserRole, companyName?: string | null, telegramConnection?: { __typename?: 'MessengerConnection', id: string, type: MessengerType, channelId: string, displayName?: string | null, username?: string | null, avatarAvailable: boolean } | null }> };
export type ManagerWithdrawalRequestsQueryVariables = Exact<{
status?: InputMaybe<WithdrawalStatus>;
@@ -1625,6 +1651,8 @@ export const CreateReferralDocument = gql`
id
referrerId
refereeId
createdById
bonusPercent
createdAt
}
}
@@ -1763,6 +1791,44 @@ export function useManagerOrdersLazyQuery(variables: ManagerOrdersQueryVariables
return VueApolloComposable.useLazyQuery<ManagerOrdersQuery, ManagerOrdersQueryVariables>(ManagerOrdersDocument, variables, options);
}
export type ManagerOrdersQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn<ManagerOrdersQuery, ManagerOrdersQueryVariables>;
export const ManagerReferralLinksDocument = gql`
query ManagerReferralLinks {
managerReferralLinks {
id
referrerId
referrerName
referrerEmail
referrerCompanyName
refereeId
refereeName
refereeEmail
refereeCompanyName
createdById
bonusPercent
createdAt
}
}
`;
/**
* __useManagerReferralLinksQuery__
*
* To run a query within a Vue component, call `useManagerReferralLinksQuery` and pass it any options that fit your needs.
* When your component renders, `useManagerReferralLinksQuery` returns an object from Apollo Client that contains result, loading and error properties
* you can use to render your UI.
*
* @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 } = useManagerReferralLinksQuery();
*/
export function useManagerReferralLinksQuery(options: VueApolloComposable.UseQueryOptions<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables> | VueCompositionApi.Ref<VueApolloComposable.UseQueryOptions<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>> | ReactiveFunction<VueApolloComposable.UseQueryOptions<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>> = {}) {
return VueApolloComposable.useQuery<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>(ManagerReferralLinksDocument, {}, options);
}
export function useManagerReferralLinksLazyQuery(options: VueApolloComposable.UseQueryOptions<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables> | VueCompositionApi.Ref<VueApolloComposable.UseQueryOptions<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>> | ReactiveFunction<VueApolloComposable.UseQueryOptions<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>> = {}) {
return VueApolloComposable.useLazyQuery<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>(ManagerReferralLinksDocument, {}, options);
}
export type ManagerReferralLinksQueryCompositionFunctionResult = VueApolloComposable.UseQueryReturn<ManagerReferralLinksQuery, ManagerReferralLinksQueryVariables>;
export const ManagerUsersDetailDocument = gql`
query ManagerUsersDetail {
managerUsers {
@@ -1809,7 +1875,10 @@ export const ManagerUsersDocument = gql`
query ManagerUsers {
managerUsers {
id
email
fullName
role
companyName
telegramConnection {
id
type

View File

@@ -92,6 +92,12 @@ const filteredWithdrawals = computed(() => {
title="Бонусы"
:search-placeholder="activeTab === 'balances' ? 'Пользователь, email или сумма' : 'Пользователь, сумма или статус'"
>
<template #controls>
<NuxtLink to="/bonus-system/referrals/new" class="btn btn-primary border-0">
Добавить связь
</NuxtLink>
</template>
<template #tabs>
<div class="tabs tabs-boxed w-fit bg-white">
<button

View File

@@ -1,24 +1,81 @@
<script setup lang="ts">
import { useMutation } from '@vue/apollo-composable';
import { CreateReferralDocument } from '~/composables/graphql/generated';
import { useMutation, useQuery } from '@vue/apollo-composable';
import {
CreateReferralDocument,
ManagerReferralLinksDocument,
ManagerUsersDocument,
type ManagerReferralLinksQuery,
type ManagerUsersQuery,
} from '~/composables/graphql/generated';
definePageMeta({
middleware: ['manager-only'],
});
type ManagerUserItem = ManagerUsersQuery['managerUsers'][number];
type ManagerReferralLinkItem = ManagerReferralLinksQuery['managerReferralLinks'][number];
const referrerUserId = ref('');
const refereeUserId = ref('');
const bonusPercent = ref(5);
const createdReferralId = ref('');
const errorMessage = ref('');
const usersQuery = useQuery(ManagerUsersDocument);
const linksQuery = useQuery(ManagerReferralLinksDocument);
const createReferralMutation = useMutation(CreateReferralDocument);
const clientOptions = computed<ManagerUserItem[]>(() => (
(usersQuery.result.value?.managerUsers ?? [])
.filter((user) => user.role === 'CLIENT')
.slice()
.sort((left, right) => left.fullName.localeCompare(right.fullName, 'ru'))
));
const referralLinks = computed<ManagerReferralLinkItem[]>(() => (
linksQuery.result.value?.managerReferralLinks ?? []
));
function userOptionLabel(user: ManagerUserItem) {
return [user.fullName, user.companyName || user.email]
.filter(Boolean)
.join(' • ');
}
async function createReferral() {
createdReferralId.value = '';
errorMessage.value = '';
if (!referrerUserId.value || !refereeUserId.value) {
errorMessage.value = 'Выберите обоих клиентов для связки.';
return;
}
if (referrerUserId.value === refereeUserId.value) {
errorMessage.value = 'Нельзя связать клиента с самим собой.';
return;
}
const normalizedBonusPercent = Number(bonusPercent.value);
if (!Number.isFinite(normalizedBonusPercent) || normalizedBonusPercent <= 0 || normalizedBonusPercent > 100) {
errorMessage.value = 'Укажите процент бонуса от 0.01 до 100.';
return;
}
try {
const response = await createReferralMutation.mutate({
input: {
referrerUserId: referrerUserId.value,
refereeUserId: refereeUserId.value,
bonusPercent: normalizedBonusPercent,
},
});
createdReferralId.value = response?.data?.createReferral.id ?? '';
refereeUserId.value = '';
await linksQuery.refetch();
} catch (error: any) {
errorMessage.value = error?.message || 'Не удалось создать бонусную связку.';
}
}
</script>
@@ -28,22 +85,96 @@ async function createReferral() {
<div class="manager-hero">
<p class="manager-eyebrow">Бонусы</p>
<h1 class="manager-title">Создать реферальную связь</h1>
<h1 class="manager-title">Создать бонусную связку клиентов</h1>
<p class="max-w-2xl text-sm text-[#466653]">
Первый клиент получает процент бонуса, когда заказ второго клиента переходит в статус доставленного.
</p>
</div>
<div class="surface-card rounded-3xl p-5">
<div class="surface-card rounded-3xl p-5 space-y-4">
<label class="form-control">
<span class="label-text">ID приглашенного пользователя</span>
<input v-model="refereeUserId" class="input manager-field w-full" placeholder="user id">
<span class="label-text">Клиент, который получает бонус</span>
<select v-model="referrerUserId" class="select manager-field w-full">
<option value="">Выберите клиента</option>
<option v-for="user in clientOptions" :key="user.id" :value="user.id">
{{ userOptionLabel(user) }}
</option>
</select>
</label>
<label class="form-control">
<span class="label-text">Клиент, с чьих заказов начисляется бонус</span>
<select v-model="refereeUserId" class="select manager-field w-full">
<option value="">Выберите клиента</option>
<option v-for="user in clientOptions" :key="user.id" :value="user.id">
{{ userOptionLabel(user) }}
</option>
</select>
</label>
<label class="form-control">
<span class="label-text">Процент бонусной программы</span>
<input
v-model="bonusPercent"
type="number"
min="0.01"
max="100"
step="0.01"
class="input manager-field w-full"
placeholder="5"
>
</label>
<div class="mt-4">
<button class="btn btn-primary border-0" @click="createReferral">Создать</button>
<button
class="btn btn-primary border-0"
:disabled="createReferralMutation.loading.value || usersQuery.loading.value"
@click="createReferral"
>
{{ createReferralMutation.loading.value ? 'Сохраняем...' : 'Создать связь' }}
</button>
</div>
</div>
<div v-if="errorMessage" class="surface-card rounded-3xl border border-[#d27d7d] bg-[#fff4f4] p-5 text-sm text-[#8b2a2a]">
{{ errorMessage }}
</div>
<div v-if="createdReferralId" class="surface-card rounded-3xl p-5 text-sm text-[#123824]">
Создана связь: <span class="font-semibold">{{ createdReferralId }}</span>
</div>
<div class="space-y-4">
<div class="flex items-center justify-between gap-3">
<h2 class="text-lg font-bold text-[#123824]">Текущие бонусные связки</h2>
<span class="text-sm text-[#466653]">{{ referralLinks.length }}</span>
</div>
<div v-if="linksQuery.loading.value" class="manager-empty-state">
Загружаем связки...
</div>
<div v-else-if="referralLinks.length === 0" class="manager-empty-state">
Бонусных связок пока нет.
</div>
<div v-else class="space-y-3">
<article
v-for="link in referralLinks"
:key="link.id"
class="surface-card rounded-3xl p-5"
>
<div class="space-y-2">
<p class="text-sm font-semibold text-[#123824]">
{{ link.referrerName }} получает {{ link.bonusPercent }}% с заказов {{ link.refereeName }}
</p>
<p class="text-sm text-[#466653]">
{{ link.referrerCompanyName || link.referrerEmail }} {{ link.refereeCompanyName || link.refereeEmail }}
</p>
<p class="text-xs text-[#5c7b69]">
Создано {{ new Date(link.createdAt).toLocaleString() }}
</p>
</div>
</article>
</div>
</div>
</section>
</template>

View File

@@ -3,6 +3,8 @@ mutation CreateReferral($input: CreateReferralInput!) {
id
referrerId
refereeId
createdById
bonusPercent
createdAt
}
}

View File

@@ -0,0 +1,16 @@
query ManagerReferralLinks {
managerReferralLinks {
id
referrerId
referrerName
referrerEmail
referrerCompanyName
refereeId
refereeName
refereeEmail
refereeCompanyName
createdById
bonusPercent
createdAt
}
}

View File

@@ -1,7 +1,10 @@
query ManagerUsers {
managerUsers {
id
email
fullName
role
companyName
telegramConnection {
id
type

View File

@@ -269,6 +269,23 @@ type ReferralLink {
id: ID!
referrerId: ID!
refereeId: ID!
createdById: ID!
bonusPercent: Float!
createdAt: DateTime!
}
type ManagerReferralLink {
id: ID!
referrerId: ID!
referrerName: String!
referrerEmail: String!
referrerCompanyName: String
refereeId: ID!
refereeName: String!
refereeEmail: String!
refereeCompanyName: String
createdById: ID!
bonusPercent: Float!
createdAt: DateTime!
}
@@ -339,6 +356,7 @@ type Query {
myCurrentOrders: [Order!]!
managerUsers: [ManagerUser!]!
managerOrders(status: OrderStatus, customerId: ID): [Order!]!
managerReferralLinks: [ManagerReferralLink!]!
managerBonusBalances: [ManagerBonusBalance!]!
managerWithdrawalRequests(status: WithdrawalStatus): [ManagerWithdrawalRequest!]!
registrationRequests(status: RegistrationStatus): [RegistrationRequest!]!
@@ -447,7 +465,9 @@ input BlockOrderInput {
}
input CreateReferralInput {
referrerUserId: ID!
refereeUserId: ID!
bonusPercent: Float!
}
input AddBonusTransactionInput {