NINS_CODE/bahmniapps/common/concept-set/views/observation.html
travelershot 70dda814aa codepush
2024-12-12 22:37:39 +06:00

330 lines
25 KiB
HTML

<div class="observations-tab" ng-if="!observation.hide">
<div ng-if="!observation.voided || (observation.getControlType() == 'image' && observation.value)">
<div class="field-value" ng-switch="::observation.getControlType()" ng-class="{'field-value-buttonSelectType' :observation.getControlType()== 'buttonselect' || observation.getControlType()== 'grid'}">
<div class="concept-description" ng-if="::getBooleanResult(observation.previous)">
<span class="details" ng-bind-html="getStringValue(observation.previous)"></span>
</div>
<div ng-switch-when="image" class="consultation-image" ng-class="{'consultation-image-disabled': observation.disabled}">
<input id="file-browse-{{observation.uniqueId}}" class="file-browse" type="file" name="image" accept="application/pdf, image/*" capture="camera" ng-model="observation.value" image-upload patient-uuid="::patient.uuid" tabindex="1" observation="observation" root-observation="rootObservation">
<label class="placeholder" title="Upload your file" for="file-browse-{{observation.uniqueId}}" ng-hide="observation.value || observation.voided">
<i class="fa fa-upload" aria-hidden="true"></i>
</label>
<div ng-show="observation.value" class="file">
<img ng-if="observation.value && !hasPDFAsValue()" ng-src="{{observation.value|thumbnail}}" ng-class="{'has-image': observation.value, 'voided': observation.voided}">
<img ng-if="hasPDFAsValue()" ng-src="../../../../bahmni/images/pdfIcon.png" ng-class="{'has-image': observation.value, 'voided': observation.voided}">
<button type="button" ng-click="observation.toggleVoidingOfImage()" ng-if="observation.value" class="row-remover">
<span class="fa fa-remove"></span>
</button>
<button type="button" title="Undo Delete" class="undo-img-delete" ng-if="observation.voided" ng-click="observation.toggleVoidingOfImage()">
<span class="fa fa-undo"></span>
</button>
</div>
<textarea class="consultation-img-comments" placeholder="{{'CLINICAL_ADD_NOTES'|translate}}" ng-if="observation.value" maxlength="255" ng-model="observation.comment" msd-elastic tabindex="1">
</textarea>
</div>
</div>
</div>
<div class="vitals form-horizontal" ng-if="((observation.getControlType() != 'image' && !observation.voided) || ( observation.getControlType() == 'video') && observation.value)">
<fieldset class="leaf-observation-node" ng-if="::getBooleanResult(observation.isObservationNode)">
<div class="form-group" bm-pop-over ng-class="{'add-more-image' :observation.getControlType()== 'image'}">
<div class="concept-tooltip-description" bm-pop-over-target ng-if="::getBooleanResult(observation.primaryObs.concept.description)">
<i class="fa fa-caret-down"></i>
<span class="details" ng-bind-html="::observation.primaryObs.concept.description"></span>
</div>
<label class="control-label" ng-hide="observation.getControlType()== 'image'" ng-if="::showTitle" for="{{::observation.uniqueId}}">
<span ng-bind="::translatedLabel(observation)"></span>
<span ng-if="::getBooleanResult(observation.primaryObs.units)" ng-bind-html="::'(' + observation.primaryObs.units + ')'"></span>
<span ng-if="::observation.conceptUIConfig.required===true" class="asterick">*</span>
<i class="fa fa-question-circle concept-tooltip-trigger" bm-pop-over-trigger ng-if="::observation.primaryObs.concept.description">
</i>
</label>
<div class="field-value" ng-if="::observation.isComputed()">
<div class="compuptedValue" ng-class="{'is-abnormal': observation.abnormalObs.value}">
{{observation.value}}
</div>
</div>
<div class="field-value" ng-if="!observation.isComputed()" ng-switch="::observation.getControlType()" ng-class="{'field-value-buttonSelectType' :observation.getControlType()== 'buttonselect'}">
<div class="concept-description" ng-if="::getBooleanResult(observation.previous)">
<span class="details" ng-bind-html="observation.previous.value"></span>
</div>
<div ng-switch-when="html5InputDataType">
<div ng-include src="'../common/concept-set/views/observationDataTypes/html5DataType.html'"></div>
</div>
<div ng-switch-when="text" ng-if="::!observation.isConciseText()">
<div ng-include src="'../common/concept-set/views/observationDataTypes/textType.html'"></div>
</div>
<div ng-switch-when="text" ng-if="::observation.isConciseText()">
<div ng-include src="'../common/concept-set/views/observationDataTypes/conciseTextType.html'"></div>
</div>
<div ng-switch-when="dropdown" class="field-value info fa fa-info-sign">
<concept-dropdown on-change="update" ng-disabled="observation.disabled" model="observation.primaryObs.value" answers-concept-name="::observation.conceptUIConfig.answersConceptName" default-concept="observation.primaryObs.concept" on-invalid-class="'illegalValue'" is-valid="observation.isValid(atLeastOneValueIsSet,conceptSetRequired)">
</concept-dropdown>
</div>
<div ng-switch-when="freeTextAutocomplete">
<div ng-include src="'../common/concept-set/views/observationDataTypes/autocompleteFreeTextType.html'"></div>
</div>
<div ng-switch-when="buttonselect">
<div ng-include src="'../common/concept-set/views/observationDataTypes/buttonSelectType.html'"></div>
</div>
<div data-ng-controller="multiSelectObservationSearchController" ng-switch-when="autocompleteMultiSelect" class="autocompleteMultiSelect">
<tags-input ng-model="values" display-property="label" ng-blur="removeFreeTextItem()" key-property="name" on-tag-adding="setLabel($tag)" on-tag-added="addItem($tag)" on-tag-removed="removeItem($tag)" add-from-autocomplete-only="true" ng-class="{'illegalValue': !observation.isValid(atLeastOneValueIsSet, conceptSetRequired)}">
<auto-complete source="search($query)" min-length="2"></auto-complete>
</tags-input>
</div>
<div ng-switch-when="autocomplete" class="autocomplete">
<input ng-change="handleUpdate()" ng-disabled="observation.disabled" ng-model="observation.value" concept-autocomplete previous-value="observation.value" answers-concept-name="::observation.conceptUIConfig.answersConceptName" default-concept="observation.primaryObs.concept" strict-select="::true" ng-class="{
'computed-field': observation.isComputedAndEditable()
}"/>
</div>
<p ng-switch-default class="field-value info fa fa-info-sign"> The concept data type
'::{{observation.dataTypeName}}' is not supported yet.</p>
</div>
<hint concept-details="::observation.primaryObs.concept"/>
<div ng-class="{'accept-btn-wrap-smallScreen' : observation.unknownObs && observation.abnormalObs && !observation.isComputed() && !hideAbnormalButton}">
<div ng-if="observation.abnormalObs && !observation.isComputed() && !hideAbnormalButton" class="fl accept-btn-wrapper">
<button type="button" ng-model="observation.abnormalObs.value" class="small-btn accept-btn grid-row-element" ng-disabled="!observation.primaryObs.hasValue() || observation.disabled" ng-class="{'active': observation.abnormalObs.value}" ng-click="observation.toggleAbnormal(); handleUpdate()"><i class="fa fa-ok"></i>{{'OBS_ABNORMAL_TRANSLATE_KEY' | translate}}
</button>
</div>
<div ng-if="::observation.unknownObs" class="fl accept-btn-wrapper">
<button type="button" ng-model="observation.unknownObs.value" class="small-btn accept-btn grid-row-element" ng-disabled="observation.primaryObs.hasValue() && observation.primaryObs.atLeastOneValueSet() || observation.disabled" ng-class="{'active': observation.unknownObs.value}" ng-click="observation.toggleUnknown(); handleUpdate()"><i class="fa fa-ok"></i>{{'OBS_UNKNOWN_TRANSLATE_KEY' | translate}}
</button>
</div>
</div>
<div class="checkbox-inline" ng-if="::observation.durationObs" ng-class="{'duration': observation.durationObs, 'computed-field': observation.isComputedAndEditable()}">
<span class="for-separator fl">for</span>
<duration ng-model="observation.durationObs.value" disabled="!observation.primaryObs.hasValue()" illegal-value="observation.isDurationRequired() && observation.doesNotHaveDuration()"></duration>
</div>
<div class="fl" ng-include src="'../common/concept-set/views/observationDataTypes/removeClone.html'" ng-if="observation.getControlType() != 'video'"></div>
<div ng-include src="'../common/concept-set/views/observationDataTypes/addMore.html'" ng-if="observation.getControlType() != 'video'"></div>
<div ng-include src="'../common/concept-set/views/observationDataTypes/showComment.html'" ng-if="observation.getControlType() != 'video'"></div>
<div class="offset-label" ng-if="observation.showComment">
<label class="control-label"></label>
<div class="field-value">
<textarea class="obs-comment-section" maxlength="255" ng-model="observation.comment" placeholder="{{ 'NOTES_LABEL'|translate }}" tabindex="1" msd-elastic>
</textarea>
</div>
</div>
</div>
</fieldset>
<fieldset class="leaf-observation-node" ng-if="getBooleanResult(observation.isFormElement())">
<div class="form-group" bm-pop-over ng-class="{'add-more-image' :observation.getControlType()== 'image' , 'form-group-video' :observation.getControlType()== 'video'}">
<div class="concept-tooltip-description" bm-pop-over-target ng-if="::getBooleanResult(observation.concept.description)">
<i class="fa fa-caret-down"></i>
<span class="details" ng-bind-html="::observation.concept.description"></span>
</div>
<label class="control-label" ng-hide="observation.getControlType()== 'image'" ng-if="::showTitle" for="{{::observation.uniqueId}}">
<span ng-bind="::translatedLabel(observation)"></span>
<span ng-show="::getBooleanResult(observation.units)" ng-bind-html="::'(' + observation.units + ')'"></span>
<span ng-if="::observation.conceptUIConfig.required===true" class="asterick">*</span>
<i class="fa fa-question-circle concept-tooltip-trigger" bm-pop-over-trigger ng-if="::getBooleanResult(observation.concept.description)">
</i>
</label>
<div class="field-value" ng-switch="::observation.getControlType()" ng-class="{'field-value-buttonSelectType' :observation.getControlType()== 'buttonselect' || observation.getControlType()== 'grid'}">
<div class="concept-description" ng-if="::getBooleanResult(observation.previous)">
<span class="details" ng-bind-html="getStringValue(observation.previous)"></span>
</div>
<div ng-switch-when="html5InputDataType">
<div ng-include src="'../common/concept-set/views/observationDataTypes/html5DataType.html'"></div>
</div>
<div ng-switch-when="text" ng-if="::!observation.isConciseText()">
<div ng-include src="'../common/concept-set/views/observationDataTypes/textType.html'"></div>
</div>
<div ng-switch-when="text" ng-if="::observation.isConciseText()">
<div ng-include src="'../common/concept-set/views/observationDataTypes/conciseTextType.html'"></div>
</div>
<div ng-switch-when="freeTextAutocomplete">
<div ng-include src="'../common/concept-set/views/observationDataTypes/autocompleteFreeTextType.html'"></div>
</div>
<div ng-switch-when="buttonselect">
<div ng-include src="'../common/concept-set/views/observationDataTypes/buttonSelectType.html'"></div>
</div>
<div ng-switch-when="datetime">
<datetimepicker model="observation.value" observation="::observation" ng-blur="handleUpdate()" allow-future-dates="(observation.conceptUIConfig && observation.conceptUIConfig.allowFutureDates)" show-time="::true" illegal-value="!observation.isValid(atLeastOneValueIsSet, conceptSetRequired)"></datetimepicker>
</div>
<div ng-switch-when="grid">
<div ng-repeat="member in ::observation.groupMembers track by $index" class="grid-row" ng-class="{'illegalValue': !observation.isValid(atLeastOneValueIsSet, conceptSetRequired)}">
<button-select observation="member"></button-select>
</div>
</div>
<div ng-switch-when="video" class="consultation-video" ng-disabled="observation.voided">
<input id="file-browse-{{observation.uniqueId}}" class="file-browse" type="file" name="video" accept=".mkv,.flv,.ogg,video/*,audio/3gpp" capture="camera" ng-model="observation.value" image-upload file-type="'video'" patient-uuid="::patient.uuid" tabindex="1">
<label class="placeholder" for="file-browse-{{observation.uniqueId}}" ng-hide="observation.value">Upload Video</label>
<div ng-if="observation.value" class="fl">
<video class="video" controls preload="metadata" ng-class="{'disable': observation.voided}">
<source ng-src="{{'/document_images/' + observation.value}}">
Your browser does not support the video tag.
</video>
<!--<a href="{{'/document_images/' + observation.value}}" download>download video</a>-->
</div>
<div class="file-remove fl">
<button type="button" toggle="observation.voided" ng-if="observation.value" class="row-remover"><span ng-class="{'fa fa-remove': !observation.voided, 'fa fa-undo': observation.voided }"></span>
</button>
</div>
<div class="button-wrap-video fr">
<div ng-if="isRemoveValid(observation)" ng-include src="'../common/concept-set/views/observationDataTypes/removeClone.html'" class="fl"></div>
<div ng-include src="'../common/concept-set/views/observationDataTypes/addMore.html'" class="fl"></div>
<button type="button" toggle="observation.showComment" ng-if="observation.value" class="comment-toggle fr" tabindex="-1" ng-class="{'has-notes': observation.comment}">
<i class="fa fa-file-o">
<i class="fa fa-plus-circle"></i>
<i class="fa fa-minus-circle"></i>
</i>
<i class="fa fa-file-text-o"></i>
</button>
</div>
<textarea class="consultation-img-comments" ng-if="observation.showComment" maxlength="255" ng-model="observation.comment" msd-elastic>
</textarea>
</div>
<div ng-switch-when="dropdown" class="field-value info fa fa-info-sign">
<concept-dropdown on-change="update" ng-disabled="observation.disabled" model="observation.value" answers-concept-name="::observation.conceptUIConfig.answersConceptName" default-concept="::observation.concept" on-invalid-class="'illegalValue'" is-valid="observation.isValid(atLeastOneValueIsSet,conceptSetRequired)">
</concept-dropdown>
</div>
<div data-ng-controller="multiSelectObservationSearchController" ng-switch-when="autocompleteMultiSelect" class="autocompleteMultiSelect">
<tags-input ng-model="values" display-property="label" ng-blur="removeFreeTextItem()" key-property="name" on-tag-adding="setLabel($tag)" on-tag-added="addItem($tag)" on-tag-removed="removeItem($tag)" add-from-autocomplete-only="true" ng-class="{'illegalValue': !observation.isValid(atLeastOneValueIsSet, conceptSetRequired)}">
<auto-complete source="search($query)" min-length="2"></auto-complete>
</tags-input>
</div>
<div ng-switch-when="autocomplete">
<input ng-change="handleUpdate()" ng-disabled="observation.disabled" ng-model="observation.autocompleteValue" concept-autocomplete illegal-value="!observation.isValid(atLeastOneValueIsSet,conceptSetRequired)" previous-value="observation.autocompleteValue" answers-concept-name="::observation.conceptUIConfig.answersConceptName" default-concept="::observation.concept" strict-select="true" ng-class="{
'computed-field': observation.isComputedAndEditable(),
'illegalValue': !observation.isValid(atLeastOneValueIsSet,conceptSetRequired)
}"/>
</div>
<p ng-switch-default class="field-value info fa fa-info-sign"> The concept data type
'{{::observation.dataTypeName}}' is not supported yet.</p>
</div>
<hint concept-details="::observation.concept"/>
<div ng-if="observation.getControlType() != 'video'">
<div class="fl" ng-if="isRemoveValid(observation)" ng-include src="'../common/concept-set/views/observationDataTypes/removeClone.html'"></div>
<div ng-include src="'../common/concept-set/views/observationDataTypes/addMore.html'"></div>
</div>
<button ng-if="::observation.canHaveComment()" type="button" toggle="observation.showComment" ng-blur="handleUpdate()" ng-disabled="observation.disabled" class="comment-toggle fr" tabindex="-1" ng-class="{'has-notes': observation.comment}">
<i class="fa fa-file-o">
<i class="fa fa-plus-circle"></i>
<i class="fa fa-minus-circle"></i>
</i>
<i class="fa fa-file-text-o"></i>
</button>
<div ng-if="::observation.canHaveComment()" class="offset-label">
<label class="control-label"></label>
<div class="field-value" ng-if="observation.showComment">
<textarea class="obs-comment-section" maxlength="255" ng-model="observation.comment" placeholder="{{ 'NOTES_LABEL'|translate }}" msd-elastic>
</textarea>
</div>
</div>
</div>
</fieldset>
<fieldset class="leaf-observation-node" ng-if="::(observation.getControlType() == 'tabular')">
<div>
<table>
<caption ng-bind="::observation.label"></caption>
<thead>
<tr>
<th ng-repeat="column in ::observation.columns track by $index">
<div class="form-group" bm-pop-over>
<div class="concept-tooltip-description" bm-pop-over-target ng-if="::getBooleanResult(column.description)" ng-class="{'concept-tooltip-tabular-observation' : observation.getControlType() == 'tabular'}">
<i class="fa fa-caret-down"></i>
<span class="details" ng-bind-html="::column.description"></span>
</div>
<strong>
<span ng-bind="column.shortName || column.name"></span>
<span ng-if="::getBooleanResult(column.units)" ng-bind-html="::'(' + column.units + ')'"></span>
<i class="fa fa-question-circle concept-tooltip-trigger" bm-pop-over-trigger ng-if="::getBooleanResult(column.description)">
</i>
</strong>
</div>
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in observation.rows track by $index">
<td ng-repeat="obs in row.cells track by $index">
<concept collapse-inner-sections="collapseInnerSections" observation="obs" root-observation="row" at-least-one-value-is-set="atLeastOneValueIsSet" patient="::patient" show-title="::false" concept-set-required="conceptSetRequired" concept-set-name="::conceptSetName" hide-abnormal-button="hideAbnormalButton"></concept>
</td>
<td ng-if="::observation.canAddMore()">
<button type="button" class="add-more-btn btn-small" ng-click="observation.addNew(row)">
<i class="fa fa-plus-circle"></i> {{::'ADD_MORE_KEY' | translate}}
</button>
<i class="fa fa-remove" ng-confirm-click="observation.remove(row)" confirm-message="{{ ::'REMOVE_CONFIRMATION_KEY' | translate }}"></i>
</td>
</tr>
</tbody>
</table>
</div>
</fieldset>
<fieldset ng-if="(!observation.isObservationNode && !observation.isFormElement() && observation.getControlType()!='tabular')" class="hasLegend" ng-class="{'collapsible-set': isCollapsibleSet(), 'collapsed': collapse}" scroll-to-obs-element="{{ observation.scrollToElement }}">
<legend ng-if="::(showTitle && !observation.isComputed())" class="mylegend" ng-click="toggleSection()">
<i ng-if="isCollapsibleSet() && collapse" class="fa fa-caret-right"></i>
<i ng-if="!(isCollapsibleSet() && collapse)" class="fa fa-caret-down"></i>
<strong>{{observation.label}}</strong>
<span class="fl" ng-include src="'../common/concept-set/views/observationDataTypes/removeClone.html'"></span>
<span ng-if="::(observation.canAddMore && observation.canAddMore())" class="add-more" ng-if="observation.getControlType() != 'video'">
<button id="{{observation.assignAddMoreButtonID()}}" type="button" class="add-more-btn btn-small" ng-click="$event.stopPropagation(cloneNew(observation, rootObservation))">
<i class="fa fa-plus"></i> {{::'ADD_SECTION_KEY' | translate}}
</button>
</span>
</legend>
<div ng-if="::observation.isComputed()">
<label class="control-label" for="{{::observation.uniqueId}}">
<span ng-bind="::observation.label"></span>
<i class="fa fa-question-circle concept-tooltip-trigger" bm-pop-over-trigger ng-if="::getBooleanResult(observation.primaryObs.concept.description)"></i>
</label>
<span>{{observation.value}}</span>
</div>
<div class="form-group" ng-if="::!observation.isComputed()">
<div ng-hide="isCollapsibleSet() && collapse">
<div class="concept-set-description" ng-if="::getBooleanResult(observation.concept.description)">
<span class="description" ng-bind-html="observation.concept.description"></span>
</div>
<div class="form-field form-field-group" ng-repeat="member in observation.groupMembers" ng-if="!(member.hidden || member.hide)" ng-class="{'image-upload-wrapper': member.concept.name == 'Image'}">
<concept collapse-inner-sections="collapseInnerSections" observation="member" root-observation="observation" at-least-one-value-is-set="atLeastOneValueIsSet" patient="::patient" show-title="::true" concept-set-required="conceptSetRequired" concept-set-name="::conceptSetName" hide-abnormal-button="hideAbnormalButton"></concept>
</div>
</div>
</div>
</fieldset>
</div>
</div>