| | |
| | | import React, { useState, useRef, useEffect, useMemo } from "react"; |
| | | import { useNavigate } from 'react-router-dom'; |
| | | import { useTheme } from '@mui/material/styles'; |
| | | 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 { Box, Typography, LinearProgress, Stack, Grid } from '@mui/material'; |
| | | import React, { useState, useRef, useEffect, useMemo } from "react"; |
| | | import SensorOccupiedIcon from '@mui/icons-material/SensorOccupied'; |
| | | import CardWithIcon from '../components/CardWithIcon'; |
| | | import CommentIcon from '@mui/icons-material/Comment'; |
| | | import WifiIcon from '@mui/icons-material/Wifi'; |
| | | import { useTheme } from '@mui/material/styles'; |
| | | import { useNavigate } from 'react-router-dom'; |
| | | import { getSystemDicts } from '@/api/auth' |
| | | import { WordEffect } from './WordEffect'; |
| | | import request from '@/utils/request'; |
| | | import { Box, Typography, LinearProgress, Stack } from '@mui/material'; |
| | | import Welcome from "./Welcome"; |
| | | import NbChart from "./NbChart"; |
| | | import NbList from "./NbList"; |
| | | import NbCard from "./NbCard"; |
| | | import NbPie from './NbPie'; |
| | | |
| | | const styles = { |
| | | flex: { display: 'flex' }, |
| | | flexColumn: { display: 'flex', flexDirection: 'column' }, |
| | | leftCol: { flex: 1, marginRight: '0.5em' }, |
| | | rightCol: { flex: 1, marginLeft: '0.5em' }, |
| | | leftCol: { flex: 1, }, |
| | | rightCol: { flex: 1, }, |
| | | singleCol: { marginTop: '1em', marginBottom: '1em' }, |
| | | }; |
| | | |
| | |
| | | padding: '2rem 1rem', |
| | | }} |
| | | > |
| | | <WordEffect |
| | | {/* <WordEffect |
| | | words={translate('page.welcome.index')} |
| | | color={theme.palette.mode === 'light' ? '#666' : '#eeeeee'} |
| | | /> |
| | | <WordEffect |
| | | words={translate('page.welcome.tech')} |
| | | color={theme.palette.mode === 'light' ? '#666' : '#eeeeee'} |
| | | /> |
| | | /> */} |
| | | </div> |
| | | </> |
| | | ) |
| | |
| | | const DashboardSummaryView = () => { |
| | | const translate = useTranslate(); |
| | | const notify = useNotify(); |
| | | const [statistic, setStatistic] = useState(null); |
| | | const [statistic, setStatistic] = useState({}); |
| | | const [stock, setStock] = useState([]); |
| | | const [deadStock, setDeadStock] = useState([]); |
| | | const [locUsage, setLocUsages] = useState([]); |
| | | const [tasks, setTasks] = useState([]); |
| | | const [total, setTotal] = useState(0); |
| | | |
| | | |
| | | useEffect(() => { |
| | | request.get('/dashboard/member/statistic', { |
| | | params: {} |
| | | }).then(res => { |
| | | const { code, msg, data } = res.data; |
| | | getDashBoardHeader() |
| | | getRecentTrands() |
| | | getRecentStocks() |
| | | getRecentUsage() |
| | | getExcingTasks() |
| | | |
| | | }, []) |
| | | |
| | | const getDashBoardHeader = async () => { |
| | | await request.post('/asnOrder/dashbord/header').then(res => { |
| | | const { code, msg, data } = res?.data; |
| | | console.log(code); |
| | | |
| | | if (code === 200) { |
| | | setStatistic(data); |
| | | } else { |
| | |
| | | } |
| | | }).catch((error) => { |
| | | notify(error.message, { type: 'error', messageArgs: { _: error.message } }); |
| | | console.error(error); |
| | | }) |
| | | }, []) |
| | | } |
| | | |
| | | const getRecentStocks = async () => { |
| | | await request.post('/locItem/page', { current: 1, pageSize: 10, orderBy: 'create_time asc' }).then(res => { |
| | | const { code, msg, data } = res?.data; |
| | | if (code === 200) { |
| | | setDeadStock(data?.records); |
| | | } else { |
| | | notify(msg, { type: 'error', messageArgs: { _: msg } }); |
| | | } |
| | | }).catch((error) => { |
| | | notify(error.message, { type: 'error', messageArgs: { _: error.message } }); |
| | | }) |
| | | } |
| | | |
| | | const getExcingTasks = async () => { |
| | | await request.post('/task/page', { current: 1, pageSize: 100, orderBy: 'sort desc' }).then(res => { |
| | | const { code, msg, data } = res?.data; |
| | | if (code === 200) { |
| | | setTasks(data?.records) |
| | | setTotal(data?.total) |
| | | } else { |
| | | notify(msg, { type: 'error', messageArgs: { _: msg } }); |
| | | } |
| | | }).catch((error) => { |
| | | notify(error.message, { type: 'error', messageArgs: { _: error.message } }); |
| | | }) |
| | | } |
| | | |
| | | const getRecentUsage = () => { |
| | | request.post("/loc/pie/list").then(res => { |
| | | const { code, msg, data } = res?.data; |
| | | if (code === 200) { |
| | | setLocUsages(data?.data) |
| | | } else { |
| | | notify(msg, { type: 'error', messageArgs: { _: msg } }); |
| | | } |
| | | }).catch((error) => { |
| | | notify(error.message, { type: 'error', messageArgs: { _: error.message } }); |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * 获取库近一个月出入库信息 |
| | | */ |
| | | const getRecentTrands = async () => { |
| | | await request.post('/asnOrder/stock/trand').then(res => { |
| | | const { code, msg, data } = res.data?.data; |
| | | if (code === 200) { |
| | | setStock(data) |
| | | } else { |
| | | notify(msg, { type: 'error', messageArgs: { _: msg } }); |
| | | } |
| | | }).catch((error) => { |
| | | notify(error.message, { type: 'error', messageArgs: { _: error.message } }); |
| | | }) |
| | | } |
| | | |
| | | return ( |
| | | <> |
| | | <div style={styles.flex}> |
| | | <div style={styles.leftCol}> |
| | | <div style={styles.flex}> |
| | | <Grid container md={12} item> |
| | | <Grid item md={8}> |
| | | <Box sx={{ display: "flex" }}> |
| | | <CardWithIcon |
| | | icon={WifiIcon} |
| | | title={translate('page.member.header.onlineMembers')} |
| | | subtitle={`${statistic?.membersOnlineQua}`} |
| | | subtitle={translate('page.dashboard.header.inStockQty')} |
| | | title={`${statistic?.inAnf}`} |
| | | type={"in"} |
| | | statistic={statistic} |
| | | /> |
| | | <Spacer /> |
| | | <CardWithIcon |
| | | icon={SensorOccupiedIcon} |
| | | title={translate('page.member.header.totalMembers')} |
| | | subtitle={`${statistic?.membersTotalQua}`} |
| | | subtitle={translate('page.dashboard.header.outStockQty')} |
| | | title={`${statistic?.outAnf}`} |
| | | type={"out"} |
| | | statistic={statistic} |
| | | /> |
| | | </div> |
| | | <div style={styles.singleCol}> |
| | | {/* <OrderChart 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}`} |
| | | /> |
| | | </Box> |
| | | <Spacer /> |
| | | <Box> |
| | | <NbChart orders={stock} /> |
| | | </Box> |
| | | <Spacer /> |
| | | <Box sx={{ display: 'flex', justifyContent: 'space-between' }}> |
| | | <NbList deadStock={deadStock} /> |
| | | <NbPie locUsage={locUsage} /> |
| | | </Box> |
| | | <Spacer /> |
| | | </Grid> |
| | | <Grid item md={4}> |
| | | <Box sx={{ display: 'flex' }}> |
| | | <Spacer /> |
| | | <CardWithIcon |
| | | icon={SensorOccupiedIcon} |
| | | title={translate('page.member.header.totalMembers')} |
| | | subtitle={`${statistic?.membersTotalQua}`} |
| | | <NbCard |
| | | icon={CommentIcon} |
| | | subtitle={translate('page.dashboard.header.taskWorkQty')} |
| | | title={`${statistic?.taskQty}`} |
| | | total={total} |
| | | to={{ |
| | | pathname: '/task', |
| | | search: JSON.stringify({ |
| | | filter: JSON.stringify({ status: 1 }), |
| | | }), |
| | | }} |
| | | tasks={tasks} |
| | | /> |
| | | </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 > */} |
| | | </Box> |
| | | </Grid> |
| | | </Grid> |
| | | </> |
| | | ) |
| | | } |