shishengliang/lingniu-vehicle-ingest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(mileage): use fixed-column table on mobile

Browse Source
This commit is contained in:
lingniu
2026-07-16 13:07:43 +08:00
parent 4877c3fe8f
commit 6d6c9ce534
3 changed files with 20 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
vehicle-data-platform/apps/web/src/v2/styles/v2.css
View File

@@ -1332,8 +1332,8 @@ button, a { -webkit-tap-highlight-color: transparent; }
.v2-mileage-result-actions > button { height: 34px; flex: 0 0 auto; }
.v2-mileage-export-progress { align-items: stretch; flex-direction: column; gap: 7px; padding: 9px 12px; }
.v2-mileage-export-progress > span { min-width: 0; }
.v2-mileage-table-wrap { display: none; }
.v2-mileage-mobile-list { display: flex; flex-direction: column; }
.v2-mileage-table-wrap { display: block; }
.v2-mileage-mobile-list { display: none; }
.v2-mileage-mobile-list article { border-bottom: 1px solid #e9eef5; padding: 14px 12px; }
.v2-mileage-mobile-list article > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.v2-mileage-mobile-list article > header div { min-width: 0; }
@@ -1934,16 +1934,15 @@ button, a { -webkit-tap-highlight-color: transparent; }
.v2-mileage-results > header .v2-mileage-result-actions { gap: 6px; }
.v2-mileage-results > header .v2-mileage-result-actions em { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2-mileage-result-actions > button { height: 32px; padding: 0 9px; font-size: 10px; }
.v2-mileage-mobile-list { gap: 5px; background: #f4f7fb; padding: 5px; }
.v2-mileage-mobile-list article { overflow: hidden; border: 1px solid #dfe6ef; border-radius: 8px; background: #fff; padding: 9px 10px 8px; box-shadow: 0 1px 4px rgba(23,39,62,.03); }
.v2-mileage-mobile-list article > header { align-items: center; }
.v2-mileage-mobile-list article > header strong { font-size: 14px; }
.v2-mileage-mobile-list article > header span { margin-top: 1px; font-size: 8px; }
.v2-mileage-mobile-list article > header b { color: #135fcb; font-size: 17px; letter-spacing: -.025em; }
.v2-mileage-mobile-list article > header b small { margin-top: 1px; font-size: 8px; }
.v2-mileage-mobile-days { grid-auto-columns: 70px; gap: 4px; margin-top: 7px; border-top: 1px solid #edf1f5; padding-top: 6px; padding-bottom: 1px; scroll-snap-type: x proximity; }
.v2-mileage-mobile-days > div { min-height: 38px; border: 0; border-radius: 6px; background: #f6f8fb; padding: 5px 7px; scroll-snap-align: start; }
.v2-mileage-mobile-days time { font-size: 8px; }
.v2-mileage-mobile-days strong { margin-top: 3px; color: #26364b; font-size: 10px; }
.v2-mileage-mobile-days small { display: none; }
.v2-mileage-table-wrap { display: block; width: 100%; max-width: 100%; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scrollbar-width: thin; }
.v2-mileage-table { width: max-content; min-width: 100%; font-size: 10px; }
.v2-mileage-table th { height: 38px; padding: 0 8px; font-size: 9px; }
.v2-mileage-table td { height: 44px; padding: 0 8px; font-size: 10px; }
.v2-mileage-table .is-vin { display: none; }
.v2-mileage-table .is-plate { left: 0; width: 92px; min-width: 92px; max-width: 92px; border-right: 1px solid #d8e0ea; box-shadow: 5px 0 10px rgba(15,23,42,.035); }
.v2-mileage-table td.is-plate strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2-mileage-table .is-date { width: 76px; min-width: 76px; }
.v2-mileage-table .is-total { width: 104px; min-width: 104px; padding-right: 10px; }
.v2-mileage-table .is-daily { font-size: 10px; }
.v2-mileage-table .is-period { font-size: 11px; }
}