From 8a4755489c7c20bf21f481b272f87bc29a2d36c7 Mon Sep 17 00:00:00 2001 From: vincentlu <t1341870251@gmail.com> Date: 星期一, 11 八月 2025 11:17:32 +0800 Subject: [PATCH] # --- rsf-admin/src/page/dashboard/index.jsx | 135 ++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 134 insertions(+), 1 deletions(-) diff --git a/rsf-admin/src/page/dashboard/index.jsx b/rsf-admin/src/page/dashboard/index.jsx index 986ace8..c02706a 100644 --- a/rsf-admin/src/page/dashboard/index.jsx +++ b/rsf-admin/src/page/dashboard/index.jsx @@ -1,10 +1,24 @@ import React, { useState, useRef, useEffect, useMemo } from "react"; import { useNavigate } from 'react-router-dom'; import { useTheme } from '@mui/material/styles'; -import { useTranslate, useAuthProvider, Title } from 'react-admin'; +import { useTranslate, useAuthProvider, Title, useNotify } from 'react-admin'; import { WordEffect } from './WordEffect'; import { getSystemDicts } from '@/api/auth' import Welcome from "./Welcome"; +import CardWithIcon from '../components/CardWithIcon'; +import SensorOccupiedIcon from '@mui/icons-material/SensorOccupied'; +import WifiIcon from '@mui/icons-material/Wifi'; +import request from '@/utils/request'; +import { Box, Typography, LinearProgress, Stack } from '@mui/material'; +import NbChart from "./NbChart"; + +const styles = { + flex: { display: 'flex' }, + flexColumn: { display: 'flex', flexDirection: 'column' }, + leftCol: { flex: 1, marginRight: '0.5em' }, + rightCol: { flex: 1, marginLeft: '0.5em' }, + singleCol: { marginTop: '1em', marginBottom: '1em' }, +}; const Dashboard = () => { const authProvider = useAuthProvider(); @@ -25,6 +39,7 @@ <> <Title title={"menu.dashboard"} /> <Welcome /> + <DashboardSummaryView /> <div style={{ boxSizing: 'border-box', @@ -50,4 +65,122 @@ ) } +const DashboardSummaryView = () => { + const translate = useTranslate(); + const notify = useNotify(); + const [statistic, setStatistic] = useState(null); + + useEffect(() => { + request.get('/dashboard/member/statistic', { + params: {} + }).then(res => { + const { code, msg, data } = res.data; + if (code === 200) { + setStatistic(data); + } else { + notify(msg, { type: 'error', messageArgs: { _: msg } }); + } + }).catch((error) => { + notify(error.message, { type: 'error', messageArgs: { _: error.message } }); + console.error(error); + }) + }, []) + + const recentOrders = [ + { + date: "2025-08-10T12:23:56.959Z", + total: 138.94 + }, + { + date: "2025-08-03T07:45:00.304Z", + total: 214.66 + }, + { + date: "2025-07-28T00:20:10.968Z", + total: 68.19 + }, + { + date: "2025-07-22T20:39:00.293Z", + total: 36.56 + }, + { + date: "2025-07-16T17:40:24.791Z", + total: 100.82 + }, + ] + + return ( + <> + <div style={styles.flex}> + <div style={styles.leftCol}> + <div style={styles.flex}> + <CardWithIcon + icon={WifiIcon} + title={translate('page.member.header.onlineMembers')} + subtitle={`${statistic?.membersOnlineQua}`} + /> + <Spacer /> + <CardWithIcon + icon={SensorOccupiedIcon} + title={translate('page.member.header.totalMembers')} + subtitle={`${statistic?.membersTotalQua}`} + /> + </div> + <div style={styles.singleCol}> + <NbChart orders={recentOrders} /> + </div> + <div style={styles.singleCol}> + {/* <PendingOrders orders={pendingOrders} /> */} + </div> + </div> + <div style={styles.rightCol}> + <div style={styles.flex}> + <CardWithIcon + icon={WifiIcon} + title={translate('page.member.header.onlineMembers')} + subtitle={`${statistic?.membersOnlineQua}`} + /> + <Spacer /> + <CardWithIcon + icon={SensorOccupiedIcon} + title={translate('page.member.header.totalMembers')} + subtitle={`${statistic?.membersTotalQua}`} + /> + </div> + </div> + </div> + + {/* <Box sx={{ + display: 'flex', + mt: 2, + gap: 2, + justifyContent: 'space-between', + }}> + <CardWithIcon + icon={WifiIcon} + title={translate('page.member.header.onlineMembers')} + subtitle={`${statistic?.membersOnlineQua}`} + /> + <CardWithIcon + icon={SensorOccupiedIcon} + title={translate('page.member.header.totalMembers')} + subtitle={`${statistic?.membersTotalQua}`} + /> + <CardWithIcon + icon={WifiIcon} + title={translate('page.member.header.onlineMembers')} + subtitle={`${statistic?.membersOnlineQua}`} + /> + <CardWithIcon + icon={SensorOccupiedIcon} + title={translate('page.member.header.totalMembers')} + subtitle={`${statistic?.membersTotalQua}`} + /> + </Box > */} + </> + ) +} + +const Spacer = () => <span style={{ width: '1em' }} />; + export default Dashboard; \ No newline at end of file -- Gitblit v1.9.1