Breast features review later

app/views/_includes/workflow/workflow-side-navigation.njk

@@ -17,7 +17,7 @@
 {% set workflowSteps = [
   { id: 'confirm-identity', label: 'Confirm identity' },
   { id: 'review-medical-information', label: 'Review medical information' },
-  { id: 'take-images', label: 'Take images' },
+  { id: 'take-images', label: 'Take mammogram images' },
   { id: 'check-information', label: 'Check information' }
 ] %}
 

app/views/appointments/images-manual.html

@@ -4,7 +4,7 @@
 {% set hideBackLink = true %}
 {% set activeWorkflowStep = 'take-images' %}
 
-{% set pageHeading = "Manually record image information" %}
+{% set pageHeading = "Take mammogram images" %}
 
 {% set gridColumn = "nhsuk-grid-column-two-thirds" %}
 

app/views/events/images-automatic.html

@@ -0,0 +1,136 @@
+{% extends 'layout-appointment.html' %}
+
+{% set imageCount = event.mammogramData.metadata.totalImages %}
+
+{% set pageHeading = "Take mammogram images" %}
+
+{% set mammogramSource = event.mammogramData %}
+{% set namePrefix = "event[mammogramData]" %}
+
+{% set showNavigation = true %}
+{% set activeWorkflowStep = 'take-images' %}
+{% set hideBackLink = true %}
+
+{# {% set hideBackLink = true %} #}
+
+
+{% set gridColumn = "nhsuk-grid-column-full" %}
+{% set formAction = './imaging-answer' %}
+
+{% set activeTab = 'images' %}
+
+{% set mammogramImages = getImagesForEvent(eventId, "diagrams", { event: event }) %}
+
+{# Build ordered image list for streaming simulation - bookmatched arrival order #}
+{# CC first: RCC > RMLO > LMLO > LCC (right side then left mirrored) #}
+{# MLO first: RMLO > RCC > LCC > LMLO #}
+{% if data.settings.mammogramViewOrder == 'mlo-first' %}
+  {% set streamViewOrder = ['rmlo', 'rcc', 'lcc', 'lmlo'] %}
+{% else %}
+  {% set streamViewOrder = ['rcc', 'rmlo', 'lmlo', 'lcc'] %}
+{% endif %}
+
+{% set streamingImages = [] %}
+{% if mammogramImages and mammogramImages.allPaths %}
+  {% for viewKey in streamViewOrder %}
+    {% set paths = mammogramImages.allPaths[viewKey] %}
+    {% if paths %}
+      {% if paths is string %}
+        {% set streamingImages = streamingImages | push({ view: viewKey | upper, src: paths }) %}
+      {% else %}
+        {% for path in paths %}
+          {% set streamingImages = streamingImages | push({ view: viewKey | upper, src: path }) %}
+        {% endfor %}
+      {% endif %}
+    {% endif %}
+  {% endfor %}
+{% endif %}
+
+{% block pageContent %}
+
+  <h1>{{ pageHeading }}</h1>
+
+
+
+  {% if data.event.workflowStatus["take-images"] == 'completed' %}
+    {{ button({
+      text: "Next section",
+      classes: "nhsuk-u-margin-bottom-1"
+    }) }}
+  {% endif %}
+
+  {% set insetTextHtml %}
+    {% if data.settings.screening.imageStreaming.enabled != 'false' and data.event.workflowStatus['take-images'] != 'completed' %}
+      <p>Receiving images&#8230;
+        <span id="streaming-received-count">0 received</span>
+      </p>
+    {% else %}
+      <p>{{ imageCount }} images have been received</p>
+    {% endif %}
+  {% endset %}
+
+  {{ insetText({
+    html: insetTextHtml
+  }) }}
+
+  {# Convert object to an array of views and get machine room #}
+  {% set mammogramViews = event.mammogramData.views | getObjectValues %}
+  {% set machineRoom = event.mammogramData.machineRoom %}
+
+  {# Show notice if any view has multiple images - repeats will be captured on the next page #}
+  {% set hasMultipleImages = false %}
+  {% for view in mammogramViews %}
+    {% if (view.images | length) > 1 %}
+      {% set hasMultipleImages = true %}
+    {% endif %}
+  {% endfor %}
+
+  {# Display images in two breast cards #}
+  {% set thumbnailSize = "large" %}
+  {% set hideAdditionalDetails = true %}
+  {% include "_includes/mammogram-image-cards.njk" %}
+
+  <p><a href="#">View imported image metadata</a></p>
+
+  <hr class="nhsuk-section-break nhsuk-section-break--m nhsuk-section-break--visible nhsuk-u-margin-top-0">
+
+  <div class="nhsuk-grid-row">
+    <div class="nhsuk-grid-column-two-thirds">
+
+      {% if hasMultipleImages %}
+        {% set repeatsInsetHtml %}
+          <p>Repeat or extra image details captured on the next screen</p>
+        {% endset %}
+        {{ insetText({ html: repeatsInsetHtml }) }}
+      {% endif %}
+
+
+      <h2>Additional details</h2>
+
+      {% set namePrefix = "event[mammogramData]" %}
+      {% set mammogramSource = event.mammogramData %}
+      {% include "_includes/additional-image-details.njk" %}
+
+      {{ button({
+        text: "Confirm all images received"
+      }) }}
+
+    </div>
+  </div>
+
+  {% include "_includes/images/image-troubleshooting.njk" %}
+
+{% endblock %}
+
+{% block pageScripts %}
+  <script type="application/json" id="image-streaming-config">
+    {
+      "enabled": {{ 'false' if data.settings.screening.imageStreaming.enabled == 'false' else 'true' }},
+      "alreadyReceived": {{ 'true' if data.event.workflowStatus['take-images'] == 'completed' else 'false' }},
+      "intervalMs": {{ data.settings.screening.imageStreaming.intervalMs if data.settings.screening.imageStreaming.intervalMs else 3000 }},
+      "totalImages": {{ imageCount }},
+      "images": {{ streamingImages | dump | safe }}
+    }
+  </script>
+  <script type="module" src="/assets/javascript/image-streaming.js"></script>
+{% endblock %}

app/views/events/images-before-mammography.html

@@ -0,0 +1,48 @@
+
+{% extends 'layout-appointment.html' %}
+
+
+{% set pageHeading = "Take mammogram images" %}
+{% set showNavigation = true %}
+{% set activeWorkflowStep = 'take-images' %}
+{% set hideBackLink = true %}
+
+{% set formAction = './images-automatic' %}
+
+{% set activeTab = 'images' %}
+
+{% block pageContent %}
+
+  <h1>{{ pageHeading }}</h1>
+
+  {% set insetHtml %}
+    <p>
+      Mammography images will appear below once they have been received
+    </p>
+  {% endset %}
+
+  {{ insetText({
+    html: insetHtml
+  }) }}
+
+
+  {{ appHiddenInput({
+    name: "event[workflowStatus][awaiting-images]",
+    value: "completed"
+  }) }}
+
+  <p class="app-suppress-link-styles">
+    <button class="app-button-link" type="submit">
+      Loading images...
+    </button>
+    {# <a href="./images?event[workflowStatus][awaiting-images]=completed">
+      <span class="">Loading images...</span>
+    </a> #}
+  </p>
+
+  {% include "_includes/images/image-troubleshooting.njk" %}
+
+
+{% endblock %}
+
+

app/views/events/images-manual.html

@@ -0,0 +1,178 @@
+{% extends 'layout-appointment.html' %}
+
+{% set showNavigation = true %}
+{% set hideBackLink = true %}
+{% set activeWorkflowStep = 'take-images' %}
+
+{% set pageHeading = "Take mammogram images" %}
+
+{% set gridColumn = "nhsuk-grid-column-two-thirds" %}
+
+{% set formAction = './images-manual-answer' %}
+
+{% set activeTab = 'images' %}
+
+{% block pageContent %}
+
+  <h1>{{ pageHeading }}</h1>
+
+  {% set mammogramSource = event.mammogramDataTemp or event.mammogramData %}
+
+  {# Determine current room name #}
+  {% set currentRoomName = "" %}
+  {% set isMobileClinic = (clinic.location.type == 'mobile_unit') %}
+
+  {% if isMobileClinic %}
+    {# For mobile clinics, use the mobile unit name #}
+    {% set currentRoomName = clinic.location.name %}
+  {% else %}
+    {# For hospital clinics, look up the room from screening rooms #}
+    {% for room in data.screeningRooms %}
+      {% if room.id == data.currentScreeningRoom %}
+        {% set currentRoomName = room.displayName %}
+      {% endif %}
+    {% endfor %}
+  {% endif %}
+
+  {% if currentRoomName %}
+    <p>
+      Mammogram location: <span class="nhsuk-u-font-weight-bold">{{ currentRoomName }}</span>.
+      {% if not isMobileClinic %}
+        <br><a href="{{ './images-room-selection' | urlWithReferrer(referrerChain) }}">Change room or machine details</a>
+      {% endif %}
+    </p>
+
+    {{ appHiddenInput({
+      name: "event[mammogramDataTemp][machineRoom]",
+      value: currentRoomName
+    }) }}
+  {% else %}
+    <p>
+      <a href="{{ './images-room-selection' | urlWithReferrer(referrerChain) }}">Select a room before continuing</a>
+    </p>
+  {% endif %}
+
+  {# {{ radios({
+    name: "event[mammogramDataTemp][machineRoom]",
+    value: mammogramSource.machineRoom,
+    idPrefix: "machineRoom",
+    fieldset: {
+      legend: {
+        text: "Which room is imaging being done in?",
+        size: "m",
+        isPageHeading: false
+      }
+    },
+    items: [
+      {
+        value: "Room A - machine XYZ",
+        text: "Room A - machine XYZ"
+      },
+      {
+        value: "Room B - machine ABC",
+        text: "Room B - machine ABC"
+      },
+      {
+        value: "Room C - machine DEF",
+        text: "Room C - machine DEF"
+      }
+    ]
+  }) }} #}
+
+  {# Show unscheduled-appointment setup details whenever the appointment is
+     being handled in manual image collection mode. The reason-for-switching
+     input is only shown when the user manually switched mid-appointment via
+     the troubleshooting link on the automatic images page (failover). #}
+  {% set isManualFailover = event.mammogramDataTemp.isManualFailover %}
+  {% set troubleshootingIssue = event.mammogramDataTemp.troubleshootingIssue %}
+  {% set hasTroubleshootingIssue = troubleshootingIssue in ['worklist-participant', 'wrong-image-count', 'incorrect-image-labels'] %}
+  {% set showWorklistMatchingContent = troubleshootingIssue == 'worklist-participant' %}
+  {% set showDefaultManualContent = data.settings.screening.manualImageCollection == 'true' or data.event.isManualImageCollection or isManualFailover %}
+
+  {% if (hasTroubleshootingIssue and showWorklistMatchingContent) or (not hasTroubleshootingIssue and showDefaultManualContent) %}
+    <h2>Manually add participant details</h2>
+    <p>Set up an unscheduled appointment using the following information so mammograms can be assigned correctly:</p>
+    {{ summaryList({
+      rows: [
+        {
+          key: { html: "<span class='app-nowrap'>Accession number</span>" },
+          value: { html: '<span class="nhsuk-u-font-code nhsuk-u-nowrap">' + (event.accessionNumber | formatAccessionNumber) + '</span>' }
+        },
+        {
+          key: { text: "NHS number" },
+          value: { html: '<span class="nhsuk-u-font-code nhsuk-u-nowrap">' + (participant.medicalInformation.nhsNumber | formatNhsNumber) + '</span>' }
+        },
+        {
+          key: { text: "First names" },
+          value: { text: participant | getFirstNames }
+        },
+        {
+          key: { text: "Last name" },
+          value: { text: participant.demographicInformation.lastName }
+        },
+        {
+          key: { text: "Date of birth" },
+          value: { text: participant.demographicInformation.dateOfBirth | formatDate }
+        }
+      ]
+    }) }}
+
+    {# {% if isManualFailover %}
+      {% call details({
+        summaryText: "Add reason for switching to manual"
+      }) %}
+        {{ textarea({
+          label: {
+            text: "Reason for switching to manual",
+            classes: "nhsuk-label--s"
+          },
+          id: "manualImageModeReason",
+          name: "event[mammogramDataTemp][manualImageModeReason]",
+          rows: 3,
+          value: mammogramSource.manualImageModeReason
+        }) }}
+      {% endcall %}
+    {% endif %} #}
+  {% endif %}
+
+  {{ radios({
+    idPrefix: "imagingComplete",
+    name: "event[mammogramDataTemp][isStandardSet]",
+    fieldset: {
+      legend: {
+        text: "Have you taken a standard set of images?",
+        size: "m",
+        isPageHeading: false
+      }
+    },
+    value: mammogramSource.isStandardSet,
+    items: [
+      {
+        value: "yes",
+        text: "Yes, 2 CC and 2 MLO"
+      },
+      {
+        value: "custom",
+        text: "No, add other information",
+        hint: {
+          text: "Such as too few or additional images"
+        }
+      },
+      {
+        divider: "or"
+      },
+      {
+        value: "no",
+        text: "No images taken",
+        hint: {
+          text: "The appointment cannot proceed"
+        }
+      }
+    ]
+  }) }}
+
+  {{ button({
+    text: "Continue"
+  }) }}
+
+{% endblock %}