diff --git a/app/views/clinics/00-create-day-clinic.html b/app/views/clinics/00-create-day-clinic.html index b2ffcc6..485b455 100644 --- a/app/views/clinics/00-create-day-clinic.html +++ b/app/views/clinics/00-create-day-clinic.html @@ -1,6 +1,8 @@ {% extends 'layout.html' %} -{% set pageName = "Clinics" %} +{% set errorState = "false" %} + +{% set pageName = "Create day clinic" %} {% from "_includes/primary-navigation.html" import primaryNavigation %} {% block header %} @@ -63,18 +65,43 @@

+ {% if errorState === "true" %} + {{ errorSummary({ + titleText: "There is a problem", + errorList: [ + { + text: "Clinic must be given a name", + href: "#" + }, + { + text: "A unit must be chosen", + href: "#" + }, + { + text: "A location must be chosen", + href: "#" + } + ] + }) }} + {% endif %} +

Clinic details

-
+
A memorable name for this clinic. This is the name you’ll see everywhere for it, as titles and links.
- + {% if errorState === "true" %} + + Error: Clinic must be given a name + + {% endif %} +
@@ -89,11 +116,16 @@

Clinic details

-
+
Unit + {% if errorState === "true" %} + + Error: A unit must be chosen + + {% endif %}
@@ -132,11 +164,16 @@

Clinic details

-
+
Location + {% if errorState === "true" %} + + Error: A location must be chosen + + {% endif %}
diff --git a/app/views/clinics/01-set-date-and-time.html b/app/views/clinics/01-set-date-and-time.html index 4e1e71d..5cb2e98 100644 --- a/app/views/clinics/01-set-date-and-time.html +++ b/app/views/clinics/01-set-date-and-time.html @@ -1,6 +1,8 @@ {% extends 'layout.html' %} -{% set pageName = "Clinics" %} +{% set errorState = "false" %} + +{% set pageName = "Set date and time" %} {% from "_includes/primary-navigation.html" import primaryNavigation %} {% block header %} @@ -63,12 +65,47 @@

+ {% if errorState === "true" %} + {{ errorSummary({ + titleText: "There is a problem", + errorList: [ + { + text: "Date of clinic must be given a day, month, and year", + href: "#" + }, + { + text: "Date of clinic must be in the future", + href: "#" + }, + { + text: "Start time must be entered, in 24 hour format", + href: "#" + }, + { + text: "End time must be entered, in 24 hour format", + href: "#" + }, + { + text: "End time must be later than start time", + href: "#" + }, + { + text: "Start time must be earlier than end time", + href: "#" + }, + { + text: "Slot length must be entered, in minutes", + href: "#" + } + ] + }) }} + {% endif %} +

Set date and time

-

Potentially some real brief help and scene setting. Mainly to point out you can punch holes in it as you go?

-
+
Date of clinic @@ -76,13 +113,18 @@

Set date and time

For example, 18 6 2026
+ {% if errorState === "true" %} + + Error: Date of clinic must be given a day, month, and year + + {% endif %}
- +
@@ -90,7 +132,7 @@

Set date and time

- +
@@ -98,21 +140,26 @@

Set date and time

- +

-
+
Session start time
- For example, 10:00 + Use 24 hour format, for example, 10:00
+ {% if errorState === "true" %} + + Error: Start time must be entered, in 24 hour format + + {% endif %}
@@ -120,7 +167,7 @@

Set date and time

-
@@ -130,7 +177,7 @@

Set date and time

-
@@ -138,14 +185,19 @@

Set date and time

-
+
Session end time
- For example, 17:00 + Use 24 hour format, for example, 17:00
+ {% if errorState === "true" %} + + Error: End time must be entered, in 24 hour format + + {% endif %}
@@ -153,7 +205,7 @@

Set date and time

-
@@ -162,7 +214,7 @@

Set date and time

-
@@ -170,12 +222,17 @@

Set date and time

-
+
+ {% if errorState === "true" %} + + Error: Slot length must be entered, in minutes + + {% endif %}
-
@@ -187,18 +244,12 @@

Set date and time

X total slots in the session

- +
- -
- Time must be in 24 hour format
- Start time must be before end time and vice versa
- Slots dont have to divide equally into the times, but it'll be interesting to work that out? -
@@ -269,6 +320,7 @@

Set date and time

totalElement.textContent = String(totalSlots); totalInput.value = String(totalSlots); + if (!errorElement) { return; } diff --git a/app/views/clinics/02-organise-slots.html b/app/views/clinics/02-organise-slots.html index 56dc77a..ef31776 100644 --- a/app/views/clinics/02-organise-slots.html +++ b/app/views/clinics/02-organise-slots.html @@ -1,6 +1,6 @@ {% extends 'layout.html' %} -{% set pageName = "Clinics" %} +{% set pageName = "Organise slots" %} {% from "_includes/primary-navigation.html" import primaryNavigation %} {% block header %} @@ -126,7 +126,6 @@

Organise slots

-

Potentially some real brief help and scene setting. Selection and controls

Session time {{ data.newSession.startTime.hour | zeroPad }}:{{ data.newSession.startTime.minute | zeroPad }} to {{ data.newSession.endTime.hour | zeroPad }}:{{ data.newSession.endTime.minute | zeroPad }} @@ -139,10 +138,9 @@

- +

+ Click to select a slot. Press shift and click to select a range. +

@@ -155,8 +153,9 @@

With selected:

  • Hold
  • Staff break
  • Special appointment
    • -
  • Clear slot type
    • +
  • Clear slot type
    • +
    • Merge selected
    • Unmerge
      • @@ -444,6 +443,7 @@

      With selected:

      `; const checkbox = div.querySelector('input[type="checkbox"]'); + const label = div.querySelector('label'); function handleCheckboxSelection(e, checked) { const head = resolveToMergeHead(i); @@ -475,6 +475,16 @@

      With selected:

      checkbox.addEventListener('click', e => { handleCheckboxSelection(e, checkbox.checked); }); + + if (label) { + label.addEventListener('click', e => { + // Handle label clicks explicitly so shift-click range selection works from the label text too. + e.preventDefault(); + const nextChecked = !checkbox.checked; + checkbox.checked = nextChecked; + handleCheckboxSelection(e, nextChecked); + }); + } } container.appendChild(div); diff --git a/app/views/clinics/03-publish-clinic.html b/app/views/clinics/03-publish-clinic.html index 65740ec..5c79ff2 100644 --- a/app/views/clinics/03-publish-clinic.html +++ b/app/views/clinics/03-publish-clinic.html @@ -1,6 +1,6 @@ {% extends 'layout.html' %} -{% set pageName = "Clinics" %} +{% set pageName = "Publish clinic" %} {% from "_includes/primary-navigation.html" import primaryNavigation %} {% block header %} @@ -64,7 +64,6 @@

      Publish clinic

      -

      Potentially some real brief help and scene setting. Mainly to point out you can punch holes in it as you go?