Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
5f56d06fcd |
3
.gitignore
vendored
3
.gitignore
vendored
@@ -12,7 +12,6 @@ coverage/
|
||||
.yarn/
|
||||
.nx/
|
||||
addOns/yarn.lock
|
||||
**.zip
|
||||
|
||||
# YALC (for Erik)
|
||||
.yalc
|
||||
@@ -60,5 +59,3 @@ tests/playwright-report/
|
||||
|
||||
# Dummy
|
||||
/dump
|
||||
jwt-auth-inject.json
|
||||
platform/app/dist.zip
|
||||
|
||||
@@ -102,20 +102,8 @@ export const studyDataForOverlayItem = (studyInstanceUID: string) => {
|
||||
try {
|
||||
const qidoRootUrl = getQidoRootUrl();
|
||||
|
||||
// Get the authentication token from session storage
|
||||
const authToken = window.sessionStorage.getItem('ohif-auth-token');
|
||||
|
||||
// Create request headers with Authorization if token exists
|
||||
const headers: HeadersInit = {};
|
||||
if (authToken) {
|
||||
headers['Authorization'] = `Bearer ${authToken}`;
|
||||
}
|
||||
|
||||
const response = await fetch(
|
||||
`${qidoRootUrl}/studies?limit=101&offset=0&fuzzymatching=false&includefield=00080050,00081030,00101010,0010004&StudyInstanceUID=${studyInstanceUID}`,
|
||||
{
|
||||
headers,
|
||||
}
|
||||
`${qidoRootUrl}/studies?limit=101&offset=0&fuzzymatching=false&includefield=00080050,00081030,00101010,0010004&StudyInstanceUID=${studyInstanceUID}`
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
|
||||
@@ -39,16 +39,6 @@ export default function initWADOImageLoader(
|
||||
Accept: acceptHeader,
|
||||
};
|
||||
|
||||
// // Patch Mario:
|
||||
const authToken = sessionStorage.getItem('ohif-auth-token');
|
||||
if (!authToken) {
|
||||
// window.location.href = '/login'; // Kalau mau pakae login tinggal uncomment
|
||||
window.location.href = '/';
|
||||
return;
|
||||
}
|
||||
|
||||
xhrRequestHeaders.Authorization = `Bearer ${authToken}`;
|
||||
|
||||
if (headers) {
|
||||
Object.assign(xhrRequestHeaders, headers);
|
||||
}
|
||||
|
||||
@@ -26,8 +26,6 @@ const SidePanelWithServices = ({
|
||||
const [sidePanelOpen, setSidePanelOpen] = useState(activeTabIndexProp !== null);
|
||||
const [activeTabIndex, setActiveTabIndex] = useState(activeTabIndexProp);
|
||||
const [tabs, setTabs] = useState(tabsProp ?? panelService.getPanels(side));
|
||||
const [studyInstanceUID, setStudyInstanceUID] = useState('');
|
||||
const [lastActivatedStudyUID, setLastActivatedStudyUID] = useState('');
|
||||
|
||||
const handleActiveTabIndexChange = useCallback(({ activeTabIndex }) => {
|
||||
setActiveTabIndex(activeTabIndex);
|
||||
@@ -73,35 +71,11 @@ const SidePanelWithServices = ({
|
||||
const activatePanelSubscription = panelService.subscribe(
|
||||
panelService.EVENTS.ACTIVATE_PANEL,
|
||||
(activatePanelEvent: Types.ActivatePanelEvent) => {
|
||||
const isExpertisePanel = activatePanelEvent.panelId.includes('-exp-');
|
||||
const realPanelID = isExpertisePanel
|
||||
? activatePanelEvent.panelId.split('-exp-')[0]
|
||||
: activatePanelEvent.panelId;
|
||||
|
||||
// studyInstanceUID = take from activatePanelEvent.panelId after '-exp-
|
||||
setStudyInstanceUID(isExpertisePanel ? activatePanelEvent.panelId.split('-exp-')[1] : null);
|
||||
|
||||
const tabIndex = tabs.findIndex(tab => tab.id === realPanelID);
|
||||
|
||||
if (isExpertisePanel && side === 'right') {
|
||||
// Extract study UID from the panel ID
|
||||
const currentStudyUID = activatePanelEvent.panelId.split('-exp-')[1];
|
||||
|
||||
// Toggle logic - close if same study is clicked again, open if different study
|
||||
if (currentStudyUID === lastActivatedStudyUID && sidePanelOpen) {
|
||||
// Same study - close panel
|
||||
setSidePanelOpen(false);
|
||||
setActiveTabIndex(null);
|
||||
setLastActivatedStudyUID('');
|
||||
} else {
|
||||
// Different study or panel was closed - open panel with new study
|
||||
setSidePanelOpen(true);
|
||||
setActiveTabIndex(tabIndex !== -1 ? tabIndex : null);
|
||||
setStudyInstanceUID(currentStudyUID);
|
||||
setLastActivatedStudyUID(currentStudyUID);
|
||||
}
|
||||
} else if (tabIndex !== -1) {
|
||||
setActiveTabIndex(tabIndex);
|
||||
if (sidePanelOpen || activatePanelEvent.forceActive) {
|
||||
const tabIndex = tabs.findIndex(tab => tab.id === activatePanelEvent.panelId);
|
||||
if (tabIndex !== -1) {
|
||||
setActiveTabIndex(tabIndex);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
@@ -109,7 +83,7 @@ const SidePanelWithServices = ({
|
||||
return () => {
|
||||
activatePanelSubscription.unsubscribe();
|
||||
};
|
||||
}, [tabs, sidePanelOpen, panelService, lastActivatedStudyUID]);
|
||||
}, [tabs, sidePanelOpen, panelService]);
|
||||
|
||||
return (
|
||||
<SidePanel
|
||||
@@ -121,8 +95,6 @@ const SidePanelWithServices = ({
|
||||
onClose={handleClose}
|
||||
onActiveTabIndexChange={handleActiveTabIndexChange}
|
||||
expandedWidth={expandedWidth}
|
||||
servicesManager={servicesManager} // Pass servicesManager ke SidePanel
|
||||
studyInstanceUID={studyInstanceUID}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -85,15 +85,6 @@ function createDicomWebApi(dicomWebConfig, servicesManager) {
|
||||
if (authHeaders && authHeaders.Authorization) {
|
||||
xhrRequestHeaders.Authorization = authHeaders.Authorization;
|
||||
}
|
||||
|
||||
const authToken = sessionStorage.getItem('ohif-auth-token');
|
||||
if (!authToken) {
|
||||
// window.location.href = '/login'; // Kalau mau pakae login tinggal uncomment
|
||||
window.location.href = '/';
|
||||
return;
|
||||
}
|
||||
xhrRequestHeaders.Authorization = `Bearer ${authToken}`;
|
||||
|
||||
return xhrRequestHeaders;
|
||||
};
|
||||
|
||||
|
||||
@@ -6,8 +6,8 @@ function OHIFCornerstonePdfViewport({ displaySets }) {
|
||||
var [url, setUrl] = useState(null);
|
||||
|
||||
const sopInstanceUid = displaySets[0].SOPInstanceUID;
|
||||
url = `${window.config.pacs_document_host}:${window.config.pacs_document_port}/rid/IHERetrieveDocument?requestType=DOCUMENT&documentUID=${sopInstanceUid}&preferredContentType=application%2Fpdf`;
|
||||
console.log('URL PDF', url);
|
||||
url = `http://${window.config.pacs_document_host}:${window.config.pacs_document_port}/rid/IHERetrieveDocument?requestType=DOCUMENT&documentUID=${sopInstanceUid}&preferredContentType=application%2Fpdf`;
|
||||
console.log("URL PDF", url);
|
||||
|
||||
useEffect(() => {
|
||||
document.body.addEventListener('drag', makePdfDropTarget);
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 101 KiB |
@@ -1,16 +1,14 @@
|
||||
/** @type {AppTypes.Config} */
|
||||
function sas_get_token() {
|
||||
//implement token here
|
||||
return '';
|
||||
}
|
||||
|
||||
window.config = {
|
||||
sasGetToken: sas_get_token,
|
||||
routerBasename: '/',
|
||||
pacs_document_host: '152.42.173.210',
|
||||
pacs_document_port: 8080,
|
||||
// whiteLabeling: {},
|
||||
extensions: [],
|
||||
modes: [],
|
||||
customizationService: {},
|
||||
showStudyList: false,
|
||||
showStudyList: true,
|
||||
// some windows systems have issues with more than 3 web workers
|
||||
maxNumberOfWebWorkers: 3,
|
||||
// below flag is for performance reasons, but it might not work for all servers
|
||||
@@ -28,12 +26,10 @@ window.config = {
|
||||
prefetch: 25,
|
||||
},
|
||||
expertise: false, //* Tambahan untuk enable expertise (CustomizableViewportOverlay)
|
||||
expertise_host: `https://devone.aplikasi.web.id/one-api/mockup/pacsmwl/Workorder/get_dummy_expertise`, //* Tambahan untuk fetch data Expertise)
|
||||
pacs_document_host: `${window.location.hostname}`,
|
||||
pacs_document_port: 8080,
|
||||
// filterQueryParam: false,
|
||||
// defaultDataSourceName: 'dicomweb',
|
||||
defaultDataSourceName: 'local-proxy',
|
||||
// defaultDataSourceName: 'GCP',
|
||||
/* Dynamic config allows user to pass "configUrl" query string this allows to load config without recompiling application. The regex will ensure valid configuration source */
|
||||
// dangerouslyUseDynamicConfig: {
|
||||
// enabled: true,
|
||||
@@ -49,10 +45,10 @@ window.config = {
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomweb',
|
||||
sourceName: 'local-proxy',
|
||||
configuration: {
|
||||
friendlyName: 'Static WADO Local Data',
|
||||
friendlyName: 'DCM4CHEE Server',
|
||||
name: 'DCM4CHEE',
|
||||
qidoRoot: `http://${window.location.hostname}:5000/rs`,
|
||||
wadoRoot: `http://${window.location.hostname}:5000/rs`,
|
||||
qidoRoot: 'http://152.42.173.210:5000/rs',
|
||||
wadoRoot: 'http://152.42.173.210:5000/rs',
|
||||
qidoSupportsIncludeField: false,
|
||||
supportsReject: true,
|
||||
supportsStow: true,
|
||||
@@ -62,14 +58,100 @@ window.config = {
|
||||
supportsFuzzyMatching: false,
|
||||
supportsWildcard: true,
|
||||
staticWado: true,
|
||||
singlepart: 'video',
|
||||
singlepart: 'bulkdata,video',
|
||||
bulkDataURI: {
|
||||
enabled: true,
|
||||
relativeResolution: 'studies',
|
||||
transform: url => url.replace('/pixeldata.mp4', '/rendered'),
|
||||
},
|
||||
omitQuotationForMultipartRequest: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomweb',
|
||||
sourceName: 'dicomweb',
|
||||
configuration: {
|
||||
friendlyName: 'AWS S3 Static wado server',
|
||||
name: 'aws',
|
||||
wadoUriRoot: 'https://d14fa38qiwhyfd.cloudfront.net/dicomweb',
|
||||
qidoRoot: 'https://d14fa38qiwhyfd.cloudfront.net/dicomweb',
|
||||
wadoRoot: 'https://d14fa38qiwhyfd.cloudfront.net/dicomweb',
|
||||
qidoSupportsIncludeField: false,
|
||||
imageRendering: 'wadors',
|
||||
thumbnailRendering: 'wadors',
|
||||
enableStudyLazyLoad: true,
|
||||
supportsFuzzyMatching: false,
|
||||
supportsWildcard: true,
|
||||
staticWado: true,
|
||||
singlepart: 'bulkdata,video',
|
||||
// whether the data source should use retrieveBulkData to grab metadata,
|
||||
// and in case of relative path, what would it be relative to, options
|
||||
// are in the series level or study level (some servers like series some study)
|
||||
bulkDataURI: {
|
||||
enabled: true,
|
||||
relativeResolution: 'studies',
|
||||
transform: url => url.replace('/pixeldata.mp4', '/rendered'),
|
||||
},
|
||||
omitQuotationForMultipartRequest: true,
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomweb',
|
||||
sourceName: 'ohif2',
|
||||
configuration: {
|
||||
friendlyName: 'AWS S3 Static wado secondary server',
|
||||
name: 'aws',
|
||||
wadoUriRoot: 'https://dd14fa38qiwhyfd.cloudfront.net/dicomweb',
|
||||
qidoRoot: 'https://dd14fa38qiwhyfd.cloudfront.net/dicomweb',
|
||||
wadoRoot: 'https://dd14fa38qiwhyfd.cloudfront.net/dicomweb',
|
||||
qidoSupportsIncludeField: false,
|
||||
supportsReject: false,
|
||||
imageRendering: 'wadors',
|
||||
thumbnailRendering: 'wadors',
|
||||
enableStudyLazyLoad: true,
|
||||
supportsFuzzyMatching: false,
|
||||
supportsWildcard: true,
|
||||
staticWado: true,
|
||||
singlepart: 'bulkdata,video',
|
||||
// whether the data source should use retrieveBulkData to grab metadata,
|
||||
// and in case of relative path, what would it be relative to, options
|
||||
// are in the series level or study level (some servers like series some study)
|
||||
bulkDataURI: {
|
||||
enabled: true,
|
||||
relativeResolution: 'studies',
|
||||
},
|
||||
omitQuotationForMultipartRequest: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomweb',
|
||||
sourceName: 'ohif3',
|
||||
configuration: {
|
||||
friendlyName: 'AWS S3 Static wado secondary server',
|
||||
name: 'aws',
|
||||
wadoUriRoot: 'https://d3t6nz73ql33tx.cloudfront.net/dicomweb',
|
||||
qidoRoot: 'https://d3t6nz73ql33tx.cloudfront.net/dicomweb',
|
||||
wadoRoot: 'https://d3t6nz73ql33tx.cloudfront.net/dicomweb',
|
||||
qidoSupportsIncludeField: false,
|
||||
supportsReject: false,
|
||||
imageRendering: 'wadors',
|
||||
thumbnailRendering: 'wadors',
|
||||
enableStudyLazyLoad: true,
|
||||
supportsFuzzyMatching: false,
|
||||
supportsWildcard: true,
|
||||
staticWado: true,
|
||||
singlepart: 'bulkdata,video',
|
||||
// whether the data source should use retrieveBulkData to grab metadata,
|
||||
// and in case of relative path, what would it be relative to, options
|
||||
// are in the series level or study level (some servers like series some study)
|
||||
bulkDataURI: {
|
||||
enabled: true,
|
||||
relativeResolution: 'studies',
|
||||
},
|
||||
omitQuotationForMultipartRequest: true,
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomwebproxy',
|
||||
sourceName: 'dicomwebproxy',
|
||||
|
||||
@@ -1,57 +0,0 @@
|
||||
/** @type {AppTypes.Config} */
|
||||
window.config = {
|
||||
routerBasename: '/',
|
||||
pacs_document_host: `http://152.42.173.210`,
|
||||
pacs_document_port: 8585,
|
||||
goProxyHost: `http://152.42.173.210:5555`,
|
||||
expertise: false, //* Tambahan untuk enable expertise (CustomizableViewportOverlay)
|
||||
expertise_host: `https://devone.aplikasi.web.id/one-api/mockup/pacsmwl/Workorder/get_dummy_expertise`, //* Tambahan untuk fetch data Expertise)
|
||||
enableGoogleCloudAdapter: false,
|
||||
// below flag is for performance reasons, but it might not work for all servers
|
||||
showWarningMessageForCrossOrigin: true,
|
||||
showCPUFallbackMessage: true,
|
||||
showLoadingIndicator: true,
|
||||
strictZSpacingForVolumeViewport: true,
|
||||
extensions: [],
|
||||
modes: [],
|
||||
showStudyList: false,
|
||||
// filterQueryParam: false,
|
||||
defaultDataSourceName: 'dicomweb',
|
||||
dataSources: [
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomweb',
|
||||
sourceName: 'dicomweb',
|
||||
configuration: {
|
||||
friendlyName: 'dcmjs DICOMWeb Server',
|
||||
name: 'GCP',
|
||||
wadoUriRoot: `http://152.42.173.210:5555/dicomWeb`,
|
||||
qidoRoot: `http://152.42.173.210:5555/dicomWeb`,
|
||||
wadoRoot: `http://152.42.173.210:5555/dicomWeb`,
|
||||
qidoSupportsIncludeField: true,
|
||||
imageRendering: 'wadors',
|
||||
thumbnailRendering: 'wadors',
|
||||
enableStudyLazyLoad: true,
|
||||
supportsFuzzyMatching: false,
|
||||
supportsWildcard: true,
|
||||
dicomUploadEnabled: false,
|
||||
omitQuotationForMultipartRequest: true,
|
||||
configurationAPI: 'ohif.dataSourceConfigurationAPI.google',
|
||||
},
|
||||
},
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomjson',
|
||||
sourceName: 'dicomjson',
|
||||
configuration: {
|
||||
friendlyName: 'dicom json',
|
||||
name: 'json',
|
||||
},
|
||||
},
|
||||
{
|
||||
namespace: '@ohif/extension-default.dataSourcesModule.dicomlocal',
|
||||
sourceName: 'dicomlocal',
|
||||
configuration: {
|
||||
friendlyName: 'dicom local',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
@@ -1,20 +1,37 @@
|
||||
/** @type {AppTypes.Config} */
|
||||
window.config = {
|
||||
routerBasename: '/',
|
||||
pacs_document_host: `https://${window.location.hostname}`,
|
||||
pacs_document_port: 8585,
|
||||
goProxyHost: `https://${window.location.hostname}:5555`,
|
||||
expertise: false, //* Tambahan untuk enable expertise (CustomizableViewportOverlay)
|
||||
expertise_host: `https://devone.aplikasi.web.id/one-api/mockup/pacsmwl/Workorder/get_dummy_expertise`, //* Tambahan untuk fetch data Expertise)
|
||||
pacs_document_host: '152.42.173.210',
|
||||
pacs_document_port: 8080,
|
||||
expertise:false,
|
||||
enableGoogleCloudAdapter: false,
|
||||
// below flag is for performance reasons, but it might not work for all servers
|
||||
showWarningMessageForCrossOrigin: true,
|
||||
showCPUFallbackMessage: true,
|
||||
showLoadingIndicator: true,
|
||||
strictZSpacingForVolumeViewport: true,
|
||||
// This is an array, but we'll only use the first entry for now
|
||||
// Remove OIDC configuration since proxy handles authentication
|
||||
// oidc: [
|
||||
// {
|
||||
// // ~ REQUIRED
|
||||
// // Authorization Server URL
|
||||
// authority: 'https://accounts.google.com',
|
||||
// client_id: '382212153306-7q39hdie4ecj0uhemkitvedo93bnvfhn.apps.googleusercontent.com',
|
||||
// redirect_uri: '/callback',
|
||||
// response_type: 'id_token token',
|
||||
// scope:
|
||||
// 'email profile openid https://www.googleapis.com/auth/cloudplatformprojects.readonly https://www.googleapis.com/auth/cloud-healthcare', // email profile openid
|
||||
// // ~ OPTIONAL
|
||||
// post_logout_redirect_uri: '/logout-redirect.html',
|
||||
// revoke_uri: 'https://accounts.google.com/o/oauth2/revoke?token=',
|
||||
// automaticSilentRenew: true,
|
||||
// revokeAccessTokenOnSignout: true,
|
||||
// },
|
||||
// ],
|
||||
extensions: [],
|
||||
modes: [],
|
||||
showStudyList: false,
|
||||
showStudyList: true,
|
||||
// filterQueryParam: false,
|
||||
defaultDataSourceName: 'dicomweb',
|
||||
dataSources: [
|
||||
@@ -24,18 +41,24 @@ window.config = {
|
||||
configuration: {
|
||||
friendlyName: 'dcmjs DICOMWeb Server',
|
||||
name: 'GCP',
|
||||
wadoUriRoot: `https://${window.location.hostname}:5555/dicomWeb`,
|
||||
qidoRoot: `https://${window.location.hostname}:5555/dicomWeb`,
|
||||
wadoRoot: `https://${window.location.hostname}:5555/dicomWeb`,
|
||||
wadoUriRoot: `http://${window.location.hostname}:5555/dicomWeb`,
|
||||
qidoRoot: `http://${window.location.hostname}:5555/dicomWeb`,
|
||||
wadoRoot: `http://${window.location.hostname}:5555/dicomWeb`,
|
||||
qidoSupportsIncludeField: true,
|
||||
imageRendering: 'wadors',
|
||||
thumbnailRendering: 'wadors',
|
||||
enableStudyLazyLoad: true,
|
||||
supportsFuzzyMatching: false,
|
||||
supportsFuzzyMatching: true,
|
||||
supportsWildcard: true,
|
||||
dicomUploadEnabled: false,
|
||||
dicomUploadEnabled: true,
|
||||
omitQuotationForMultipartRequest: true,
|
||||
configurationAPI: 'ohif.dataSourceConfigurationAPI.google',
|
||||
// defaultDicomStoreConfiguredItems: {
|
||||
// id: 'projects/ohifproxy/locations/asia-southeast2/datasets/sas-storage',
|
||||
// itemType: '3',
|
||||
// name: 'store-1',
|
||||
// url: 'https://healthcare.googleapis.com/v1/projects/ohifproxy/locations/asia-southeast2/datasets/sas-storage/dicomStores/store-1'
|
||||
// },
|
||||
},
|
||||
},
|
||||
{
|
||||
|
||||
@@ -14,21 +14,9 @@
|
||||
name="mobile-web-app-capable"
|
||||
content="yes"
|
||||
/>
|
||||
<meta
|
||||
property="og:title"
|
||||
content="SAS Dicom Viewer"
|
||||
/>
|
||||
<meta
|
||||
property="og:description"
|
||||
content="Web-based Cloud DICOM Viewer by SAS for viewing and analyzing DICOM images. Powered by Open Health Imaging Foundation and Google Cloud Healthcare."
|
||||
/>
|
||||
<meta
|
||||
property="og:image"
|
||||
content="<%= PUBLIC_URL %>assets/logo-sismedika.png"
|
||||
/>
|
||||
<meta
|
||||
name="application-name"
|
||||
content="SAS Dicom Viewer"
|
||||
content="OHIF Viewer"
|
||||
/>
|
||||
<meta
|
||||
name="apple-mobile-web-app-capable"
|
||||
@@ -208,7 +196,7 @@
|
||||
src="<%= PUBLIC_URL %>init-service-worker.js"
|
||||
></script>
|
||||
|
||||
<title>SAS Dicom Viewer</title>
|
||||
<title>OHIF Viewer</title>
|
||||
|
||||
<!-- WEB FONTS -->
|
||||
<link
|
||||
@@ -228,6 +216,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!-- EXTENSIONS -->
|
||||
<!-- <script type="text/javascript" src="path/to/some-extension.js"></script>
|
||||
|
||||
@@ -247,6 +236,7 @@
|
||||
<body>
|
||||
<noscript> You need to enable JavaScript to run this app. </noscript>
|
||||
<div id="react-portal"></div>
|
||||
<div id="root"></div>
|
||||
<div id="root">
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -14,21 +14,9 @@
|
||||
name="mobile-web-app-capable"
|
||||
content="yes"
|
||||
/>
|
||||
<meta
|
||||
property="og:title"
|
||||
content="SAS Dicom Viewer"
|
||||
/>
|
||||
<meta
|
||||
property="og:description"
|
||||
content="Web-based Cloud DICOM Viewer by SAS for viewing and analyzing DICOM images. Powered by Open Health Imaging Foundation and Google Cloud Healthcare."
|
||||
/>
|
||||
<meta
|
||||
property="og:image"
|
||||
content="<%= PUBLIC_URL %>assets/logo-sismedika.png"
|
||||
/>
|
||||
<meta
|
||||
name="application-name"
|
||||
content="SAS Dicom Viewer"
|
||||
content="OHIF Viewer"
|
||||
/>
|
||||
<meta
|
||||
name="apple-mobile-web-app-capable"
|
||||
@@ -203,7 +191,7 @@
|
||||
src="<%= PUBLIC_URL %>init-service-worker.js"
|
||||
></script>
|
||||
|
||||
<title>SAS Dicom Viewer</title>
|
||||
<title>OHIF Viewer</title>
|
||||
|
||||
<!-- WEB FONTS -->
|
||||
<link
|
||||
|
||||
@@ -36,49 +36,6 @@ import createRoutes from './routes';
|
||||
import appInit from './appInit.js';
|
||||
import OpenIdConnectRoutes from './utils/OpenIdConnectRoutes';
|
||||
import { ShepherdJourneyProvider } from 'react-shepherd';
|
||||
import { initializeCustomAuth } from './utils/initUserAuthenticationService';
|
||||
|
||||
function injectAuth() {
|
||||
console.log('---> Inject Auth');
|
||||
const originalXHROpen = XMLHttpRequest.prototype.open;
|
||||
const originalXHRSend = XMLHttpRequest.prototype.send;
|
||||
|
||||
// Kalau ingin disable study list (Role Patient)
|
||||
// window.config.showStudyList = false;
|
||||
|
||||
const authToken = sessionStorage.getItem('ohif-auth-token');
|
||||
|
||||
XMLHttpRequest.prototype.open = function (method, url, async, user, password) {
|
||||
this._url = url; // Save URL if you want conditional logic
|
||||
return originalXHROpen.apply(this, arguments);
|
||||
};
|
||||
|
||||
XMLHttpRequest.prototype.send = function (body) {
|
||||
this.setRequestHeader('Authorization', `Bearer ${authToken}`);
|
||||
|
||||
this.addEventListener('readystatechange', function () {
|
||||
if (this.readyState === 4) {
|
||||
// readyState 4 = DONE
|
||||
try {
|
||||
// Check for auth errors (401/403) and redirect to login if needed
|
||||
if (this.status === 401 || this.status === 403) {
|
||||
window.sessionStorage.removeItem('ohif-auth-token');
|
||||
// window.location.href = '/login'; // Kalau mau pakae login tinggal uncomment
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Error handling auth response:', e);
|
||||
}
|
||||
}
|
||||
});
|
||||
return originalXHRSend.apply(this, arguments);
|
||||
};
|
||||
}
|
||||
|
||||
// Setup token access function
|
||||
window.config.sasGetToken = () => window.sessionStorage.getItem('ohif-auth-token');
|
||||
|
||||
// Enable auth token injection
|
||||
// injectAuth();
|
||||
|
||||
let commandsManager: CommandsManager,
|
||||
extensionManager: ExtensionManager,
|
||||
@@ -151,9 +108,6 @@ function App({
|
||||
customizationService,
|
||||
} = servicesManager.services;
|
||||
|
||||
// Initialize our custom authentication service
|
||||
initializeCustomAuth(userAuthenticationService);
|
||||
|
||||
const providers = [
|
||||
[AppConfigProvider, { value: appConfigState }],
|
||||
[UserAuthenticationProvider, { service: userAuthenticationService }],
|
||||
|
||||
@@ -1,138 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { useNavigate, useLocation } from 'react-router-dom';
|
||||
import { useUserAuthentication } from '@ohif/ui';
|
||||
import { Icons } from '@ohif/ui-next';
|
||||
|
||||
const Login = () => {
|
||||
const [email, setEmail] = useState('');
|
||||
const [password, setPassword] = useState('');
|
||||
const [error, setError] = useState('');
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const [, authContext] = useUserAuthentication();
|
||||
|
||||
// Get the intended destination from URL query params or default to home
|
||||
const searchParams = new URLSearchParams(location.search);
|
||||
const redirectPath = searchParams.get('redirect') || '/';
|
||||
|
||||
// Check if already authenticated
|
||||
useEffect(() => {
|
||||
const token = window.sessionStorage.getItem('ohif-auth-token');
|
||||
if (token) {
|
||||
// Already logged in, redirect to destination
|
||||
navigate(redirectPath, { replace: true });
|
||||
}
|
||||
}, [redirectPath, navigate]);
|
||||
|
||||
const handleLogin = async e => {
|
||||
e.preventDefault();
|
||||
setError('');
|
||||
setIsLoading(true);
|
||||
|
||||
try {
|
||||
// Use window.config.goProxyHost for authentication endpoint
|
||||
const proxyHost = window.config?.goProxyHost || `https://${window.location.hostname}:5555`;
|
||||
const authEndpoint = `${proxyHost}/auth/login`;
|
||||
|
||||
// Call go-ohif-proxy login endpoint
|
||||
const response = await fetch(authEndpoint, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ email, password }),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Login failed. Please check your credentials.');
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
// Store token in sessionStorage
|
||||
window.sessionStorage.setItem('ohif-auth-token', data.access_token);
|
||||
|
||||
// Decode token to extract role and user information
|
||||
let userInfo = data.user;
|
||||
|
||||
// Update the auth context
|
||||
authContext.setUser({
|
||||
...userInfo,
|
||||
token: data.access_token,
|
||||
});
|
||||
|
||||
// Set window.config.sasGetToken for the injectAuth function
|
||||
if (window.config) {
|
||||
window.config.sasGetToken = () => window.sessionStorage.getItem('ohif-auth-token');
|
||||
}
|
||||
|
||||
// Handle role-specific redirects if specified in response
|
||||
if (data.redirect_url) {
|
||||
navigate(data.redirect_url, { replace: true });
|
||||
} else {
|
||||
// Redirect to the original destination
|
||||
navigate(redirectPath, { replace: true });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Login error:', error);
|
||||
setError(error.message || 'Failed to log in. Please try again.');
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex h-screen w-screen items-center justify-center bg-black">
|
||||
<div className="bg-popover w-88 rounded p-8 shadow-lg">
|
||||
<div className="mb-4 flex justify-center">
|
||||
<Icons.OHIFLogo className="h-12 text-white" />
|
||||
</div>
|
||||
|
||||
<h2 className="text-md text-center font-bold text-white">Login to</h2>
|
||||
<h1 className="mb-8 text-center text-2xl font-bold text-white">Cloud DICOM Viewer</h1>
|
||||
|
||||
{error && <div className="mb-4 rounded bg-red-800 px-4 py-2 text-white">{error}</div>}
|
||||
|
||||
<form onSubmit={handleLogin}>
|
||||
<div className="mb-4">
|
||||
<label className="mb-2 block text-sm font-bold text-white">Email</label>
|
||||
<input
|
||||
type="text"
|
||||
className="focus:shadow-outline w-full appearance-none rounded border py-2 px-3 leading-tight text-gray-700 shadow focus:outline-none"
|
||||
value={email}
|
||||
onChange={e => setEmail(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-6">
|
||||
<label className="mb-2 block text-sm font-bold text-white">Password</label>
|
||||
<input
|
||||
type="password"
|
||||
className="focus:shadow-outline w-full appearance-none rounded border py-2 px-3 leading-tight text-gray-700 shadow focus:outline-none"
|
||||
value={password}
|
||||
onChange={e => setPassword(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center">
|
||||
<button
|
||||
type="submit"
|
||||
className="focus:shadow-outline w-full rounded bg-blue-500 py-2 px-4 font-bold text-white hover:bg-blue-700 focus:outline-none"
|
||||
disabled={isLoading}
|
||||
>
|
||||
{isLoading ? 'Logging in...' : 'Log In'}
|
||||
</button>
|
||||
</div>
|
||||
<p className="text-muted-foreground mt-8 text-center text-sm">
|
||||
Powered by OHIF & Google Cloud DICOM Storage
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Login;
|
||||
@@ -1,139 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { useNavigate, useLocation } from 'react-router-dom';
|
||||
import { useUserAuthentication } from '@ohif/ui';
|
||||
import { Icons } from '@ohif/ui-next';
|
||||
|
||||
const ShortlinkLogin = () => {
|
||||
const [dob, setDob] = useState('');
|
||||
const [shortToken, setShortToken] = useState('');
|
||||
const [error, setError] = useState('');
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const [, authContext] = useUserAuthentication();
|
||||
|
||||
// Parse the short token from URL query params
|
||||
useEffect(() => {
|
||||
const searchParams = new URLSearchParams(location.search);
|
||||
const token = searchParams.get('short');
|
||||
|
||||
if (token) {
|
||||
setShortToken(token);
|
||||
} else {
|
||||
// No short token found, redirect to regular login
|
||||
setError('No shortlink token found in URL');
|
||||
setTimeout(() => {
|
||||
navigate('/', { replace: true });
|
||||
}, 3000);
|
||||
}
|
||||
}, [location.search, navigate]);
|
||||
|
||||
// Handle form submission
|
||||
const handleSubmit = async e => {
|
||||
e.preventDefault();
|
||||
setError('');
|
||||
setIsLoading(true);
|
||||
|
||||
try {
|
||||
// Use window.config.goProxyHost for authentication endpoint
|
||||
const proxyHost = window.config?.goProxyHost || `https://${window.location.hostname}:5555`;
|
||||
const authEndpoint = `${proxyHost}/auth/shortlink`;
|
||||
|
||||
// Call the shortlink authentication endpoint
|
||||
const response = await fetch(authEndpoint, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ short_token: shortToken, dob }),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Authentication failed. Please check your date of birth and try again.');
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
// Store token in sessionStorage
|
||||
window.sessionStorage.setItem('ohif-auth-token', data.access_token);
|
||||
|
||||
// Decode token to extract user information (if available in token)
|
||||
let userInfo = data.user;
|
||||
|
||||
// Update the auth context
|
||||
authContext.setUser({
|
||||
...userInfo,
|
||||
token: data.access_token,
|
||||
});
|
||||
|
||||
// Set window.config.sasGetToken for the injectAuth function
|
||||
if (window.config) {
|
||||
window.config.sasGetToken = () => window.sessionStorage.getItem('ohif-auth-token');
|
||||
}
|
||||
|
||||
// Navigate to the viewer page with the authenticated patient's study
|
||||
// The actual URL would depend on how studies are loaded in your OHIF instance
|
||||
if (data.redirect_url) {
|
||||
navigate(data.redirect_url, { replace: true });
|
||||
} else {
|
||||
// Default navigation if no specific redirect is provided
|
||||
navigate('/', { replace: true });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Authentication error:', error);
|
||||
setError(error.message || 'Failed to authenticate. Please try again.');
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDateChange = e => {
|
||||
// Format date input as YYYY-MM-DD
|
||||
setDob(e.target.value);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex h-screen w-screen items-center justify-center bg-black">
|
||||
<div className="bg-popover w-88 rounded p-8 shadow-lg">
|
||||
<div className="mb-4 flex justify-center">
|
||||
<Icons.OHIFLogo className="h-12 text-white" />
|
||||
</div>
|
||||
|
||||
<h1 className="mb-8 text-center text-2xl font-bold text-white">Cloud DICOM Viewer</h1>
|
||||
|
||||
{error && <div className="mb-4 rounded bg-red-800 px-4 py-2 text-white">{error}</div>}
|
||||
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="mb-6">
|
||||
<label className="mb-2 block text-sm font-bold text-white">
|
||||
Masukkan tanggal lahir Anda:
|
||||
</label>
|
||||
<input
|
||||
type="date"
|
||||
className="focus:shadow-outline w-full appearance-none rounded border py-2 px-3 leading-tight text-gray-700 shadow focus:outline-none"
|
||||
value={dob}
|
||||
onChange={handleDateChange}
|
||||
required
|
||||
/>
|
||||
<p className="mt-1 text-xs text-gray-400">Format: Bulan - Tanggal - Tahun</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center">
|
||||
<button
|
||||
type="submit"
|
||||
className="focus:shadow-outline w-full rounded bg-blue-500 py-2 px-4 font-bold text-white hover:bg-blue-700 focus:outline-none"
|
||||
disabled={isLoading || !shortToken}
|
||||
>
|
||||
{isLoading ? 'Verifying...' : 'View'}
|
||||
</button>
|
||||
</div>
|
||||
<p className="text-muted-foreground mt-8 text-center text-sm">
|
||||
Powered by OHIF & Google Cloud DICOM Storage
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ShortlinkLogin;
|
||||
@@ -85,38 +85,6 @@ function WorkList({
|
||||
const debouncedFilterValues = useDebounce(filterValues, 200);
|
||||
const { resultsPerPage, pageNumber, sortBy, sortDirection } = filterValues;
|
||||
|
||||
/*
|
||||
* Patch untuk Role checking patient gabisa akses ke study list
|
||||
*/
|
||||
const token = window.sessionStorage.getItem('ohif-auth-token');
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
const decodedToken = decodeToken(token);
|
||||
|
||||
// Check jika 'role' = 'patient' tapi akses '/' return ke viewer
|
||||
if (decodedToken && decodedToken.role === 'patient') {
|
||||
const currentPath = window.location.pathname + window.location.search;
|
||||
if (currentPath === '/') {
|
||||
console.log(
|
||||
'User is a patient and trying to access the root path. Redirecting to his/her home URL.'
|
||||
);
|
||||
window.location.href = `${decodedToken.home_url}`;
|
||||
}
|
||||
}
|
||||
|
||||
function decodeToken(token) {
|
||||
try {
|
||||
const payload = token.split('.')[1];
|
||||
if (payload) {
|
||||
return JSON.parse(atob(payload));
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Error parsing JWT token', e);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/*
|
||||
* The default sort value keep the filters synchronized with runtime conditional sorting
|
||||
* Only applied if no other sorting is specified and there are less than 101 studies
|
||||
@@ -574,7 +542,7 @@ function WorkList({
|
||||
/>
|
||||
<Onboarding />
|
||||
<InvestigationalUseDialog dialogConfiguration={appConfig?.investigationalUseDialog} />
|
||||
<div className="flex h-full flex-col overflow-y-auto">
|
||||
<div className="flex flex-col h-full overflow-y-auto">
|
||||
<ScrollArea>
|
||||
<div className="flex grow flex-col">
|
||||
<StudyListFilter
|
||||
@@ -590,7 +558,9 @@ function WorkList({
|
||||
// ? () => dataSourceConfigurationComponent()
|
||||
// : undefined
|
||||
// }
|
||||
getDataSourceConfigurationComponent={undefined}
|
||||
getDataSourceConfigurationComponent={
|
||||
undefined
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
{hasStudies ? (
|
||||
|
||||
@@ -12,8 +12,6 @@ import buildModeRoutes from './buildModeRoutes';
|
||||
import PrivateRoute from './PrivateRoute';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from 'react-router-dom';
|
||||
import Login from './Login';
|
||||
import ShortlinkLogin from './ShortlinkLogin';
|
||||
|
||||
const NotFoundServer = ({
|
||||
message = 'Unable to query for studies at this time. Check your data source configuration or network connection',
|
||||
@@ -76,15 +74,6 @@ const bakedInRoutes = [
|
||||
path: '/localbasic',
|
||||
children: Local.bind(null, { modePath: 'viewer/dicomlocal' }),
|
||||
},
|
||||
// * Custom Patch untuk Login go-ohif-proxy
|
||||
{
|
||||
path: '/login',
|
||||
children: Login,
|
||||
},
|
||||
{
|
||||
path: '/short-auth',
|
||||
children: ShortlinkLogin,
|
||||
},
|
||||
];
|
||||
|
||||
// NOT FOUND (404)
|
||||
|
||||
@@ -1,73 +0,0 @@
|
||||
/**
|
||||
* Initializes the custom authentication service for OHIF Viewer
|
||||
* to work with go-ohif-proxy authentication
|
||||
*/
|
||||
export function initializeCustomAuth(userAuthenticationService) {
|
||||
// Set up the authentication service with custom implementation
|
||||
userAuthenticationService.setServiceImplementation({
|
||||
// Custom implementation to handle unauthenticated users
|
||||
handleUnauthenticated: () => {
|
||||
// Check if there's a shortlink token in the URL
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const shortToken = urlParams.get('short');
|
||||
|
||||
// If there's a shortlink token, redirect to the shortlink login page
|
||||
if (shortToken) {
|
||||
window.location.href = `/short-auth?short=${shortToken}`;
|
||||
return null;
|
||||
}
|
||||
|
||||
// Otherwise, handle as normal login flow
|
||||
// Get the current path for redirect after login
|
||||
const currentPath = window.location.pathname + window.location.search;
|
||||
|
||||
// Clear any existing tokens
|
||||
window.sessionStorage.removeItem('ohif-auth-token');
|
||||
|
||||
// Redirect to login page with the redirect URL in query params
|
||||
// window.location.href = `/login?redirect=${encodeURIComponent(currentPath)}`;
|
||||
window.location.href = '/';
|
||||
|
||||
// Return null to prevent rendering while redirecting
|
||||
return null;
|
||||
},
|
||||
|
||||
// Custom implementation to get the authorization header
|
||||
// di ohif3.9.1 ini sepertinya masih development
|
||||
// getAuthorizationHeader: () => {
|
||||
// const token = window.sessionStorage.getItem('ohif-auth-token');
|
||||
// return token ? `Bearer ${token}` : undefined;
|
||||
// },
|
||||
});
|
||||
|
||||
// Set authentication as enabled
|
||||
userAuthenticationService.set({ enabled: true });
|
||||
|
||||
// Check if we already have a token and set the user if we do
|
||||
const token = window.sessionStorage.getItem('ohif-auth-token');
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
const decodedToken = decodeToken(token);
|
||||
|
||||
// Check jika 'role' = 'patient' tapi akses '/' return ke viewer
|
||||
if (decodedToken && decodedToken.role === 'patient') {
|
||||
const currentPath = window.location.pathname + window.location.search;
|
||||
if (currentPath === '/') {
|
||||
console.log('User is a patient and trying to access the root path. Redirecting to /patient.');
|
||||
window.location.href = `${decodedToken.home_url}`;
|
||||
}
|
||||
}
|
||||
|
||||
function decodeToken(token) {
|
||||
try {
|
||||
const payload = token.split('.')[1];
|
||||
if (payload) {
|
||||
return JSON.parse(atob(payload));
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Error parsing JWT token', e);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@@ -4,7 +4,6 @@ import React, { useCallback, useEffect, useState } from 'react';
|
||||
import { Icons } from '../Icons';
|
||||
import { TooltipTrigger, TooltipContent, TooltipProvider, Tooltip } from '../Tooltip';
|
||||
import { Separator } from '../Separator';
|
||||
import { ScrollArea } from '../ScrollArea';
|
||||
|
||||
type StyleMap = {
|
||||
open: {
|
||||
@@ -153,23 +152,10 @@ const SidePanel = ({
|
||||
onClose,
|
||||
expandedWidth = 280,
|
||||
onActiveTabIndexChange,
|
||||
servicesManager, // Tambah servicesManager as a prop
|
||||
studyInstanceUID,
|
||||
}) => {
|
||||
const [panelOpen, setPanelOpen] = useState(activeTabIndexProp !== null);
|
||||
const [activeTabIndex, setActiveTabIndex] = useState(0);
|
||||
|
||||
const [isExpertiseVisible, setIsExpertiseVisible] = useState(false); // New state for expertise visibility
|
||||
const [expertiseData, setExpertiseData] = useState(null);
|
||||
const [isExpertiseLoading, setIsExpertiseLoading] = useState(false);
|
||||
|
||||
const { cornerstoneViewportService } = servicesManager.services;
|
||||
const [viewportData, setViewportData] = useState(null);
|
||||
|
||||
// Harusnya (viewportId), tapi karena gabutuh perubahan viewport maka dihardcode 'default'
|
||||
// const viewportInfo = cornerstoneViewportService.getViewportInfo('default');
|
||||
// const studyInstanceUID = viewportInfo?.viewportData?.data?.[0]?.StudyInstanceUID || '';
|
||||
|
||||
const styleMap = createStyleMap(expandedWidth, borderSize, collapsedWidth);
|
||||
const baseStyle = createBaseStyle(expandedWidth);
|
||||
const gridAvailableWidth = expandedWidth - closeIconWidth - gridHorizontalPadding;
|
||||
@@ -210,16 +196,6 @@ const SidePanel = ({
|
||||
updateActiveTabIndex(activeTabIndexProp);
|
||||
}, [activeTabIndexProp, updateActiveTabIndex]);
|
||||
|
||||
const toggleExpertiseVisibility = () => {
|
||||
const shouldOpenExpertise = !isExpertiseVisible;
|
||||
setIsExpertiseVisible(shouldOpenExpertise);
|
||||
|
||||
// Open the side panel if the expertise panel is being shown
|
||||
if (shouldOpenExpertise && !panelOpen) {
|
||||
updatePanelOpen(true);
|
||||
}
|
||||
};
|
||||
|
||||
const getCloseStateComponent = () => {
|
||||
const _childComponents = Array.isArray(tabs) ? tabs : [tabs];
|
||||
return (
|
||||
@@ -279,235 +255,6 @@ const SidePanel = ({
|
||||
);
|
||||
};
|
||||
|
||||
// Tambahkan di atas useEffect fetchExpertiseData
|
||||
useEffect(() => {
|
||||
const fetchAccessionNumber = async () => {
|
||||
if (!studyInstanceUID) {
|
||||
console.warn('No StudyInstanceUID available');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const qidoRootUrl = getQidoRootUrl();
|
||||
if (!qidoRootUrl) {
|
||||
console.warn('QIDO root URL not configured');
|
||||
return;
|
||||
}
|
||||
|
||||
// Create request headers with Authorization if token exists
|
||||
const authToken = window.sessionStorage.getItem('ohif-auth-token');
|
||||
|
||||
const headers: HeadersInit = {};
|
||||
if (authToken) {
|
||||
headers['Authorization'] = `Bearer ${authToken}`;
|
||||
}
|
||||
|
||||
// Fetch data with specific fields including Accession Number
|
||||
const response = await fetch(
|
||||
`${qidoRootUrl}/studies?includefield=00080050&StudyInstanceUID=${studyInstanceUID}`,
|
||||
{
|
||||
headers,
|
||||
}
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to fetch study data');
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data && data.length > 0) {
|
||||
// Extract accession number from DICOM tag 00080050
|
||||
const accessionNumber = data[0]['00080050']?.Value?.[0] || '';
|
||||
|
||||
// If we have an accession number, call fetchExpertiseData
|
||||
if (accessionNumber) {
|
||||
console.log('Found Accession Number:', accessionNumber);
|
||||
fetchExpertiseData(accessionNumber);
|
||||
} else {
|
||||
console.warn('Accession number not found in study data');
|
||||
}
|
||||
} else {
|
||||
console.warn('No study data returned');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching accession number:', error);
|
||||
}
|
||||
};
|
||||
|
||||
// Helper function to get QIDO root URL
|
||||
const getQidoRootUrl = () => {
|
||||
const { config } = window;
|
||||
if (!config?.dataSources || !config.defaultDataSourceName) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const dataSource = config.dataSources.find(
|
||||
ds => ds.sourceName === config.defaultDataSourceName
|
||||
);
|
||||
|
||||
return dataSource?.configuration?.qidoRoot;
|
||||
};
|
||||
|
||||
fetchAccessionNumber();
|
||||
}, [studyInstanceUID]); // Run when studyInstanceUID changes
|
||||
|
||||
// Ubah fungsi fetchExpertiseData menjadi dengan parameter accessionNumber
|
||||
const fetchExpertiseData = async accessionNumber => {
|
||||
try {
|
||||
// Check if window.config.expertise_host exists
|
||||
if (!window.config?.expertise_host) {
|
||||
console.warn('Expertise host not configured in window.config.expertise_host');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!accessionNumber) {
|
||||
console.warn('No accession number available for expertise lookup');
|
||||
return;
|
||||
}
|
||||
|
||||
setIsExpertiseLoading(true);
|
||||
const url = `${window.config.expertise_host}?accessionNo=${accessionNumber}`;
|
||||
|
||||
const response = await fetch(url);
|
||||
const data = await response.json();
|
||||
if (data?.status === 'OK' && data?.data) {
|
||||
// Create expertise data in the format expected by your component
|
||||
const formattedExpertiseData = {
|
||||
ordering_physician: data.data.senderDoctorName,
|
||||
radiologist: data.data.pjDoctorName,
|
||||
expertise_dttm: data.data.expTime,
|
||||
// Convert the expertise object to a string format that parseExpertise can handle
|
||||
expertise: formatExpertiseToString(data.data.expertise),
|
||||
};
|
||||
|
||||
setExpertiseData(formattedExpertiseData);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching expertise data:', error);
|
||||
} finally {
|
||||
setIsExpertiseLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// Helper function to convert expertise object to string format
|
||||
const formatExpertiseToString = expertiseObj => {
|
||||
if (!expertiseObj) return '';
|
||||
|
||||
let result = '';
|
||||
|
||||
// Add each section with proper formatting
|
||||
if (expertiseObj.Indikasi) {
|
||||
result += `KLINIS: ${expertiseObj.Indikasi}\r\n`;
|
||||
}
|
||||
|
||||
if (expertiseObj.Teknik) {
|
||||
result += `TEKNIK: ${expertiseObj.Teknik}\r\n\r\n`;
|
||||
}
|
||||
|
||||
if (expertiseObj.Deskripsi) {
|
||||
result += `KETERANGAN:\r\n${expertiseObj.Deskripsi.replace(/\n/g, '\r\n')}\r\n\r\n`;
|
||||
}
|
||||
|
||||
if (expertiseObj.Kesan) {
|
||||
result += `KESAN: ${expertiseObj.Kesan}`;
|
||||
}
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
const getExpertisePanel = () => {
|
||||
if (side !== 'right') return null; // Only show in the right side panel
|
||||
|
||||
if (isExpertiseLoading) {
|
||||
return (
|
||||
<div className="flex h-[500px] w-[350px] items-center justify-center text-white">
|
||||
Loading expertise data...
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!expertiseData) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const parseExpertise = text => {
|
||||
if (!text) return {};
|
||||
|
||||
const result = {};
|
||||
let currentSection = 'Keterangan';
|
||||
|
||||
// Split expertise text by lines and process each line
|
||||
const lines = text.split('\r\n').filter(line => line.trim() !== '');
|
||||
|
||||
lines.forEach(line => {
|
||||
// Check if this is a section header
|
||||
if (line.includes(':') && !line.trim().startsWith('-')) {
|
||||
const parts = line.split(':');
|
||||
currentSection = parts[0].trim();
|
||||
const value = parts[1]?.trim() || '';
|
||||
|
||||
if (value) {
|
||||
if (!result[currentSection]) {
|
||||
result[currentSection] = [];
|
||||
}
|
||||
result[currentSection].push(value);
|
||||
}
|
||||
} else if (line.toLowerCase().includes('kesan')) {
|
||||
currentSection = 'Kesan';
|
||||
} else {
|
||||
// Add line to current section
|
||||
if (!result[currentSection]) {
|
||||
result[currentSection] = [];
|
||||
}
|
||||
result[currentSection].push(line.trim());
|
||||
}
|
||||
});
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
const parsedSections = parseExpertise(expertiseData.expertise);
|
||||
|
||||
// Create formatted data structure
|
||||
const formattedData = [
|
||||
{ label: 'Dokter Pengirim', value: expertiseData.ordering_physician || '' },
|
||||
{ label: 'Dokter Radiologis', value: expertiseData.radiologist || '' },
|
||||
{ label: 'Waktu Expertise', value: expertiseData.expertise_dttm || '' },
|
||||
];
|
||||
|
||||
// Add additional sections from parsed text
|
||||
Object.entries(parsedSections).forEach(([key, value]) => {
|
||||
formattedData.push({
|
||||
label: key,
|
||||
value: Array.isArray(value) ? value : [value],
|
||||
});
|
||||
});
|
||||
|
||||
return (
|
||||
<ScrollArea className="border-input bg-background h-[500px] w-[350px] rounded-md border p-2 text-sm text-white">
|
||||
<h3 className="mb-4 text-lg font-bold">Expertise</h3>
|
||||
{formattedData.map((section, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="mb-4"
|
||||
>
|
||||
<h5 className="text-base font-bold">{section.label}:</h5>
|
||||
{Array.isArray(section.value) ? (
|
||||
<ul className="list-disc pl-6">
|
||||
{section.value.map((item, idx) => (
|
||||
<li key={idx}>{item}</li>
|
||||
))}
|
||||
</ul>
|
||||
) : (
|
||||
<p>{section.value}</p>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</ScrollArea>
|
||||
);
|
||||
};
|
||||
|
||||
const getCloseIcon = () => {
|
||||
return (
|
||||
<div
|
||||
@@ -639,7 +386,6 @@ const SidePanel = ({
|
||||
}
|
||||
return null;
|
||||
})}
|
||||
{getExpertisePanel()} {/* Add expertise panel here */}
|
||||
</>
|
||||
) : (
|
||||
<React.Fragment>{getCloseStateComponent()}</React.Fragment>
|
||||
@@ -667,8 +413,6 @@ SidePanel.propTypes = {
|
||||
onClose: PropTypes.func,
|
||||
onActiveTabIndexChange: PropTypes.func,
|
||||
expandedWidth: PropTypes.number,
|
||||
servicesManager: PropTypes.object.isRequired, // Tambah servicesManager prop
|
||||
studyInstanceUID: PropTypes.string, // Tambahkan prop studyInstanceUID
|
||||
};
|
||||
|
||||
export { SidePanel };
|
||||
|
||||
@@ -62,8 +62,6 @@ const StudyBrowser = ({
|
||||
data-cy="thumbnail-list"
|
||||
viewPreset={viewPreset}
|
||||
onThumbnailContextMenu={onThumbnailContextMenu}
|
||||
servicesManager={servicesManager} // Pass servicesManager ke Study Item
|
||||
studyInstanceUid={studyInstanceUid}
|
||||
/>
|
||||
</React.Fragment>
|
||||
);
|
||||
|
||||
@@ -20,11 +20,7 @@ const StudyItem = ({
|
||||
onClickUntrack,
|
||||
viewPreset = 'thumbnails',
|
||||
onThumbnailContextMenu,
|
||||
servicesManager, // Tambah servicesManager as a prop
|
||||
studyInstanceUid = '',
|
||||
}: withAppTypes) => {
|
||||
// FETCHING ACCESSION NUMBER DAN EXPERTISE
|
||||
|
||||
return (
|
||||
<Accordion
|
||||
type="single"
|
||||
@@ -59,33 +55,15 @@ const StudyItem = ({
|
||||
}}
|
||||
>
|
||||
{isExpanded && displaySets && (
|
||||
<>
|
||||
{/* Expertise Button */}
|
||||
<div
|
||||
className="bg-primary-dark hover:bg-primary-active mx-8 my-4 cursor-pointer rounded-lg border border-white py-3 text-center text-white"
|
||||
onClick={() => {
|
||||
// Trigger the expertise panel in the right side panel (segmentation Panel)
|
||||
servicesManager.services.panelService.activatePanel(
|
||||
// '@ohif/extension-cornerstone.panelModule.panelSegmentation-exp',
|
||||
`@ohif/extension-cornerstone.panelModule.panelSegmentation-exp-${studyInstanceUid}`,
|
||||
true
|
||||
);
|
||||
}}
|
||||
>
|
||||
Expertise
|
||||
</div>
|
||||
|
||||
{/* Thumbnails */}
|
||||
<ThumbnailList
|
||||
thumbnails={displaySets}
|
||||
activeDisplaySetInstanceUIDs={activeDisplaySetInstanceUIDs}
|
||||
onThumbnailClick={onClickThumbnail}
|
||||
onThumbnailDoubleClick={onDoubleClickThumbnail}
|
||||
onClickUntrack={onClickUntrack}
|
||||
viewPreset={viewPreset}
|
||||
onThumbnailContextMenu={onThumbnailContextMenu}
|
||||
/>
|
||||
</>
|
||||
<ThumbnailList
|
||||
thumbnails={displaySets}
|
||||
activeDisplaySetInstanceUIDs={activeDisplaySetInstanceUIDs}
|
||||
onThumbnailClick={onClickThumbnail}
|
||||
onThumbnailDoubleClick={onDoubleClickThumbnail}
|
||||
onClickUntrack={onClickUntrack}
|
||||
viewPreset={viewPreset}
|
||||
onThumbnailContextMenu={onThumbnailContextMenu}
|
||||
/>
|
||||
)}
|
||||
</AccordionContent>
|
||||
</AccordionItem>
|
||||
@@ -108,8 +86,6 @@ StudyItem.propTypes = {
|
||||
onDoubleClickThumbnail: PropTypes.func,
|
||||
onClickUntrack: PropTypes.func,
|
||||
viewPreset: PropTypes.string,
|
||||
servicesManager: PropTypes.object.isRequired, // Tambah servicesManager prop
|
||||
studyInstanceUid: PropTypes.string.string,
|
||||
};
|
||||
|
||||
export { StudyItem };
|
||||
|
||||
Reference in New Issue
Block a user