|  |  | 
 |  |  | 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 NbChart from "./NbChart"; | 
 |  |  | import NbList from "./NbList"; | 
 |  |  | import NbCard from "./NbCard"; | 
 |  |  | import NbPie from './NbPie'; | 
 |  |  |  | 
 |  |  | const styles = { | 
 |  |  |     flex: { display: 'flex' }, | 
 |  |  | 
 |  |  |     const notify = useNotify(); | 
 |  |  |     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(() => { | 
 |  |  |         getDashBoardHeader() | 
 |  |  |         getRecentTrands() | 
 |  |  |         getRecentStocks() | 
 |  |  |         getRecentUsage() | 
 |  |  |         getExcingTasks() | 
 |  |  |  | 
 |  |  |     }, []) | 
 |  |  |  | 
 |  |  |     const getDashBoardHeader = async () => { | 
 |  |  |         await request.post('/asnOrder/dashbord/header').then(res => { | 
 |  |  |             const { code, msg, data } = res.data?.data; | 
 |  |  |             const { code, msg, data } = res?.data; | 
 |  |  |             console.log(code); | 
 |  |  |              | 
 |  |  |             if (code === 200) { | 
 |  |  |                 setStatistic(data); | 
 |  |  |             } else { | 
 |  |  | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     const getRecentStocks = async () => { | 
 |  |  |         await request.post('/asnOrder/dashbord/header').then(res => { | 
 |  |  |             const { code, msg, data } = res.data?.data; | 
 |  |  |         await request.post('/locItem/page', { current: 1, pageSize: 10, orderBy: 'create_time asc' }).then(res => { | 
 |  |  |             const { code, msg, data } = res?.data; | 
 |  |  |             if (code === 200) { | 
 |  |  |                 setStatistic(data); | 
 |  |  |                 setDeadStock(data?.records); | 
 |  |  |             } else { | 
 |  |  |                 notify(msg, { type: 'error', messageArgs: { _: msg } }); | 
 |  |  |             } | 
 |  |  | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     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 recentOrders = [ | 
 |  |  |         { | 
 |  |  |             id: 1, | 
 |  |  |             name: 'a', | 
 |  |  |             date: "2025-08-10T12:23:56.959Z", | 
 |  |  |             total: 138.94, | 
 |  |  |             inTotal: 254, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             id: 2, | 
 |  |  |             name: 'b', | 
 |  |  |             date: "2025-08-03T07:45:00.304Z", | 
 |  |  |             total: 214.66, | 
 |  |  |             inTotal: 258, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             id: 3, | 
 |  |  |             name: 'c', | 
 |  |  |             date: "2025-07-28T00:20:10.968Z", | 
 |  |  |             total: 68.19, | 
 |  |  |             inTotal: 154, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             id: 4, | 
 |  |  |             name: 'd', | 
 |  |  |             date: "2025-07-22T20:39:00.293Z", | 
 |  |  |             total: 36.56, | 
 |  |  |             inTotal: 124, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             id: 5, | 
 |  |  |             name: 'e', | 
 |  |  |             date: "2025-07-16T17:40:24.791Z", | 
 |  |  |             total: 100.82, | 
 |  |  |             inTotal: 354, | 
 |  |  |         }, | 
 |  |  |     ] | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <> | 
 |  |  |             <Grid container md={12}> | 
 |  |  |             <Grid container md={12} item> | 
 |  |  |                 <Grid item md={8}> | 
 |  |  |                     <Box sx={{ display: "flex" }}> | 
 |  |  |                         <CardWithIcon | 
 |  |  | 
 |  |  |                         <CardWithIcon | 
 |  |  |                             icon={SensorOccupiedIcon} | 
 |  |  |                             subtitle={translate('page.dashboard.header.outStockQty')} | 
 |  |  |                             title={`${statistic?.membersTotalQua}`} | 
 |  |  |                             title={`${statistic?.outAnf}`} | 
 |  |  |                             type={"out"} | 
 |  |  |                             statistic={statistic} | 
 |  |  |  | 
 |  |  |                         /> | 
 |  |  |                     </Box> | 
 |  |  |                     <Spacer /> | 
 |  |  | 
 |  |  |                         <NbChart orders={stock} /> | 
 |  |  |                     </Box> | 
 |  |  |                     <Spacer /> | 
 |  |  |                     <Box> | 
 |  |  |                         <NbList orders={recentOrders} /> | 
 |  |  |                     <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 /> | 
 |  |  |                         <NbCard | 
 |  |  |                             icon={SensorOccupiedIcon} | 
 |  |  |                             icon={CommentIcon} | 
 |  |  |                             subtitle={translate('page.dashboard.header.taskWorkQty')} | 
 |  |  |                             title={`${statistic?.membersTotalQua}`} | 
 |  |  |                             title={`${statistic?.taskQty}`} | 
 |  |  |                             total={total} | 
 |  |  |                             to={{ | 
 |  |  |                                 pathname: '/task', | 
 |  |  |                                 search: JSON.stringify({ | 
 |  |  |                                     filter: JSON.stringify({ status: 1 }), | 
 |  |  |                                 }), | 
 |  |  |                             }} | 
 |  |  |                             list={recentOrders} | 
 |  |  |                             tasks={tasks} | 
 |  |  |                         /> | 
 |  |  |                     </Box> | 
 |  |  |                 </Grid> |