Documenten
Component preview opent in nieuw tabbladThere are no notes for this item.
<main>
<form>
<div class="dso-app-heading">
<h1>Aanvraag Laan van Eik en Duinen 125, Den Haag</h1>
<h2 class="dso-steps-indicator">
5. Documenten
<span class="dso-step">
Stap 5/7
</span>
</h2>
</div>
<h3>Milieubelastende activiteit - Vergunning (Gemeente)</h3>
<div class="dso-accordion">
<div class="dso-accordion-section dso-open dso-nested-accordion">
<h3 class="dso-section-handle"><button type="button" aria-expanded="true">Veehouderij
</button>
</h3>
<div class="dso-section-body">
<div class="dso-accordion">
<div class="dso-accordion-section dso-open">
<div class="dso-section-handle">
<button type="button" aria-expanded="true">
Beschrijving installatie en activiteiten
</button>
</div>
<div class="dso-section-body">
<div class="dso-rich-content">
<p>Geef een tekening van de nieuwe situatie in 1:100. Een situatietekening geeft een schets van de bestaande en de nieuwe situatie met daarop duidelijk de maatvoering en de schaalaanduiding (1:100).</p>
</div>
<fieldset class="form-group dso-files">
<legend class="sr-only">Documenten</legend>
<div class="dso-label-container">
<label for="documenten" class="control-label" aria-hidden="true">
Documenten
</label>
</div>
<div class="dso-field-container">
<ul class="dso-filelist">
<li>
<div class="dso-filename" id="documenten-file-filename-0">
Schetsen_en_foto's_1.pdf
</div>
<div class="dso-selectable dso-confidential">
<input type="checkbox" id="documenten-input-confirm-0" name="documenten-input-confirm-0" aria-describedby="documenten-file-filename-0">
<label for="documenten-input-confirm-0">
Vertrouwelijk
</label>
</div>
<button type="button" aria-describedby="documenten-file-filename-0" class="dso-tertiary dso-remove"><span>Verwijder document</span></button>
</li>
<li>
<div class="dso-filename" id="documenten-file-filename-1">
Bijlagen_hoveniersbedrijf_de_heggeschaar_hoveniers.jpg
</div>
<div class="dso-selectable dso-confidential">
<input type="checkbox" id="documenten-input-confirm-1" name="documenten-input-confirm-1" aria-describedby="documenten-file-filename-1" checked>
<label for="documenten-input-confirm-1">
Vertrouwelijk
</label>
</div>
<dso-icon icon="status-warning"></dso-icon>
<button type="button" aria-describedby="documenten-file-filename-1" class="dso-tertiary dso-remove"><span>Verwijder document</span></button>
</li>
</ul>
<dso-alert status="warning">
<div class="dso-rich-content">
<p>U vraagt of wij een document vertrouwelijk willen behandelen. Hiervoor moet u twee dingen doen:</p>
<ol>
<li>Voeg ook een publiceerbaar document zonder vertrouwelijke informatie toe.</li>
<li>Geef per document de reden op als toelichting op het verzoek in de laatste stap van uw aanvraag.</li>
</ol>
<p>Er zal worden beoordeeld of uw vraag terecht is. U krijgt hiervan bericht.</p>
</div>
</dso-alert>
<!-- To use an input type="file" element -->
<div class="dso-file-upload">
<input type="file" id="documenten-file-upload" />
<label class="dso-secondary" for="documenten-file-upload">
<dso-icon icon="plus"></dso-icon><span>Document toevoegen</span>
</label>
</div>
</div>
<!-- Or to trigger the upload using a button element (not recommended) -->
<!--
<button type="button"
class="dso-tertiary"><dso-icon icon="plus"></dso-icon><span >Document toevoegen</span></button>
-->
</fieldset>
<div class="dso-form-buttons">
<button type="button" class="dso-primary"><span>Volgende</span></button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="dso-accordion-section">
<h3 class="dso-section-handle"><button type="button" aria-expanded="false">Beschrijving grondstoffen en hulpstoffen
</button>
</h3>
</div>
<div class="dso-accordion-section">
<h3 class="dso-section-handle"><button type="button" aria-expanded="false">Energiegebruik en maatregelen
</button>
</h3>
</div>
<div class="dso-accordion-section">
<h3 class="dso-section-handle"><button type="button" aria-expanded="false">Emissies, maatregelen en technieken
</button>
</h3>
</div>
<div class="dso-accordion-section">
<h3 class="dso-section-handle"><button type="button" aria-expanded="false">Beschrijving toestand van de lokatie
</button>
</h3>
</div>
<div class="dso-accordion-section">
<h3 class="dso-section-handle"><button type="button" aria-expanded="false">Afvalstoffen
</button>
</h3>
</div>
</div>
</form>
</main>
<main>
<form>
{% render '@application-heading', {title: appheading.title, subtitle: appheading.subtitle, step: appheading.step} %}
<h3>Milieubelastende activiteit - Vergunning (Gemeente)</h3>
{% render '@accordion', accordion %}
</form>
</main>
appheading:
title: Aanvraag Laan van Eik en Duinen 125, Den Haag
subtitle: 5. Documenten
step: Stap 5/7
accordion:
sections:
- title: Veehouderij
id: panel1
open: true
sections:
- title: Beschrijving installatie en activiteiten
id: panel1
open: true
richContent: >
<p>Geef een tekening van de nieuwe situatie in 1:100. Een
situatietekening geeft een schets van de bestaande en de nieuwe
situatie met daarop duidelijk de maatvoering en de schaalaanduiding
(1:100).</p>
fieldsets:
- groups:
- id: documenten
inputType: files
label: Documenten
files:
- filename: Schetsen_en_foto's_1.pdf
- filename: Bijlagen_hoveniersbedrijf_de_heggeschaar_hoveniers.jpg
confidential: true
buttons:
- type: button
modifier: dso-primary
label: Volgende
- title: Beschrijving grondstoffen en hulpstoffen
id: panel2
- title: Energiegebruik en maatregelen
id: panel3
- title: Emissies, maatregelen en technieken
id: panel4
- title: Beschrijving toestand van de lokatie
id: panel5
- title: Afvalstoffen
id: panel6