21 changed files with 245 additions and 36 deletions
@ -0,0 +1,20 @@
|
||||
<div class="box"> |
||||
<form nz-form [formGroup]="validateForm"> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSm]="6" [nzXs]="24" nzFor="菜单">菜单</nz-form-label> |
||||
<nz-form-control> |
||||
<nz-tree-select #nzTreeComponent formControlName="menus" [nzNodes]="nodes" nzShowSearch nzCheckable nzPlaceHolder="请选择菜单" |
||||
[nzExpandedIcon]="multiExpandedIconTpl"> |
||||
</nz-tree-select> |
||||
</nz-form-control> |
||||
<ng-template #multiExpandedIconTpl let-node let-origin="origin"> |
||||
<ng-container *ngIf="node.children.length == 0; else elseTemplate"> |
||||
</ng-container> |
||||
<ng-template #elseTemplate> |
||||
<i nz-icon [nzType]="node.isExpanded ? 'caret-down' : 'caret-right'" |
||||
class="ant-tree-switcher-line-icon"></i> |
||||
</ng-template> |
||||
</ng-template> |
||||
</nz-form-item> |
||||
</form> |
||||
</div> |
||||
@ -0,0 +1,71 @@
|
||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
||||
import { Component, OnInit, Input, ViewChild } from '@angular/core'; |
||||
import { NzModalRef } from 'ng-zorro-antd/modal'; |
||||
import { HttpClient } from '@angular/common/http'; |
||||
import { TreeService } from 'src/app/service/tree.service'; |
||||
import { NzTreeComponent } from 'ng-zorro-antd/tree'; |
||||
@Component({ |
||||
selector: 'app-menus', |
||||
templateUrl: './menus.component.html', |
||||
styleUrls: ['./menus.component.scss'] |
||||
}) |
||||
export class MenusComponent implements OnInit { |
||||
@ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent; |
||||
@Input() data?: any; |
||||
@Input() nodes?: any; |
||||
validateForm!: FormGroup; |
||||
constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient, private toTree: TreeService) { } |
||||
|
||||
ngOnInit(): void { |
||||
this.nodes.length != 0 ? null : this.getAllMenus() |
||||
this.getMenus() |
||||
this.validateForm = this.fb.group({ |
||||
menus: [] |
||||
}); |
||||
} |
||||
|
||||
getMenus() { |
||||
let params = { |
||||
Id: this.data.id, |
||||
} |
||||
this.http.get('/api/services/app/Role/Get', { |
||||
params: params |
||||
}).subscribe((data: any) => { |
||||
// console.log(666, data)
|
||||
let arr = [] |
||||
data.result.menus.forEach(element => { |
||||
arr.push(element.id) |
||||
}); |
||||
this.validateForm.patchValue({ |
||||
menus: arr |
||||
}); |
||||
}) |
||||
} |
||||
|
||||
|
||||
totalCount |
||||
getAllMenus() { |
||||
let params = { |
||||
SkipCount: '0', |
||||
MaxResultCount: '999' |
||||
} |
||||
this.http.get('/api/services/app/Menu/GetAll', { |
||||
params: params |
||||
}).subscribe((data: any) => { |
||||
// console.log(666, data)
|
||||
this.totalCount = data.result.totalCount |
||||
data.result.items.forEach(element => { |
||||
element.key = element.id |
||||
element.title = element.name |
||||
element.selectable = false |
||||
}); |
||||
this.nodes = [...this.toTree.toTree(data.result.items)] |
||||
}) |
||||
} |
||||
|
||||
destroyModal(): void { |
||||
this.modal.destroy({ data: 'this the result data' }); |
||||
} |
||||
|
||||
|
||||
} |
||||
Loading…
Reference in new issue