mirror of
https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git
synced 2026-02-19 03:00:49 +08:00
fix(usage): make model stats card scrollable
This commit is contained in:
@@ -59,10 +59,11 @@ export function ModelStatsCard({ modelStats, loading, hasPrices }: ModelStatsCar
|
|||||||
sortKey === key ? (sortDir === 'asc' ? 'ascending' : 'descending') : 'none';
|
sortKey === key ? (sortDir === 'asc' ? 'ascending' : 'descending') : 'none';
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card title={t('usage_stats.models')}>
|
<Card title={t('usage_stats.models')} className={styles.detailsFixedCard}>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className={styles.hint}>{t('common.loading')}</div>
|
<div className={styles.hint}>{t('common.loading')}</div>
|
||||||
) : sorted.length > 0 ? (
|
) : sorted.length > 0 ? (
|
||||||
|
<div className={styles.detailsScroll}>
|
||||||
<div className={styles.tableWrapper}>
|
<div className={styles.tableWrapper}>
|
||||||
<table className={styles.table}>
|
<table className={styles.table}>
|
||||||
<thead>
|
<thead>
|
||||||
@@ -149,6 +150,7 @@ export function ModelStatsCard({ modelStats, loading, hasPrices }: ModelStatsCar
|
|||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className={styles.hint}>{t('usage_stats.no_data')}</div>
|
<div className={styles.hint}>{t('usage_stats.no_data')}</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -580,6 +580,26 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Fixed-height cards with internal scrolling (API details / model stats)
|
||||||
|
.detailsFixedCard {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 520px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
@include mobile {
|
||||||
|
height: 420px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.detailsScroll {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
min-height: 0;
|
||||||
|
overflow: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
overscroll-behavior: contain;
|
||||||
|
}
|
||||||
|
|
||||||
// Table (80%比例)
|
// Table (80%比例)
|
||||||
.tableWrapper {
|
.tableWrapper {
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
|
|||||||
Reference in New Issue
Block a user