Completed inline filtering - moved loading indicator into tbody to avoid reloading the header (with filter contents)
This commit is contained in:
Rob Lewis
parent
73a95b6e22
commit
aec9ec8f8b
@ -13,8 +13,6 @@ input.worklist-search
|
||||
height: 25px
|
||||
background-color: #888888
|
||||
|
||||
// style="background-color: #444444; border-color:#444444;cursor:default;">
|
||||
|
||||
#tblStudyList
|
||||
tr
|
||||
height: 45px
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
<template name="worklistResult">
|
||||
{{ #if studies.count }}
|
||||
<table id="tblStudyList" class="table table-striped noselect">
|
||||
<thead>
|
||||
<tr>
|
||||
@ -40,7 +39,7 @@
|
||||
Modality
|
||||
</div>
|
||||
<div class="modality-input">
|
||||
<input type="search" class="form-control worklist-search" id="modality">
|
||||
<input type="search" class="form-control worklist-search" id="modality" style="visibility: hidden; ">
|
||||
</div>
|
||||
</th>
|
||||
<th>
|
||||
@ -48,7 +47,7 @@
|
||||
StudyDescription
|
||||
</div>
|
||||
<div class="study-description-input">
|
||||
<input type="search" class="form-control worklist-search" id="studyDescription">
|
||||
<input type="search" class="form-control worklist-search" id="studyDescription" style="visibility: hidden; ">
|
||||
</div>
|
||||
</th>
|
||||
<th>
|
||||
@ -56,7 +55,7 @@
|
||||
# Images
|
||||
</div>
|
||||
<div class="worklist-input">
|
||||
<input type="search" class="form-control worklist-search" id="numberOfImages">
|
||||
<input type="search" class="form-control worklist-search" id="numberOfImages" style="visibility: hidden; ">
|
||||
</div>
|
||||
</th>
|
||||
</tr>
|
||||
@ -67,7 +66,7 @@
|
||||
{{/each}}
|
||||
</tbody>
|
||||
</table>
|
||||
{{ else }}
|
||||
{{ #unless studies.count }}
|
||||
{{ >loadingText }}
|
||||
{{ /if }}
|
||||
{{ /unless }}
|
||||
</template>
|
||||
@ -19,6 +19,7 @@ var studyDateFrom;
|
||||
var studyDateTo;
|
||||
var checkFrom = false;
|
||||
var checkTo = false;
|
||||
var filter;
|
||||
|
||||
/**
|
||||
* Transforms an input string into a search filter for
|
||||
@ -72,7 +73,7 @@ function convertStringToStudyDate (dateStr) {
|
||||
*/
|
||||
function search() {
|
||||
// Create the filters to be used for the Worklist Search
|
||||
var filter = {
|
||||
filter = {
|
||||
patientName: getFilter($('#patientName').val()),
|
||||
patientId: getFilter($('#patientId').val()),
|
||||
accessionNumber: getFilter($('#patientAccessionNumber').val())
|
||||
@ -103,7 +104,6 @@ function search() {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
Template.worklistResult.events({
|
||||
@ -112,5 +112,6 @@ Template.worklistResult.events({
|
||||
},
|
||||
'onsearch': function(event) {
|
||||
search();
|
||||
|
||||
}
|
||||
});
|
||||
@ -1,94 +0,0 @@
|
||||
<template name="worklistSearch">
|
||||
<!--Search Panel-->
|
||||
<div id="worklistSearchPanel" class="panel panel-default">
|
||||
<div class="panel-heading" id="search-panel-head">
|
||||
<h4 class="panel-title">
|
||||
<a data-toggle="collapse" href="#searchPanel">Search</a>
|
||||
</h4>
|
||||
</div>
|
||||
<div id="searchPanel" class="panel-collapse collapse">
|
||||
<div class="panel-body">
|
||||
<div style="padding: 10px;">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 col-md-8 col-xs-12">
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="patientId">Patient ID</label>
|
||||
<input type="text" class="form-control" id="patientId" placeholder="Patient ID">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="patientName">Name</label>
|
||||
<input type="text" class="form-control" id="patientName" placeholder="Name">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="patientAccessionNumber">Accession #</label>
|
||||
<input type="text" class="form-control" id="patientAccessionNumber" placeholder="Accession #">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="studyDescription">Study Description</label>
|
||||
<input type="text" class="form-control" id="studyDescription" placeholder="Study Description">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<!--Add calendar ui-->
|
||||
<div class="form-group">
|
||||
<label for="">Study Date(from)</label>
|
||||
<p><input type="checkbox" id="checkFrom"><input id="studyDateFrom" type="date" class="form-control" style="padding-left: 30px;"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="">Study Date(to)</label>
|
||||
<p><input type="checkbox" id="checkTo"><input id="studyDateTo" type="date" class="form-control" style="padding-left:30px;"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="referringPhysician">Referring Physician</label>
|
||||
<input type="text" class="form-control" id="referringPhysician" placeholder="Referring Physician">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-3 col-xs-10">
|
||||
<div class="form-group">
|
||||
<label for="modality">Modality</label>
|
||||
<input type="text" class="form-control" id="modality" placeholder="Modality">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4 col-md-4 col-xs-12">
|
||||
<div class="row" style="margin-top: 25px;margin-bottom: 25px;">
|
||||
<div class="col-lg-4 col-md-6 col-xs-6">
|
||||
<button class="btn btn-primary" id="btnSearch">Search</button>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-xs-6">
|
||||
<button class="btn btn-primary" id="btnToday">Today</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-4 col-md-6 col-xs-6">
|
||||
<button class="btn btn-primary" id="btnClear">Clear</button>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-xs-6">
|
||||
<button class="btn btn-primary" id="btnLastSevenDays">Last 7 Days</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Search panel ends-->
|
||||
</template>
|
||||
@ -1,136 +0,0 @@
|
||||
// Retrieve all studies
|
||||
search();
|
||||
|
||||
var studyDateFrom;
|
||||
var studyDateTo;
|
||||
var checkFrom = false;
|
||||
var checkTo = false;
|
||||
|
||||
/**
|
||||
* Transforms an input string into a search filter for
|
||||
* the Worklist Search call
|
||||
*
|
||||
* @param filter The input string to be searched for
|
||||
* @returns {*}
|
||||
*/
|
||||
function getFilter(filter) {
|
||||
if(filter && filter.length && filter.substr(filter.length - 1) !== '*') {
|
||||
filter += '*';
|
||||
}
|
||||
return filter;
|
||||
}
|
||||
|
||||
/**
|
||||
* Search for a value in a string
|
||||
*/
|
||||
function isIndexOf(mainVal, searchVal) {
|
||||
if (mainVal === undefined || mainVal === '' || mainVal.indexOf(searchVal) > -1){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Replace object if undefined
|
||||
*/
|
||||
function replaceUndefinedColumnValue (text) {
|
||||
if (text == undefined || text === "undefined") {
|
||||
return "";
|
||||
} else {
|
||||
return text;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Convert string to study date
|
||||
*/
|
||||
function convertStringToStudyDate (dateStr) {
|
||||
var y = dateStr.substring(0,4);
|
||||
var m = dateStr.substring(4,6);
|
||||
var d = dateStr.substring(6,8);
|
||||
var newDateStr = y+"/"+m+"/"+d;
|
||||
return new Date(newDateStr);
|
||||
}
|
||||
|
||||
/**
|
||||
* Runs a search for studies matching the worklist query parameters
|
||||
* Inserts the identified studies into the Studies Collection
|
||||
*/
|
||||
function search() {
|
||||
// Create the filters to be used for the Worklist Search
|
||||
var filter = {
|
||||
patientName: getFilter($('#patientName').val()),
|
||||
patientId: getFilter($('#patientId').val()),
|
||||
accessionNumber: getFilter($('#patientAccessionNumber').val())
|
||||
};
|
||||
|
||||
// Make sure that modality has a reasonable value, since it is occasionally
|
||||
// returned as 'undefined'
|
||||
var modality = replaceUndefinedColumnValue($('#modality').val());
|
||||
|
||||
// Clear all current studies
|
||||
WorklistStudies.remove({});
|
||||
|
||||
Meteor.call('WorklistSearch', filter, function(error, studies) {
|
||||
if (!studies) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Loop through all identified studies
|
||||
studies.forEach(function(study) {
|
||||
|
||||
// Search the rest of the parameters that aren't done via the server call
|
||||
if(isIndexOf(study.modalities, modality) &&
|
||||
(new Date(studyDateFrom).setHours(0,0,0,0) <= convertStringToStudyDate(study.studyDate) || !checkFrom) &&
|
||||
(convertStringToStudyDate(study.studyDate) <= new Date(studyDateTo).setHours(0,0,0,0) || !checkTo)) {
|
||||
|
||||
// Insert any matching studies into the Studies Collection
|
||||
WorklistStudies.insert(study);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
Template.worklistSearch.events({
|
||||
/**
|
||||
* Searches for studies given the current state of the form controls
|
||||
*/
|
||||
'click button#btnSearch' :function(event) {
|
||||
studyDateFrom = $('#studyDateFrom').val();
|
||||
studyDateTo = $('#studyDateTo').val();
|
||||
checkFrom = $('#checkFrom').is(':checked');
|
||||
checkTo = $('#checkTo').is(':checked');
|
||||
search();
|
||||
},
|
||||
/**
|
||||
* Searches for studies with a study date equal to Today
|
||||
*/
|
||||
'click button#btnToday' :function(event) {
|
||||
studyDateTo = new Date();
|
||||
studyDateFrom = studyDateTo;
|
||||
checkFrom = true;
|
||||
checkTo = true;
|
||||
search();
|
||||
},
|
||||
|
||||
/**
|
||||
* Searches for studies in the Last 7 Days
|
||||
*/
|
||||
'click button#btnLastSevenDays' :function() {
|
||||
studyDateTo = new Date();
|
||||
studyDateFrom = new Date();
|
||||
studyDateFrom.setDate(studyDateFrom.getDate()-7);
|
||||
checkFrom = true;
|
||||
checkTo = true;
|
||||
search();
|
||||
},
|
||||
/**
|
||||
* Clears all input data in the study search panel
|
||||
*/
|
||||
'click button#btnClear' :function(event) {
|
||||
$("#searchPanel .form-control").val("");
|
||||
$('#checkFrom').prop('checked', false);
|
||||
$('#checkTo').prop('checked', false);
|
||||
}
|
||||
});
|
||||
@ -1,25 +0,0 @@
|
||||
/***********************************************/
|
||||
/* Search Panel */
|
||||
/***********************************************/
|
||||
#worklistSearchPanel
|
||||
margin: 20px 0
|
||||
color: #888888
|
||||
background-color: #202020
|
||||
|
||||
#search-panel-head
|
||||
background-color: #337ab7
|
||||
color: white
|
||||
font-weight: 500
|
||||
font-size: 20px
|
||||
line-height: 20px
|
||||
box-shadow: 2px 2px 2px #888888
|
||||
|
||||
#btnSearch, #btnToday, #btnClear, #btnLastSevenDays
|
||||
width: 100%
|
||||
|
||||
#checkFrom, #checkTo
|
||||
width: 20px
|
||||
height: 20px
|
||||
position: absolute
|
||||
left: 20px
|
||||
bottom: 22px
|
||||
Loading…
Reference in New Issue
Block a user