{% load forms %}
<div class="modal-header">
  <button type="button" class="close" ng-click="cancel()">×</button>
  <h3>
    <i class="glyphicon glyphicon-plus"></i>
    New Episode
  </h3>
</div>
<div class="modal-body">
  <form class="form-horizontal" name="newEpisodeForm">


	<div class="form-group">
	  <label class="control-label col-sm-3">Hospital Number</label>
      <label class="control-label col-sm-8 text-left">
        [[ editing.demographics.hospital_number ]]
      </label>
	</div>

    {% input "autofocus" label="Name" model="editing.demographics.name" %}

	<div class="form-group">
	  <label class="control-label col-sm-3">Date of birth</label>
	  <div class="col-sm-8">
		<input class="form-control"
               type="text"
               name="date_of_birth"
			   ng-model="editing.demographics.date_of_birth"
         ng-model-options="{ updateOn: 'blur' }"
			   ng-pattern="/^(0?[1-9]|[12][0-9]|3[01])\/(0?[1-9]|1[012])\/(\d{4})$/"
			   placeholder="dd/mm/yyyy" />
        <span class="help-block" ng-show="newEpisodeForm.date_of_birth.$invalid">
          Date of Birth must be dd/mm/yyyy
        </span>
	  </div>
	</div>

    {% select label="Category" model="editing.location.category" lookuplist="episode_category_list" %}
    {% select label="Hospital" model="editing.location.hospital" lookuplist="hospital_list" %}
    {% input label="Ward" model="editing.location.ward" %}
    {% input label="Bed" model="editing.location.bed" %}
    {% datepicker label="Date of admission" model="editing.date_of_admission" %}

    {% include 'partials/_teams_form.html' %}
  </form>
</div>
<div class="modal-footer">
  <button class="btn btn-primary" ng-click="save()" ng-disabled="newEpisodeForm.date_of_birth.$invalid">
    <i class="fa fa-save"></i>
    Save record
  </button>
  <button class="btn" ng-click="cancel()">Cancel</button>
</div>
