refactor(groups): restyle traffic summary into upload/download + usage cards

Split the group traffic summary into two inbound-style cards: a "Total
upload / download" card with up/down arrow icons and a "Total Usage" card
with the pie icon. Add the totalUpDown label across all locales.
This commit is contained in:
MHSanaei
2026-06-12 16:22:30 +02:00
parent 5af02265ec
commit 85983eec1a
14 changed files with 31 additions and 8 deletions
+18 -8
View File
@@ -29,6 +29,7 @@ import {
EditOutlined,
LinkOutlined,
MoreOutlined,
PieChartOutlined,
PlusOutlined,
RetweetOutlined,
TagsOutlined,
@@ -480,30 +481,39 @@ export default function GroupsPage() {
<Col span={24}>
<Card size="small" hoverable className="summary-card">
<Row gutter={[16, isMobile ? 16 : 12]}>
<Col xs={12} sm={8}>
<Col xs={12} sm={12} md={6}>
<Statistic
title={t('pages.groups.totalGroups')}
value={String(totalGroups)}
prefix={<TagsOutlined />}
/>
</Col>
<Col xs={12} sm={8}>
<Col xs={12} sm={12} md={6}>
<Statistic
title={t('pages.groups.totalGroupedClients')}
value={String(totalClients)}
prefix={<TeamOutlined />}
/>
</Col>
<Col xs={24} sm={8}>
<Col xs={12} sm={12} md={6}>
<Statistic
title={t('pages.groups.totalUpDown')}
value={0}
formatter={() => (
<span>
<ArrowUpOutlined /> {SizeFormatter.sizeFormat(totalUpload)}
{' / '}
<ArrowDownOutlined /> {SizeFormatter.sizeFormat(totalDownload)}
</span>
)}
/>
</Col>
<Col xs={12} sm={12} md={6}>
<Statistic
title={t('pages.groups.totalTraffic')}
value={SizeFormatter.sizeFormat(totalTraffic)}
prefix={<RetweetOutlined />}
prefix={<PieChartOutlined />}
/>
<Space size={16} style={{ marginTop: 4, color: 'var(--ant-color-text-secondary)', fontSize: 13 }}>
<span><ArrowUpOutlined /> {SizeFormatter.sizeFormat(totalUpload)}</span>
<span><ArrowDownOutlined /> {SizeFormatter.sizeFormat(totalDownload)}</span>
</Space>
</Col>
</Row>
</Card>
+1
View File
@@ -819,6 +819,7 @@
"upload": "رفع",
"download": "تنزيل",
"totalTraffic": "إجمالي حركة المرور",
"totalUpDown": "إجمالي الرفع / التنزيل",
"addGroup": "إضافة مجموعة",
"createSuccess": "تم إنشاء المجموعة «{name}».",
"rename": "إعادة تسمية",
+1
View File
@@ -820,6 +820,7 @@
"upload": "Upload",
"download": "Download",
"totalTraffic": "Total traffic",
"totalUpDown": "Total upload / download",
"addGroup": "Add Group",
"createSuccess": "Group \"{name}\" created.",
"rename": "Rename",
+1
View File
@@ -819,6 +819,7 @@
"upload": "Subida",
"download": "Bajada",
"totalTraffic": "Tráfico total",
"totalUpDown": "Subida / bajada total",
"addGroup": "Añadir grupo",
"createSuccess": "Grupo «{name}» creado.",
"rename": "Renombrar",
+1
View File
@@ -819,6 +819,7 @@
"upload": "آپلود",
"download": "دانلود",
"totalTraffic": "مجموع ترافیک",
"totalUpDown": "مجموع آپلود / دانلود",
"addGroup": "افزودن گروه",
"createSuccess": "گروه «{name}» ایجاد شد.",
"rename": "تغییر نام",
+1
View File
@@ -819,6 +819,7 @@
"upload": "Unggah",
"download": "Unduh",
"totalTraffic": "Total trafik",
"totalUpDown": "Total unggah / unduh",
"addGroup": "Tambah grup",
"createSuccess": "Grup «{name}» dibuat.",
"rename": "Ubah nama",
+1
View File
@@ -819,6 +819,7 @@
"upload": "アップロード",
"download": "ダウンロード",
"totalTraffic": "合計トラフィック",
"totalUpDown": "合計アップロード / ダウンロード",
"addGroup": "グループ追加",
"createSuccess": "グループ「{name}」を作成しました。",
"rename": "名前変更",
+1
View File
@@ -819,6 +819,7 @@
"upload": "Envio",
"download": "Recebimento",
"totalTraffic": "Tráfego total",
"totalUpDown": "Total de envio / recebimento",
"addGroup": "Adicionar grupo",
"createSuccess": "Grupo «{name}» criado.",
"rename": "Renomear",
+1
View File
@@ -819,6 +819,7 @@
"upload": "Отправлено",
"download": "Получено",
"totalTraffic": "Общий трафик",
"totalUpDown": "Всего отправлено / получено",
"addGroup": "Добавить группу",
"createSuccess": "Группа «{name}» создана.",
"rename": "Переименовать",
+1
View File
@@ -820,6 +820,7 @@
"upload": "Yükleme",
"download": "İndirme",
"totalTraffic": "Toplam trafik",
"totalUpDown": "Toplam yükleme / indirme",
"addGroup": "Grup ekle",
"createSuccess": "«{name}» grubu oluşturuldu.",
"rename": "Yeniden adlandır",
+1
View File
@@ -819,6 +819,7 @@
"upload": "Вивантаження",
"download": "Завантаження",
"totalTraffic": "Загальний трафік",
"totalUpDown": "Всього вивантажено / завантажено",
"addGroup": "Додати групу",
"createSuccess": "Групу «{name}» створено.",
"rename": "Перейменувати",
+1
View File
@@ -819,6 +819,7 @@
"upload": "Tải lên",
"download": "Tải xuống",
"totalTraffic": "Tổng lưu lượng",
"totalUpDown": "Tổng tải lên / tải xuống",
"addGroup": "Thêm nhóm",
"createSuccess": "Đã tạo nhóm «{name}».",
"rename": "Đổi tên",
+1
View File
@@ -819,6 +819,7 @@
"upload": "上传",
"download": "下载",
"totalTraffic": "总流量",
"totalUpDown": "总上传 / 下载",
"addGroup": "添加分组",
"createSuccess": "已创建分组 “{name}”。",
"rename": "重命名",
+1
View File
@@ -819,6 +819,7 @@
"upload": "上傳",
"download": "下載",
"totalTraffic": "總流量",
"totalUpDown": "總上傳 / 下載",
"addGroup": "新增群組",
"createSuccess": "已建立群組「{name}」。",
"rename": "重新命名",