fix: remove nested button patterns across all pages, remove Dashboard gantt
This commit is contained in:
@@ -22,7 +22,6 @@ const DashboardPage: React.FC = () => {
|
||||
const screens = Grid.useBreakpoint();
|
||||
const isMobile = !screens.sm;
|
||||
const [stats, setStats] = useState<any>(null);
|
||||
const [ganttData, setGanttData] = useState<any[]>([]);
|
||||
const [expenseStats, setExpenseStats] = useState<any[]>([]);
|
||||
const [roomRanking, setRoomRanking] = useState<any[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
@@ -34,9 +33,8 @@ const DashboardPage: React.FC = () => {
|
||||
const fetchData = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const [s, g, e, r] = await Promise.all([
|
||||
const [s, e, r] = await Promise.all([
|
||||
api.get('/dashboard/stats'),
|
||||
api.get('/dashboard/gantt', { params: { periodStart: period[0], periodEnd: period[1] } }),
|
||||
api.get('/dashboard/expense-stats', {
|
||||
params: { periodStart: period[0], periodEnd: period[1] },
|
||||
}),
|
||||
@@ -45,7 +43,6 @@ const DashboardPage: React.FC = () => {
|
||||
}),
|
||||
]);
|
||||
setStats(s);
|
||||
setGanttData(g as any);
|
||||
setExpenseStats(e as any);
|
||||
setRoomRanking(r as any);
|
||||
} catch (e) {
|
||||
@@ -70,56 +67,6 @@ const DashboardPage: React.FC = () => {
|
||||
other: '其他',
|
||||
};
|
||||
|
||||
// 甘特图配置
|
||||
const ganttOption = () => {
|
||||
if (!ganttData.length) return {};
|
||||
const rooms = ganttData.map((d) => d.roomNumber);
|
||||
const pStart = new Date(period[0]).getTime();
|
||||
const pEnd = new Date(period[1]).getTime();
|
||||
|
||||
const data: any[] = [];
|
||||
ganttData.forEach((room, roomIdx) => {
|
||||
room.occupancies.forEach((occ: any, i: number) => {
|
||||
const start = Math.max(new Date(occ.checkInDate).getTime(), pStart);
|
||||
const end = occ.checkOutDate ? Math.min(new Date(occ.checkOutDate).getTime(), pEnd) : pEnd;
|
||||
data.push({
|
||||
name: occ.studentName,
|
||||
value: [roomIdx, start, end, occ.studentName],
|
||||
itemStyle: { color: COLORS[(occ.studentId || i) % COLORS.length] },
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
return {
|
||||
tooltip: {
|
||||
formatter: (p: any) => {
|
||||
const v = p.value;
|
||||
return `${p.name}<br/>宿舍: ${rooms[v[0]]}<br/>入住: ${dayjs(v[1]).format('MM-DD')} ~ ${dayjs(v[2]).format('MM-DD')}`;
|
||||
},
|
||||
},
|
||||
grid: { left: 80, right: 30, top: 20, bottom: 30 },
|
||||
xAxis: { type: 'time', min: pStart, max: pEnd },
|
||||
yAxis: { type: 'category', data: rooms, inverse: true },
|
||||
series: [
|
||||
{
|
||||
type: 'custom',
|
||||
renderItem: (_params: any, api: any) => {
|
||||
const catIdx = api.value(0);
|
||||
const start = api.coord([api.value(1), catIdx]);
|
||||
const end = api.coord([api.value(2), catIdx]);
|
||||
const height = api.size([0, 1])[1] * 0.6;
|
||||
return {
|
||||
type: 'rect',
|
||||
shape: { x: start[0], y: start[1] - height / 2, width: end[0] - start[0], height },
|
||||
style: { ...api.style(), fill: api.visual('color'), stroke: '#fff', lineWidth: 1 },
|
||||
};
|
||||
},
|
||||
encode: { x: [1, 2], y: 0 },
|
||||
data,
|
||||
},
|
||||
],
|
||||
};
|
||||
};
|
||||
|
||||
// 费用饼图
|
||||
const pieOption = {
|
||||
@@ -298,17 +245,6 @@ const DashboardPage: React.FC = () => {
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Card title="入住时间线(甘特图)" style={{ marginBottom: 24 }}>
|
||||
{ganttData.length > 0 ? (
|
||||
<ReactECharts
|
||||
option={ganttOption()}
|
||||
style={{ width: '100%', height: Math.max(300, ganttData.length * 40) }}
|
||||
/>
|
||||
) : (
|
||||
<div style={{ textAlign: 'center', padding: 40, color: '#999' }}>暂无入住数据</div>
|
||||
)}
|
||||
</Card>
|
||||
|
||||
<Row gutter={[16, 16]} style={{ marginBottom: 24 }}>
|
||||
<Col xs={24} sm={12}>
|
||||
<Card title="考勤趋势(近30天)">
|
||||
|
||||
Reference in New Issue
Block a user