<div class="form-group d-flex flex-wrap">
<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 -sm -hover -border -pointer cursor-default">
<i class="icon-view"></i>
</div>
<div class="a-circle -sm -hover -border -pointer cursor-default" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_configuration_menu" data-custom-class="-menu">
<i class="icon-vertical-dots"></i>
</div>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item'>Dearchiveren</div>
</div>
</div>
</div>
</div>
<div class="m-configuration__bottom -borderTop p-3 p-md-4">
<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>
</div>
</div>
</div>
<div class="form-group d-flex flex-wrap">
{% if table == false %}<label class="flex-grow-1">{{label}}</label>{% endif %}
{% if text %}<p class="form-text">Voer eventuele wijzigingen door aan de primaire configuratie, of dupliceer de configuratie.</p>{% endif %}
{% if (planner == true) and (title1=="") and (title2=="") %}
{% set title1="Adviesgesprek 1" %}
{% set title2="Adviesgesprek 2" %}
{% endif %}
{% render '@configuration', {radio:radio, notes:notes, table:table, planner:planner, title:title1, buttons:buttons, documentation_checklist:documentation_checklist, invalid:invalid, valid:valid, disabled:disabled, checked:checked, badge:badge, tabs:tabs}, true %}
{% if table == false and planner == true %}{% render '@configuration', {radio:radio, notes:notes, planner:planner, title:title2, buttons:buttons, invalid:invalid, valid:valid, disabled:disabled, badge:badge}, true %}{% endif %}
{% if add %}{% render '@add-item--no-box' %}{% endif %}
{% if show_feedback %}<div class="{% if valid %}valid-feedback{% endif %}{% if invalid %}invalid-feedback{% endif %}{% if feedback_message %} d-inline-block{% endif %}"><strong>{{feedback_message}}</strong></div>{% endif %}
</div>
{
"label": "Selecteer een definitieve configuratie",
"invalid": false,
"valid": false,
"feedback_message": "This field is invalid",
"show_feedback": false,
"radio": false,
"table": true,
"planner": false,
"buttons": false,
"documentation_checklist": false,
"disabled": false,
"checked": false,
"text": false,
"title1": "De Klamp Schets 1",
"title2": "De Klamp Schets 1",
"add": false,
"badge": false,
"notes": false,
"tabs": false
}
When the configuration group is disabled, the configuration should not be editable. Therefor the edit button should change to a view button. Change .icon-edit-alt to .icon-view.