Skip to content
This repository has been archived by the owner on Feb 22, 2020. It is now read-only.

Commit

Permalink
Refine and refactor Report and Export to show data. (Closes: #182)
Browse files Browse the repository at this point in the history 
* Refine and refactor Report and Export to show data.

Refactor constant

* Adding some more mockup data

* Add a sample nodule image
  • Loading branch information
@louisgv @lamby
louisgv authored and lamby committed Nov 1, 2017
1 parent e30f9d7 commit bb54879
Show file tree
Hide file tree
Showing 5 changed files with 249 additions and 90 deletions.
Binary file added interface/frontend/src/assets/images/sample-right-nodule.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
11 changes: 9 additions & 2 deletions interface/frontend/src/components/report-and-export/OneLineParagraph.vue
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,19 @@
<template>
<p>
<label>{{label}} :</label> <span>{{ value }}</span>
<label>{{label}} :</label>
<span v-if="constantKey">{{ constantValue }}</span>
<span v-else>{{ value }}</span>
</p>
</template>

<script>
export default {
props: [ 'label', 'value' ]
props: [ 'label', 'value', 'constant-key' ],
computed: {
constantValue: function () {
return this.$constants[this.constantKey][this.value]
}
}
}
</script>

Expand Down
229 changes: 162 additions & 67 deletions interface/frontend/src/components/report-and-export/RSNAStandardTemplate.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,75 +40,154 @@
</p>
</article>
</section>

<section id="findings">
<h2>Findings</h2>
<!-- {{findings}} -->

<article>
<!-- {{ findings.exam }} -->
<h3>Exam parameters</h3>
<olp label='Diagnostic quality' :value='findings.exam.diagnosticQuality'></olp>
<olp label='Comments' :value='findings.exam.comments'></olp>
</article>

<article>
<!-- {{findings.lungNodules}} -->
<h3>Lung nodules</h3>
<p v-if="findings.lungNodules.length === 0">
None.
</p>

<div class="nodule-list" v-else>
<nodule v-for="(nodule, index) in findings.lungNodules" :nodule="nodule" :index="index">
<div slot="add-on-editor">
{{ nodule }}
</div>
</nodule>
</div>

</article>

<article>
{{findings.lungs}}
<h3>Lungs</h3>

</article>

<article>
{{findings.rightPleuralSpace}}
<h3>Right pleural space</h3>
</article>

<article>
{{findings.leftPleuralSpace}}
<h3>Left pleural space</h3>
</article>

<article>
{{findings.heart}}
<h3>Heart</h3>
</article>

<article>
{{findings.other}}
<h3>Other findings</h3>
</article>

</section>

<section id="impression">
<h2>Impression</h2>
<!-- {{ impression }} -->
<article>
<olp label='Need comparison' :value='impression.needComparison'></olp>
<olp label='Repeat CT' :value='impression.repeatCT'></olp>
<olp label='See physician' :value='impression.seePhysician'></olp>
<olp label='See physician' :value='impression.comments'></olp>
</article>
</section>
</div>

<section id="findings">
<h2>Findings</h2>
<!-- {{findings}} -->

<article>
<!-- {{ findings.exam }} -->
<h3>Exam parameters</h3>
<olp label='Diagnostic quality'
constant-key="DIAGNOSTIC_QUALITY_STRINGS"
:value='findings.exam.diagnosticQuality'></olp>
<olp label='Comments' :value='findings.exam.comments'></olp>
</article>

<article>
<!-- {{findings.lungNodules}} -->
<h3>Lung nodules</h3>
<p v-if="findings.lungNodules.length === 0">
None.
</p>

<div class="nodule-list" v-else>
<nodule v-for="(nodule, index) in findings.lungNodules" :nodule="nodule" :index="index">
<div class="nodule-info-container" slot="add-on-editor">
<!-- {{ nodule }} -->
<div class="nodule-info">
<olp label='Position'
constant-key="LUNG_ORIENTATION_STRINGS"
:value='nodule.lung_orientation'></olp>
<olp label='Size'
:value='nodule.size + "mm"'></olp>
<olp label='Solidity'
constant-key="SOLIDITY_STRINGS"
:value='nodule.solidity'></olp>
<olp label='Condition'
constant-key="CONDITION_STRINGS"
:value='nodule.condition'></olp>
</div>
<div class="nodule-image">
<img :src="nodule.image" alt="Nodule Image">
</div>
</div>
</nodule>
</div>

</article>

<article>
<!-- {{findings.lungs}} -->
<h3>Lungs</h3>
<olp label='COPD'
constant-key="SEVERITY_STRINGS"
:value='findings.lungs.copd'></olp>
<olp label='Fibrosis'
constant-key="SEVERITY_STRINGS"
:value='findings.lungs.fibrosis'></olp>
<olp label='Lymph nodes' :value='findings.lungs.lymphNodes'></olp>
<olp label='Other findings' :value='findings.lungs.otherFindings'></olp>
</article>

<article>
<!-- {{findings.rightPleuralSpace}} -->
<h3>Right pleural space</h3>
<olp label='Effusion'
constant-key="SIZE_STRINGS"
:value='findings.rightPleuralSpace.effusion'></olp>

<olp label='Calcification'
constant-key="SPREAD_STRINGS"
:value='findings.rightPleuralSpace.calcification'></olp>

<olp label='Thickening'
constant-key="SPREAD_STRINGS"
:value='findings.rightPleuralSpace.thickening'></olp>

<olp label='Pneumothorax'
constant-key="SIZE_STRINGS"
:value='findings.rightPleuralSpace.pneumothorax'></olp>
</article>

<article>
<!-- {{findings.leftPleuralSpace}} -->
<h3>Left pleural space</h3>

<olp label='Effusion'
constant-key="SIZE_STRINGS"
:value='findings.leftPleuralSpace.effusion'></olp>

<olp label='Calcification'
constant-key="SPREAD_STRINGS"
:value='findings.leftPleuralSpace.calcification'></olp>

<olp label='Thickening'
constant-key="SPREAD_STRINGS"
:value='findings.leftPleuralSpace.thickening'></olp>

<olp label='Pneumothorax'
constant-key="SIZE_STRINGS"
:value='findings.leftPleuralSpace.pneumothorax'></olp>
</article>

<article>
<!-- {{findings.heart}} -->
<h3>Heart</h3>
<olp label='Heart size'
constant-key="HEART_ENLARGEMENT_STRINGS"
:value='findings.heart.sizeEnlargement'></olp>

<olp label='Coronary calcification'
constant-key="SEVERITY_STRINGS"
:value='findings.heart.coronaryCalcification'></olp>

<olp label='Pericardial effusion'
constant-key="SEVERITY_STRINGS"
:value='findings.heart.pericardialEffusion'></olp>
</article>

<article>
<!-- {{findings.other}} -->
<h3>Other findings</h3>
<olp label='Upper abdomen'
:value='findings.other.upperAbdomen'></olp>

<olp label='Thorax'
:value='findings.other.thorax'></olp>

<olp label='Base of neck'
:value='findings.other.baseOfNeck'></olp>
</article>

</section>

<section id="impression">
<h2>Impression</h2>
<!-- {{ impression }} -->
<article>
<olp label='Need comparison' :value='impression.needComparison'></olp>

<olp label='Repeat CT'
constant-key='REPEAT_CT_STRING'
:value='impression.repeatCT'></olp>

<olp label='See physician' :value='impression.seePhysician'></olp>

<olp label='Comments' :value='impression.comments'></olp>
</article>
</section>
</div>
</template>

Expand Down Expand Up @@ -180,6 +259,7 @@ export default {
article {
margin-left: 1em;
font-size: 1.35em;
margin-bottom: 2em;
h3 {
margin-bottom: 1em;
}
Expand All @@ -189,6 +269,21 @@ export default {
.nodule-list {
padding: 0 1em;
.nodule-info-container {
display: flex;
flex-direction: row;
justify-content: space-between;
}
.nodule-image img {
height: 9em;
transition: 0.5s;
&:hover {
height: 18em;
}
}
}
}
Expand Down
92 changes: 73 additions & 19 deletions interface/frontend/src/constants.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,50 +4,104 @@ export default {
LEFT: 1,
RIGHT: 2
},
LUNG_ORIENTATION_STRINGS: ['None', 'Left', 'Right'],
DIAGNOSTIC_QUALITY: {
NONE: 'Non-diagnostic',
LIMITED: 'Limited, but interpretable',
SATISFACTORY: 'Satisfactory'
NONE: 0,
LIMITED: 1,
SATISFACTORY: 2
},
DIAGNOSTIC_QUALITY_STRINGS: [
'Non-diagnostic',
'Limited, but interpretable',
'Satisfactory'
],
SOLIDITY: {
SOLID: 'Solid',
SEMI_SOLID: 'Semi-solid',
GROUND_GLASS: 'Ground glass'
SOLID: 0,
SEMI_SOLID: 1,
GROUND_GLASS: 2
},
SOLIDITY_STRINGS: [
'Solid',
'Semi-solid',
'Ground glass'
],
CONDITION: {
UNCHANGED: 'Unchanged',
INCREASED: 'Increased',
DECREASED: 'Decreased',
NEW: 'New'
UNCHANGED: 0,
INCREASED: 1,
DECREASED: 2,
NEW: 3
},
CONDITION_STRINGS: [
'Unchanged',
'Increased',
'Decreased',
'New'
],
SEVERITY: {
NONE: 0,
MILD: 1,
MODERATE: 2,
SEVERE: 3
},
SEVERITY_STRINGS: [
'None',
'Mild',
'Moderate',
'Severe'
],
HEART_ENLARGEMENT_STRINGS: [
'Normal',
'Mildly enlarged',
'Moderately enlarged',
'Severely enlarged'
],
SPREAD: {
NONE: 0,
MILD: 1,
MODERATE: 2,
EXTENSIVE: 3
},
SPREAD_STRINGS: [
'None',
'Mild',
'Moderate',
'Extensive'
],
SIZE: {
NONE: 0,
SMALL: 1,
MODERATE: 2,
LARGE: 3
},

SIZE_STRINGS: [
'None',
'Small',
'Moderate',
'Large'
],
PHYSICIAN_VISIT: {
NO: 'No',
YES_CANCER: 'YES. Suspect cancer',
YES_NON_MALIGNANT: 'YES, non-malignant finding'
NO: 0,
YES_CANCER: 1,
YES_NON_MALIGNANT: 2
},
PHYSICIAN_VISIT_STRINGS: [
'No',
'YES. Suspect cancer',
'YES, non-malignant finding'
],
REPEAT_CT: {
THREE_MONTH: '3 months from screening exam',
SIX_MONTH: '6 months from screening exam',
THREE_TO_SIX_MONTH: '3 to 6 months from screening exam',
TWELVE_MONTH: '12 months from screening exam',
TWENTY_FOUR_MONTH: '24 months from screening exam'
}
THREE_MONTH: 0,
SIX_MONTH: 1,
THREE_TO_SIX_MONTH: 2,
TWELVE_MONTH: 3,
TWENTY_FOUR_MONTH: 4
},
REPEAT_CT_STRING: [
'3 months from screening exam',
'6 months from screening exam',
'3 to 6 months from screening exam',
'12 months from screening exam',
'24 months from screening exam'
]
}
Loading

0 comments on commit bb54879

Please sign in to comment.