mirror of
https://github.com/SECTL/SecScore.git
synced 2026-07-21 09:39:03 +08:00
优化竖屏列表右侧间距避免字母栏遮挡
This commit is contained in:
+18
-3
@@ -1062,9 +1062,18 @@ export const Home: React.FC<HomeProps> = ({ canEdit, isPortraitMode = false }) =
|
|||||||
}
|
}
|
||||||
}, [groupedStudents, quickNavLayout.itemSize, quickNavLayout.paddingY])
|
}, [groupedStudents, quickNavLayout.itemSize, quickNavLayout.paddingY])
|
||||||
|
|
||||||
|
const shouldShowQuickNav =
|
||||||
|
groupedStudents.length > 1 &&
|
||||||
|
sortType !== "score" &&
|
||||||
|
!(sortType === "alphabet" && searchKeyword)
|
||||||
|
|
||||||
|
const portraitListRightPadding =
|
||||||
|
isPortraitMode && shouldShowQuickNav
|
||||||
|
? quickNavLayout.itemSize + quickNavLayout.paddingX * 2 + 16
|
||||||
|
: 0
|
||||||
|
|
||||||
const renderQuickNav = () => {
|
const renderQuickNav = () => {
|
||||||
if (groupedStudents.length <= 1 || sortType === "score" || (sortType === "alphabet" && searchKeyword))
|
if (!shouldShowQuickNav) return null
|
||||||
return null
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
@@ -1612,7 +1621,13 @@ export const Home: React.FC<HomeProps> = ({ canEdit, isPortraitMode = false }) =
|
|||||||
|
|
||||||
{renderQuickNav()}
|
{renderQuickNav()}
|
||||||
|
|
||||||
<div style={{ minHeight: "400px" }} ref={scrollContainerRef}>
|
<div
|
||||||
|
style={{
|
||||||
|
minHeight: "400px",
|
||||||
|
paddingRight: portraitListRightPadding ? `${portraitListRightPadding}px` : undefined,
|
||||||
|
}}
|
||||||
|
ref={scrollContainerRef}
|
||||||
|
>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div style={{ textAlign: "center", padding: "100px 0" }}>
|
<div style={{ textAlign: "center", padding: "100px 0" }}>
|
||||||
<div style={{ color: "var(--ss-text-secondary)" }}>{t("common.loading")}</div>
|
<div style={{ color: "var(--ss-text-secondary)" }}>{t("common.loading")}</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user