diff --git a/frontend/src/admin/pages/TicketManage.jsx b/frontend/src/admin/pages/TicketManage.jsx index 7196c37..398ada6 100644 --- a/frontend/src/admin/pages/TicketManage.jsx +++ b/frontend/src/admin/pages/TicketManage.jsx @@ -197,7 +197,11 @@ export default function TicketManage() { {loading ? : list.length === 0 ? 暂无匹配工单 : ( - {list.map((ticket) => )} + {list.map((ticket) => { + const subject = ticket.subject || ticket.title || '无标题工单'; + const requester = `${ticket.requester_name || ticket.requester_username || '未知用户'} · ${fmtTime(ticket.updated_at || ticket.created_at)}`; + return ; + })} )} setPage(page - 1)}>第 {page} / {totalPages} 页= totalPages || loading} onClick={() => setPage(page + 1)}> diff --git a/frontend/src/admin/theme.css b/frontend/src/admin/theme.css index 05e0129..fb270dc 100644 --- a/frontend/src/admin/theme.css +++ b/frontend/src/admin/theme.css @@ -91,7 +91,7 @@ body { flex: 1 1 0; min-height: 0; overflow-y: auto; - overflow-x: hidden; + overflow-x: auto; align-items: stretch; } @@ -110,7 +110,39 @@ body { .ticket-list-scroll > li > .MuiButton-root { display: flex; box-sizing: border-box; - overflow: visible; + overflow: hidden; + min-height: 48px; +} + +.ticket-list-row { + display: grid; + grid-template-columns: max-content minmax(120px, 1.4fr) minmax(120px, 1fr) max-content max-content; + align-items: center; + gap: 8px; + width: 100%; + min-width: 0; + overflow: hidden; +} + +@media (min-width: 700px) { + .ticket-list-row { + min-width: 500px; + } +} + +.ticket-list-row > .MuiTypography-root, +.ticket-list-row > .MuiChip-root { + min-width: 0; +} + +.ticket-list-row > .MuiTypography-root { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.ticket-list-row > .MuiChip-root { + flex: 0 0 auto; } .ticket-list-scroll > li > .MuiButton-root > .MuiBox-root { @@ -122,23 +154,11 @@ body { overflow-wrap: anywhere; } -.ticket-list-scroll .MuiTypography-noWrap { - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; - white-space: normal; - overflow: hidden; -} - .ticket-list-scroll .MuiChip-root { flex: 0 0 auto; max-width: 100%; } -.ticket-list-meta { - flex-wrap: wrap; -} - .ticket-list-number { min-width: 0; overflow-wrap: anywhere; @@ -231,6 +251,15 @@ body { max-height: 350px; } + .ticket-list-row { + grid-template-columns: max-content minmax(140px, 1.2fr) minmax(120px, 1fr) max-content max-content; + min-width: 560px; + } + + .ticket-list-scroll { + overflow-x: auto; + } + .ticket-detail-pane > .MuiPaper-root { min-height: 480px; }