/* ========== 工作负载甘特图样式 ========== */ .workload-gantt-card { background: white; border-radius: 12px; padding: 20px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); margin-bottom: 24px; .gantt-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; flex-wrap: wrap; gap: 12px; h3 { font-size: 18px; font-weight: 700; color: #1f2937; margin: 0; } .gantt-subtitle { width: 100%; font-size: 13px; color: #6b7280; margin: 4px 0 8px 0; } .gantt-controls { display: flex; align-items: center; gap: 20px; .scale-switch { display: flex; background: #f3f4f6; border-radius: 8px; padding: 2px; button { padding: 8px 16px; border: none; background: transparent; border-radius: 6px; font-size: 14px; font-weight: 500; color: #6b7280; cursor: pointer; transition: all 0.2s ease; &:hover { color: #1f2937; } &.active { background: white; color: #3b82f6; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } } } .legend { display: flex; gap: 16px; align-items: center; .legend-item { display: flex; align-items: center; gap: 6px; font-size: 14px; color: #6b7280; .dot { width: 12px; height: 12px; border-radius: 3px; &.idle { background: #f3f4f6; // 空闲 } &.busy { background: #3b82f6; // 忙碌 } &.overload { background: #ef4444; // 超负荷 } &.leave { background: repeating-linear-gradient(45deg, #e5e7eb, #e5e7eb 2px, #f3f4f6 2px, #f3f4f6 4px); // 请假纹理 } } } } } } .gantt-container { width: 100%; height: 500px; min-height: 400px; cursor: pointer; // 提示可点击 // ECharts会覆盖cursor,所以在全局添加 canvas { cursor: pointer !important; } } }