frontdev/no-copy-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

edit referrals page, add referrals fetch functions

Browse Source
This commit is contained in:
smanylov
2026-02-07 14:31:04 +07:00
parent 7572c1ada2
commit 0ec7834cc5
11 changed files with 273 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/ui/navigation/nav-links.tsx
+21
View File
@@ -11,8 +11,25 @@ import navigation from './navigation.json';
import { useSideMenuStore } from '@/app/stores/sideMenuStore';
import { useRef } from 'react';
import { useClickOutside } from '@/app/hooks/useClickOutside';
import { fetchReferralUserStats } from '@/app/actions/referralsActions';
import { useQuery } from '@tanstack/react-query';
export default function NavLinks() {
const {
data: referralLink,
isLoading,
isError,
error
} = useQuery({
queryKey: ['referralUserStats'],
queryFn: () => {
return fetchReferralUserStats();
},
select: (data) => {
return data?.referralLink;
}
});
const pathname = usePathname().replace('/en/', '/').replace('/ru/', '/');
const t = useTranslations('Global');
@@ -69,6 +86,10 @@ export default function NavLinks() {
<DropDownList />
{links.map((link) => {
if (!referralLink && link.name === 'referral-program') {
return null;
}
return (
<Link
key={link.name}
src/app/ui/referral-page/Income-and-payments.tsx
+6 -38
View File
@@ -10,7 +10,7 @@ export default function IncomeAndPayments() {
<div className="earning-card success">
<h4>💰 Доступно к выводу</h4>
<p>
135.00 Б
0
</p>
<small>Минимальная сумма вывода: 100 Б</small>
</div>
@@ -18,7 +18,7 @@ export default function IncomeAndPayments() {
<div className="earning-card">
<h4>📈 Всего заработано</h4>
<p>
135.00 Б
0
</p>
<small>За все время участия в программе</small>
</div>
@@ -26,7 +26,7 @@ export default function IncomeAndPayments() {
<div className="earning-card warning">
<h4>✅ Выплачено</h4>
<p>
0.00 Б
0
</p>
<small>Успешно выплачено на ваши счета</small>
</div>
@@ -70,8 +70,8 @@ export default function IncomeAndPayments() {
Обработано
</div>
<div className="stats-item first-column second-row">
100.00
<div className="stats-item first-column left-bottom-corner">
0
</div>
<div className="stats-item second-row">
0
@@ -82,39 +82,7 @@ export default function IncomeAndPayments() {
<div className="stats-item second-row">
0
</div>
<div className="stats-item second-row last-column">
0
</div>
<div className="stats-item first-column">
100.00
</div>
<div className="stats-item">
0
</div>
<div className="stats-item">
0
</div>
<div className="stats-item">
0
</div>
<div className="stats-item last-column">
0
</div>
<div className="stats-item last-row left-bottom-corner first-column">
100.00
</div>
<div className="stats-item last-row">
0
</div>
<div className="stats-item last-row">
0
</div>
<div className="stats-item last-row">
0
</div>
<div className="stats-item last-row last-column right-bottom-corner">
<div className="stats-item last-column right-bottom-corner">
0
</div>
</div>
src/app/ui/referral-page/commission-levels.tsx
+34
View File
@@ -1,4 +1,38 @@
'use client'
import { useQuery } from '@tanstack/react-query';
import { fetchReferralsLevels } from '@/app/actions/referralsActions';
import { useEffect } from 'react';
export default function CommissionLevels() {
const {
data: referralsLevels,
isLoading,
isError,
error
} = useQuery({
queryKey: ['referralsLevels'],
queryFn: () => {
return fetchReferralsLevels();
},
select: (data) => {
if (data?.message_body) {
return data?.message_body
} else {
return []
}
}
});
useEffect(() => {
console.log('referralsLevels');
console.log(referralsLevels);
}, [referralsLevels])
if (!referralsLevels?.length) {
return null;
}
return (
<div className="block-wrapper">
<h3 className="section-title">
src/app/ui/referral-page/invitations-table.tsx
+18 -22
View File
@@ -17,38 +17,34 @@ import DropDownList from '@/app/components/DropDownList';
import { useQuery, useQueryClient } from '@tanstack/react-query';
import { toast } from 'sonner';
import { pluralize } from '@/app/lib/pluralize';
import { fetchReferralInvitees } from '@/app/actions/referralsActions';
type FileItem = {
type InviteesType = {
status?: string;
email?: string;
registrationData: number;
};
type ApiFile = {
status?: string;
type InviteType = {
active?: string;
email?: string;
registrationData: string;
regDate: number;
};
type ApiResponse = {
files?: ApiFile[];
};
export default function InvitationsTable() {
const {
data: testData,
data: referralInvitees,
isLoading,
isError,
error,
} = useQuery<ApiResponse, Error, FileItem[], ['testData']>({
queryKey: ['testData'],
} = useQuery<InviteType[], Error, InviteesType[], ['referralInvitees']>({
queryKey: ['referralInvitees'],
queryFn: () => {
return {}
return fetchReferralInvitees();
},
select: (data: ApiResponse): FileItem[] => {
if (!data?.files) return [
select: (data: InviteType[]): InviteesType[] => {
if (!data) return [
{
status: 'string1',
email: 'string1',
@@ -66,11 +62,11 @@ export default function InvitationsTable() {
}
];
return data.files.map((item: ApiFile) => {
return data.map((item: InviteType) => {
return {
status: 'string',
email: 'string',
registrationData: 40
status: item.active,
email: item.email,
registrationData: item.regDate
};
});
},
@@ -92,7 +88,7 @@ export default function InvitationsTable() {
const locale = useLocale();
// Определение колонок
const columns = useMemo<ColumnDef<FileItem>[]>(
const columns = useMemo<ColumnDef<InviteesType>[]>(
() => [
{
accessorKey: 'email',
@@ -207,7 +203,7 @@ export default function InvitationsTable() {
// Фильтрация по типу файла и дате
const filteredData = useMemo(() => {
let result = testData;
let result = referralInvitees;
if (!result) {
return [];
}
@@ -263,7 +259,7 @@ export default function InvitationsTable() {
}
return result;
}, [testData, statusFilter, dateFilter]);
}, [referralInvitees, statusFilter, dateFilter]);
useEffect(() => {
const currentPageRows = table.getRowModel().rows;
src/app/ui/referral-page/referral-link-section.tsx
+60 -7
View File
@@ -1,18 +1,71 @@
'use client'
import { fetchReferralUserStats } from '@/app/actions/referralsActions';
import { useQuery } from '@tanstack/react-query';
import { useTranslations } from 'next-intl';
import { useEffect, useRef, useState } from 'react';
import { toast } from 'sonner';
export default function ReferralLinkSection() {
const {
data: referralUserStats,
isLoading,
isError,
error
} = useQuery({
queryKey: ['referralUserStats'],
queryFn: () => {
return fetchReferralUserStats();
},
select: (data) => {
return data;
}
});
const t = useTranslations('Global')
const [referralUrl, setReferralUrl] = useState<string>('');
const refLink = useRef<HTMLElement>(null);
useEffect(() => {
if (typeof window !== 'undefined') {
setReferralUrl(`${window.location.origin}/register?ref=${referralUserStats?.referralLink}`);
}
}, [referralUserStats]);
const copyHandler = () => {
if (refLink.current?.textContent) {
navigator.clipboard.writeText(refLink.current?.textContent);
toast.success(`${t('copied')}: ${refLink.current?.textContent}`)
}
};
if (!referralUserStats?.referralLink) {
return null;
}
return (
<div className="referral-link-section">
<h3>🔗 Ваша реферальная ссылка</h3>
<h3>Ваша реферальная ссылка</h3>
<p>Поделитесь этой ссылкой с друзьями и получайте комиссию с каждой их покупки</p>
<div className="referral-link-input">
<span id="referral-link" >
https://dashboard.no-copy.ru/register.php?ref=REFA0406AC8
<span
id="referral-link"
ref={refLink}
>
{referralUrl}
</span >
<button className="copy-btn">📋 Копировать</button>
<button
className="copy-btn"
onClick={copyHandler}
>
Копировать
</button>
</div>
<p className="referral-link-footer">
Код: <strong>REFA0406AC8</strong> •
Кликов: <strong>21</strong> •
Комиссия: <strong>15%</strong>
Код: <strong>{referralUserStats?.referralLink}</strong> •
Приглашений: <strong>
{referralUserStats?.totalInvitee}
</strong>
</p>
</div>
)