Skip to content

Commit 0a54f0e

Browse files
bnguyen-bcgscbnguyen-bcgsc
authored
Merge branch 'develop' into bugfix/DEVSU-2565-fix-drug-names-in-rr-table
2 parents 46e147f + 1f88bfc commit 0a54f0e

File tree

7 files changed

+142
-61
lines changed

7 files changed

+142
-61
lines changed

‎app/components/PrintTable/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -244,7 +244,7 @@ function PrintTable({
244244

245245
useLayoutEffect(() => {
246246
if (!data.length || !tableId) { return; }
247-
class MyHandler extends Handler {
247+
class PrintTableColSpanHandler extends Handler {
248248
// eslint-disable-next-line class-methods-use-this
249249
afterRendered() {
250250
const targetTables: NodeListOf<HTMLTableElement> = document.querySelectorAll(`[data-table-id='${tableId}']`);
@@ -276,7 +276,7 @@ function PrintTable({
276276
}
277277
}
278278
}
279-
registerHandlers(MyHandler);
279+
registerHandlers(PrintTableColSpanHandler);
280280
}, [data, tableId]);
281281

282282
return (

‎app/handlers/splitRowSpanHandler.ts‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { Handler } from 'pagedjs';
2+
/**
3+
* Handles when a RowSpanned column is split between two pages in print
4+
* It copies over values from original table to empty cells that are supposed to have values in it
5+
*/
6+
class SplitRowSpanHandler extends Handler {
7+
// eslint-disable-next-line class-methods-use-this
8+
afterRendered(pages) {
9+
const rowSpanMap = {};
10+
pages.forEach((page) => {
11+
const originTables = page.element.querySelectorAll('table[data-split-to]:not([data-split-from])');
12+
originTables.forEach((t) => {
13+
const rowSpanTds = [...t.querySelectorAll('td[rowspan]')].filter((td) => td.rowSpan > 1);
14+
15+
rowSpanTds
16+
.filter((td) => td.innerHTML.trim())
17+
.forEach((td) => {
18+
const refId = td.getAttribute('data-ref');
19+
if (!rowSpanMap[refId]) {
20+
rowSpanMap[refId] = td.innerHTML;
21+
}
22+
});
23+
});
24+
25+
const splitTables = page.element.querySelectorAll('table[data-split-from]');
26+
splitTables.forEach((t) => {
27+
const rowSpanTds = [...t.querySelectorAll('td[rowspan]')];
28+
rowSpanTds
29+
.filter((td) => !td.innerHTML.trim())
30+
.forEach((td) => {
31+
const refId = td.getAttribute('data-ref');
32+
const temp = document.createElement('td');
33+
temp.innerHTML = rowSpanMap[refId] ?? '';
34+
td.innerHTML = '';
35+
td.appendChild(temp.cloneNode(true));
36+
});
37+
});
38+
});
39+
}
40+
}
41+
42+
export default SplitRowSpanHandler;

‎app/index.css‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,19 @@
1818
break-before: page;
1919
}
2020

21+
table[data-split-from] thead,
22+
table[data-split-from] thead :is(th, tr) {
23+
visibility: unset !important;
24+
margin-top: unset !important;
25+
margin-bottom: unset !important;
26+
padding-top: unset !important;
27+
padding-bottom: unset !important;
28+
border-top: unset !important;
29+
border-bottom: unset !important;
30+
line-height: unset !important;
31+
opacity: unset !important;
32+
}
33+
2134
@page {
2235
size: 9in 11.5in;
2336
margin: .4in;

‎app/views/PrintView/index.tsx‎

Lines changed: 45 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import {
1919
import getImageDataURI from '@/utils/getImageDataURI';
2020
import { SummaryProps } from '@/commonComponents';
2121

22+
import SplitRowSpanHandler from '@/handlers/splitRowSpanHandler';
2223
import Summary from '../ReportView/components/Summary';
2324
import RunningLeft from './components/RunningLeft';
2425
import RunningCenter from './components/RunningCenter';
@@ -34,6 +35,8 @@ const Appendices = lazy(() => import('../ReportView/components/Appendices'));
3435

3536
const reducer = (state, action) => {
3637
switch (action.type) {
38+
case 'summary':
39+
return { ...state, summary: true };
3740
case 'summary-genomic':
3841
return { ...state, summary: true };
3942
case 'summary-tgr':
@@ -176,45 +179,6 @@ const Print = ({
176179
}
177180
}, [params.ident, report]);
178181

179-
useEffect(() => {
180-
if (reportSectionsLoaded
181-
&& template?.sections.length
182-
&& Object.entries(reportSectionsLoaded).every(([section, loaded]) => loaded || !template?.sections.includes(section))
183-
&& !isPrintDialogShown) {
184-
const showPrint = async () => {
185-
const paged = new Previewer();
186-
await paged.preview(document.getElementById('root'), ['index.css'], document.body);
187-
const templateName = report.template.name === 'probe' ? 'targeted_gene' : report.template.name;
188-
const currentDate = new Date();
189-
const year = currentDate.getFullYear();
190-
const month = (currentDate.getMonth() + 1).toString().padStart(2, '0');
191-
const day = currentDate.getDate().toString().padStart(2, '0');
192-
const hours = currentDate.getHours().toString().padStart(2, '0');
193-
const minutes = currentDate.getMinutes().toString().padStart(2, '0');
194-
const seconds = currentDate.getSeconds().toString().padStart(2, '0');
195-
let serverName;
196-
switch (process.env.NODE_ENV) {
197-
case 'development':
198-
serverName = '_iprdev';
199-
break;
200-
case 'staging':
201-
serverName = '_iprstaging';
202-
break;
203-
default:
204-
serverName = '';
205-
break;
206-
}
207-
const formattedDate = `${year}-${month}-${day}_${hours}h${minutes}m${seconds}s`;
208-
209-
document.title = `${report.patientId}${serverName}_${templateName}_report_${formattedDate}`;
210-
211-
window.print();
212-
setIsPrintDialogShown(true);
213-
};
214-
showPrint();
215-
}
216-
}, [isPrintDialogShown, report, reportSectionsLoaded, template]);
217-
218182
const renderSections = useMemo(() => {
219183
if (report && template) { // TODO remove checks on 'summary' and template name once data updated in prod
220184
return (
@@ -267,6 +231,48 @@ const Print = ({
267231
setReport,
268232
}), [report, setReport]);
269233

234+
useEffect(() => {
235+
if (
236+
reportSectionsLoaded
237+
&& template?.sections.length
238+
&& Object.entries(reportSectionsLoaded).every(([section, loaded]) => loaded || !template?.sections.includes(section))
239+
&& !isPrintDialogShown
240+
) {
241+
const showPrint = async () => {
242+
const paged = new Previewer();
243+
paged.registerHandlers(SplitRowSpanHandler);
244+
await paged.preview(document.getElementById('root'), ['index.css'], document.body);
245+
const templateName = report.template.name === 'probe' ? 'targeted_gene' : report.template.name;
246+
const currentDate = new Date();
247+
const year = currentDate.getFullYear();
248+
const month = (currentDate.getMonth() + 1).toString().padStart(2, '0');
249+
const day = currentDate.getDate().toString().padStart(2, '0');
250+
const hours = currentDate.getHours().toString().padStart(2, '0');
251+
const minutes = currentDate.getMinutes().toString().padStart(2, '0');
252+
const seconds = currentDate.getSeconds().toString().padStart(2, '0');
253+
let serverName;
254+
switch (process.env.NODE_ENV) {
255+
case 'development':
256+
serverName = '_iprdev';
257+
break;
258+
case 'staging':
259+
serverName = '_iprstaging';
260+
break;
261+
default:
262+
serverName = '';
263+
break;
264+
}
265+
const formattedDate = `${year}-${month}-${day}_${hours}h${minutes}m${seconds}s`;
266+
267+
document.title = `${report.patientId}${serverName}_${templateName}_report_${formattedDate}`;
268+
269+
window.print();
270+
setIsPrintDialogShown(true);
271+
};
272+
showPrint();
273+
}
274+
}, [isPrintDialogShown, report, reportSectionsLoaded, template]);
275+
270276
return (
271277
<ReportContext.Provider value={reportContextValue}>
272278
<div className={`${printVersion === 'condensedLayout' ? 'condensedLayout' : 'print'}`}>

‎app/views/ReportView/components/RapidSummary/index.tsx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -421,8 +421,7 @@ const RapidSummary = ({
421421
<PrintTable
422422
data={therapeuticAssociationResults}
423423
columnDefs={therapeuticAssociationColDefs.filter((col) => col.headerName !== 'Actions')}
424-
// DEVSU-2540 - turn off coalescing for now until more permanent solution
425-
// collapseableCols={['genomicEvents', 'Alt/Total (Tumour)', 'tumourAltCount/tumourDepth', 'comments']}
424+
collapseableCols={['genomicEvents', 'Alt/Total (Tumour)', 'tumourAltCount/tumourDepth', 'comments']}
426425
fullWidth
427426
/>
428427
);
@@ -485,8 +484,7 @@ const RapidSummary = ({
485484
<PrintTable
486485
data={cancerRelevanceResults}
487486
columnDefs={cancerRelevanceColDefs.filter((col) => col.headerName !== 'Actions')}
488-
// DEVSU-2540 - turn off coalescing for now until more permanent solution
489-
// collapseableCols={['genomicEvents', 'Alt/Total (Tumour)', 'tumourAltCount/tumourDepth']}
487+
collapseableCols={['genomicEvents', 'Alt/Total (Tumour)', 'tumourAltCount/tumourDepth']}
490488
fullWidth
491489
/>
492490
);

‎package-lock.json‎

Lines changed: 37 additions & 15 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@
125125
"lodash": "^4.17.21",
126126
"minimist": "~1.2.8",
127127
"notistack": "~3.0.1",
128-
"pagedjs": "^0.5.0-beta.0",
128+
"pagedjs": "^0.5.0-beta.2",
129129
"prop-types": "~15.8.1",
130130
"react": "~17.0.2",
131131
"react-chartjs-2": "~3.3.0",

0 commit comments

Comments
 (0)