[% META title="Sample storage" %]
<!-- BEGIN [% template.name %] -->
[% # PROCESS dumper.tt dump = request.as_tree %]
[% # PROCESS dumper.tt dump = specimen_map %]
[% # PROCESS dumper.tt dump = storage %]
[% # PROCESS dumper.tt dump = c.stash.errs %]
[% # PROCESS dumper.tt dump = menu_options %]
[% # PROCESS dumper.tt dump = lab_tests %]
[% # PROCESS dumper.tt dump = lab_sections %]
[% # PROCESS dumper.tt dump = request_lab_tests %]
[% # PROCESS dumper.tt dump = menu_options %]
[% # define some data structures:
# c.debug('##############'); # to reveal any db calls from templates
patient = request.patient_case.patient; # not as_tree - preserve datetime objects;
sample_codes = specimen_map.item(request.id).sample_code;
%]
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$('#sample').blur(function() {
// $('#xna_fields').hide();
var f = this.value.toLowerCase(); // alert(f);
if (f.match('[rd]na')) {
$('#xna_fields').show();
}
else {
$('#xna_fields').hide();
}
});
});
</script>
[% INCLUDE record/patient_summary.tt %]
<h3 class="header">Sample storage</h3>
[% IF lab_tests.size; INCLUDE storage/request_lab_tests.tt; END %]
<h3>Current stock</h3>
<p class="info indent">Number of vials in store: [% available.size %]</p>
[% IF storage.size %]
<table class="indent">
<tr>
<td class="borderless"></td>
<th>Specimen</th>
<th>Vial ID</th>
<th>Sample</th>
<th>Source</th>
<th>Volume</th>
<th>Conc<sup>n</sup></th>
<th>
<span class="acronym" title="XNA extration method">Method</span>
</th>
<th>Location</th>
<th>In</th>
<th>Out</th>
<td class="borderless"></td>
</tr>
[% FOREACH item IN storage; # PROCESS dumper.tt dump = item.as_tree
class = item.signed_out ? 'grey' : 'normal';
%]
<tr class="[% class %]">
<td>[% loop.count %]</td>
<td>[% item.specimen.sample_code %]</td>
<td>[% item.vialId %]</td>
<td>[% item.sample %]</td>
<td>[% item.source || site.html.grey_null %]</td>
<td>[% IF item.volume; item.volume; 'µL';
ELSE; site.html.grey_null; END %]</td>
<td>[% IF item.concentration; item.concentration; 'ng/µL';
ELSE; site.html.grey_null; END %]</td>
<td>[% item.method || site.html.grey_null %]</td>
<td>[% IF item.vial_location;
item.rack.plateId _ '/' _ item.vial_location; END %]</td>
<td>[% item.created_at.strftime('%d.%b.%Y') %]</td>
<td>[% item.signed_out.strftime('%d.%b.%Y') %]</td>
<td>
<a href="[% app_url %]/storage/edit/[% item.vialId %]/[% request.id %]">[edit]</a>
</td>
</tr>
[% END %]
</table>
[% END %]
<h3>Input new vial
[% div_name = 'input'; INCLUDE site/snippets/toggleview.tt %]
</h3>
<div class="item[% available.size AND NOT dfv_errors ? 'hidden' : 'show' %]"
id="[% div_name %]">
<p class="info indent">Scan multiple vials consecutively (no spaces):</p>
<form action="[% app_url %]/storage/input/[% request.id %]" method="post" id="form">
<table class="indent">
<tbody>
<tr>
<td class="label" style="width: 120px">Vial ID(s):</td>
<td>
<label><input type="text" id="vialId" name="vialId" /></label>
</td>
<td class="borderless">
[% IF error_vialId; error_vialId; ELSIF NOT c.query.param('vialId') %]
<span id="vialId_result" class="error">
« place cursor here to scan barcode
</span>
[% END %]
</td>
</tr>
<tr>
<td class="label">Specimen:</td>
<td>
[% FOREACH s IN sample_codes; # PROCESS dumper.tt dump = s %]
<div>
<label>
<input type="radio" name="specimen" value="[% s %]"
[% IF sample_codes.size == 1; 'checked=1'; END %] />
[% s %]
</label>
</div>
[% END %]
</td>
<td class="borderless">[% error_specimen %]</td>
</tr>
<tr>
<td class="label">Sample:</td>
<td>
<label>
<input type="text" name="sample" placeholder="DNA, RNA, skin, etc"
id="sample" />
</label>
</td>
<td class="borderless">[% error_sample %]</td>
</tr>
<tr>
<td class="label">Source:</td>
<td>
<label>
<select name="source">
<option value="">-- select --</option>
[% FOREACH entry IN menu_options.source %]
<option value="[% entry %]">[% entry %]</option>
[% END %]
</select>
</label>
</td>
<td class="borderless">[% error_source %]</td>
</tr>
</tbody>
[% display = c.query.param('sample').match('[rd]na') ? 'visible' : 'none' %]
<tbody id="xna_fields" style="display:[% display %]">
<tr>
<td class="label">Volume:</td>
<td>
<label>
<input type="text" name="volume" placeholder="µL" />
</label>
</td>
<td class="borderless">[% error_volume %]</td>
</tr>
<tr>
<td class="label">Concentration:</td>
<td>
<label>
<input type="text" name="concentration" placeholder="ng/µL" />
</label>
</td>
<td class="borderless">[% error_concentration %]</td>
</tr>
<tr>
<td class="label"><div>Extraction</div><div>method:</div></td>
<td>
<label>
<select name="method">
<option value="">-- select --</option>
[% FOREACH entry IN menu_options.method %]
<option value="[% entry %]">[% entry %]</option>
[% END %]
</select>
</label>
</td>
<td class="borderless">[% error_method %]</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3" class="borderless">
<span class="indent">[% site.html.submit %] [% site.html.reset %]</span>
</td>
</tr>
</tfoot>
</table>
</form>
</div>
[% IF available.size %]
<h3 class="header">Output vial</h3>
[% IF error; # PROCESS dumper.tt dump = error %]
<p class="error">ERROR: [% error %]</p>
[% END %]
<form action="[% app_url %]/storage/output/[% request.id %]" method="post">
<div class="indent"
<p>
<span class="info">Available vials to sign out:</span>
[% available.join(', ') %]
</p>
<p>
<span class="bold">VialId:</span>
<label><input type="text" name="vialId" /></label>
[% IF error_vialId; error_vialId; ELSE %]
<span class="error">« place cursor here to scan barcode</span>
[% END %]
</p>
<p class="indent">
[% site.html.submit %]
</p>
</form>
[% END %]
<!-- done() needs jquery >= 1.5: -->
<script src="/js/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
// vialId field focus:
document.getElementById('form').vialId.focus();
// vialID validation:
$('#vialId').blur(function() { // alert("Handler for .blur() called.");
var formData = { 'id' : $('input[name=vialId]').val() };
var appMethod = "[% app_url %]/ajax/check_storage_vialId";
$.get( appMethod, formData ).done( function(result) {
$( "#vialId_result" ).text(result); // alert(result);
} );
});
</script>
<!-- END [% template.name %] -->