.admin-dashboard { min-height: 100vh; background: #f8fafc; } /* 使用与普通Dashboard一致的Header样式 */ .admin-dashboard .dashboard-header { background: white; border-bottom: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } .admin-dashboard .header-content { max-width: 1400px; margin: 0 auto; padding: 1rem 2rem; display: flex; justify-content: space-between; align-items: center; } .admin-dashboard .logo { display: flex; align-items: center; gap: 0.5rem; font-size: 1.5rem; font-weight: bold; color: #667eea; } .admin-dashboard .logo-icon { width: 32px; height: 32px; } .admin-dashboard .user-actions { display: flex; align-items: center; gap: 1rem; } .auto-refresh-toggle { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; border: 1px solid #e2e8f0; background: white; border-radius: 8px; cursor: pointer; transition: all 0.3s ease; font-size: 0.875rem; color: #64748b; } .auto-refresh-toggle:hover { border-color: #667eea; color: #667eea; transform: translateY(-1px); } .auto-refresh-toggle.active { background: #667eea; color: white; border-color: #667eea; } .admin-dashboard .user-menu-trigger { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: #f8fafc; border-radius: 12px; cursor: pointer; transition: all 0.2s; } .admin-dashboard .user-menu-trigger:hover { background: #f1f5f9; transform: translateY(-1px); } .dashboard-content { max-width: 1400px; margin: 0 auto; padding: 2rem; } .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin-bottom: 2rem; } .stat-card { background: white; border-radius: 16px; padding: 1.5rem; display: flex; gap: 1rem; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); transition: all 0.3s ease; } .stat-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12); } .stat-icon { width: 60px; height: 60px; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: white; flex-shrink: 0; } .stat-content { flex: 1; } .stat-content h3 { margin: 0 0 0.5rem 0; font-size: 0.875rem; color: #64748b; font-weight: 500; } .stat-number { font-size: 2rem; font-weight: 700; color: #1e293b; margin-bottom: 0.5rem; } .stat-details { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.875rem; color: #64748b; } .resource-bars { display: flex; flex-direction: column; gap: 0.5rem; } .resource-item { display: flex; align-items: center; gap: 0.5rem; } .resource-bar { flex: 1; height: 8px; background: #f1f5f9; border-radius: 4px; overflow: hidden; } .resource-fill { height: 100%; background: linear-gradient(90deg, #667eea 0%, #764ba2 100%); transition: width 0.3s ease; } .tasks-overview { margin-bottom: 2rem; } .tasks-overview h2 { color: #1e293b; margin-bottom: 1rem; font-size: 1.25rem; font-weight: 600; } .task-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; } .task-stat-card { background: white; border-radius: 16px; padding: 1.5rem; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); } .task-stat-card h3 { margin: 0 0 1rem 0; font-size: 1.125rem; color: #1e293b; font-weight: 600; } .task-stat-numbers { display: flex; justify-content: space-between; gap: 1rem; } .task-stat-item { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; } .task-stat-label { font-size: 0.875rem; color: #64748b; } .task-stat-value { font-size: 1.5rem; font-weight: 700; } .task-stat-value.running { color: #3b82f6; } .task-stat-value.completed { color: #10b981; } .task-stat-value.failed { color: #ef4444; } .admin-content-grid { display: flex; flex-direction: column; gap: 2rem; } .admin-panel { background: white; border-radius: 16px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); } .panel-header { padding: 1.5rem; border-bottom: 1px solid #e2e8f0; display: flex; justify-content: space-between; align-items: center; } .panel-header h2 { margin: 0; font-size: 1.25rem; color: #1e293b; font-weight: 600; } .panel-filters { display: flex; gap: 0.75rem; } .panel-filters select { padding: 0.5rem 1rem; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 0.875rem; background: white; cursor: pointer; transition: all 0.2s; } .panel-filters select:hover { border-color: #667eea; } .panel-filters select:focus { outline: none; border-color: #667eea; box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); } .panel-content { padding: 1.5rem; max-height: 500px; overflow-y: auto; } .empty-state { text-align: center; padding: 3rem; color: #94a3b8; font-size: 0.875rem; } .online-users-table, .tasks-table { width: 100%; border-collapse: collapse; } .online-users-table th, .tasks-table th { text-align: left; padding: 0.75rem; background: #f8fafc; color: #475569; font-weight: 600; font-size: 0.875rem; border-bottom: 2px solid #e2e8f0; } .online-users-table td, .tasks-table td { padding: 0.75rem; border-bottom: 1px solid #f1f5f9; font-size: 0.875rem; color: #1e293b; } .online-users-table tbody tr:hover, .tasks-table tbody tr:hover { background: #f8fafc; } .kick-btn { padding: 0.375rem; border: none; background: #fef2f2; color: #ef4444; border-radius: 6px; cursor: pointer; transition: all 0.2s; display: inline-flex; align-items: center; justify-content: center; } .kick-btn:hover { background: #fee2e2; transform: translateY(-1px); } .status-badge { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 12px; font-size: 0.75rem; font-weight: 600; } .status-badge.status-pending { background: #fef3c7; color: #92400e; } .status-badge.status-processing { background: #dbeafe; color: #1e40af; } .status-badge.status-completed { background: #d1fae5; color: #065f46; } .status-badge.status-failed { background: #fee2e2; color: #991b1b; } .loading-container { display: flex; align-items: center; justify-content: center; min-height: 100vh; color: white; font-size: 1.25rem; } .admin-dashboard .error-message { background: #fee2e2; color: #991b1b; padding: 1rem; border-radius: 8px; margin-bottom: 1rem; } /* 滚动条样式 */ .panel-content::-webkit-scrollbar { width: 8px; } .panel-content::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 4px; } .panel-content::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; } .panel-content::-webkit-scrollbar-thumb:hover { background: #94a3b8; } /* 全宽面板 */ .admin-panel.full-width { margin-bottom: 2rem; } /* 用户列表表格 */ .users-table { width: 100%; border-collapse: collapse; } .users-table thead { background: #f8fafc; border-bottom: 2px solid #e2e8f0; } .users-table th { padding: 1rem; text-align: left; font-size: 0.875rem; font-weight: 600; color: #475569; white-space: nowrap; } .users-table tbody tr { border-bottom: 1px solid #e2e8f0; transition: background-color 0.2s; } .users-table tbody tr:hover { background: #f8fafc; } .users-table td { padding: 1rem; font-size: 0.875rem; color: #1e293b; } /* 响应式设计 */ @media (max-width: 768px) { .stats-grid { grid-template-columns: 1fr; } .task-stats-grid { grid-template-columns: 1fr; } .admin-navbar { flex-direction: column; gap: 1rem; align-items: stretch; } .admin-navbar-right { justify-content: space-between; } } /* Modal Styles */ .modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.7); display: flex; align-items: center; justify-content: center; z-index: 1000; } .modal-content { background: white; padding: 2rem; border-radius: 8px; width: 90%; max-width: 500px; } .modal-content h2 { margin-top: 0; } .modal-content .form-group { margin-bottom: 1rem; } .modal-content .form-group label { display: block; margin-bottom: 0.5rem; } .modal-content .form-group input { width: 100%; padding: 0.5rem; border-radius: 4px; border: 1px solid #ccc; } .modal-actions { display: flex; justify-content: flex-end; gap: 1rem; margin-top: 2rem; } /* 会议详情模态框样式 */ .meeting-details-info { display: flex; flex-direction: column; gap: 1rem; } .detail-item { display: flex; align-items: flex-start; line-height: 1.5; } .detail-label { font-weight: 600; color: #64748b; width: 80px; flex-shrink: 0; } .detail-value { color: #1e293b; flex: 1; } .audio-item { display: flex; align-items: center; margin-bottom: 0.5rem; } .audio-item:last-child { margin-bottom: 0; } .download-link { font-size: 0.875rem; text-decoration: none; } .download-link:hover { text-decoration: underline; } /* 弹窗内部加载样式 */ .modal-body-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 0; color: #64748b; } .modal-body-loading .loading-spinner { margin-bottom: 1rem; }