* { margin: 0; padding: 0; box-sizing: border-box; } html, body, #app { height: 100%; font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif; } // 页面通用样式 .page-container { background: #fff; border-radius: 4px; padding: 20px; min-height: calc(100vh - 140px); } .search-bar { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; padding: 16px; background: #fafafa; border-radius: 4px; .el-input, .el-select, .el-cascader, .el-date-picker { width: 200px; } } .tool-bar { margin-bottom: 16px; display: flex; justify-content: space-between; } // 表格操作按钮 .table-actions { display: flex; gap: 8px; } // 弹窗表单 .dialog-form { .el-form-item { margin-bottom: 18px; } .el-input, .el-select, .el-cascader { width: 100%; } } // 统计卡片 .stat-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; } .stat-card { background: #fff; border-radius: 8px; padding: 20px; display: flex; align-items: center; gap: 16px; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08); .stat-icon { width: 56px; height: 56px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #fff; } .stat-info { .stat-label { color: #909399; font-size: 14px; } .stat-value { font-size: 28px; font-weight: 700; color: #303133; } } }