Mobile Menu

Patient Banner

Patient banner shows the active patient selected in the system.

Jake Testerson
Male
15/03/1984 (37)
NHS 999-999-999
CRN: 12345678
Inpatient Click for Alerts

Alerts

  • Smoker
  • Diabetes
  • Fabulous

Contact

07444 444 444
Address
4 Abbots Close
Fleet
GU51 3RF

Next of Kin

Name: Nick Testerson
Relationship: Partner

Address
4 Abbots Close
Fleet
GU51 3RF

GP

Best Test GP Surgery
02920 202020
Address
5 Strathy Rd
St. Mellons
Cardiff
CF3 0SH
<div class="pt-banner">
  <div id="pt-name">Jake Testerson</div>
  <div id="pt-crn">Male<br />
    15/03/1984 (37)
  </div>
  <div id="pt-nhs">NHS 999-999-999<br />
    CRN: 12345678
  </div>
  <div id="pt-alerts">
    <span class="nhs-tag nhs-light-grey">Inpatient</span>
    <span class="nhs-tag nhs-red">
      <i class="fas fa-exclamation"></i> Click for Alerts</span>
  </div>
</div>

<div class="pt-banner-ext">
  <div class="nhs-grid">
    <div id="pt-ext1">
      <h4>Alerts</h4>
      <ul>
        <li>Smoker</li>
        <li>Diabetes</li>
        <li>Fabulous</li>
      </ul>
    </div>
    <div id="pt-ext2">
      <h4>Contact</h4>
      <i class="fas fa-phone-alt"></i> 07444 444 444
      <h5>Address</h5>
      4 Abbots Close<br />
      Fleet<br />
      GU51 3RF
    </div>
    <div id="pt-ext3">
      <h4>Next of Kin</h4>
      <p>
        Name: Nick Testerson<br />
        Relationship: Partner<br />
      </p>
      <h5>Address</h5>
      4 Abbots Close<br />
      Fleet<br />
      GU51 3RF
    </div>
    <div id="pt-ext4">
      <h4>GP</h4>
      Best Test GP Surgery<br />
      <i class="fas fa-phone-alt"></i> 02920 202020
      <h5>Address</h5>
      5 Strathy Rd<br />
      St. Mellons<br />
      Cardiff<br />
      CF3 0SH
    </div>
  </div>
</div>

<script>
  var acc = document.getElementsByClassName("pt-banner");
  var i;

  for (i = 0; i < acc.length; i++) {
    acc[i].addEventListener("click", function() {
      var panel = this.nextElementSibling;
      if (panel.style.display === "block") {
        panel.style.display = "none";
      } else {
        panel.style.display = "block";
      }
    });
  }
</script>