{% load forms %}
{% datetimepicker field="Observation.datetime" %}

<div ng-class="{'has-error': form.diastolic.$error.pattern || form.bp_systolic.$error.pattern}" class="form-group">
  <label class="control-label col-sm-3">BP</label>
  <div class="col-sm-4">
    <input class="form-control" type="text"
           placeholder="Systolic"
           ng-pattern="/^[0-9\.]+$/"
           name="bp_systolic"
           ng-model="editing.observation.bp_systolic" />
   <span class="help-block" ng-show="form.bp_systolic.$error.pattern">
     Systolic must be a number
   </span>
  </div>
  <div class="col-sm-4">
    <input class="form-control" type="text"
           placeholder="Diastolic"
           ng-pattern="/^[0-9\.]+$/"
           ng-model="editing.observation.bp_diastolic"
           name="diastolic"
           />
     <span class="help-block" ng-show="form.diastolic.$error.pattern">
       Diastolic must be a number
     </span>
  </div>
</div>


<div ng-class="{'has-error': form.pulse.$error.pattern}" class="form-group">
  <div class="row">
    <div class="col-md-12">
      <label class="control-label col-sm-3">Pulse</label>
      <div class="col-sm-2">
        <input class="form-control" type="text" name="pulse" ng-model="editing.observation.pulse" ng-pattern="/^[0-9\.]+$/">
      </div>
      <label class="control-label"><small>(beats/min)</small></label>
    </div>
  </div>
  <div class="row">
    <div class="col-md-9 col-md-push-3">
      <span class="help-block" ng-show="form.pulse.$error.pattern">
        Pulse must be a number
      </span>
    </div>
  </div>
</div>

<div ng-class="{'has-error': form.resp_rate.$error.pattern}" class="form-group">
  <div class="row">
    <div class="col-md-12">
      <label class="control-label col-sm-3">Resp rate</label>
      <div class="col-sm-2">
        <input class="form-control" type="text" name="resp_rate" ng-model="editing.observation.resp_rate" ng-pattern="/^[0-9\.]+$/">
      </div>
      <label class="control-label"><small>(breaths/min)</small></label>
    </div>
  </div>
  <div class="row">
    <div class="col-md-9 col-md-push-3">
      <span class="help-block" ng-show="form.resp_rate.$error.pattern">
        Resp rate must be a number
      </span>
    </div>
  </div>
</div>


<div ng-class="{'has-error': form.sp02.$error.pattern}" class="form-group">
  <div class="row">
    <div class="col-md-12">
      <label class="control-label col-sm-3">Sp02</label>
      <div class="col-sm-2">
        <input class="form-control" type="text" name="sp02" ng-model="editing.observation['sp02']" ng-pattern="/^[0-9\.]+$/">
      </div>
      <label class="control-label"><small>(%)</small></label>
    </div>
  </div>
  <div class="row">
    <div class="col-md-9 col-md-push-3">
      <span class="help-block" ng-show="form.sp02.$error.pattern">
        Sp02 rate must be a number
      </span>
    </div>
  </div>
</div>


<div ng-class="{'has-error': form.temperature.$error.pattern}" class="form-group">
  <div class="row">
    <div class="col-md-12">
      <label class="control-label col-sm-3">Temperature</label>
      <div class="col-sm-2">
        <input class="form-control" type="text" name="temperature" ng-model="editing.observation.temperature" ng-pattern="/^[0-9\.]+$/">
      </div>
      <label class="control-label"><small>(&deg; C)</small></label>
    </div>
  </div>
  <div class="row">
    <div class="col-md-9 col-md-push-3">
      <span class="help-block" ng-show="form.temperature.$error.pattern">
        Temperature must be a number
      </span>
    </div>
  </div>
</div>

<div ng-class="{'has-error': form.height.$error.pattern}" class="form-group">
  <div class="row">
    <div class="col-md-12">
      <label class="control-label col-sm-3">Height</label>
      <div class="col-sm-2">
        <input class="form-control" type="text" name="height" ng-model="editing.observation.height" ng-pattern="/^[0-9\.]+$/">
      </div>
      <label class="control-label"><small>(cm)</small></label>
    </div>
  </div>
  <div class="row">
    <div class="col-md-9 col-md-push-3">
      <span class="help-block" ng-show="form.height.$error.pattern">
        Height must be a number
      </span>
    </div>
  </div>
</div>


<div ng-class="{'has-error': form.weight.$error.pattern}" class="form-group">
  <div class="row">
    <div class="col-md-12">
      <label class="control-label col-sm-3">Weight</label>
      <div class="col-sm-2">
        <input class="form-control" type="text" name="weight" ng-model="editing.observation.weight" ng-pattern="/^[0-9\.]+$/">
      </div>
      <label class="control-label"><small>(kg)</small></label>
    </div>
  </div>
  <div class="row">
    <div class="col-md-9 col-md-push-3">
      <span class="help-block" ng-show="form.weight.$error.pattern">
        Weight must be a number
      </span>
    </div>
  </div>
</div>