118 lines
3.3 KiB
JavaScript
118 lines
3.3 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { metadata, utils } from 'ohif-core';
|
|
|
|
import ConnectedViewer from './ConnectedViewer.js';
|
|
import PropTypes from 'prop-types';
|
|
import { extensionManager } from './../App.js';
|
|
import Dropzone from 'react-dropzone';
|
|
import filesToStudies from '../lib/filesToStudies';
|
|
import './ViewerLocalFileData.css';
|
|
import { withTranslation } from 'react-i18next';
|
|
|
|
const { OHIFStudyMetadata } = metadata;
|
|
const { studyMetadataManager, updateMetaDataManager } = utils;
|
|
|
|
class ViewerLocalFileData extends Component {
|
|
static propTypes = {
|
|
studies: PropTypes.array,
|
|
};
|
|
|
|
state = {
|
|
studies: null,
|
|
loading: false,
|
|
error: null,
|
|
};
|
|
|
|
updateStudies = studies => {
|
|
// Render the viewer when the data is ready
|
|
studyMetadataManager.purge();
|
|
|
|
// Map studies to new format, update metadata manager?
|
|
const updatedStudies = studies.map(study => {
|
|
const studyMetadata = new OHIFStudyMetadata(
|
|
study,
|
|
study.studyInstanceUid
|
|
);
|
|
const sopClassHandlerModules =
|
|
extensionManager.modules['sopClassHandlerModule'];
|
|
|
|
study.displaySets =
|
|
study.displaySets ||
|
|
studyMetadata.createDisplaySets(sopClassHandlerModules);
|
|
studyMetadata.setDisplaySets(study.displaySets);
|
|
|
|
// Updates WADO-RS metaDataManager
|
|
updateMetaDataManager(study);
|
|
|
|
studyMetadataManager.add(studyMetadata);
|
|
|
|
return study;
|
|
});
|
|
|
|
this.setState({
|
|
studies: updatedStudies,
|
|
});
|
|
};
|
|
|
|
render() {
|
|
const onDrop = async acceptedFiles => {
|
|
this.setState({ loading: true });
|
|
|
|
const studies = await filesToStudies(acceptedFiles);
|
|
const updatedStudies = this.updateStudies(studies);
|
|
|
|
if (!updatedStudies) {
|
|
return;
|
|
}
|
|
|
|
this.setState({ studies: updatedStudies, loading: false });
|
|
};
|
|
|
|
if (this.state.error) {
|
|
return <div>Error: {JSON.stringify(this.state.error)}</div>;
|
|
}
|
|
|
|
return (
|
|
<Dropzone onDrop={onDrop}>
|
|
{({ getRootProps, getInputProps }) => (
|
|
<div {...getRootProps()} style={{ width: '100%', height: '100%' }}>
|
|
{this.state.studies ? (
|
|
<ConnectedViewer
|
|
studies={this.state.studies}
|
|
studyInstanceUids={
|
|
this.state.studies &&
|
|
this.state.studies.map(a => a.studyInstanceUid)
|
|
}
|
|
/>
|
|
) : (
|
|
<div className={'drag-drop-instructions'}>
|
|
<div className={'drag-drop-contents'}>
|
|
{this.state.loading ? (
|
|
<h3>{this.props.t('Loading...')}</h3>
|
|
) : (
|
|
<>
|
|
<h3>
|
|
{this.props.t(
|
|
'Drag and Drop DICOM files here to load them in the Viewer'
|
|
)}
|
|
</h3>
|
|
<h4>
|
|
{this.props.t(
|
|
"Or click to load the browser's file selector"
|
|
)}
|
|
</h4>
|
|
</>
|
|
)}
|
|
</div>
|
|
<input {...getInputProps()} style={{ display: 'none' }} />
|
|
</div>
|
|
)}
|
|
</div>
|
|
)}
|
|
</Dropzone>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default withTranslation('Common')(ViewerLocalFileData);
|