{% extends '@commons/default.html.twig' %}

{% block content %}
    <div class="demo-updates mdl-card mdl-shadow--2dp mdl-cell mdl-cell--4-col mdl-cell--4-col-tablet mdl-cell--4-col-desktop">
        <div class="mdl-card__title mdl-card--expand mdl-color--teal-300">
            <h2 class="mdl-card__title-text">{{ company }}</h2>
        </div>
        <form name="add_company" action="{{ link }}" method="post">
            <div class="mdl-card__supporting-text mdl-color-text--grey-600">
                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label" >
                    <input class="mdl-textfield__input" type="text" id="forename" name="forename" value="{{ staff.forename }}">
                    <label class="mdl-textfield__label" for="forename">Vorname</label>
                </div>
                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label" >
                    <input class="mdl-textfield__input" type="text" id="surname" name="surname" value="{{ staff.surname }}">
                    <label class="mdl-textfield__label" for="surname">Nachname</label>
                </div>
                <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label" >
                    <input class="mdl-textfield__input" type="text" id="mail" name="mail" value="{{ staff.mail }}">
                    <label class="mdl-textfield__label" for="mail">Mailadresse</label>
                </div>
                <div>
                    Rollen:
                    <ul class="demo-list-control mdl-list">
                        {% for role in roles %}
                            <li class="mdl-list__item">
                                <span class="mdl-list__item-primary-content mdl-color-text--grey-600">{{ role.label }}</span>
                                <span class="mdl-list__item-secondary-action">
                                    <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="role-checkbox-{{ role.id }}">
                                        {% if role.checked %}
                                            <input type="checkbox" name="role-checkbox-{{ role.id }}" id="role-checkbox-{{ role.id }}" class="mdl-checkbox__input" value="role_{{ role.id }}" checked/>
                                        {% else %}
                                            <input type="checkbox" name="role-checkbox-{{ role.id }}" id="role-checkbox-{{ role.id }}" class="mdl-checkbox__input" value="role_{{ role.id }}"/>
                                        {% endif %}
                                    </label>
                                </span>
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>
            <input class="mdl-textfield__input" type="hidden" id="user_id" name="user_id">
            <div class="mdl-card__actions mdl-card--border">
                <a href="{{ back_link }}"><button class="mdl-button mdl-js-button mdl-js-ripple-effect" type="button">Zurück</button></a>
                <button class="mdl-button mdl-js-button mdl-js-ripple-effect" type="submit">Senden</button>
            </div>
        </form>
    </div>
{% endblock %}