{# GENERATED by FlaskForge Core 0.36.0 from resolved page pg_02bb8e2f — do not edit.
   Each .row below corresponds 1:1 to a layout row in the resolved IR.
   Injection point: custom/patient_form_extra.html (before buttons). #}
{% extends "base.html" %}
{% block title %}{{ "Edit Patient" if obj else "New Patient" }}{% endblock %}

{% block content %}
<h1 class="h3 mb-4">{{ "Edit Patient" if obj else "New Patient" }}</h1>

<form method="post" enctype="multipart/form-data" novalidate>
  {{ form.hidden_tag() }}
  {% for e in form.form_errors %}<div class="alert alert-danger">{{ e }}</div>{% endfor %}

  <div class="row mb-3">
    <div class="col-md-6">
      <label class="form-label" for="{{ form.first_name.id }}">{{ form.first_name.label.text }}</label>
      {{ form.first_name(class="form-control" + (" is-invalid" if form.first_name.errors else "")) }}
      {% for e in form.first_name.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
    </div>
    <div class="col-md-6">
      <label class="form-label" for="{{ form.last_name.id }}">{{ form.last_name.label.text }}</label>
      {{ form.last_name(class="form-control" + (" is-invalid" if form.last_name.errors else "")) }}
      {% for e in form.last_name.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
    </div>
  </div>

  <div class="row mb-3">
    <div class="col-md-4">
      <label class="form-label" for="{{ form.date_of_birth.id }}">{{ form.date_of_birth.label.text }}</label>
      {{ form.date_of_birth(class="form-control" + (" is-invalid" if form.date_of_birth.errors else "")) }}
      {% for e in form.date_of_birth.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
    </div>
    <div class="col-md-4">
      <label class="form-label" for="{{ form.phone.id }}">{{ form.phone.label.text }}</label>
      {{ form.phone(class="form-control" + (" is-invalid" if form.phone.errors else "")) }}
      {% for e in form.phone.errors %}<div class="invalid-feedback">{{ e }}</div>{% endfor %}
    </div>
    <div class="col-md-4 d-flex align-items-end">
      <div class="form-check">
        {{ form.active(class="form-check-input") }}
        <label class="form-check-label" for="{{ form.active.id }}">{{ form.active.label.text }}</label>
      </div>
    </div>
  </div>

  <div class="row mb-3">
    <div class="col-md-6">
      <label class="form-label" for="{{ form.clinician_id.id }}">{{ form.clinician_id.label.text }}</label>
      <input type="search" class="form-control form-control-sm mb-1 ff-rel-search" data-target="{{ form.clinician_id.id }}" data-url="{{ url_for('patients.patient_form_clinician_choices') }}" placeholder="Search related records…" autocomplete="off">
      {{ form.clinician_id(class="form-select ff-rel-select") }}
      <div class="form-text">Primary clinician responsible for this patient.</div>
    </div>
  </div>

  <div class="row mb-3">
    <div class="col-md-6">
      <label class="form-label" for="{{ form.care_team.id }}">{{ form.care_team.label.text }}</label>
      <input type="search" class="form-control form-control-sm mb-1 ff-rel-search" data-target="{{ form.care_team.id }}" data-url="{{ url_for('patients.patient_form_care_team_choices') }}" placeholder="Search related records…" autocomplete="off">
      {{ form.care_team(class="form-select ff-rel-select") }}
    </div>
  </div>

  {% include "custom/patient_form_extra.html" ignore missing %}

  <div class="mt-4">
    <a class="btn btn-outline-secondary" href="{{ url_for('patients.patients_list') }}">Cancel</a>
    <button type="submit" class="btn btn-primary">Save</button>
  </div>
</form>
<script>
(() => {
  document.querySelectorAll('.ff-rel-search').forEach(input => {
    const select = document.getElementById(input.dataset.target);
    if (!select) return;
    let timer = null;
    input.addEventListener('input', () => {
      clearTimeout(timer);
      timer = setTimeout(async () => {
        const q = input.value.trim();
        if (q.length === 1) return;
        try {
          const r = await fetch(input.dataset.url + '?q=' + encodeURIComponent(q), {headers:{'Accept':'application/json'}});
          if (!r.ok) return;
          const rows = await r.json();
          const selected = new Map(Array.from(select.selectedOptions).map(o => [String(o.value), o.textContent]));
          const blank = Array.from(select.options).find(o => String(o.value) === '0');
          select.innerHTML = '';
          if (blank) select.add(new Option(blank.textContent, '0', false, false));
          for (const [id, text] of selected) if (id !== '0') select.add(new Option(text, id, true, true));
          for (const row of rows) if (!selected.has(String(row.id))) select.add(new Option(row.text, row.id));
        } catch (_) { /* keep existing choices when search is unavailable */ }
      }, 220);
    });
  });
})();
</script>
{% endblock %}