<div class="m-configuration w-100 overflow-hidden">
<div class="m-configuration__main d-flex justify-content-between align-items-center position-relative p-3 p-md-4">
<div class="m-configuration__info d-flex align-items-center flex-grow-1">
<img class="m-configuration__img rounded-circle mr-3 mr-lg-4" src="/fractal/build/img/img11.jpg">
<div class="flex-grow-1">
<strong>De Klamp Schets 1</strong>
<div class="text-muted">Totaal opties: € 15.317,65</div>
<div class="text-muted">Laatst gewijzigd: 12-03-2021, 13:25</div>
</div>
</div>
<div class="m-configuration__actions d-flex flex-column flex-sm-row ml-2">
<div class="a-circle -view -smaller -hover -border -pointer cursor-default">
<i class="icon-view"></i>
</div>
<div class="a-circle -smaller -hover -border -pointer cursor-default">
<i class="icon-sync"></i>
</div>
</div>
</div>
<div class="m-configuration__bottom ">
<ul class="list-group">
<li class="list-group-item py-2 px-3 px-md-4 d-flex justify-content-between align-items-center">
<a href="bestand.pdf" target="_blank" class="mr-3 d-flex text-muted pointer-events-none"><span class="list-group-label flex-grow-1">Listgroup label of bestandsnaam</span><span>.pdf</span></a>
<div class="d-flex align-items-center">
<button type="button" class="btn btn-sm btn-primary -iconRight">
Genereer
</button>
</div>
</li>
<li class="list-group-item py-2 px-3 px-md-4 d-flex justify-content-between align-items-center">
<a href="bestand.pdf" target="_blank" class="mr-3 d-flex text-muted pointer-events-none"><span class="list-group-label flex-grow-1">Listgroup label of bestandsnaam</span><span>.pdf</span></a>
<div class="d-flex align-items-center">
<span class="d-none d-md-inline-block text-muted mr-2 white-space-nowrap">Document genereren</span>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32px" height="32px" viewBox="20 20 60 60">
<circle cx="50" cy="50" r="27" stroke="#ececec" stroke-width="5" fill="none" />
<circle cx="50" cy="50" r="27" stroke="#69d2c2" stroke-width="5" stroke-linecap="round" fill="none">
<animateTransform attributeName="transform" type="rotate" repeatCount="indefinite" dur="1.5384615384615383s" values="0 50 50;180 50 50;720 50 50" keyTimes="0;0.5;1" />
<animate attributeName="stroke-dasharray" repeatCount="indefinite" dur="1.5384615384615383s" values="15.079644737231007 173.41591447815657;147.0265361880023 41.469023027385276;15.079644737231007 173.41591447815657" keyTimes="0;0.5;1" />
</circle>
</svg>
</div>
</li>
<li class="list-group-item py-2 px-3 px-md-4 d-flex justify-content-between align-items-center">
<a href="bestand.pdf" target="_blank" class="mr-3 d-flex "><span class="list-group-label flex-grow-1">Listgroup label of bestandsnaam</span><span>.pdf</span></a>
<div class="d-flex align-items-center">
<a href="" target="_blank" class="a-circle -view -sm -hover -border -pointer cursor-default">
<i class="icon-view"></i>
</a>
<div class="a-circle -download -sm -hover -border -pointer cursor-default">
<i class="icon-download-alt"></i>
</div>
<div class="a-circle -sm -hover -border -pointer cursor-default">
<i class="icon-bin"></i>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="m-configuration w-100{% if radio %} -radio{% endif %}{% if invalid %} is-invalid{% endif %}{% if valid %} is-valid{% endif %}{% if disabled %} -disabled{% endif %}{% if checked %} -checked{% endif %} overflow-hidden" {% if disabled %}aria-disabled="true"{% endif %}>
<div class="m-configuration__main d-flex justify-content-between align-items-center position-relative p-3 p-md-4">
{% if radio %}
<div class="m-configuration__radio mr-3 mr-lg-4">
{% if disabled %}
{% set suffix="-disabled" %}
{% endif %}
{% render '@radio-button', {name:"configuratie"+suffix, label:label, fill:true, disabled:disabled, checked:checked}, true %}
</div>
{% endif %}
<div class="m-configuration__info d-flex align-items-center flex-grow-1">
{% if planner %}
<div class="flex-grow-1">
<strong {% if badge %}class="mr-2"{% endif %}>{{title}}</strong> {% if badge %}<div class="d-inline-block">{% render '@badge', {text:"In behandeling", color:"warning"}, true %}</div>{% endif %}
<div class="text-muted">17-04-2021</div>
{% if buttons %}
<div class="d-flex flex-wrap mt-3">
{% if title == "Adviesgesprek 1" %}
{% set variant1="border" %}
{% set variant2="danger" %}
{% else %}
{% set variant1="success" %}
{% set variant2="border" %}
{% endif %}
<div class="mr-2">{% render '@button--'+variant1, {text:"Goedgekeurd", small:true}, true %}</div>
{% render '@button--'+variant2, {text:"Afgewezen", small:true}, true %}
</div>
{% endif %}
</div>
{% else %}
<img class="m-configuration__img rounded-circle mr-3 mr-lg-4" src="{{root}}{{img_folder}}img11.jpg">
<div class="flex-grow-1">
<strong>{{title}}</strong>
<div class="text-muted">Totaal opties: € 15.317,65</div>
<div class="text-muted">Laatst gewijzigd: 12-03-2021, 13:25</div>
</div>
{% endif %}
</div>
<div class="m-configuration__actions d-flex flex-column flex-sm-row ml-2">
{% if radio or planner %}{% if disabled %}{% set icon="view" %}{% else %}{% set icon="edit-alt" %}{% endif %}{% else %}{% set icon="view" %}{% endif %}{% render '@circle--smaller', {icon:icon}, true %}
{% if radio and not disabled %}{% render '@circle--smaller', {icon:"copy"}, true %}{% elseif not planner and not table and not radio %}{% render '@circle--smaller', {icon:"sync"}, true %}{% endif %}
</div>
</div>
<div class="m-configuration__bottom {% if table %}-borderTop p-3 p-md-4{% endif %}">
{% if table %}
<table class="m-configuration__table table -noBorder">
<thead>
<tr>
<th colspan="2"><strong>Besteloverzicht</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td>Type bestelling</td>
<td class="text-right">Huur</td>
</tr>
<tr>
<td>Aantal woningen</td>
<td class="text-right">24, waarvan 12 hoekwoningen</td>
</tr>
<tr>
<td>Woningtypes en beukmaten</td>
<td class="text-right">Fijn 101 5040, Fijn 201 5040</td>
</tr>
<tr>
<td>Datum offerte akkoord</td>
<td class="text-right">21-01-2021</td>
</tr>
</tbody>
<tfoot>
<tr>
<td><strong>Totaalsom</strong></td>
<td class="text-right"><strong>€8.817.000</strong></td>
</tr>
</tfoot>
</table>
{% else %}
{% set amount=3 %}
{% if planner or disabled %}{% set amount=1 %}{% endif %}
{% if amount == 1 and disabled %}
{% render '@list-group', {amount:amount, disabled:true}, true %}
{% else %}
{% render '@list-group', {amount:amount}, true %}
{% endif %}
{% endif %}
</div>
</div>
{
"label": "",
"title": "De Klamp Schets 1",
"name": "keuze",
"border": false,
"valid": false,
"invalid": false,
"radio": false,
"table": false,
"planner": false,
"buttons": false,
"documentation_checklist": false,
"disabled": false,
"checked": false,
"tabs": false
}
No notes defined.