You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
92 lines
3.7 KiB
92 lines
3.7 KiB
2 years ago
|
<app-page [scroll]="false">
|
||
|
|
|
||
|
|
<div nz-row class="h-full overflow-hidden bg-white rounded-lg">
|
||
|
|
<div nz-col nzFlex="220px" class="user-type">
|
||
|
|
<nz-card
|
||
|
|
class="h-full "
|
||
|
|
[nzBordered]="false"
|
||
|
|
nzTitle="用户角色"
|
||
|
|
[nzBodyStyle]="{padding:'1px 0 0 0'}">
|
||
|
|
|
||
|
|
<ul nz-menu nzMode="inline">
|
||
|
|
<li
|
||
|
|
*ngFor="let item of roleList"
|
||
|
|
nz-menu-item
|
||
|
|
(click)="onRoleChange(item.id)"
|
||
|
|
[nzSelected]="role?.id === item.id"
|
||
|
|
class="flex items-center justify-between role-item">
|
||
|
|
<span>
|
||
|
|
{{item.roleName}}
|
||
|
|
</span>
|
||
|
|
<nz-space nzSize="small" class="options">
|
||
|
|
<a *nzSpaceItem nz-button nzType="link" nzSize="small"
|
||
|
|
(click)="openForm(roleFormTpl,$event,item)">
|
||
|
|
<span nz-icon nzType="edit"></span>
|
||
|
|
</a>
|
||
|
|
<a *nzSpaceItem nz-button nzType="link" nzSize="small"
|
||
|
|
(click)="deleteItem($event,item.id)">
|
||
|
|
<span nz-icon nzType="delete"></span>
|
||
|
|
</a>
|
||
|
|
</nz-space>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
<div class="px-4 py-2">
|
||
|
|
<button nz-button nzType="dashed" nzBlock (click)="openForm(roleFormTpl,$event)">
|
||
|
|
<i nz-icon nzType="plus"></i>
|
||
|
|
<span>
|
||
|
|
新增角色
|
||
|
|
</span>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</nz-card>
|
||
|
|
</div>
|
||
|
|
<div nz-col nzFlex="1" class="flex-1 h-full overflow-hidden bg-white ">
|
||
|
|
|
||
|
|
<nz-card [nzBordered]="false"
|
||
|
|
class="h-full scroll-card-body ">
|
||
|
|
<nz-card-tab>
|
||
|
|
<nz-tabset nzSize="large" [nzSelectedIndex]="tab" (nzSelectedIndexChange)="onTabChange($event)">
|
||
|
|
<nz-tab nzTitle="用户列表"></nz-tab>
|
||
|
|
<nz-tab nzTitle="权限管理"></nz-tab>
|
||
|
|
</nz-tabset>
|
||
|
|
</nz-card-tab>
|
||
|
|
<div class="p-4">
|
||
|
|
<app-user-list
|
||
|
|
*ngIf="role && tab.toString() === '0'"
|
||
|
|
[users]="currentUserList"
|
||
|
|
[role]="role"
|
||
|
|
(onReload)="reloadUserList()">
|
||
|
|
|
||
|
|
</app-user-list>
|
||
|
|
<app-role-permission
|
||
|
|
*ngIf="role && tab.toString() === '1'"
|
||
|
|
[perms]="allPerms"
|
||
|
|
[role]="role"
|
||
|
|
(onReload)="getRoleList()">
|
||
|
|
</app-role-permission>
|
||
|
|
</div>
|
||
|
|
</nz-card>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</app-page>
|
||
|
|
|
||
|
|
|
||
|
|
<ng-template #roleFormTpl>
|
||
|
|
<form nz-form [formGroup]="roleForm">
|
||
|
|
<nz-form-item>
|
||
|
|
<nz-form-label nzSpan="6" nzRequired>
|
||
|
|
角色名称
|
||
|
|
</nz-form-label>
|
||
|
|
<nz-form-control nzSpan="12" [nzErrorTip]="formErrorTipsTpl">
|
||
|
|
<input nz-input placeholder="请输入角色名称" formControlName="roleName" />
|
||
|
|
</nz-form-control>
|
||
|
|
</nz-form-item>
|
||
|
|
</form>
|
||
|
|
</ng-template>
|
||
|
|
|
||
|
|
<ng-template #formErrorTipsTpl let-control>
|
||
|
|
<div class="text-left">
|
||
|
|
<form-error-tips [control]="control"></form-error-tips>
|
||
|
|
</div>
|
||
|
|
</ng-template>
|