Merge branch 'feat/v2-main' of https://github.com/OHIF/Viewers into fix/OHIF-37-thumbnailDoubleClick
This commit is contained in:
commit
4b8dcef956
48 files changed
+1156
-363
No files matched your search
@@ -5,9 +5,6 @@ import { DicomMetadataStore, DICOMSR } from '@ohif/core';
|
||||
import { useDebounce } from '@hooks';
|
||||
import ActionButtons from './ActionButtons';
|
||||
import { useTrackedMeasurements } from '../../getContextModule';
|
||||
import cornerstoneTools from 'cornerstone-tools';
|
||||
import cornerstone from 'cornerstone-core';
|
||||
import dcmjs from 'dcmjs';
|
||||
|
||||
const DISPLAY_STUDY_SUMMARY_INITIAL_VALUE = {
|
||||
key: undefined, //
|
||||
@@ -24,7 +21,12 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
||||
measurementChangeTimestamp,
|
||||
200
|
||||
);
|
||||
const { MeasurementService } = servicesManager.services;
|
||||
const {
|
||||
MeasurementService,
|
||||
UINotificationService,
|
||||
UIDialogService,
|
||||
DisplaySetService,
|
||||
} = servicesManager.services;
|
||||
const [
|
||||
trackedMeasurements,
|
||||
sendTrackedMeasurementsEvent,
|
||||
@@ -34,9 +36,7 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
||||
DISPLAY_STUDY_SUMMARY_INITIAL_VALUE
|
||||
);
|
||||
const [displayMeasurements, setDisplayMeasurements] = useState([]);
|
||||
// TODO: measurements subscribtion
|
||||
|
||||
// Initial?
|
||||
useEffect(() => {
|
||||
const measurements = MeasurementService.getMeasurements();
|
||||
const filteredMeasurements = measurements.filter(
|
||||
@@ -105,7 +105,7 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
||||
|
||||
const activeMeasurementItem = 0;
|
||||
|
||||
const onExportClick = () => {
|
||||
const exportReport = () => {
|
||||
const measurements = MeasurementService.getMeasurements();
|
||||
const trackedMeasurements = measurements.filter(
|
||||
m =>
|
||||
@@ -117,21 +117,50 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
||||
DICOMSR.downloadReport(trackedMeasurements, dataSource);
|
||||
};
|
||||
|
||||
const onCreateReportClick = () => {
|
||||
const measurements = MeasurementService.getMeasurements();
|
||||
const trackedMeasurements = measurements.filter(
|
||||
m =>
|
||||
trackedStudy === m.referenceStudyUID &&
|
||||
trackedSeries.includes(m.referenceSeriesUID)
|
||||
);
|
||||
const createReport = async () => {
|
||||
const loadingDialogId = UIDialogService.create({
|
||||
showOverlay: true,
|
||||
isDraggable: false,
|
||||
centralize: true,
|
||||
// TODO: Create a loading indicator component + zeplin design?
|
||||
content: () => <div className="text-primary-active">Loading...</div>,
|
||||
});
|
||||
|
||||
try {
|
||||
const measurements = MeasurementService.getMeasurements();
|
||||
const trackedMeasurements = measurements.filter(
|
||||
m =>
|
||||
trackedStudy === m.referenceStudyUID &&
|
||||
trackedSeries.includes(m.referenceSeriesUID)
|
||||
);
|
||||
|
||||
const dataSources = extensionManager.getDataSources();
|
||||
// TODO -> Eventually deal with multiple dataSources.
|
||||
// Would need some way of saying which one is the "push" dataSource
|
||||
const dataSource = dataSources[0];
|
||||
const dataSources = extensionManager.getDataSources();
|
||||
// TODO -> Eventually deal with multiple dataSources.
|
||||
// Would need some way of saying which one is the "push" dataSource
|
||||
const dataSource = dataSources[0];
|
||||
|
||||
DICOMSR.storeMeasurements(trackedMeasurements, dataSource);
|
||||
const naturalizedReport = await DICOMSR.storeMeasurements(
|
||||
trackedMeasurements,
|
||||
dataSource
|
||||
);
|
||||
|
||||
DisplaySetService.makeDisplaySets([naturalizedReport], {
|
||||
madeInClient: true,
|
||||
});
|
||||
UINotificationService.show({
|
||||
title: 'STOW SR',
|
||||
message: 'Measurements saved successfully',
|
||||
type: 'success',
|
||||
});
|
||||
} catch (error) {
|
||||
UINotificationService.show({
|
||||
title: 'STOW SR',
|
||||
message: error.message || 'Failed to store measurements',
|
||||
type: 'error',
|
||||
});
|
||||
} finally {
|
||||
UIDialogService.dismiss({ id: loadingDialogId });
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -154,15 +183,24 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
||||
</div>
|
||||
<div className="flex justify-center p-4">
|
||||
<ActionButtons
|
||||
onExportClick={onExportClick}
|
||||
onCreateReportClick={onCreateReportClick}
|
||||
onExportClick={exportReport}
|
||||
onCreateReportClick={createReport}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
PanelMeasurementTableTracking.propTypes = {};
|
||||
PanelMeasurementTableTracking.propTypes = {
|
||||
servicesManager: PropTypes.shape({
|
||||
services: PropTypes.shape({
|
||||
MeasurementService: PropTypes.shape({
|
||||
getMeasurements: PropTypes.func.isRequired,
|
||||
VALUE_TYPES: PropTypes.object.isRequired,
|
||||
}).isRequired,
|
||||
}).isRequired,
|
||||
}).isRequired,
|
||||
};
|
||||
|
||||
// TODO: This could be a MeasurementService mapper
|
||||
function _mapMeasurementToDisplay(measurement, index, types) {
|
||||
@@ -182,9 +220,6 @@ function _mapMeasurementToDisplay(measurement, index, types) {
|
||||
);
|
||||
const { PixelSpacing, SeriesNumber, InstanceNumber } = instance;
|
||||
|
||||
console.log('mapping....', measurement);
|
||||
console.log(instance);
|
||||
|
||||
return {
|
||||
id: index + 1,
|
||||
label: '(empty)', // 'Label short description',
|
||||
@@ -213,15 +248,7 @@ function _getDisplayText(
|
||||
instanceNumber,
|
||||
types
|
||||
) {
|
||||
// TODO: determination of shape influences text
|
||||
// Length: 'xx.x unit (S:x, I:x)'
|
||||
// Rectangle: 'xx.x x xx.x unit (S:x, I:x)',
|
||||
// Ellipse?
|
||||
// Bidirectional?
|
||||
// Freehand?
|
||||
|
||||
const { type, points } = measurement;
|
||||
|
||||
const hasPixelSpacing =
|
||||
pixelSpacing !== undefined &&
|
||||
Array.isArray(pixelSpacing) &&
|
||||
@@ -232,18 +259,16 @@ function _getDisplayText(
|
||||
const unit = hasPixelSpacing ? 'mm' : 'px';
|
||||
|
||||
switch (type) {
|
||||
case types.POLYLINE:
|
||||
case types.POLYLINE: {
|
||||
const { length } = measurement;
|
||||
|
||||
const roundedLength = _round(length, 1);
|
||||
|
||||
return [
|
||||
`${roundedLength} ${unit} (S:${seriesNumber}, I:${instanceNumber})`,
|
||||
];
|
||||
|
||||
case types.BIDIRECTIONAL:
|
||||
}
|
||||
case types.BIDIRECTIONAL: {
|
||||
const { shortestDiameter, longestDiameter } = measurement;
|
||||
|
||||
const roundedShortestDiameter = _round(shortestDiameter, 1);
|
||||
const roundedLongestDiameter = _round(longestDiameter, 1);
|
||||
|
||||
@@ -251,16 +276,19 @@ function _getDisplayText(
|
||||
`l: ${roundedLongestDiameter} ${unit} (S:${seriesNumber}, I:${instanceNumber})`,
|
||||
`s: ${roundedShortestDiameter} ${unit}`,
|
||||
];
|
||||
case types.ELLIPSE:
|
||||
}
|
||||
case types.ELLIPSE: {
|
||||
const { area } = measurement;
|
||||
|
||||
const roundedArea = _round(area, 1);
|
||||
|
||||
return [
|
||||
`${roundedArea} ${unit}2 (S:${seriesNumber}, I:${instanceNumber})`,
|
||||
];
|
||||
case types.POINT:
|
||||
}
|
||||
case types.POINT: {
|
||||
const { text } = measurement;
|
||||
return [`${text} (S:${seriesNumber}, I:${instanceNumber})`];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
+83
-5
@@ -37,6 +37,7 @@ function PanelStudyBrowserTracking({
|
||||
const [studyDisplayList, setStudyDisplayList] = useState([]);
|
||||
const [displaySets, setDisplaySets] = useState([]);
|
||||
const [thumbnailImageSrcMap, setThumbnailImageSrcMap] = useState({});
|
||||
const [jumpToDisplaySet, setJumpToDisplaySet] = useState(null);
|
||||
|
||||
const onClickThumbnailHandler = displaySetInstanceUID => {
|
||||
viewportGridService.setDisplaysetForViewport({
|
||||
@@ -149,18 +150,26 @@ function PanelStudyBrowserTracking({
|
||||
// DISPLAY_SETS_ADDED returns an array of DisplaySets that were added
|
||||
const SubscriptionDisplaySetsAdded = DisplaySetService.subscribe(
|
||||
DisplaySetService.EVENTS.DISPLAY_SETS_ADDED,
|
||||
newDisplaySets => {
|
||||
newDisplaySets.forEach(async dSet => {
|
||||
data => {
|
||||
const { displaySetsAdded, options } = data;
|
||||
displaySetsAdded.forEach(async dSet => {
|
||||
const displaySetInstanceUID = dSet.displaySetInstanceUID;
|
||||
|
||||
const newImageSrcEntry = {};
|
||||
const displaySet = DisplaySetService.getDisplaySetByUID(
|
||||
dSet.displaySetInstanceUID
|
||||
displaySetInstanceUID
|
||||
);
|
||||
|
||||
if (options.madeInClient) {
|
||||
setJumpToDisplaySet(displaySetInstanceUID);
|
||||
}
|
||||
|
||||
const imageIds = dataSource.getImageIdsForDisplaySet(displaySet);
|
||||
const imageId = imageIds[Math.floor(imageIds.length / 2)];
|
||||
// TODO: Is it okay that imageIds are not returned here for SR displaysets?
|
||||
if (imageId) {
|
||||
// When the image arrives, render it and store the result in the thumbnailImgSrcMap
|
||||
newImageSrcEntry[dSet.displaySetInstanceUID] = await getImageSrc(
|
||||
newImageSrcEntry[displaySetInstanceUID] = await getImageSrc(
|
||||
imageId
|
||||
);
|
||||
setThumbnailImageSrcMap(prevState => {
|
||||
@@ -227,6 +236,51 @@ function PanelStudyBrowserTracking({
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (jumpToDisplaySet) {
|
||||
// Get element by displaySetInstanceUID
|
||||
const displaySetInstanceUID = jumpToDisplaySet;
|
||||
const element = document.getElementById(
|
||||
`thumbnail-${displaySetInstanceUID}`
|
||||
);
|
||||
|
||||
if (element && typeof element.scrollIntoView === 'function') {
|
||||
// TODO: Any way to support IE here?
|
||||
element.scrollIntoView({ behavior: 'smooth' });
|
||||
|
||||
setJumpToDisplaySet(null);
|
||||
}
|
||||
}
|
||||
}, [jumpToDisplaySet, expandedStudyInstanceUIDs, activeTabName]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!jumpToDisplaySet) {
|
||||
return;
|
||||
}
|
||||
|
||||
const displaySetInstanceUID = jumpToDisplaySet;
|
||||
// Set the activeTabName and expand the study
|
||||
const thumbnailLocation = _findTabAndStudyOfDisplaySet(
|
||||
displaySetInstanceUID,
|
||||
tabs
|
||||
);
|
||||
if (!thumbnailLocation) {
|
||||
console.warn('jumpToThumbnail: displaySet thumbnail not found.');
|
||||
|
||||
return;
|
||||
}
|
||||
const { tabName, StudyInstanceUID } = thumbnailLocation;
|
||||
setActiveTabName(tabName);
|
||||
const studyExpanded = expandedStudyInstanceUIDs.includes(StudyInstanceUID);
|
||||
if (!studyExpanded) {
|
||||
const updatedExpandedStudyInstanceUIDs = [
|
||||
...expandedStudyInstanceUIDs,
|
||||
StudyInstanceUID,
|
||||
];
|
||||
setExpandedStudyInstanceUIDs(updatedExpandedStudyInstanceUIDs);
|
||||
}
|
||||
}, [jumpToDisplaySet]);
|
||||
|
||||
return (
|
||||
<StudyBrowser
|
||||
tabs={tabs}
|
||||
@@ -306,8 +360,11 @@ function _mapDisplaySets(
|
||||
const firstViewportIndexWithMatchingDisplaySetUid = viewports.findIndex(
|
||||
vp => vp.displaySetInstanceUID === ds.displaySetInstanceUID
|
||||
);
|
||||
|
||||
const viewportIdentificator =
|
||||
_viewportLabels[firstViewportIndexWithMatchingDisplaySetUid] || '';
|
||||
viewports.length > 1
|
||||
? _viewportLabels[firstViewportIndexWithMatchingDisplaySetUid]
|
||||
: '';
|
||||
|
||||
const array =
|
||||
componentType === 'thumbnailTracked'
|
||||
@@ -413,3 +470,24 @@ function _createStudyBrowserTabs(
|
||||
|
||||
return tabs;
|
||||
}
|
||||
|
||||
function _findTabAndStudyOfDisplaySet(displaySetInstanceUID, tabs) {
|
||||
for (let t = 0; t < tabs.length; t++) {
|
||||
const { studies } = tabs[t];
|
||||
|
||||
for (let s = 0; s < studies.length; s++) {
|
||||
const { displaySets } = studies[s];
|
||||
|
||||
for (let d = 0; d < displaySets.length; d++) {
|
||||
const displaySet = displaySets[d];
|
||||
|
||||
if (displaySet.displaySetInstanceUID === displaySetInstanceUID) {
|
||||
return {
|
||||
tabName: tabs[t].name,
|
||||
StudyInstanceUID: studies[s].studyInstanceUid,
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user