pageTitle: Summary tables
pageDescription: |
  Examples use <a href="http://jinja.pocoo.org/docs/dev/templates/#call">Jinja2 "macro call" syntax</a>.
assetPath: ../govuk_template/assets/
examples:
  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table", id="summary_table") }}
    {% call(item) summary.list_table(
      [
        {"name": "Service 1", "lot": "SCS"},
        {"name": "Service 2", "lot": "SaaS"},
        {"name": "Service 2", "lot": "IaaS"},
      ],
      caption="Summary table",
      empty_message="You haven't submitted any services yet",
      field_headings=[
        "Service",
        "Lot",
        summary.hidden_field_heading("Action")
      ],
      field_headings_visible=True
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#') }}
        {{ summary.text(item.lot) }}
        {{ summary.edit_link("Edit", '#') }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with no entries") }}
    {% call(item) summary.list_table(
      [],
      caption="Summary table with no entries",
      empty_message="You haven't submitted any services yet",
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#') }}
        {{ summary.text(item.lot) }}
        {{ summary.edit_link("Edit", '#') }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with many columns") }}
    {% call(item) summary.list_table(
      [
        {"name": "Service 1", "lot": "SCS",  "id": "1234567890123456", "date": "12 June 2015", "framework": "G-Cloud 6"},
        {"name": "Service 2", "lot": "SaaS", "id": "5678901212343456", "date": "12 June 2015", "framework": "G-Cloud 6"},
        {"name": "Service 2", "lot": "IaaS", "id": "9012123456783456", "date": "12 June 2015", "framework": "G-Cloud 6"},
      ],
      caption="Summary table with many columns",
      empty_message="You haven't submitted any services yet",
      field_headings=[
        "Service",
        "ID",
        "Framework",
        "Lot",
        "Last edited",
        summary.hidden_field_heading(""),
        summary.hidden_field_heading("")
      ],
      field_headings_visible=True
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#', wide=False) }}
        {{ summary.service_id(item.id) }}
        {{ summary.text(item.framework) }}
        {{ summary.text(item.lot) }}
        {{ summary.text(item.date) }}
        {{ summary.remove_link("Remove", '#', item.name) }}
        {{ summary.edit_link("Edit", '#', item.name) }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with manual rows") }}
    {{ summary.description("This will be displayed on the Digital Marketplace.") }}
    {% call summary.mapping_table(
      caption="Summary table with manual rows",
      field_headings=[
        "Label",
        "Value",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row() %}
        {{ summary.field_name("Service Name") }}
        {{ summary.text("Service 1") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Service ID") }}
        {{ summary.text("1234 1234 1234") }}
      {% endcall %}
      {% call summary.row(complete=False) %}
        {{ summary.field_name("Description") }}
        {{ summary.text("Answer required") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Clients") }}
        {{ summary.list(["Client 1", "Client 2", "Client 3"]) }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with top-level action") }}
    {{ summary.description("You must add at least one service to be eligible.") }}
    {{ summary.top_link("Add new service", '#') }}
    {% call(item) summary.list_table(
      [],
      caption="Summary table with top-level action",
      empty_message="You haven't submitted any services yet",
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#') }}
        {{ summary.text(item.lot) }}
        {{ summary.edit_link("Edit", '#') }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with number", index=12) }}
    {% call(item) summary.list_table(
      [],
      caption="Summary table with number",
      empty_message="You haven't submitted any services yet",
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#') }}
        {{ summary.text(item.lot) }}
        {{ summary.edit_link("Edit", '#') }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with name field as link") }}
    {% call(item) summary.list_table(
      [
        {"name": "Service 1", "lot": "SCS"},
        {"name": "Service 2", "lot": "SaaS"},
        {"name": "Service 2", "lot": "IaaS"},
      ],
      caption="Summary table with name field as link",
      empty_message="You haven't submitted any services yet",
      field_headings=[
        "Service",
        "Lot",
        summary.hidden_field_heading("Action")
      ],
      field_headings_visible=True
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#') }}
        {{ summary.text(item.lot) }}
        {{ summary.edit_link("Change", "#", hidden_text="summary item") }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with left-aligned action links that have hidden text for accessibility") }}
    {% call(item) summary.list_table(
      [
        {"question": "Registered company name", "answer": "Answer required"},
        {"question": "Registered company address", "answer": "Answer required"},
        {"question": "Registration number", "answer": "Answer required"},
      ],
      caption="Summary table with left-aligned action links that have hidden text for accessibility",
      empty_message="You haven't submitted any services yet",
      field_headings=[
        "Question",
        "Answer",
        summary.hidden_field_heading("Action")
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row() %}
        {{ summary.field_name(item.question) }}
        {{ summary.link(link_title=item.answer, link='#', hidden_text="for " + item.question) }}
        {{ summary.text("") }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with action button") }}
    {% call(item) summary.list_table(
      [
        {"name": "Service 1", "lot": "SCS"},
        {"name": "Service 2", "lot": "SaaS"},
        {"name": "Service 2", "lot": "IaaS"},
      ],
      caption="Summary table with name field as link",
      empty_message="You haven't submitted any services yet",
      field_headings=[
        "Service",
        "Lot",
        summary.hidden_field_heading("Action")
      ],
      field_headings_visible=True
    ) %}
      {% call summary.row() %}
        {{ summary.service_link(item.name, '#') }}
        {{ summary.text(item.lot) }}
        {{ summary.button("Delete", "#", csrf_token_value='random') }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with various types of service content") }}
    {% call summary.mapping_table(
      caption="Summary table with content field as list",
      field_headings=[
        "Field name",
        "Field value",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row() %}
        {{ summary.field_name("Features") }}
        {{ summary.list(["Feature 1", "Feature 2", "Feature 3"],
          assurance="Independent validation of assertion") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Data centre tier") }}
        {{ summary.text("Uptime institute Tier 1",
          assurance="Independent validation of assertion") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Uptime") }}
        {{ summary.number(99.999,
          assurance="Independent validation of assertion") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Pricing document") }}
        {{ summary.upload("http://example.com/pricingDocument.pdf") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Description") }}
        {{ summary.textbox_large(
          "An advanced, web-based content management system that helps users create, manage and publish content quickly and easily."
        ) }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Support available") }}
        {{ summary.boolean(True, "CESG-assured components") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Developer") }}
        {{ summary.multiquestion([
          {"name": "Where they'll work", "type": "list", "value": ["London", "Mississauga", "Rivière-du-Loup", "Singapore"]},
          {"name": "Day rate", "type": "text", "value": "£100 to £1000000 per day"}
         ]) }}
      {% endcall %}
      {% call summary.row() %}
       {{ summary.field_name("Service categories with children") }}
       {{ summary.checkbox_tree(
         [{
           "label": "Accounting and finance",
           "options": [
             {"label": "Accounting", "options": []},
             {"label": "Accounts payable", "options": []},
             {"label": "Accounts receivable", "options": []},
             {"label": "Asset management", "options": []}]
         },{
           "label": "Operations management",
           "options": [
             {"label": "Contract management", "options": []},
             {"label": "Enterprise resource planning (ERP)", "options": []},
             {"label": "Operations management", "options": []}]
         }])
       }}
      {% endcall %}
      {% call summary.row() %}
       {{ summary.field_name("Flat list of service categories") }}
       {{ summary.checkbox_tree(
         [
          {"label": "Firewall"},
          {"label": "Infrastructure and platform security"},
          {"label": "Intrusion detection"},
          {"label": "Load balancing"},
          {"label": "Logging and analysis"},
         ])
       }}
      {% endcall %}
    {% endcall %}
  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with various types of service content, some blank") }}
    {% call summary.mapping_table(
      caption="Summary table with content field as list",
      field_headings=[
        "Field name",
        "Field value",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row() %}
        {{ summary.field_name("Features") }}
        {{ summary.list() }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Data centre tier") }}
        {{ summary.text("Uptime institute Tier 1",
          assurance="Independent validation of assertion") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Uptime") }}
        {{ summary.number() }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Pricing document") }}
        {{ summary.upload("http://example.com/pricingDocument.pdf") }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Website") }}
        {{ summary.external_link() }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Description") }}
        {{ summary.textbox_large(
          "An advanced, web-based content management system that helps users create, manage and publish content quickly and easily."
        ) }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Support available") }}
        {{ summary.boolean() }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Developer") }}
        {{ summary.multiquestion() }}
      {% endcall %}
    {% endcall %}

  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with incomplete entry") }}
    {{ summary.top_link("Edit", '#', hidden_text="extra text for screenreaders") }}
    {% call(item) summary.list_table(
      [
        ("Features", "Answer required"),
      ],
      caption="Summary table with incomplete entry",
      empty_message="You haven't submitted any services yet",
      field_headings=[
        "Field name",
        "Field value",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row(complete=False) %}
        {{ summary.field_name(item[0]) }}
        {{ summary.text(item[1]) }}
      {% endcall %}
    {% endcall %}
  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with external link") }}
    {{ summary.top_link("Edit", '#') }}
    {% call summary.mapping_table(
      caption="Summary table with external link",
      field_headings=[
        "Label",
        "Value",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row() %}
        {{ summary.field_name("Website") }}
        {{ summary.external_link("https://gov.uk/", "https://gov.uk/") }}
      {% endcall %}
    {% endcall %}
  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with bold text and borders") }}
      {% call summary.mapping_table(
      row_bold_borders=True,
      text_large = True,
      no_bottom_border=True,
      caption="If you publish today, you must be aware of the following dates:",
      caption_visible=True,
      field_headings=[
        "Date",
        "Notice",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row(no_border=True) %}
        {{ summary.field_heading_date("Today", scope='row') }}
        {{ summary.text("Suppliers can apply and ask questions about your requirements.") }}
      {% endcall %}
      {% call summary.row(bold_border=True) %}
        {{ summary.field_heading_date("Before 14 April", rowspan='3', scope='row') }}
        {{ summary.text_bold("Details of your question and answer session") }}
      {% endcall %}
      {% call summary.row(no_border=True) %}
        {{ summary.text("Question and answer session information.") }}
      {% endcall %}
      {% call summary.row(no_border=True) %}
        {{ summary.text_bold("You must hold your question and answer session before 11 April.", border=True) }}
      {% endcall %}
      {% call summary.row(bold_border=True) %}
        {{ summary.field_heading_date("14 April", scope='row') }}
        {{ summary.text("Suppliers can no longer ask questions.") }}
      {% endcall %}
      {% call summary.row(bold_border=True) %}
        {{ summary.field_heading_date("16 April", rowspan='2', scope='row') }}
        {{ summary.text("You must have published answers to all suppliers’ questions.") }}
      {% endcall %}
      {% call summary.row(no_border=True) %}
        {{ summary.text("If 16 April is a Saturday or Sunday, you need to have published all questions and answers by the Friday before.", border=True) }}
      {% endcall %}
      {% call summary.row(bold_border=True) %}
        {{ summary.field_heading_date("18 April", scope='row') }}
        {{ summary.text("Suppliers can no longer apply.") }}
      {% endcall %}
    {% endcall %}
  - |
    {% import "summary-table.html" as summary %}
    {{ summary.heading("Summary table with two-thirds with first column") }}
    {% call summary.mapping_table(
      caption="Summary table with two-thirds width first column",
      field_headings=[
        "Label",
        "Value",
      ],
      field_headings_visible=False
    ) %}
      {% call summary.row() %}
        {{ summary.field_name("Have demonstrable experience of working in a culture of continuous delivery and improvement. Can show evidence of creating a culture of innovation for delivery teams. (Scores 10%)", two_thirds=True) }}
        {{ summary.boolean(True) }}
      {% endcall %}
      {% call summary.row() %}
        {{ summary.field_name("Demonstrate enthusiasm (e.g. bring whole self to work, celebrate success, share energy and passion with others, optimistic) (Scores 20%)", two_thirds=True) }}
        {{ summary.boolean(False) }}
      {% endcall %}
    {% endcall %}