From 4cac404f499310ecd4e34658bf26a8d6c452aa6a Mon Sep 17 00:00:00 2001 From: kkfluous Date: Fri, 27 Mar 2026 18:22:00 +0800 Subject: [PATCH] feat: add department operations statistics section Co-Authored-By: Claude Opus 4.6 (1M context) --- src/App.tsx | 496 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 496 insertions(+) diff --git a/src/App.tsx b/src/App.tsx index 996cf6c..8e86f6e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -860,6 +860,502 @@ export default function App() { + {/* Department Operations Statistics */} +
+
+
+
+
+

部门运营统计

+

实时更新部门运营核心指标

+
+
+
+ +
+ {/* Overall Total Summary (Compact) */} +
+
+
+ 总资产 + {deptData.reduce((s, d) => s + d.totalAssets, 0)} +
+
+ 运营中 + + {deptData.reduce((acc, d) => acc + d.operatingCount, 0)} + +
+
+ 闲置中 + + {deptData.reduce((acc, d) => acc + d.idleCount, 0)} + +
+
+
+ + {/* Controls Row: Toggles Left, Filter Right */} +
+
+ + +
+ +
+ {deptViewMode === 'manager' && ( +
+ + + +
+ )} +
+
+ + {/* Desktop Table View */} +
+ + + + + {deptViewMode === 'manager' && } + {deptViewMode === 'department' && ( + <> + + + + + )} + {deptViewMode === 'manager' && ( + <> + + + + + + + + + )} + + + + + {deptViewMode === 'department' ? ( + deptData.map((dept) => { + const isExpanded = expandedDepts.has(dept.department); + return ( + + toggleDept(dept.department)} + > + + + + + + + {isExpanded && ( + + + + )} + + ); + }) + ) : ( + managerStats.map((m) => { + const isManagerExpanded = expandedManagerDetails.has(m.manager); + return ( + + toggleManagerDetails(m.manager)} + > + + + + + + + + + + + + {isManagerExpanded && ( + + + + )} + + ); + }) + )} + +
{deptViewMode === 'department' ? '部门名称' : '业务员'}所属部门资产总数运营中闲置中合计资产4.5T冷链18T49T挂车其他详情
+ {dept.department} + + {dept.totalAssets} + + {dept.operatingCount} + + {dept.idleCount} + + {isExpanded ? : } +
+
+ {dept.managers.map(m => { + const isManagerExpanded = expandedManagerDetails.has(m.manager); + return ( +
+
toggleManagerDetails(m.manager)} + > +
+ {isManagerExpanded ? : } + {m.manager} +
+ +
+ + {isManagerExpanded && ( +
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T普货' })} + > +
4.5T
+
{m.t4_5}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T冷链' })} + > +
冷链
+
{m.t4_5c}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '18T' })} + > +
18T
+
{m.t18}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '49T' })} + > +
49T
+
{m.t49}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, isTrailer: true })} + > +
挂车
+
{m.trailer}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '其他' })} + > +
其他
+
{m.other}
+
+
+
+ )} +
+ ); + })} +
+
+ {isManagerExpanded ? : } + {m.manager} + {m.department} { + e.stopPropagation(); + setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager }); + }} + > + {m.total} + ------ + +
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T普货' })}> + 4.5T + {m.t4_5} +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T冷链' })}> + 冷链 + {m.t4_5c} +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '18T' })}> + 18T + {m.t18} +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '49T' })}> + 49T + {m.t49} +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, isTrailer: true })}> + 挂车 + {m.trailer} +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '其他' })}> + 其他 + {m.other} +
+
+
+
+ + {/* Mobile Card View */} +
+ {deptViewMode === 'department' ? ( + deptData.map((dept) => { + const isExpanded = expandedDepts.has(dept.department); + return ( +
+
toggleDept(dept.department)} + > +
+

{dept.department}

+
+
+
+
资产
+
{dept.totalAssets}
+
+
+
运营
+
{dept.operatingCount}
+
+
+
闲置
+
{dept.idleCount}
+
+
+
+ {isExpanded ? : } +
+
+ {isExpanded && ( +
+ {dept.managers.map(m => { + const isManagerExpanded = expandedManagerDetails.has(m.manager); + return ( +
+
toggleManagerDetails(m.manager)} + > +
+ {isManagerExpanded ? : } + {m.manager} +
+ +
+ + {isManagerExpanded && ( +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T普货' })} + > +
4.5T
+
{m.t4_5}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T冷链' })} + > +
冷链
+
{m.t4_5c}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '18T' })} + > +
18T
+
{m.t18}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '49T' })} + > +
49T
+
{m.t49}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, isTrailer: true })} + > +
挂车
+
{m.trailer}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '其他' })} + > +
其他
+
{m.other}
+
+
+ )} +
+ ); + })} +
+ )} +
+ ); + }) + ) : ( + managerStats.map((m) => { + const isManagerExpanded = expandedManagerDetails.has(m.manager); + return ( +
+
toggleManagerDetails(m.manager)} + > +
+ {isManagerExpanded ? : } +
+

{m.manager}

+ {m.department} +
{ + e.stopPropagation(); + setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager }); + }} + > + 资产: {m.total} +
+
+
+ + +
+ + {isManagerExpanded && ( +
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T普货' })} + > +
4.5T
+
{m.t4_5}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '4.5T冷链' })} + > +
冷链
+
{m.t4_5c}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '18T' })} + > +
18T
+
{m.t18}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '49T' })} + > +
49T
+
{m.t49}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, isTrailer: true })} + > +
挂车
+
{m.trailer}
+
+
setShowPlateNumbers({ batch: 'All', model: 'All', location: 'All', manager: m.manager, vehicleType: '其他' })} + > +
其他
+
{m.other}
+
+
+ )} +
+ ); + }) + )} +
+
+
+ {/* Plate Number Modal */} {showPlateNumbers && (