Merge branch 'value-formats'

Author: alaric-rd

lib/importer/govuk-prototype-kit.config.json

@@ -35,6 +35,11 @@
       "path": "/templates/mapping.html",
       "type": "nunjucks"
     },
+    {
+      "name": "Choose field formats",
+      "path": "/templates/format.html",
+      "type": "nunjucks"
+    },
     {
       "name": "Review your data",
       "path": "/templates/review.html",

lib/importer/nunjucks/importer/macros/field_mapper.njk

@@ -46,6 +46,7 @@
       </div>
     {% endif %}
 
+<input type="hidden" name="mappings-present" value="yes">
 <table class="govuk-table">
   {% if params.caption %}
   <caption class="govuk-table__caption govuk-table__caption--m">{{params.caption}}</caption>
@@ -67,7 +68,7 @@
       <th scope="row" class="govuk-table__header">{{ h.name }}</th>
       <td class="govuk-table__cell">{{ h.examples }}</td>
       <td class="govuk-table__cell govuk-table__cell--numeric">
-         <select class="govuk-select" style="float: right;" name="{{h.index}}">
+         <select class="govuk-select" style="float: right;" name="field-{{h.index}}">
                 <option name=""></option>
                 {% for field in fields %}
                     <option value="{{field.name}}" {% if field.name == currentValue or (mappingsLen == 0 and field.name == h.name) %}selected{% endif %}>

lib/importer/nunjucks/importer/macros/format_picker.njk

@@ -0,0 +1,106 @@
+{#
+    dudkFormatPicker shows each column heading mapped to a field whose type has
+    format options from the current spreadsheet, alongside a drop-down containing
+    available formats.  This allows the user to choose a format for
+    each column that needs one, to select how the value mapping should be applied.
+
+    The resulting data to be submitted to the 'importerMapDataPath'
+    will be a map of column indices to format names.
+
+    It accepts a data object which is taken from the prototype kit's
+    session data which is made available on every page, and contains the
+    data submitted from forms to the backend, and also the current
+    data import session.
+#}
+
+{% macro dudkFormatPicker(params) %}
+    {% set fields = params.data['importer.session']['fields'] %}
+    {% set mapping = params.data['importer.session']['mapping'] %}
+    {% set headings = importerGetHeaders(params.data) %}
+    {% set headingError = headings.error %}
+    {% set error = importerError(params.data) %}
+
+    {% if headingError %}
+    <p id="mapping-error" class="govuk-error-message">
+      <span class="govuk-visually-hidden">Error:</span> {{ headingError.text }}
+    </p>
+    {% endif %}
+
+    {% if error %}
+      <div class="govuk-error-summary" data-module="govuk-error-summary">
+        <div role="alert">
+          <h2 class="govuk-error-summary__title">
+            {{ error.text }}
+          </h2>
+          <div class="govuk-error-summary__body">
+            <ul class="govuk-list govuk-error-summary__list">
+              {% for e in error.extra %}
+              <li>
+                <a href="#field-{{ e | slugify }}">{{ e }}</a>
+              </li>
+              {% endfor %}
+            </ul>
+          </div>
+        </div>
+      </div>
+    {% endif %}
+
+<input type="hidden" name="formats-present" value="yes">
+<table class="govuk-table">
+  {% if params.caption %}
+  <caption class="govuk-table__caption govuk-table__caption--m">{{params.caption}}</caption>
+  {% endif %}
+  <thead class="govuk-table__head">
+    <tr class="govuk-table__row">
+      <th scope="col" class="govuk-table__header">{{params.columnTitle}}</th>
+      <th scope="col" class="govuk-table__header">{{params.examplesTitle}}</th>
+      <th scope="col" class="govuk-table__header">{{params.fieldAndTypeTitle}}</th>
+      <th scope="col" class="govuk-table__header" style="padding-left: 1.5em">{{params.fieldsTitle}}</th>
+    </tr>
+  </thead>
+  <tbody class="govuk-table__body">
+    {% set mappingsLen = mapping | length %}
+    {% set possibleFormatsByColumn = importerPossibleColumnFormats(params.data) %}
+    {% set mappedColumnDetails = importerMappedColumnDetails(params.data) %}
+    {% for h in headings.data %}
+      {% set hIndex = loop.index0 %}
+      {% set currentValue = importerErrorMappingData(error, hIndex) %}
+      {% set possibleFormats = possibleFormatsByColumn[hIndex] %}
+      {% set mapping = mappedColumnDetails[hIndex] %}
+
+    <tr class="govuk-table__row" id="field-{{ h.name | slugify }}">
+      <th scope="row" class="govuk-table__header">{{ h.name }}</th>
+      <td class="govuk-table__cell">{{ h.examples }}</td>
+      <td class="govuk-table__cell">
+          {% if mapping %}
+              {{ mapping.fieldName }} ({{ mapping.typeName }})
+          {% endif %}
+      </td>
+      <td class="govuk-table__cell govuk-table__cell--numeric">
+         {% if possibleFormats %}
+         <select class="govuk-select" style="float: right;" name="format-{{h.index}}">
+            <optgroup label="Matches every row">
+                {% for format in possibleFormats[0] %}
+                    <option value="{{format.name}}"
+                      {% if format.name == currentValue %}selected{% endif %}>
+                      {{format.displayName}}
+                    </option>
+                {% endfor %}
+            </optgroup>
+            <optgroup label="Matches some rows">
+                {% for format in possibleFormats[1] %}
+                    <option value="{{format.name}}"
+                      {% if format.name == currentValue %}selected{% endif %}>
+                      {{format.displayName}}
+                    </option>
+                {% endfor %}
+            </optgroup>
+         </select>
+         {% endif %}
+      </td>
+    </tr>
+    {% endfor %}
+  </tbody>
+</table>
+{% endmacro %}
+