<vdr-action-bar>
    <vdr-ab-left>
        <vdr-entity-info [entity]="entity$ | async"></vdr-entity-info>
    </vdr-ab-left>
    <vdr-ab-right>
        <vdr-action-bar-items locationId="role-detail"></vdr-action-bar-items>
        <button
            class="btn btn-primary"
            *ngIf="isNew$ | async; else updateButton"
            (click)="create()"
            [disabled]="detailForm.invalid || detailForm.pristine"
        >
            {{ 'common.create' | translate }}
        </button>
        <ng-template #updateButton>
            <button
                class="btn btn-primary"
                (click)="save()"
                *vdrIfPermissions="'UpdateAdministrator'"
                [disabled]="detailForm.invalid || detailForm.pristine"
            >
                {{ 'common.update' | translate }}
            </button>
        </ng-template>
    </vdr-ab-right>
</vdr-action-bar>

<form class="form" [formGroup]="detailForm">
    <vdr-form-field [label]="'common.description' | translate" for="description">
        <input
            id="description"
            type="text"
            formControlName="description"
            [readonly]="!('UpdateAdministrator' | hasPermission)"
            (input)="updateCode($event.target.value)"
        />
    </vdr-form-field>
    <vdr-form-field
        [label]="'common.code' | translate"
        for="code"
        [readOnlyToggle]="'UpdateAdministrator' | hasPermission"
    >
        <input
            id="code"
            type="text"
            formControlName="code"
            [readonly]="!('UpdateAdministrator' | hasPermission)"
        />
    </vdr-form-field>
    <vdr-form-field [label]="'settings.channel' | translate">
        <vdr-channel-assignment-control
            formControlName="channelIds"
            [vdrDisabled]="!('UpdateAdministrator' | hasPermission)"
        ></vdr-channel-assignment-control>
    </vdr-form-field>
    <label>{{ 'settings.permissions' | translate }}</label>
    <vdr-permission-grid
        [permissionDefinitions]="permissionDefinitions"
        [activePermissions]="detailForm.get('permissions')?.value"
        (permissionChange)="setPermission($event)"
        [readonly]="!('UpdateAdministrator' | hasPermission)"
    ></vdr-permission-grid>
</form>
