73 lines
1.7 KiB
TypeScript
73 lines
1.7 KiB
TypeScript
|
import { PageContainer, StatisticCard } from '@ant-design/pro-components';
|
||
|
|
import { Col, Row } from 'antd';
|
||
|
|
import { useEffect, useState } from 'react';
|
||
|
|
import { getStockSummary } from '@/services/api';
|
||
|
|
|
||
|
|
const { Statistic } = StatisticCard;
|
||
|
|
|
||
|
|
const DashboardPage: React.FC = () => {
|
||
|
|
const [summary, setSummary] = useState<any>({});
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
getStockSummary().then((res) => {
|
||
|
|
if (res?.code === 0) {
|
||
|
|
setSummary(res.data);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<PageContainer>
|
||
|
|
<Row gutter={[16, 16]}>
|
||
|
|
<Col span={4}>
|
||
|
|
<StatisticCard
|
||
|
|
statistic={{
|
||
|
|
title: '产品总数',
|
||
|
|
value: summary.productCount || 0,
|
||
|
|
suffix: '种',
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</Col>
|
||
|
|
<Col span={5}>
|
||
|
|
<StatisticCard
|
||
|
|
statistic={{
|
||
|
|
title: '总匹数',
|
||
|
|
value: summary.totalPieces || 0,
|
||
|
|
suffix: '匹',
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</Col>
|
||
|
|
<Col span={5}>
|
||
|
|
<StatisticCard
|
||
|
|
statistic={{
|
||
|
|
title: '总盘数',
|
||
|
|
value: summary.totalRolls || 0,
|
||
|
|
suffix: '盘',
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</Col>
|
||
|
|
<Col span={5}>
|
||
|
|
<StatisticCard
|
||
|
|
statistic={{
|
||
|
|
title: '库存总值(成本)',
|
||
|
|
value: summary.totalCostValue || '0.00',
|
||
|
|
prefix: '¥',
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</Col>
|
||
|
|
<Col span={5}>
|
||
|
|
<StatisticCard
|
||
|
|
statistic={{
|
||
|
|
title: '库存总值(销售)',
|
||
|
|
value: summary.totalSalesValue || '0.00',
|
||
|
|
prefix: '¥',
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</Col>
|
||
|
|
</Row>
|
||
|
|
</PageContainer>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default DashboardPage;
|