将最近工单改为单行列表

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;
   }