{% extends 'OroUIBundle:actions:update.html.twig' %}
{% import 'OroDataGridBundle::macros.html.twig' as dataGrid %}

{% form_theme form with 'OroFormBundle:Form:fields.html.twig' %}

{% set formAction = entity.id ? path('oro_account_account_user_role_update', {id: entity.id}) : path('oro_account_account_user_role_create') %}

{% oro_title_set({params : {"%label%": entity.label|default('N/A'|trans), '%entityName%': 'oro.account.accountuserrole.entity_label'|trans} }) %}

{% block navButtons %}
    {% set fields = [] %}
    {% for name, child in form %}
        {% if name not in ['appendUsers', 'removeUsers', 'entity', 'privileges', 'action'] %}
            {% set fields = fields|merge({(name): '#' ~ child.vars.id}) %}
        {% endif %}
    {% endfor %}

    {% set options = {
        elSelector: '.btn-success.role-submit',
        formName: form.vars.name,
        formSelector: '#' ~ form.vars.id,
        accountSelector: '#' ~ form.account.vars.id,
        privilegesSelector: '#' ~ form.privileges.vars.id,
        appendUsersSelector: '#roleAppendUsers',
        removeUsersSelector: '#roleRemoveUsers',
        fields: fields
    } %}
    <div data-page-component-module="oroaccount/js/app/views/account-role-view"
         data-page-component-options="{{ options|json_encode }}">
    </div>

    {{ parent() }}

    {{ UI.cancelButton(path('oro_account_account_user_role_index')) }}
    {% set html = UI.saveAndCloseButton({
        'type': 'button',
        'class': 'btn-success role-submit',
        'route': 'oro_account_account_user_role_view',
        'params': {'id': '$id'}
    }) %}
    {% if entity.id or resource_granted('oro_account_account_user_role_update') %}
        {# button attribute 'action' is avoided because of there is unacceptable submit binding on .action-button in init-layout.js #}
        {% set html = html ~ UI.saveAndStayButton({
            'class': 'btn-success main-group role-submit',
            'route': 'oro_account_account_user_role_update',
            'params': {'id': '$id'}
        }) %}
    {% endif %}
    {{ UI.dropdownSaveButton({'html': html}) }}
{% endblock %}

{% block pageHeader %}
    {% if entity.id %}
        {% set breadcrumbs = {
            'entity':      entity,
            'indexPath':   path('oro_account_account_user_role_index'),
            'indexLabel': 'oro.account.accountuserrole.entity_plural_label'|trans,
            'entityTitle': entity.label|default('N/A'|trans)
        } %}
        {{ parent() }}
    {% else %}
        {% set title = 'oro.ui.create_entity'|trans({'%entityName%': 'oro.account.accountuserrole.entity_label'|trans}) %}
        {% include 'OroUIBundle::page_title_block.html.twig' with { title: title } %}
    {% endif %}
{% endblock pageHeader %}

{% block content_data %}
    {% set id = 'account-user-role-edit' %}

    {% set accountSelectorComponentOptions = {
        accountFieldId: '#' ~ form.account.vars.id,
        datagridName: 'account-account-users-grid-update',
        originalValue: form.account.vars.value
    } %}

    {% set accountSelector %}
        <div data-page-component-module="oroaccount/js/app/components/account-user-role-component"
             data-page-component-options="{{ accountSelectorComponentOptions|json_encode }}">
            {{ form_row(form.account) }}
        </div>
    {% endset %}

    {% set fields = [
            form_row(form.label),
            accountSelector,
        ]
    %}

    {% if entity.public %}
        {% set fields = fields|merge([form_row(form.selfManaged)]) %}
    {% endif %}

    {% set dataBlocks = [
        {
            'title': 'oro.account.sections.general'|trans,
            'class': 'active',
            'subblocks': [
                {
                    'data': fields
                }
            ]
        }
    ] %}

    {% set rolePermissionsGrid %}
        <div {{ UI.renderPageComponentAttributes({
            module: 'orouser/js/components/role/entity-category-tabs-component',
            options: tabsOptions
        }) }}></div>
        {{ dataGrid.renderGrid('account-user-role-permission-grid', {role: entity}, { cssClass: 'inner-permissions-grid' }) }}
        <div {{ UI.renderPageComponentAttributes({
            module: 'orouser/js/components/role/capability-set-component',
            options: capabilitySetOptions
        }) }}></div>
    {% endset %}

    {% set dataBlocks = dataBlocks|merge([{
        'title': form.vars.privilegeConfig['entity'].label|trans,
        'subblocks': [
            {
                'title': '',
                'useSpan': false,
                'data': [
                    rolePermissionsGrid
                ]
            }
        ]
    }]) %}

    {% set dataBlocks = dataBlocks|merge([{
        'title' : 'oro.account.accountuser.entity_plural_label'|trans,
        'subblocks': [{
            'title' : null,
            'useSpan': false,
            'data' : [
                form_widget(form.appendUsers, {'id': 'roleAppendUsers'}),
                form_widget(form.removeUsers, {'id': 'roleRemoveUsers'}),
                dataGrid.renderGrid('account-account-users-grid-update', {role: entity.id, account: entity.account.id|default(null)}, { cssClass: 'inner-grid' })
            ]
        }]
    }] ) %}

    {% set data = {
        'formErrors': form_errors(form),
        'dataBlocks': dataBlocks
    }%}

    {{ parent() }}
{% endblock content_data %}