diff --git a/frontend/src/admin/AdminLayout.jsx b/frontend/src/admin/AdminLayout.jsx index 819f91d..427a5cc 100644 --- a/frontend/src/admin/AdminLayout.jsx +++ b/frontend/src/admin/AdminLayout.jsx @@ -304,7 +304,7 @@ export default function AdminLayout() { )} - + {/* AppBar 占位:桌面 64 / 移动 56 + 搜索行 48 */} diff --git a/frontend/src/admin/pages/TicketManage.jsx b/frontend/src/admin/pages/TicketManage.jsx index 9d7968f..380aa45 100644 --- a/frontend/src/admin/pages/TicketManage.jsx +++ b/frontend/src/admin/pages/TicketManage.jsx @@ -146,13 +146,13 @@ export default function TicketManage() { ], [stats, total]); return ( - + 工单管理集中处理论坛和站内问题反馈 - + {statItems.map(([label, value, tone]) => )} @@ -167,8 +167,8 @@ export default function TicketManage() { {error && 重试} sx={{ mb: 2 }}>{error}} - - + + 最近工单共 {total} 条 @@ -179,9 +179,9 @@ export default function TicketManage() { )} setPage(page - 1)}>第 {page} / {totalPages} 页= totalPages || loading} onClick={() => setPage(page + 1)}> - + - + {!selectedId ? 选择一个工单开始处理工单详情、回复和状态操作会显示在这里 : detailLoading ? : selectedTicket ? ( @@ -194,8 +194,8 @@ export default function TicketManage() { ) : 工单详情不存在或加载失败。} - - + + ); } diff --git a/frontend/src/admin/theme.css b/frontend/src/admin/theme.css index 7dfe64e..686c98b 100644 --- a/frontend/src/admin/theme.css +++ b/frontend/src/admin/theme.css @@ -32,6 +32,77 @@ body { [data-theme="dark"] ::-webkit-scrollbar-thumb { background: #49454f; } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #938f99; } +/* 工单工作区:占满 AdminLayout 内容区,桌面保持列表/详情主次比例。 */ +.ticket-workspace { + width: 100%; + max-width: none; + min-width: 0; + min-height: calc(100vh - 112px); +} + +.ticket-workspace .ticket-stats { + width: 100%; +} + +.ticket-work-area { + display: grid; + grid-template-columns: minmax(280px, 0.55fr) minmax(0, 1fr); + gap: 16px; + width: 100%; + min-width: 0; + min-height: calc(100vh - 280px); + align-items: stretch; +} + +.ticket-list-pane, +.ticket-detail-pane { + min-width: 0; + width: 100%; +} + +.ticket-list-pane > .MuiPaper-root, +.ticket-detail-pane > .MuiPaper-root { + width: 100%; + min-width: 0; + box-sizing: border-box; +} + +.ticket-list-pane > .MuiPaper-root { + min-height: calc(100vh - 280px); +} + +.ticket-detail-pane > .MuiPaper-root { + min-height: calc(100vh - 280px); +} + +@media (max-width: 1199px) and (min-width: 700px) { + .ticket-work-area { + grid-template-columns: minmax(250px, 0.62fr) minmax(0, 1fr); + gap: 14px; + } +} + +@media (max-width: 699px) { + .ticket-workspace { + min-height: 0; + } + + .ticket-work-area { + grid-template-columns: minmax(0, 1fr); + min-height: 0; + gap: 16px; + } + + .ticket-list-pane > .MuiPaper-root, + .ticket-detail-pane > .MuiPaper-root { + min-height: 0; + } + + .ticket-detail-pane > .MuiPaper-root { + min-height: 480px; + } +} + /* 减弱动效偏好 */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after {