diff --git a/src/components/DailyLineChartCard.tsx b/src/components/DailyLineChartCard.tsx new file mode 100644 index 0000000..304d3f8 --- /dev/null +++ b/src/components/DailyLineChartCard.tsx @@ -0,0 +1,50 @@ +import React from 'react'; +import { Card, Col } from 'antd'; +import { + LineChart, + Line, + XAxis, + YAxis, + CartesianGrid, + Tooltip, + Legend, + ResponsiveContainer, +} from 'recharts'; +import { DayCount } from '../types/api'; + +interface Props { + title: string; + data?: DayCount[]; + color: string; + lg?: number; +} + +const DailyLineChartCard: React.FC = ({ title, data, color, lg = 12 }) => { + const chartData = (data ?? []).map((item) => ({ + date: item.date, + count: item.count, + })); + + if (chartData.length === 0) { + return null; + } + + return ( + + + + + + + + + + + + + + + ); +}; + +export default DailyLineChartCard; diff --git a/src/pages/dashboard/DashboardPage.tsx b/src/pages/dashboard/DashboardPage.tsx index c2d174b..142f87d 100644 --- a/src/pages/dashboard/DashboardPage.tsx +++ b/src/pages/dashboard/DashboardPage.tsx @@ -8,22 +8,18 @@ import { WarningOutlined, BugOutlined, ClockCircleOutlined, + DollarOutlined, } from '@ant-design/icons'; import { useDashboardStats } from '../../hooks/useDashboard'; import type { ColumnsType } from 'antd/es/table'; import { AdminActivity } from '../../types/api'; import { - LineChart, - Line, - XAxis, - YAxis, - CartesianGrid, - Tooltip, - Legend, - ResponsiveContainer, AreaChart, Area, + XAxis, + Tooltip, } from 'recharts'; +import DailyLineChartCard from '../../components/DailyLineChartCard'; const DashboardPage: React.FC = () => { const { data, isLoading, error } = useDashboardStats(); @@ -54,12 +50,12 @@ const DashboardPage: React.FC = () => { { title: 'Последний вход', dataIndex: 'last_login', key: 'last_login' }, ]; - const eventsChartData = data.events_by_day?.map(item => ({ + const eventsChartData = data.events_by_day?.map((item) => ({ date: item.date, events: item.count, })) || []; - const registrationsChartData = data.registrations_by_day?.map(item => ({ + const registrationsChartData = data.registrations_by_day?.map((item) => ({ date: item.date, registrations: item.count, })) || []; @@ -68,7 +64,6 @@ const DashboardPage: React.FC = () => {

Общая статистика

- {/* Пользователи с мини-графиком */}
@@ -109,7 +104,6 @@ const DashboardPage: React.FC = () => { - {/* События с мини-графиком */}
@@ -190,49 +184,76 @@ const DashboardPage: React.FC = () => { /> + + {data.pending_users_total !== undefined && ( + + + } /> + + + )} + {data.reports_pending !== undefined && ( + + + + + + )} + {data.reports_reviewed !== undefined && ( + + + + + + )} + {data.reports_dismissed !== undefined && ( + + + + + + )} + {data.subscriptions_total !== undefined && ( + + + } /> + + + )} + {data.trial_subscriptions !== undefined && ( + + + + + + )} - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + -

Активность администраторов

- + {data.admin_activity && data.admin_activity.length > 0 && ( + <> +

Активность администраторов

+
+ + )} ); }; -export default DashboardPage; \ No newline at end of file +export default DashboardPage; diff --git a/src/types/api.ts b/src/types/api.ts index a21d9f5..0f3d819 100644 --- a/src/types/api.ts +++ b/src/types/api.ts @@ -328,16 +328,28 @@ export interface AuditListParams { // ===================== Dashboard Stats ===================== export interface DashboardStats { users_total: number; + pending_users_total?: number; events_total: number; reviews_total: number; calendars_total: number; reports_total: number; + reports_pending?: number; + reports_reviewed?: number; + reports_dismissed?: number; tickets_total: number; tickets_open: number; + subscriptions_total?: number; + trial_subscriptions?: number; avg_ticket_resolution_h: number; - admin_activity: AdminActivity[]; + admin_activity?: AdminActivity[]; events_by_day: DayCount[]; registrations_by_day: DayCount[]; + reviews_by_day?: DayCount[]; + calendars_by_day?: DayCount[]; + reports_by_day?: DayCount[]; + tickets_by_day?: DayCount[]; + subscriptions_by_day?: DayCount[]; + pending_users_by_day?: DayCount[]; } export interface AdminActivity {