LT-253: Added Collection to store Additional Findings in the database. Set up some form components that store temporary UI state
This commit is contained in:
Erik Ziegler committed
1 parent
022c534895
commit
40062e2e9d
35 files changed
+599
-216
No files matched your search
@@ -0,0 +1,63 @@
|
||||
<template name="additionalFindings">
|
||||
<div class="additionalFindings">
|
||||
<div class="scrollArea">
|
||||
<div class="row">
|
||||
<div class="header">
|
||||
Additional Findings: Baseline
|
||||
</div>
|
||||
{{> radioOptionGroup (stateDataWithKey "measurableDisease")}}
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="header">
|
||||
Supplementary Measurements
|
||||
</div>
|
||||
{{> selectInput (stateDataWithKey "numberOfBoneLesions")}}
|
||||
{{> select2Input
|
||||
key="regionsOfMetastaticDisease"
|
||||
select2Options=regionsOfMetastaticDiseaseSelect2Options
|
||||
state=state
|
||||
currentSchema=currentSchema
|
||||
}}
|
||||
{{> radioOptionGroup (stateDataWithKey "tracerRelatedToMetastaticDisease")}}
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="header">
|
||||
Image Quality
|
||||
</div>
|
||||
{{> radioOptionGroup (stateDataWithKey "acceptableImageQuality")}}
|
||||
{{> radioOptionGroup (stateDataWithKey "adequateAnatomicalCoverage")}}
|
||||
{{> radioOptionGroup (stateDataWithKey "presenceOfContrast")}}
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="header">
|
||||
Additional Screen Captures
|
||||
</div>
|
||||
<div class="entrySection buttonSection">
|
||||
<div class="svgContainer">
|
||||
<svg>
|
||||
<use xlink:href="/packages/lesiontracker/assets/icons.svg#icon-create-screen-capture"></use>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="buttonLabel noselect">
|
||||
Add new screen capture
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="header">
|
||||
Comments
|
||||
</div>
|
||||
<div class="entrySection buttonSection">
|
||||
<div class="svgContainer">
|
||||
<svg>
|
||||
<use xlink:href="/packages/lesiontracker/assets/icons.svg#icon-create-comment"></use>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="buttonLabel noselect">
|
||||
Add a comment
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,82 @@
|
||||
import { Template } from 'meteor/templating';
|
||||
import { ReactiveDict } from 'meteor/reactive-dict';
|
||||
|
||||
// TODO: Check why I can't use absolute paths for this? Keeps saying module not found
|
||||
import { AdditionalFinding } from '../../../both/schema/additionalFinding';
|
||||
|
||||
Template.additionalFindings.onCreated(function additionalFindingsOnCreated() {
|
||||
console.log('additionalFindingsOnCreated');
|
||||
const instance = Template.instance();
|
||||
|
||||
instance.currentSchema = AdditionalFinding;
|
||||
instance.state = new ReactiveDict();
|
||||
|
||||
if (!instance.data.currentTimepointId) {
|
||||
console.warn('Case has no timepointId');
|
||||
return;
|
||||
}
|
||||
|
||||
const currentTimepointId = instance.data.currentTimepointId;
|
||||
if (!currentTimepointId) {
|
||||
console.warn('No currentTimepointId');
|
||||
}
|
||||
|
||||
console.log(AdditionalFindings.find().fetch());
|
||||
const additionalFindings = AdditionalFindings.findOne({
|
||||
timepointId: currentTimepointId
|
||||
});
|
||||
|
||||
if (additionalFindings) {
|
||||
instance.id = additionalFindings._id;
|
||||
|
||||
// Don't store the MongoDB Id in the ReactiveDict
|
||||
delete additionalFindings._id;
|
||||
|
||||
instance.state.set(additionalFindings);
|
||||
} else {
|
||||
const defaultData = instance.currentSchema.clean({});
|
||||
instance.state.set(defaultData);
|
||||
|
||||
// Include patientId and timepointId
|
||||
defaultData.patientId = Session.get('patientId');
|
||||
defaultData.timepointId = currentTimepointId;
|
||||
|
||||
// TODO: Turn this into a Meteor Call to insert it on the server
|
||||
instance.id = AdditionalFindings.insert(defaultData);
|
||||
}
|
||||
});
|
||||
|
||||
Template.additionalFindings.onRendered(function additionalFindingsOnRendered() {
|
||||
const instance = Template.instance();
|
||||
|
||||
instance.autorun(() => {
|
||||
console.log('Updating AdditionalFindings Collection');
|
||||
console.log(instance.state.all());
|
||||
|
||||
// TODO: Turn this into a Meteor Call to update it on the server
|
||||
let update = instance.state.all();
|
||||
AdditionalFindings.update(instance.id, {
|
||||
$set: update
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
Template.additionalFindings.helpers({
|
||||
// We need these helper methods
|
||||
// since we assign them into instance object instead of instance.data
|
||||
currentSchema() {
|
||||
return Template.instance().currentSchema;
|
||||
},
|
||||
|
||||
state() {
|
||||
return Template.instance().state;
|
||||
},
|
||||
|
||||
regionsOfMetastaticDiseaseSelect2Options() {
|
||||
return {
|
||||
placeholder: 'Search Regions',
|
||||
allowClear: true,
|
||||
multiple: true
|
||||
};
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,118 @@
|
||||
@import "{design}/app"
|
||||
|
||||
.additionalFindings
|
||||
width: 100%
|
||||
height: 100%
|
||||
background-color: #000000
|
||||
|
||||
.scrollArea
|
||||
height: 100%
|
||||
overflow-x: hidden
|
||||
overflow-y: auto
|
||||
margin-right: -16px
|
||||
padding-bottom: 100px
|
||||
padding-right: 16px
|
||||
|
||||
-webkit-overflow-scrolling: touch
|
||||
|
||||
.row
|
||||
margin-right: 0
|
||||
margin-left: 0
|
||||
|
||||
&::-webkit-scrollbar
|
||||
display: none
|
||||
|
||||
.header
|
||||
height: 33px
|
||||
line-height: 33px
|
||||
font-weight: 400
|
||||
font-size: 14px
|
||||
padding: 0 10px
|
||||
color: $textPrimaryColor
|
||||
background-color: $uiGrayDarker
|
||||
|
||||
.form-group
|
||||
padding: 10px
|
||||
color: $textPrimaryColor
|
||||
|
||||
&:not(:last-child)
|
||||
border-bottom: $uiBorderThickness solid $uiBorderColorDark
|
||||
|
||||
h5
|
||||
font-weight: 300
|
||||
|
||||
label
|
||||
font-size: 14px
|
||||
font-weight: 100
|
||||
display: inline-block
|
||||
padding: 5px
|
||||
|
||||
.radio-group
|
||||
height: 30px
|
||||
|
||||
.radio-option
|
||||
width: 50%
|
||||
text-align: center
|
||||
float: left
|
||||
display: inline-block
|
||||
padding: 5px
|
||||
height: 30px
|
||||
|
||||
input
|
||||
float: left
|
||||
height: 30px
|
||||
width: 30px
|
||||
display: inline-block
|
||||
|
||||
label
|
||||
float: left
|
||||
height: 30px
|
||||
line-height: 30px
|
||||
font-size: 14px
|
||||
font-weight: 100
|
||||
display: inline-block
|
||||
|
||||
#regionsOfMetastaticDisease
|
||||
width: 285px
|
||||
height: 30px
|
||||
border-radius: 2px
|
||||
background-color: #b6b6b6
|
||||
color: #3e3e3e
|
||||
font-size: 14px
|
||||
|
||||
.buttonSection
|
||||
cursor: pointer
|
||||
height: 100px
|
||||
color: $defaultColor
|
||||
|
||||
&:hover
|
||||
color: $hoverColor
|
||||
|
||||
.svgContainer
|
||||
svg
|
||||
fill: $hoverColor
|
||||
|
||||
&:active
|
||||
color: $activeColor
|
||||
|
||||
.svgContainer
|
||||
svg
|
||||
fill: $activeColor
|
||||
|
||||
div
|
||||
float: left
|
||||
display: inline-block
|
||||
height: 80px
|
||||
|
||||
.buttonLabel
|
||||
line-height: 80px
|
||||
padding: 0 30px
|
||||
|
||||
.svgContainer
|
||||
padding: 15px 5px
|
||||
width: 40px
|
||||
|
||||
svg
|
||||
width: 40px
|
||||
height: 40px
|
||||
fill: $textPrimaryColor
|
||||
Reference in new issue
Block a user