Verzoeken Indienen
Component preview opent in nieuw tabbladThere are no notes for this item.
<header>
<div class="dso-logo-bar">
<img src="../../images/omgevingsloket.png" alt="Omgevingsloket" class="logo" />
<div class="dso-tools-bar">
<div class="dso-login">
<a href="" class="btn btn-link">
<dso-icon icon="user"></dso-icon><span>Inloggen</span>
</a>
</div>
</div>
</div>
<nav class="dso-navbar">
<div class="dso-navbar-header">
<button type="button" class="dso-navbar-toggle btn btn-default">
<dso-icon icon="bars"></dso-icon>
<span class="sr-only">Ga naar menu</span>
</button>
</div>
<ul class="dso-nav dso-nav-main">
<li>
<a href="#">
Home
</a>
</li>
<li>
<a href="#">
Vergunningcheck
</a>
</li>
<li class="dso-active">
<a href="#">
Aanvragen
</a>
</li>
<li>
<a href="#">
Regels op de kaart
</a>
</li>
<li>
<a href="#">
Mijn Omgevingsloket
</a>
</li>
</ul>
</nav>
</header>
<main>
<form>
<h1>Object Laan van Eik en Duinen 125, Den Haag</h1>
<h2 class="dso-steps-indicator">
7. Verzoeken indienen
<span class="dso-step">
Stap 7 van 7
</span>
</h2>
<div class="dso-accordion form-horizontal">
<div class="dso-accordion-section dso-open">
<h3 class="dso-section-handle"><button type="button" aria-expanded="true">Verzoek 1: Object Laan van Eik en Duinen 125, 's-Gravenhage 1
</button>
</h3>
<div class="dso-section-body">
<dl>
<dt>Indienen bij:</dt>
<dd>Gemeente Den Haag</dd>
<dt>Soort:</dt>
<dd>Aanvraag vergunning</dd>
<dt>Bevat:</dt>
<dd>Milieubelastende activiteit - Vergunning (Gemeente)</dd>
<dt>Doel:</dt>
<dd>Definitief verzoek</dd>
</dl>
<fieldset>
<legend>Verzoek</legend>
<div class="form-group dso-textarea">
<div class="dso-label-container">
<label for="toelichting" class="control-label">
Ruimte om uw verzoek toe te lichten
</label>
</div>
<div class="dso-field-container">
<textarea class="form-control" id="toelichting" rows="5"></textarea>
</div>
</div>
</fieldset>
<fieldset class="form-group dso-files">
<div class="dso-description dso-rich-content">
</div>
<legend class="sr-only">Vraag om bijlage</legend>
<div class="dso-label-container">
<label for="documenten1" class="control-label" aria-hidden="true">
Vraag om bijlage
</label>
<button type="button" class="btn dso-info-button" aria-expanded="false">
<span class="sr-only">Toelichting bij Vraag om bijlage</span>
</button>
</div>
<div class="dso-field-container">
<ul class="dso-filelist">
<li>
<div class="dso-filename" id="documenten1-file-filename-0">
Bestand.pdf
</div>
<div class="dso-confidential dso-selectable">
<input type="checkbox" id="documenten1-input-confirm-0" name="" value="" aria-describedby="documenten1-file-filename-0" />
<label for="documenten1-input-confirm-0">
Vertrouwelijk
</label>
</div>
<button type="button" aria-describedby="documenten1-file-filename-0" class="btn btn-link dso-remove"><span>Verwijder document</span></button>
</li>
</ul>
<!-- To use an input type="file" element -->
<div class="dso-file-upload">
<input type="file" id="documenten1-file-upload" />
<label class="btn btn-default" for="documenten1-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="btn btn-link"><dso-icon icon="plus"></dso-icon><span >Document toevoegen</span></button>
-->
</fieldset>
<fieldset>
<legend>Vragengroep titel</legend>
<div class="form-group dso-input">
<div class="dso-label-container">
<label for="classificatie" class="control-label">
Vraag met classificatie 'verzoek'
</label>
</div>
<div class="dso-field-container">
<input type="" id="classificatie" class="form-control">
</div>
</div>
</fieldset>
<div class="dso-form-buttons">
<button type="button" class="btn btn-primary"><span>Volgende</span></button>
</div>
</div>
</div>
<div class="dso-accordion-section">
<h3 class="dso-section-handle"><button type="button" aria-expanded="false">Verzoek 2: Object Laan van Eik en Duinen 125, 's-Gravenhage 2
</button>
</h3>
</div>
</div>
<dso-highlight-box>
<div class="dso-rich-content">
<h3>Kosten</h3>
<p>De kosten van een aanvraag zijn verschillend. Kijk op de website van uw gemeente, waterschap of provincie voor de precieze kosten.</p>
</div>
</dso-highlight-box>
<form>
<div class="form-group dso-confirm">
<div class="dso-field-container">
<div class="dso-selectable">
<input type="checkbox" id="confirm" name="confirm">
<label for="confirm">
Hierbij verklaar ik alle vragen naar waarheid te hebben ingevuld.
</label>
</div>
</div>
</div>
<div class="dso-form-buttons">
<div class="dso-aside">
<button type="button" class="btn btn-link">
<dso-icon icon="chevron-left"></dso-icon><span>Vorige</span>
</button>
</div>
<button type="button" class="btn btn-link">
<dso-icon icon="download"></dso-icon><span>Downloaden</span>
</button>
<button type="submit" class="btn btn-primary"><span>Indienen</span></button>
</div>
</form>
</form>
</main>
<footer>
<div class="row">
<div class="col-sm-6 col-md-3">
<h2>Service</h2>
<ul>
<li><a href="#">Contact</a></li>
<li><a href="#">Sitemap</a></li>
<li><a href="#">Help</a></li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<h2>Over deze site</h2>
<ul>
<li><a href="#">Copyright</a></li>
<li><a href="#">Privacy</a></li>
<li><a href="#">Cookies</a></li>
<li><a href="#">Toegankelijkheid</a></li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<h2>Volg ons ook op</h2>
<ul>
<li><a href="#">Twitter</a></li>
<li><a href="#">LinkedIn</a></li>
</ul>
</div>
</div>
</footer>
{% render '@header', {menu: menu, breadcrumbs: []} %}
<main>
<form>
<h1>Object Laan van Eik en Duinen 125, Den Haag</h1>
{% render '@form-steps', steps %}
{% render '@accordion', accordion %}
<dso-highlight-box>
<div class="dso-rich-content">
<h3>Kosten</h3>
<p>De kosten van een aanvraag zijn verschillend. Kijk op de website van uw gemeente, waterschap of provincie voor de precieze kosten.</p>
</div>
</dso-highlight-box>
{% render '@form', form %}
</form>
</main>
{% render '@footer' %}
menu:
modifier: main
items:
- label: Home
- label: Vergunningcheck
- label: Aanvragen
active: true
- label: Regels op de kaart
- label: Mijn Omgevingsloket
steps:
title: 7. Verzoeken indienen
step: Stap 7 van 7
accordion:
modifiers: form-horizontal
sections:
- title: 'Verzoek 1: Object Laan van Eik en Duinen 125, ''s-Gravenhage 1'
id: panel1
open: true
definitions:
- term: 'Indienen bij:'
descriptions:
- description: Gemeente Den Haag
- term: 'Soort:'
descriptions:
- description: Aanvraag vergunning
- term: 'Bevat:'
descriptions:
- description: Milieubelastende activiteit - Vergunning (Gemeente)
- term: 'Doel:'
descriptions:
- description: Definitief verzoek
fieldsets:
- legend: Verzoek
groups:
- id: toelichting
inputType: textarea
rows: 5
label: Ruimte om uw verzoek toe te lichten
- groups:
- id: documenten1
label: Vraag om bijlage
inputType: files
infoOpen: false
infoButtonLabel: Toelichting bij Vraag om bijlage
infoText: none
files:
- filename: Bestand.pdf
- legend: Vragengroep titel
groups:
- id: classificatie
inputType: input
label: Vraag met classificatie 'verzoek'
buttons:
- type: button
modifier: primary
label: Volgende
- title: 'Verzoek 2: Object Laan van Eik en Duinen 125, ''s-Gravenhage 2'
id: panel2
form:
fieldsets:
- modifier: form-vertical
groups:
- id: confirm
inputType: confirm
label: Hierbij verklaar ik alle vragen naar waarheid te hebben ingevuld.
asideButtons:
- type: button
modifier: link
label: Vorige
icon: chevron-left
buttons:
- type: button
modifier: link
label: Downloaden
icon: download
- type: submit
modifier: primary
label: Indienen