Shopping Cart

There are no notes for this item.

<!-- Default -->
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
    <div class="dso-contents">
        <p class="dso-empty">U heeft nog geen activiteiten gekozen</p>
    </div>

</div>
<!-- Items Collapsed -->
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
    <div class="dso-contents">
        <button type="button" class="dso-status"><svg class="di di-chevron-down">
                <use href="../../dso-icons.svg#chevron-down" />
            </svg>U heeft 2 activiteiten gekozen
        </button>

    </div>

</div>
<!-- Items Expanded -->
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
    <div class="dso-contents">
        <button type="button" class="dso-status"><svg class="di di-chevron-up">
                <use href="../../dso-icons.svg#chevron-up" />
            </svg>U heeft 2 activiteiten gekozen
        </button>

        <ul class="dso-items">

            <li>

                Milieubelastende activiteit - Melding

                <button type="button" title="Naam bewerken" class="btn btn-link dso-edit-cart-item"><span class="sr-only">Naam bewerken</span><svg class="di di-pencil">
                        <use href="../../dso-icons.svg#pencil" />
                    </svg></button>

                <button type="button" class="dso-delete" title="Verwijder">
                    <svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>

            </li>

            <li>

                Milieubelastende activiteit - Melding
                <span class="dso-additive">2</span>

                <button type="button" title="Naam bewerken" class="btn btn-link dso-edit-cart-item"><span class="sr-only">Naam bewerken</span><svg class="di di-pencil">
                        <use href="../../dso-icons.svg#pencil" />
                    </svg></button>

                <button type="button" class="dso-delete" title="Verwijder">
                    <svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>

            </li>

        </ul>

    </div>

</div>
<!-- Items Edit -->
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
    <div class="dso-contents">
        <button type="button" class="dso-status"><svg class="di di-chevron-up">
                <use href="../../dso-icons.svg#chevron-up" />
            </svg>U heeft 2 activiteiten gekozen
        </button>

        <ul class="dso-items">

            <li>

                Milieubelastende activiteit - Melding

                <button type="button" title="Naam bewerken" class="btn btn-link dso-edit-cart-item"><span class="sr-only">Naam bewerken</span><svg class="di di-pencil">
                        <use href="../../dso-icons.svg#pencil" />
                    </svg></button>

                <button type="button" class="dso-delete" title="Verwijder">
                    <svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>

            </li>

            <li>

                Milieubelastende activiteit - Melding

                <div class="dso-edit-additive">
                    <label for="additive-items-edit-1">Bewerk toevoeging</label>
                    <input type="text" class="dso-edit-name" id="additive-items-edit-1" value="2" />
                </div>

            </li>

        </ul>

    </div>

</div>
<!-- Subitems Hidden Summary -->
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
    <div class="dso-contents">
        <ul class="dso-items">

            <li>

                Milieubelastende activiteit - Melding

                <button type="button" title="Naam bewerken" class="btn btn-link dso-edit-cart-item"><span class="sr-only">Naam bewerken</span><svg class="di di-pencil">
                        <use href="../../dso-icons.svg#pencil" />
                    </svg></button>

                <button type="button" class="dso-delete" title="Verwijder">
                    <svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>

                <ul class="dso-subitems">

                    <li>

                        Wasstraat of wasplaats
                        <button type="button" class="dso-delete" title="Verwijder">
                            <svg class="di di-trash">
                                <use href="../../dso-icons.svg#trash" />
                            </svg>
                        </button>
                    </li>

                </ul>

            </li>

            <li>

                Milieubelastende activiteit - Melding

                <div class="dso-edit-additive">
                    <label for="additive-subitems-hidden-summary-1">Bewerk toevoeging</label>
                    <input type="text" class="dso-edit-name" id="additive-subitems-hidden-summary-1" value="Wasstraat om de hoek van garagebedrijf Jansen" />
                </div>

                <ul class="dso-subitems">

                    <li>

                        Wasstraat of wasplaats
                        <button type="button" class="dso-delete" title="Verwijder">
                            <svg class="di di-trash">
                                <use href="../../dso-icons.svg#trash" />
                            </svg>
                        </button>
                    </li>

                </ul>

            </li>

        </ul>

    </div>

</div>
<!-- Subitems With Warning -->
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
    <div class="dso-contents">
        <button type="button" class="dso-status"><svg class="di di-chevron-up">
                <use href="../../dso-icons.svg#chevron-up" />
            </svg>U heeft 3 activiteiten gekozen
        </button>

        <ul class="dso-items">

            <li>

                Tankstation starten of veranderen

                <button type="button" class="dso-delete" title="Verwijder">
                    <svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>

                <ul class="dso-subitems">

                    <li>

                        Tanken van diesel, benzine en andere vloeibare brandstof
                        <button type="button" class="dso-delete" title="Verwijder">
                            <svg class="di di-trash">
                                <use href="../../dso-icons.svg#trash" />
                            </svg>
                        </button>
                    </li>

                    <li>

                        Tanken en opslaan van LPG
                        <button type="button" class="dso-delete" title="Verwijder">
                            <svg class="di di-trash">
                                <use href="../../dso-icons.svg#trash" />
                            </svg>
                        </button>
                    </li>

                </ul>

            </li>

            <li>
                <svg class="di di-status-warning">
                    <use href="../../dso-icons.svg#status-warning" />
                </svg><span class="sr-only">waarschuwing</span>
                Opslaan van vloeistoffen in een opslagtank

                <button type="button" class="dso-delete" title="Verwijder">
                    <svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>

                <ul class="dso-subitems">

                    <li>
                        <svg class="di di-status-warning">
                            <use href="../../dso-icons.svg#status-warning" />
                        </svg><span class="sr-only">waarschuwing</span>
                        Opslaan van vloeistoffen in een ondergrondse opslagtank
                        <button type="button" class="dso-delete" title="Verwijder">
                            <svg class="di di-trash">
                                <use href="../../dso-icons.svg#trash" />
                            </svg>
                        </button>
                    </li>

                </ul>

            </li>

        </ul>

    </div>

</div>
<h2>Mijn activiteiten</h2>

<div class="dso-shopping-cart">
  <div class="dso-contents">
    {%- if items.length > 0 %}
      {%- if not hideSummary %}
      <button type="button" class="dso-status">
        {%- if not collapsed -%}
          {%- render '@icon', {icon:'chevron-up'} -%}
        {%- else -%}
          {%- render '@icon', {icon:'chevron-down'} -%}
        {%- endif -%}
        U heeft {{ items | countSubitems }} activiteit{% if ((items | countSubitems) > 1) %}en{% endif %} gekozen
      </button>
      {% endif -%}
      {% if not collapsed %}
        <ul class="dso-items">
          {% for item in items %}
            <li>
              {% if (item.subitems | hasWarning) %}{% render '@icon', {icon:'status-warning'} %}<span class="sr-only">waarschuwing</span>{% endif %}
              {{ item.label }}{% if not item.readonly and not item.edit and item.additive %}
                <span class="dso-additive">{{ item.additive }}</span>
              {%- endif %}
              {% if not item.readonly %}
                {% if item.edit %}
                  <div class="dso-edit-additive">
                    <label for="additive-{{ _self.name }}-{{ loop.index0 }}">Bewerk toevoeging</label>
                    <input type="text" class="dso-edit-name" id="additive-{{ _self.name }}-{{ loop.index0 }}" value="{{ item.additive }}" />
                  </div>
                {% endif %}

                {% if not item.edit %}
                  {% render '@button', {type: 'button', modifier: 'link dso-edit-cart-item', label: 'Naam bewerken', icon: 'pencil', iconOnly: true} %}
                {% endif %}
              {% endif %}
              {% if not item.edit %}
                <button type="button" class="dso-delete" title="Verwijder">
                  {% render '@icon', {icon:'trash'} %}
                </button>
              {% endif %}
              {% if item.subitems.length %}
                <ul class="dso-subitems">
                  {% for subitem in item.subitems %}
                    <li>
                      {% if subitem.warning %}{% render '@icon', {icon:'status-warning'} %}<span class="sr-only">waarschuwing</span>{% endif %}
                      {{ subitem.label }}
                      <button type="button" class="dso-delete" title="Verwijder">
                        {% render '@icon', {icon:'trash'} %}
                      </button>
                    </li>
                  {% endfor %}
                </ul>
              {% endif %}
            </li>
          {% endfor %}
        </ul>
      {% endif %}
    {% else %}
      <p class="dso-empty">U heeft nog geen activiteiten gekozen</p>
    {% endif -%}
  </div>

  {% if items.length > 0 and (items | hasWarning) and open %}
    <p class="dso-warning">
      <strong>Let op:</strong> Voor de werkzaamheden met een {% render '@icon', {icon:'status-warning'} %} zijn geen maatregelen opgenomen in dit overzicht met maatregelen. Dit betekent niet dat er geen voorschriften en maatregelen van toepassing zijn.
    </p>
  {% endif %}
</div>
/* Default */
__title: default
items: []
/* Items Collapsed */
__title: items collapsed
items:
  - label: Milieubelastende activiteit - Melding
  - label: Milieubelastende activiteit - Melding
    additive: 2
collapsed: true
/* Items Expanded */
__title: items expanded
items:
  - label: Milieubelastende activiteit - Melding
  - label: Milieubelastende activiteit - Melding
    additive: 2
/* Items Edit */
__title: edit items
items:
  - label: Milieubelastende activiteit - Melding
  - label: Milieubelastende activiteit - Melding
    additive: 2
    edit: true
/* Subitems Hidden Summary */
__title: subitems with hidden summary
items:
  - label: Milieubelastende activiteit - Melding
    subitems:
      - label: Wasstraat of wasplaats
  - label: Milieubelastende activiteit - Melding
    additive: Wasstraat om de hoek van garagebedrijf Jansen
    edit: true
    subitems:
      - label: Wasstraat of wasplaats
hideSummary: true
/* Subitems With Warning */
__title: subitems
items:
  - label: Tankstation starten of veranderen
    readonly: true
    subitems:
      - label: 'Tanken van diesel, benzine en andere vloeibare brandstof'
      - label: Tanken en opslaan van LPG
  - label: Opslaan van vloeistoffen in een opslagtank
    readonly: true
    subitems:
      - label: Opslaan van vloeistoffen in een ondergrondse opslagtank
        warning: true