<div ng-controller="EditGroupAccessPasswordController as accessCtrl" ng-show="loaded">
    <form name="modalForm" class="form-horizontal">
        <script type="text/ng-template" id="userTypeaheadTemplate.html">
            <a class="typeahead-supporter dropdown-item">
                <span ng-bind-html="match.model.name | uibTypeaheadHighlight:query"></span>
            </a>
        </script>

        <div class="alert alert-warning" ng-show="showOwnUserError">
            {{ "TEXT.OWN_ACCESS_EDIT_NOW_ALLOWED" | translate }}
        </div>

        <div class="form-group">
            <div class="col-sm-12">
                <input type="text" id="userGroup" name="userGroup" placeholder="{{ 'ACCESS_MANAGEMENT.ADD_GROUP'|translate }}" ng-model="userGroup" autocomplete="off" typeahead-template-url="userTypeaheadTemplate.html" uib-typeahead="user as (user.name) for user in getUserGroups($viewValue)" typeahead-no-results="noResults" typeahead-on-select="typeaheadOnSelect($item, $model, $label, $event)" typeahead-editable="false" typeahead-wait-ms="100" class="form-control" required>
                <div ng-show="noResults">
                    <i class="glyphicon glyphicon-remove"></i> {{ "TEXT.NO_RESULTS_FOUND" | translate }}
                </div>
                <div class="invalid-feedback d-block" ng-show="showAlreadyAddedError" translate>ACCESS_MANAGEMENT.TEXT.GROUP_ALREADY_HAS_ACCESS</div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-12">
                <div loading-container="tableParams.settings().$loading" class="table-wrapper">
                    <table ng-table="tableParams" show-filter="true" class="table table-bordered table-striped">
                        <colgroup>
                            <col style="width: 55%">
                            <col style="width: 35%">
                            <col style="width: 10%">
                        </colgroup>
                        <tr ng-repeat="password_access in $data">
                            <td data-title="'WORDS.GROUP'|translate" filter="{ 'user.full_name': 'text' }" sortable="'user.full_name'">
                                {{password_access.user_group.name}}
                            </td>
                            <td data-title="'WORDS.RIGHTS'|translate" filter="{'right': 'select'}" filter-data="selectRights"  sortable="'right'" style="text-align:center;">
                                <div class="btn-group" ng-show="passwordGroup.access == 3">
                                    <label class="btn btn-sm" ng-model="password_access.right" uib-btn-radio="1" ng-class="{'btn-light': password_access.right != 1, 'btn-success': password_access.right == 1}" ng-click="updateAccess(password_access, 1)">Read-Only</label>
                                    <label class="btn btn-sm" ng-model="password_access.right" uib-btn-radio="2" ng-class="{'btn-light': password_access.right != 2, 'btn-warning': password_access.right == 2}" ng-click="updateAccess(password_access, 2)">Moderator</label>
                                    <label class="btn btn-sm" ng-model="password_access.right" uib-btn-radio="3" ng-class="{'btn-light': password_access.right != 3, 'btn-danger': password_access.right == 3}" ng-click="updateAccess(password_access, 3)">Administrator</label>
                                </div>
                                <div class="btn-group" ng-show="passwordGroup.access < 3">
                                    <span class="label label-success" ng-show="password_access.right == 1">Read-Only</span>
                                    <span class="label label-warning" ng-show="password_access.right == 2">Moderator</span>
                                    <span class="label label-danger" ng-show="password_access.right == 3">Administrator</span>
                                </div>
                            </td>
                            <td style="text-align:center;">
                                <div class="btn-group" ng-show="passwordGroup.access == 3">
                                    <a ng-click="delete(password_access)" class="btn btn-light btn-sm"><i class="fa fa-trash-o"></i></a>
                                </div>
                            </td>
                        </tr>
                        <tr ng-if="!$data.length">
                            <td colspan="3" translate>ACCESS_MANAGEMENT.TEXT.NO_PERMISSIONS_FOUND</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </form>
</div>
