ohif-318: reflect default sorting on ui

This commit is contained in:
igoroctaviano 2020-08-06 17:01:29 -03:00
parent 58c2c00663
commit c627280982

View File

@ -45,6 +45,7 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
const debouncedFilterValues = useDebounce(filterValues, 200); const debouncedFilterValues = useDebounce(filterValues, 200);
const { resultsPerPage, pageNumber, sortBy, sortDirection } = filterValues; const { resultsPerPage, pageNumber, sortBy, sortDirection } = filterValues;
let dynamicFilterValues = {};
const sortedStudies = studies const sortedStudies = studies
// TOOD: Move sort to DataSourceWrapper? // TOOD: Move sort to DataSourceWrapper?
// TODO: MOTIVATION, this is triggered on every render, even if list/sort does not change // TODO: MOTIVATION, this is triggered on every render, even if list/sort does not change
@ -54,7 +55,10 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
if (noSortApplied && studies.length < 101) { if (noSortApplied && studies.length < 101) {
const ascendingSortModifier = -1; const ascendingSortModifier = -1;
dynamicFilterValues = {
sortBy: 'studyDate',
sortDirection: 'ascending',
};
return _sortStringDates(s1, s2, ascendingSortModifier); return _sortStringDates(s1, s2, ascendingSortModifier);
} else if (noSortApplied) { } else if (noSortApplied) {
return 0; return 0;
@ -216,8 +220,8 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
content: patientName ? ( content: patientName ? (
<TooltipClipboard>{patientName}</TooltipClipboard> <TooltipClipboard>{patientName}</TooltipClipboard>
) : ( ) : (
<span className="text-gray-700">(Empty)</span> <span className="text-gray-700">(Empty)</span>
), ),
gridCol: 4, gridCol: 4,
}, },
{ {
@ -281,13 +285,13 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
seriesTableDataSource={ seriesTableDataSource={
seriesInStudiesMap.has(studyInstanceUid) seriesInStudiesMap.has(studyInstanceUid)
? seriesInStudiesMap.get(studyInstanceUid).map(s => { ? seriesInStudiesMap.get(studyInstanceUid).map(s => {
return { return {
description: s.description || '(empty)', description: s.description || '(empty)',
seriesNumber: s.seriesNumber || '', seriesNumber: s.seriesNumber || '',
modality: s.modality || '', modality: s.modality || '',
instances: s.numSeriesInstances || '', instances: s.numSeriesInstances || '',
}; };
}) })
: [] : []
} }
> >
@ -304,7 +308,7 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
<Link <Link
key={i} key={i}
to={`${mode.id}?StudyInstanceUIDs=${studyInstanceUid}`} to={`${mode.id}?StudyInstanceUIDs=${studyInstanceUid}`}
// to={`${mode.id}/dicomweb?StudyInstanceUIDs=${studyInstanceUid}`} // to={`${mode.id}/dicomweb?StudyInstanceUIDs=${studyInstanceUid}`}
> >
<Button <Button
rounded="full" rounded="full"
@ -312,7 +316,7 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
disabled={false} disabled={false}
endIcon={<Icon name="launch-arrow" />} // launch-arrow | launch-info endIcon={<Icon name="launch-arrow" />} // launch-arrow | launch-info
className={classnames('font-bold', { 'ml-2': !isFirst })} className={classnames('font-bold', { 'ml-2': !isFirst })}
onClick={() => {}} onClick={() => { }}
> >
{mode.displayName} {mode.displayName}
</Button> </Button>
@ -353,7 +357,7 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
<StudyListFilter <StudyListFilter
numOfStudies={numOfStudies} numOfStudies={numOfStudies}
filtersMeta={filtersMeta} filtersMeta={filtersMeta}
filterValues={filterValues} filterValues={{ ...filterValues, ...dynamicFilterValues }}
onChange={setFilterValues} onChange={setFilterValues}
clearFilters={() => setFilterValues(defaultFilterValues)} clearFilters={() => setFilterValues(defaultFilterValues)}
isFiltering={isFiltering(filterValues, defaultFilterValues)} isFiltering={isFiltering(filterValues, defaultFilterValues)}
@ -376,10 +380,10 @@ function WorkList({ history, data: studies, isLoadingData, dataSource }) {
/> />
</> </>
) : ( ) : (
<div className="flex flex-col items-center justify-center pt-48"> <div className="flex flex-col items-center justify-center pt-48">
<EmptyStudies isLoading={isLoadingData} /> <EmptyStudies isLoading={isLoadingData} />
</div> </div>
)} )}
</div> </div>
); );
} }