From c0f70999d63a78db258284974cd234ebed8a06d1 Mon Sep 17 00:00:00 2001 From: Andrewakiv Date: Thu, 5 Dec 2024 18:33:30 +0200 Subject: [PATCH 1/6] companies stats --- FrontEnd/src/pages/AdminPage/Menu/Menu.jsx | 41 ++++++++++++++++++- .../src/pages/AdminPage/Menu/Menu.module.css | 11 +++++ .../UserProfilesTable/ProfilesStatistics.jsx | 30 ++++++++++++++ 3 files changed, 81 insertions(+), 1 deletion(-) create mode 100644 FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx diff --git a/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx b/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx index 70cd9910d..a5095f20d 100644 --- a/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx +++ b/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx @@ -1,7 +1,33 @@ -import { NavLink } from 'react-router-dom'; +import { NavLink, useLocation } from 'react-router-dom'; import { useAuth } from '../../../hooks'; import css from './Menu.module.css'; +import React from 'react'; +import { Descriptions } from 'antd'; + +const items = [ + { + key: '1', + label: 'Кількість зареєстрованих компаній', + children: '2', + }, + { + key: '2', + label: 'Кількість Інвесторів', + children: '22', + }, + { + key: '3', + label: 'Кількість стратапів', + children: '222', + }, + { + key: '4', + label: 'Кількість заблокованих компаній', + children: '2222', + } + ]; + const MENU = [ { id: 'am1', @@ -25,6 +51,17 @@ const MENU = [ }, ]; +const ProfilesStatistics = () => ({ + ...item, + label: {item.label}, + children: {item.children} + }))} />; + const SUPERUSER_MENU = [ { id: 'am5', @@ -41,6 +78,7 @@ const SUPERUSER_MENU = [ function Menu() { const { isSuperUser } = useAuth(); + const location = useLocation(); return (
@@ -53,6 +91,7 @@ function Menu() { key={element.id} to={element.link}>{element.title} ))} + {location.pathname === '/customadmin/profiles/' && }
); } diff --git a/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css b/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css index 93170f61f..5cf96a2d4 100644 --- a/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css +++ b/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css @@ -22,3 +22,14 @@ .menu-section-element__active { font-weight: 600; } + +.description-item-label { + max-width: 150px; +} +.description-item-content { + max-width: 200px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx new file mode 100644 index 000000000..e0ad51071 --- /dev/null +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx @@ -0,0 +1,30 @@ +import React from 'react'; +import { Descriptions } from 'antd'; +const items = [ + { + key: '1', + label: 'Product', + children: 'Cloud Database', + span: 3 + }, + { + key: '2', + label: 'Billing Mode', + children: 'Prepaid', + span: 3 + }, + { + key: '3', + label: 'Automatic Renewal', + children: 'YES', + span: 3 + }, + { + key: '4', + label: 'Automatic Renewal', + children: 'YES', + span: 3 + } +]; +const ProfilesStatistics = () => ; +export default ProfilesStatistics; \ No newline at end of file From 5cb686d5f2192fba51412215d703c567d73fe997 Mon Sep 17 00:00:00 2001 From: Andrewakiv Date: Fri, 6 Dec 2024 14:14:55 +0200 Subject: [PATCH 2/6] separate a statistics table from main menu --- FrontEnd/src/pages/AdminPage/Menu/Menu.jsx | 37 +---------- .../src/pages/AdminPage/Menu/Menu.module.css | 10 --- .../UserProfilesTable/ProfilesStatistics.jsx | 62 +++++++++++-------- .../ProfilesStatistics.module.css | 9 +++ 4 files changed, 46 insertions(+), 72 deletions(-) create mode 100644 FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css diff --git a/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx b/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx index a5095f20d..8bb537a71 100644 --- a/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx +++ b/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx @@ -1,33 +1,8 @@ import { NavLink, useLocation } from 'react-router-dom'; import { useAuth } from '../../../hooks'; +import ProfilesStatistics from '../UserProfilesTable/ProfilesStatistics'; import css from './Menu.module.css'; -import React from 'react'; -import { Descriptions } from 'antd'; - -const items = [ - { - key: '1', - label: 'Кількість зареєстрованих компаній', - children: '2', - }, - { - key: '2', - label: 'Кількість Інвесторів', - children: '22', - }, - { - key: '3', - label: 'Кількість стратапів', - children: '222', - }, - { - key: '4', - label: 'Кількість заблокованих компаній', - children: '2222', - } - ]; - const MENU = [ { id: 'am1', @@ -51,16 +26,6 @@ const MENU = [ }, ]; -const ProfilesStatistics = () => ({ - ...item, - label: {item.label}, - children: {item.children} - }))} />; const SUPERUSER_MENU = [ { diff --git a/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css b/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css index 5cf96a2d4..a191141bf 100644 --- a/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css +++ b/FrontEnd/src/pages/AdminPage/Menu/Menu.module.css @@ -23,13 +23,3 @@ font-weight: 600; } -.description-item-label { - max-width: 150px; -} -.description-item-content { - max-width: 200px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx index e0ad51071..fe7b5aaae 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx @@ -1,30 +1,40 @@ import React from 'react'; import { Descriptions } from 'antd'; +import css from './ProfilesStatistics.module.css'; + const items = [ - { - key: '1', - label: 'Product', - children: 'Cloud Database', - span: 3 - }, - { - key: '2', - label: 'Billing Mode', - children: 'Prepaid', - span: 3 - }, - { - key: '3', - label: 'Automatic Renewal', - children: 'YES', - span: 3 - }, - { - key: '4', - label: 'Automatic Renewal', - children: 'YES', - span: 3 - } -]; -const ProfilesStatistics = () => ; + { + key: '1', + label: 'Кількість зареєстрованих компаній', + children: '2', + }, + { + key: '2', + label: 'Кількість Інвесторів', + children: '22', + }, + { + key: '3', + label: 'Кількість стратапів', + children: '222', + }, + { + key: '4', + label: 'Кількість заблокованих компаній', + children: '2222', + } + ]; + + +const ProfilesStatistics = () => ({ + ...item, + label: {item.label}, + children: {item.children} + }))} />; + export default ProfilesStatistics; \ No newline at end of file diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css new file mode 100644 index 000000000..99e45e55f --- /dev/null +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css @@ -0,0 +1,9 @@ +.description-item-label { + max-width: 150px; +} +.description-item-content { + max-width: 200px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} \ No newline at end of file From aa479f0835dbc53750e54f58f80810db055e46dc Mon Sep 17 00:00:00 2001 From: Andrewakiv Date: Wed, 11 Dec 2024 01:04:27 +0200 Subject: [PATCH 3/6] fetching profiles statistics --- .../UserProfilesTable/ProfilesStatistics.jsx | 73 ++++++++++++++----- .../ProfilesStatistics.module.css | 26 +++++-- 2 files changed, 74 insertions(+), 25 deletions(-) diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx index fe7b5aaae..110d36c1c 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx @@ -1,40 +1,75 @@ -import React from 'react'; +import React, { useState, useEffect } from 'react'; +import axios from 'axios'; import { Descriptions } from 'antd'; import css from './ProfilesStatistics.module.css'; -const items = [ +function ProfilesStatistics() { + const [statistics, setStatistics] = useState(null); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + + useEffect(() => { + const fetchStatistics = async () => { + try { + const baseUrl = process.env.REACT_APP_BASE_API_URL; + const response = await axios.get(`${baseUrl}/api/admin/profiles/statistics/`); + setStatistics(response.data); + } catch (error) { + console.error('Error fetching statistics:', error); + setError('Не вдалось отримати статистику компаній'); + } finally { + setLoading(false); + } + }; + + fetchStatistics(); + }, []); + + if (loading) return
Loading...
; + if (error) return
{error}
; + + const items = [ { key: '1', label: 'Кількість зареєстрованих компаній', - children: '2', + children: statistics.companies_count, }, { key: '2', label: 'Кількість Інвесторів', - children: '22', + children: statistics.investors_count, }, { key: '3', - label: 'Кількість стратапів', - children: '222', + label: 'Кількість Cтратапів', + children: statistics.startups_count, }, { key: '4', label: 'Кількість заблокованих компаній', - children: '2222', - } + children: statistics.blocked_companies_count, + }, ]; - -const ProfilesStatistics = () => ({ + return ( + ({ ...item, - label: {item.label}, - children: {item.children} - }))} />; + label: ( + {item.label} + ), + children: ( + + {item.children} + + ), + }))} + /> + ); +} -export default ProfilesStatistics; \ No newline at end of file +export default ProfilesStatistics; diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css index 99e45e55f..b112de1a5 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css @@ -1,9 +1,23 @@ .description-item-label { - max-width: 150px; + max-width: 150px; } + .description-item-content { - max-width: 200px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} \ No newline at end of file + max-width: 200px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.error { + color: #f5222d; + background-color: #fff1f0; + border: 1px solid #ffa39e; + padding: 10px; + border-radius: 4px; + margin-top: 10px; +} + +.loading { + font-size: 18px; +} From 626e2178a0a542291f53f6990361304233606955 Mon Sep 17 00:00:00 2001 From: Andrewakiv Date: Fri, 13 Dec 2024 00:14:55 +0200 Subject: [PATCH 4/6] changed default axios to swr --- .../UserProfilesTable/ProfilesStatistics.jsx | 32 ++++++------------- 1 file changed, 10 insertions(+), 22 deletions(-) diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx index 110d36c1c..f7154f9f0 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx @@ -1,31 +1,19 @@ -import React, { useState, useEffect } from 'react'; import axios from 'axios'; +import useSWR from 'swr'; import { Descriptions } from 'antd'; import css from './ProfilesStatistics.module.css'; -function ProfilesStatistics() { - const [statistics, setStatistics] = useState(null); - const [loading, setLoading] = useState(true); - const [error, setError] = useState(null); - - useEffect(() => { - const fetchStatistics = async () => { - try { - const baseUrl = process.env.REACT_APP_BASE_API_URL; - const response = await axios.get(`${baseUrl}/api/admin/profiles/statistics/`); - setStatistics(response.data); - } catch (error) { - console.error('Error fetching statistics:', error); - setError('Не вдалось отримати статистику компаній'); - } finally { - setLoading(false); - } - }; +async function fetcher(url) { + const response = await axios.get(url); + return response.data; +} - fetchStatistics(); - }, []); +function ProfilesStatistics() { + const baseUrl = process.env.REACT_APP_BASE_API_URL; + const url = `${baseUrl}/api/admin/profiles/statistics/`; + const { data: statistics, error, isLoading } = useSWR(url, fetcher); - if (loading) return
Loading...
; + if (isLoading) return
Loading...
; if (error) return
{error}
; const items = [ From 994de3e1b42b950401ddd3e80993065cbfd67d2d Mon Sep 17 00:00:00 2001 From: Andrewakiv Date: Sun, 15 Dec 2024 16:16:04 +0200 Subject: [PATCH 5/6] fixed error message --- .../UserProfilesTable/ProfilesStatistics.jsx | 57 ++++++++++--------- .../ProfilesStatistics.module.css | 6 +- 2 files changed, 32 insertions(+), 31 deletions(-) diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx index f7154f9f0..569308b35 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx @@ -13,33 +13,38 @@ function ProfilesStatistics() { const url = `${baseUrl}/api/admin/profiles/statistics/`; const { data: statistics, error, isLoading } = useSWR(url, fetcher); - if (isLoading) return
Loading...
; - if (error) return
{error}
; + const items = statistics + ? [ + { + key: '1', + label: 'Кількість зареєстрованих компаній', + children: statistics.companies_count, + }, + { + key: '2', + label: 'Кількість Інвесторів', + children: statistics.investors_count, + }, + { + key: '3', + label: 'Кількість Cтратапів', + children: statistics.startups_count, + }, + { + key: '4', + label: 'Кількість заблокованих компаній', + children: statistics.blocked_companies_count, + }, + ] + : []; - const items = [ - { - key: '1', - label: 'Кількість зареєстрованих компаній', - children: statistics.companies_count, - }, - { - key: '2', - label: 'Кількість Інвесторів', - children: statistics.investors_count, - }, - { - key: '3', - label: 'Кількість Cтратапів', - children: statistics.startups_count, - }, - { - key: '4', - label: 'Кількість заблокованих компаній', - children: statistics.blocked_companies_count, - }, - ]; - - return ( + return isLoading ? ( +
+ Loading... +
+ ) : error ? ( +
Не вдалося отримати статистику компаній
+ ) : ( Date: Mon, 16 Dec 2024 11:09:26 +0200 Subject: [PATCH 6/6] added a loader to the profiles statistics --- .../AdminPage/UserProfilesTable/ProfilesStatistics.jsx | 3 ++- .../UserProfilesTable/ProfilesStatistics.module.css | 5 +++++ FrontEnd/src/pages/CustomThemes/customAdminTheme.js | 7 +++++++ 3 files changed, 14 insertions(+), 1 deletion(-) diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx index 569308b35..7354b456a 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx @@ -1,6 +1,7 @@ import axios from 'axios'; import useSWR from 'swr'; import { Descriptions } from 'antd'; +import Loader from '../../../components/Loader/Loader'; import css from './ProfilesStatistics.module.css'; async function fetcher(url) { @@ -40,7 +41,7 @@ function ProfilesStatistics() { return isLoading ? (
- Loading... +
) : error ? (
Не вдалося отримати статистику компаній
diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css index c65cdf3f6..4e2dcbb6e 100644 --- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css +++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css @@ -16,4 +16,9 @@ padding: 10px; border-radius: 4px; margin-top: 10px; +} + +.loader-container { + width: 200px; + height: 300px; } \ No newline at end of file diff --git a/FrontEnd/src/pages/CustomThemes/customAdminTheme.js b/FrontEnd/src/pages/CustomThemes/customAdminTheme.js index 1d661b3e9..abcee78b5 100644 --- a/FrontEnd/src/pages/CustomThemes/customAdminTheme.js +++ b/FrontEnd/src/pages/CustomThemes/customAdminTheme.js @@ -21,6 +21,13 @@ const customAdminTheme = { Table: { lineWidth: 3, colorPrimary: '#1f9a7c' + }, + Carousel: { + colorBgContainer: '#B4D27A', + dotActiveWidth: 32, + dotWidth: 32, + dotHeight: 6, + lineHeight: 1, } }, };