html/admin-web
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
ouyangxq
2026-08-17 16:45:46 +08:00
parent 4a9438315c
commit d95c90bd1a
48 changed files with 1217 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/shared/components/DataTable.vue
+17
View File
@@ -369,5 +369,22 @@ function setPage(value: number) {
.data-table__page-buttons { gap: 4px; }
.data-table__page-button { width: 32px; min-width: 32px; height: 32px; padding: 0; margin-left: 0; }
.data-table__page-ellipsis { display: inline-flex; width: 24px; height: 32px; align-items: center; justify-content: center; }
@media (min-width: 1920px) {
.data-table__toolbar { min-height: 64px; gap: 12px; padding: 10px 14px; }
.data-table__toolbar.is-compact { min-height: 50px; padding: 6px 12px; }
.data-table__toolbar-actions,
.data-table__business-actions,
.data-table__utility-actions,
.data-table__toolbar-end { gap: 6px; }
.data-table__pagination { min-height: 52px; gap: 12px; padding: 10px 14px; }
.data-table__pagination-left,
.data-table__pagination-controls,
.data-table__page-size,
.data-table__page-buttons { gap: 6px; }
.data-table__page-button { width: 30px; min-width: 30px; height: 30px; }
.data-table__page-ellipsis { width: 22px; height: 30px; }
}
@media (max-width: 720px) { .data-table__toolbar, .data-table__toolbar.is-compact { min-height: 0; align-items: stretch; flex-direction: column; padding: 14px; } .data-table__toolbar-actions { width: 100%; align-items: flex-start; flex-wrap: wrap; justify-content: flex-start; } .data-table__toolbar-actions.has-business-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; } .data-table__business-actions { justify-content: flex-start; } .data-table__utility-actions { align-items: flex-start; justify-content: flex-end; } .data-table__toolbar-end { justify-content: flex-start; } .data-table__toolbar-actions :deep(.el-button) { max-width: 100%; min-height: 40px; } .data-table__pagination { align-items: flex-start; flex-direction: column; } .data-table__pagination-left, .data-table__pagination-controls, .data-table__page-buttons { width: 100%; } .data-table__pagination-controls { justify-content: flex-start; } .data-table__page-buttons { flex-wrap: wrap; } .data-table__page-button { width: 44px; min-width: 44px; height: 44px; } .data-table__page-ellipsis { height: 44px; } }
</style>