<div class="user-detail-view">
    <div class="menu-header">
        <div class="menu-title">{{'UserManagement' | translate}}</div>
        <div class="menu-log">
            <button class="btn btn-not-important" ng-click="showOperateLogPop()"><i class="material-icons">description</i><span translate="log"></span></button>
        </div>
    </div>
    <div class="content-container" style="background-color:#ffffff;">
        <div class="left-container">
            <div class="top">
                <div><i class="material-icons icon-array" ng-click="back()">&#xE314;</i></div>
                <div><i class="material-icons icon-user">&#xE7FD;</i></div>
                <div class="user-name">&nbsp;<span title="{{user.userName}}">{{user.userName | limitString:26}}</span></div>
                <div class="user-modify">
                    <i class="fa fa-pencil-square-o icon-user-modify" aria-hidden="true"></i>
                    <span class="str-modify" ng-class="{false:'no-permission'}[hasEditPermission]" ng-click="updateUser(user)">修改</span>
                </div>
                <div class="user-disabled">
                    <i class="material-icons icon-user-disabled" ng-if="user.status==1">&#xE033;</i>
                    <i class="material-icons icon-user-disabled" ng-if="user.status!=1">&#xE038;</i>
                    <span class="icon-user-disabled">
                        <span ng-if="user.status==1" ng-class="{false:'no-permission'}[hasEditPermission]" data-status="1" ng-click="disableUser(user)">停用</span>
                        <span ng-if="user.status!=1" ng-class="{false:'no-permission'}[hasEditPermission]" data-status="0" ng-click="enable(user)">启用</span>
                    </span>
                </div>
            </div>
            <div class="clear"></div>
            <div class="middle">

                <div class="row">
                    <div style="float: left;">机构:</div>
                    <div class="org-name">&nbsp;<span title="{{user.organizationName}}">{{user.organizationName | limitString:26}}</span></div>
                </div>


                <div class="row">
                    <div style="float: left;">邮箱:</div>
                    <div class="email">&nbsp;<span title="{{user.email}}">{{user.email | limitString:26}}</span></div>
                </div>


                <div class="row">
                    <div style="float: left;">账号:</div>
                    <div class="account-status" ng-if="user.status==1">正常<i class="material-icons">&#xE86C;</i></div>
                    <div class="account-status" ng-if="user.status!=1">停用<i class="material-icons" style="color:#757575">&#xE5C9;</i></div>
                </div>
            </div>
            <div class="clear"></div>
            <div class="bottom">
                <div class="header row role-header" style="margin-top:15px;">
                    <div class="header-left col-sm-10 col-md-10">
                        角色权限
                    </div>
                    <div class="header-right col-md-2" style="padding-left:0px;">
                        <span ng-class="{false:'no-permission'}[hasEditPermission]" ng-click="popupRoleAddWin()" class="v-role">
                            <i class="material-icons v-role" ng-click="popupRoleAddWin()">&#xE148;</i>
                            <span style="font-size: 12px;">添加</span>
                        </span>
                    </div>
                </div>
                <div class="header row">
                    <div class="header-left col-sm-12 col-md-12" style="margin-top: -10px; max-height:78px; overflow-y:auto">
                        <div ng-repeat="role in roleInfoList">
                            <div class="role-name normal-color"
                                 ng-class="{true: 'active', false: 'inactive'}[selectedRoleID==role.roleID]"
                                 ng-click="loadPermissions(role.roleID,$event)"
                                 title="{{::role.roleName}}">
                                <span>
                                    <span>{{role.roleName|limitString:7}}</span>
                                    <span class="remove-role-name" ng-class="{false:'no-permission'}[hasEditPermission]" style="display:none" ng-click="removeRole(role)"><i class="fa fa-times" aria-hidden="true"></i></span>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="clear"></div>
                <div class="content">
                    <div class="dx-viewport grid-container">
                        <div id="GridContainerPermission" dx-tree-view="permissionTreeViewOptions">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="right-container">
            <div class="align-right" style="margin-top:5px">
                <!--<button class="btn btn-export" type="button" ng-click="" translate="Export"></button>-->
                <export-button style="float: right; margin-left: 0px; margin-top: 7px"><export-button>
            </div>

            <div class="header">
                <div class="header-left">机构权限设置</div>
                <!--<div class="header-right" ng-click="AddOrg()"><i class="material-icons">&#xE148;</i></div>-->
            </div>

            <div class="bottom">

                <!--总体设置-->

                <div style="margin: 10px 20px 0px 15px; display:block;">
                    <div>
                        <div>
                            <div style="height: 36px; line-height: 36px; float: left;">机构上层维度设置</div>
                            <div style="float:right">
                                <button class="btn btn-in-grid" ng-class="{false:'no-permission'}[hasEditPermission]" ng-disabled="!hasEditPermission" ng-click="popupDimensionAddWin()" style="margin-bottom: 5px;">
                                    <i class=" material-icons">add_circle_outline</i> <span translate="AddDimensionTitle"></span>
                                </button>
                            </div>
                        </div>
                        <div class="clear"></div>
                        <div id="generalSettingGrid" style="width:99%;height:200px;border-radius: 5px;"
                             ui-grid="generalSettingList"
                             ui-grid-selection
                             ui-grid-auto-resize
                             ng-style="getGridHeight()">

                        </div>
                    </div>

                </div>

                <!--各机构设置-->
                <div style="margin: 30px 20px 0px 15px; display:block;" id="orgSetting">
                    <div>
                        <div>
                            <div style="height: 36px; line-height: 36px; float: left;">各机构设置</div>
                            <div style="float:right">
                                <button class="btn btn-in-grid" ng-click="addExistOrg()" ng-class="{false:'no-permission'}[hasEditPermission]" ng-disabled="!hasEditPermission">
                                    <i class=" material-icons">add_circle_outline</i> <span translate="AddOrgTitle"></span>
                                </button>
                            </div>
                        </div>
                        <div class="clear"></div>
                        <div id="orgSettingGrid" style="width:99%;height:300px;margin-top: 5px;"
                             ui-grid="orgSettingList"
                             ui-grid-selection
                             ui-grid-auto-resize
                             ng-style="getGridHeight()">

                        </div>
                    </div>
                </div>

                <!--分配角色-->
                <div class="assign-user-box" id="assign-user-box">
                    <div class="role-item-container">

                        <!--是否可访问-->
                        <input type="checkbox" ng-model="roleEntity.isAccessible"><span class="title-left">{{'IsAccessible' | translate}}</span></input>

                        <div class="role-box">
                            <!--原始角色-->
                            <div class="role-title">
                                <input type="checkbox" ng-model="roleEntity.isHeritable" ng-disabled="!roleEntity.isAccessible" />
                                <span class="title-left">{{'OriginalRole' | translate}}</span>
                            </div>
                            <div class="role-item">
                                <div class="role-item" ng-if="originalUserRoleList.length==0" translate="NoRolesToAssign"></div>
                                <div class="role-item" ng-repeat="r in originalUserRoleList">
                                    <div class="role-item"><span title="{{r.name}}">{{r.name |limitString:12}}</span></div>
                                </div>
                            </div>
                            <!--全部角色-->
                            <div class="role-title">
                                <input type="checkbox" ng-model="roleEntity.isAllRoleChecked" ng-click="AllRoleChecked()" ng-disabled="!roleEntity.isAccessible" />
                                <span class="title-left">{{'ExtraRole' | translate}}</span>
                            </div>
                            <div class="role-item">
                                <div class="role-item" ng-if="roleList.length==0" translate="NoRolesToAssign"></div>
                                <div class="role-item" ng-repeat="role in roleList">
                                    <input type="checkbox" value="role.id" ng-model="role.isChecked" ng-disabled="!roleEntity.isAccessible" /><span title="{{role.name}}"> {{role.name |limitString:12}}</span>
                                </div>
                            </div>

                        </div>

                    </div>
                    <div class="card-footer">
                        <button type="button" class="btn btn-primary" ng-click="setRoleToDimensionValue()">{{'Confirm' | translate }}</button>
                        <button type="button" class="btn btn-third" ng-click="closeSetRoleCard()">{{'Cancel' | translate }}</button>
                    </div>
                </div>
            </div>
        </div>
        <!--编辑或者添加机构信息-->
        <edit-organization-modal operate-type="orgOperateType" is-update="isOrgUpdate" selected-organization="selectedOrg" new-organization="organization"></edit-organization-modal>
        <!-- 编辑用户 -->
        <edit-user-modal operate-type="userOperateType " selected-user="selectedUser " is-update="isUpdateUser"></edit-user-modal>
        <!--添加现有角色-->
        <add-exist-role-modal operate-type="addExistRoleOperateType" is-update="addExistRoleIsUpdated" selected-role-list="selectedRoleList"></add-exist-role-modal>
        <!--添加现有维度-->
        <add-exist-dimension-modal operate-type="addExisDimensionOperateType" is-update="addExistDimensionIsUpdated" selected-dimension-list="selectedDimensionValueList"></add-exist-dimension-modal>
        <!--添加现有机构-->
        <add-exist-organization-modal operate-type="addExistOrgOperateType" is-update="addExistOrgIsUpdate" selected-org-list="selectedExistOrgList" selected-key-items="selectedKeyItems"></add-exist-organization-modal>
        <!--用户机构权限控制-->
        <user-organization-access-modal operate-type="userRoleOperateType" is-update="userRolesIsUpdate" user-id="selectedUserID" organization-id="selectedOrgID"></user-organization-access-modal>
    </div>

    <operate-log is-show="isShowLog" filter-operation-object-list="filterOperationObjectList"></operate-log>
</div>