TrizTech/ohif-viewer
15
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): worklist had layout shift (#3218)

Browse Source 
* fix(ui): worklist had layout shift

* apply review comments
This commit is contained in:
Alireza 2023-03-06 09:47:26 -05:00 committed by GitHub
parent 38d452e17d
commit f14e23cb8b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 35 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
platform/ui/src/components/StudyListFilter/StudyListFilter.tsx
View File

@ -66,10 +66,7 @@ const StudyListFilter = ({
</div>
</div>
</div>
<div
className="sticky z-10 border-b-4 border-black"
style={{ top: '52px' }}
>
<div className="sticky z-10 border-b-4 border-black -top-1">
<div className="pt-3 pb-3 bg-primary-dark ">
<InputGroup
inputMeta={filtersMeta}

70
platform/viewer/src/routes/WorkList/WorkList.tsx
View File

@ -430,48 +430,46 @@ function WorkList({
}
return (
<div
className={classnames('bg-black h-full', {
'h-screen': !hasStudies,
})}
>
<div className="bg-black h-screen flex flex-col ">
<Header
isSticky
menuOptions={menuOptions}
isReturnEnabled={false}
WhiteLabeling={appConfig.whiteLabeling}
/>
<StudyListFilter
numOfStudies={pageNumber * resultsPerPage > 100 ? 101 : numOfStudies}
filtersMeta={filtersMeta}
filterValues={{ ...filterValues, ...defaultSortValues }}
onChange={setFilterValues}
clearFilters={() => setFilterValues(defaultFilterValues)}
isFiltering={isFiltering(filterValues, defaultFilterValues)}
/>
{hasStudies ? (
<>
<StudyListTable
tableDataSource={tableDataSource.slice(offset, offsetAndTake)}
numOfStudies={numOfStudies}
filtersMeta={filtersMeta}
/>
<StudyListPagination
onChangePage={onPageNumberChange}
onChangePerPage={onResultsPerPageChange}
currentPage={pageNumber}
perPage={resultsPerPage}
/>
</>
) : (
<div className="flex flex-col items-center justify-center pt-48">
{appConfig.showLoadingIndicator && isLoadingData ? (
<LoadingIndicatorProgress className={'w-full h-full bg-black'} />
) : (
<EmptyStudies />
)}
</div>
)}
<div className="overflow-y-auto ohif-scrollbar">
<StudyListFilter
numOfStudies={pageNumber * resultsPerPage > 100 ? 101 : numOfStudies}
filtersMeta={filtersMeta}
filterValues={{ ...filterValues, ...defaultSortValues }}
onChange={setFilterValues}
clearFilters={() => setFilterValues(defaultFilterValues)}
isFiltering={isFiltering(filterValues, defaultFilterValues)}
/>
{hasStudies ? (
<>
<StudyListTable
tableDataSource={tableDataSource.slice(offset, offsetAndTake)}
numOfStudies={numOfStudies}
filtersMeta={filtersMeta}
/>
<StudyListPagination
onChangePage={onPageNumberChange}
onChangePerPage={onResultsPerPageChange}
currentPage={pageNumber}
perPage={resultsPerPage}
/>
</>
) : (
<div className="flex flex-col items-center justify-center pt-48">
{appConfig.showLoadingIndicator && isLoadingData ? (
<LoadingIndicatorProgress className={'w-full h-full bg-black'} />
) : (
<EmptyStudies />
)}
</div>
)}
</div>
</div>
);
}