update

src/main/webapp/app/modal/select-role/select-role.component.html

 <!--添加资源-->
-<nz-modal [nzWidth]="1080" [(nzVisible)]="isVisible" [nzTitle]="title" (nzOnCancel)="handleEditCancel()" (nzOnOk)="handEditleOk()">
-  <nz-table #basicTable [nzData]="dataSet">
+<nz-modal [nzWidth]="780" [(nzVisible)]="isVisible" [nzTitle]="title" (nzOnCancel)="handleEditCancel()" (nzOnOk)="handEditleOk()">
+  <nz-table #basicTable [nzData]="dataSet" nzPageSize="5">
     <thead>
     <tr>
+      <th nzShowCheckbox [(nzChecked)]="allChecked" [nzIndeterminate]="indeterminate" (nzCheckedChange)="checkAll($event)"></th>
       <th>角色名称</th>
-      <th>说明</th>
-      <th>权限模块</th>
-      <th>资源权限</th>
-      <th>有效</th>
-      <th>操作</th>
+      <th>角色说明</th>
     </tr>
     </thead>
     <tbody>
     <tr *ngFor="let data of basicTable.data">
+      <td nzShowCheckbox (nzCheckedChange)="selectItem($event,data)"  [(nzChecked)]="data.checked"></td>
       <td>{{data.name}}</td>
       <td>{{data.comments}}</td>
-      <td>{{data.key3}}</td>
-      <td>{{data.key4}}</td>
-      <td>
-        <ng-container *ngIf="data.status == 0">
-          <i class="anticon anticon-check"></i>
-        </ng-container>
-      </td>
-      <td class="handle">
-        <span (click)="grantUser(data)">授予用户</span>
-        <span>查看</span>
-        <span (click)="showEditModal(data.id)">编辑</span>
-        <span (click)="deleteRole(data)">删除</span>
-      </td>
     </tr>
     </tbody>
   </nz-table>

src/main/webapp/app/modal/select-role/select-role.component.ts

-import { Component, OnInit } from '@angular/core';
+import {Component, EventEmitter, OnInit, Output} from '@angular/core';
+import {SystemService} from '../../system/system.service';
 
 @Component({
-  selector: 'smart-select-role',
-  templateUrl: './select-role.component.html',
-  styles: []
+    selector: 'smart-select-role',
+    templateUrl: './select-role.component.html',
+    styles: []
 })
 export class SelectRoleComponent implements OnInit {
+    @Output() done = new EventEmitter<any>();
 
-  title;
-  isVisible = false;
-  constructor() { }
+    dataSet: any = [];
+    title;
+    selectList = [];
+    isVisible = false;
+    allChecked = false;
+    checkedNumber = 0;
+    disabledButton = true;
+    indeterminate = false;
+    displayData: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }> = [];
+    constructor(private systemSer: SystemService) {
+    }
 
-  ngOnInit() {
-  }
+    checkAll(value: boolean): void {
+        this.displayData.forEach(data => data.checked = value);
+        this.refreshStatus();
+    }
 
-  showModal(title){
-    this.title = title;
-    this.isVisible  = true;
-  }
+    currentPageDataChange($event: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }>): void {
+        this.displayData = $event;
+    }
 
-  getRoleList(){
+    selectItem(event,item){
+        if(event){
+            this.selectList.push(item);
+        }else{
+            this.selectList.forEach((value,index)=>{
+                if(value.id == item.id){
+                    this.selectList.splice(index,1)
+                }
+            })
+        }
+        this.refreshStatus()
+    }
 
-  }
+    refreshStatus(): void {
+        const allChecked = this.displayData.every(value => value.checked === true);
+        const allUnChecked = this.displayData.every(value => !value.checked);
+        this.allChecked = allChecked;
+        this.indeterminate = (!allChecked) && (!allUnChecked);
+        this.disabledButton = !this.dataSet.some(value => value.checked);
+        this.checkedNumber = this.dataSet.filter(value => value.checked).length;
+    }
+
+    ngOnInit() {
+    }
+
+    showModal(title) {
+        this.title = title;
+        this.isVisible = true;
+        this.getRole();
+    }
+
+    getRole() {
+        this.systemSer.role().subscribe(
+            (res) => {
+                this.dataSet = res.data;
+            }
+        );
+    }
+
+    handleEditCancel(){
+        this.isVisible = false;
+    }
+
+    handEditleOk(){
+        console.log(this.selectList);
+        this.done.emit(this.selectList);
+        this.isVisible = false;
+    }
 
 }

src/main/webapp/app/system/group/group.component.html

@@ -83,5 +83,5 @@
 <!--新增部门-->
 <smart-group-modal #smartGroupModal></smart-group-modal>
 <!--授予角色-->
-<smart-select-role #smartSelectRole ></smart-select-role>
+<smart-select-role #smartSelectRole (done)="setRole($event)"></smart-select-role>
 

src/main/webapp/app/system/group/group.component.ts

@@ -25,6 +25,7 @@ export class GroupComponent implements OnInit {
     checkedNumber = 0;
     nodes: any[];
     isVisible = true;
+    userId;
     displayData: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }> = [];
 
     constructor(private systemSer: SystemService, private message: NzMessageService,
@@ -145,7 +146,31 @@ export class GroupComponent implements OnInit {
 
     //授予角色
     grantRole(data){
+        this.userId = data.id;
         this.smartSelectRole.showModal("选择角色");
     }
 
+    setRole(event){
+        console.log(event);
+        let str ="";
+        event.forEach(res=>{
+            str += res.id +",";
+        });
+        str = str.substring(0,str.length-1);
+        const data = {
+            userId:this.userId,
+            roleIds:str
+        };
+        this.systemSer.batchGrantRoleToUser(data).subscribe(
+            (res)=>{
+                if(res.errCode == 10000){
+
+                    this.message.success("授予角色成功");
+                }else{
+                    this.message.error(res.errMsg);
+                }
+            }
+        )
+    }
+
 }

src/main/webapp/app/system/system.service.ts

@@ -74,4 +74,9 @@ export class SystemService {
     batchGrantUserToRole(data): Observable<any>{
         return this.http.post(SERVER_API_URL + '/role/batchGrantUserToRole',data);
     }
+
+    //对单一用户批量授权角色
+    batchGrantRoleToUser(data): Observable<any>{
+        return this.http.post(SERVER_API_URL + '/role/batchGrantRoleToUser',data);
+    }
 }