|
|
@ -1,4 +1,4 @@ |
|
|
|
import { Component } from '@angular/core'; |
|
|
|
import {Component, ViewChild} from '@angular/core'; |
|
|
|
import {NzTreeComponent} from "ng-zorro-antd/tree"; |
|
|
|
import {NzTreeComponent} from "ng-zorro-antd/tree"; |
|
|
|
import {NgForOf, NgIf} from "@angular/common"; |
|
|
|
import {NgForOf, NgIf} from "@angular/common"; |
|
|
|
import {NzIconDirective} from "ng-zorro-antd/icon"; |
|
|
|
import {NzIconDirective} from "ng-zorro-antd/icon"; |
|
|
@ -15,15 +15,15 @@ import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid"; |
|
|
|
import {NzButtonComponent} from "ng-zorro-antd/button"; |
|
|
|
import {NzButtonComponent} from "ng-zorro-antd/button"; |
|
|
|
import {NzDescriptionsComponent, NzDescriptionsItemComponent} from "ng-zorro-antd/descriptions"; |
|
|
|
import {NzDescriptionsComponent, NzDescriptionsItemComponent} from "ng-zorro-antd/descriptions"; |
|
|
|
import {MenuTypePipe} from "../../../pipes/menu/menu-type.pipe"; |
|
|
|
import {MenuTypePipe} from "../../../pipes/menu/menu-type.pipe"; |
|
|
|
import {NzFormDirective, NzFormLabelComponent} from "ng-zorro-antd/form"; |
|
|
|
import {NzFormDirective, NzFormLabelComponent, NzFormModule} from "ng-zorro-antd/form"; |
|
|
|
import {FormGroup, NonNullableFormBuilder, ReactiveFormsModule, Validators} from "@angular/forms"; |
|
|
|
import {FormGroup, NonNullableFormBuilder, ReactiveFormsModule, Validators} from "@angular/forms"; |
|
|
|
import { NzFormModule } from 'ng-zorro-antd/form'; |
|
|
|
|
|
|
|
import {NzInputDirective, NzInputGroupComponent} from "ng-zorro-antd/input"; |
|
|
|
import {NzInputDirective, NzInputGroupComponent} from "ng-zorro-antd/input"; |
|
|
|
import { NzModalModule } from 'ng-zorro-antd/modal'; |
|
|
|
import {NzModalModule, NzModalService} from 'ng-zorro-antd/modal'; |
|
|
|
import {NzFlexDirective} from "ng-zorro-antd/flex"; |
|
|
|
import {NzFlexDirective} from "ng-zorro-antd/flex"; |
|
|
|
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select"; |
|
|
|
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select"; |
|
|
|
import {NzInputNumberComponent} from "ng-zorro-antd/input-number"; |
|
|
|
import {NzInputNumberComponent} from "ng-zorro-antd/input-number"; |
|
|
|
import {NzMessageService} from "ng-zorro-antd/message"; |
|
|
|
import {NzMessageService} from "ng-zorro-antd/message"; |
|
|
|
|
|
|
|
import {NzTreeNode} from "ng-zorro-antd/core/tree/nz-tree-base-node"; |
|
|
|
|
|
|
|
|
|
|
|
@Component({ |
|
|
|
@Component({ |
|
|
|
selector: 'app-menu', |
|
|
|
selector: 'app-menu', |
|
|
@ -61,7 +61,6 @@ import {NzMessageService} from "ng-zorro-antd/message"; |
|
|
|
styleUrl: './menu.component.less' |
|
|
|
styleUrl: './menu.component.less' |
|
|
|
}) |
|
|
|
}) |
|
|
|
export class MenuComponent { |
|
|
|
export class MenuComponent { |
|
|
|
|
|
|
|
|
|
|
|
// 菜单数据
|
|
|
|
// 菜单数据
|
|
|
|
menuData: any = []; |
|
|
|
menuData: any = []; |
|
|
|
// 菜单树形数据
|
|
|
|
// 菜单树形数据
|
|
|
@ -74,11 +73,12 @@ export class MenuComponent { |
|
|
|
editMenuForm: FormGroup; |
|
|
|
editMenuForm: FormGroup; |
|
|
|
// 编辑菜单标题
|
|
|
|
// 编辑菜单标题
|
|
|
|
editMenuTitle = ''; |
|
|
|
editMenuTitle = ''; |
|
|
|
|
|
|
|
@ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent; |
|
|
|
constructor(private menuService: MenuService, |
|
|
|
constructor(private menuService: MenuService, |
|
|
|
private fb: NonNullableFormBuilder, |
|
|
|
private fb: NonNullableFormBuilder, |
|
|
|
|
|
|
|
private modal: NzModalService, |
|
|
|
private message: NzMessageService) { |
|
|
|
private message: NzMessageService) { |
|
|
|
this.queryMenuData(); |
|
|
|
this.queryMenuTree(); |
|
|
|
this.queryMenuTree2(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.editMenuForm = this.fb.group({ |
|
|
|
this.editMenuForm = this.fb.group({ |
|
|
|
id: [], |
|
|
|
id: [], |
|
|
@ -92,36 +92,22 @@ export class MenuComponent { |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
queryMenuTree2() { |
|
|
|
/** |
|
|
|
this.menuService.queryRoleMenuTree2('', (data: any) => { |
|
|
|
* 获取菜单树 |
|
|
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
queryMenuTree() { |
|
|
|
|
|
|
|
this.menuService.queryRoleMenuTreeCustomized('', (data: any) => { |
|
|
|
this.menuTree = data['return_data']; |
|
|
|
this.menuTree = data['return_data']; |
|
|
|
|
|
|
|
this.queryMenuData(); |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
/** |
|
|
|
* 查询菜单数据 |
|
|
|
* 查询菜单原始数据 |
|
|
|
*/ |
|
|
|
*/ |
|
|
|
queryMenuData() { |
|
|
|
queryMenuData() { |
|
|
|
this.menuService.queryMenuList((data: any) => { |
|
|
|
this.menuService.queryMenuList((data: any) => { |
|
|
|
this.menuData = data['return_data']; |
|
|
|
this.menuData = data['return_data']; |
|
|
|
// 获取菜单树形结构
|
|
|
|
|
|
|
|
// this.queryMenuTree();
|
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
|
|
* 查询菜单树形结构数据 |
|
|
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
queryMenuTree() { |
|
|
|
|
|
|
|
this.menuService.queryRoleMenuTree('', (data: any) => { |
|
|
|
|
|
|
|
const menuList = data['return_data']; |
|
|
|
|
|
|
|
for (const parent of menuList) { |
|
|
|
|
|
|
|
this.menuTree.push({ |
|
|
|
|
|
|
|
key: parent['id'], |
|
|
|
|
|
|
|
title: parent['menuName'], |
|
|
|
|
|
|
|
children: this.recursionChildMenu(this.menuData, parent['id']), |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
@ -142,36 +128,6 @@ export class MenuComponent { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
|
|
* 递归获取子菜单 |
|
|
|
|
|
|
|
* @param dataSource 菜单数据 |
|
|
|
|
|
|
|
* @param parentMenuId 父级菜单id |
|
|
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
public recursionChildMenu(dataSource: [], parentMenuId: number) { |
|
|
|
|
|
|
|
let dataTree: any = []; |
|
|
|
|
|
|
|
let collect: any = []; |
|
|
|
|
|
|
|
// 筛选子菜单
|
|
|
|
|
|
|
|
collect = dataSource.filter((o: any) => o.menuPSid == parentMenuId); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
for (const data of collect) { |
|
|
|
|
|
|
|
const childMenuData = this.recursionChildMenu(dataSource, data['id']); |
|
|
|
|
|
|
|
if (childMenuData.length > 0) { |
|
|
|
|
|
|
|
dataTree.push({ |
|
|
|
|
|
|
|
key: data['id'], |
|
|
|
|
|
|
|
title: data['menuName'], |
|
|
|
|
|
|
|
children: childMenuData, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
dataTree.push({ |
|
|
|
|
|
|
|
key: data['id'], |
|
|
|
|
|
|
|
title: data['menuName'], |
|
|
|
|
|
|
|
isLeaf: true |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
return dataTree; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
/** |
|
|
|
* 编辑菜单 |
|
|
|
* 编辑菜单 |
|
|
|
* @param edit 编辑状态 true:增加 false:修改 |
|
|
|
* @param edit 编辑状态 true:增加 false:修改 |
|
|
@ -209,14 +165,13 @@ export class MenuComponent { |
|
|
|
*/ |
|
|
|
*/ |
|
|
|
submitEditMenuForm() { |
|
|
|
submitEditMenuForm() { |
|
|
|
if (this.editMenuForm.valid) { |
|
|
|
if (this.editMenuForm.valid) { |
|
|
|
console.log('submit', this.editMenuForm.value); |
|
|
|
|
|
|
|
this.menuService.editMenu(this.editMenuForm.value, (data: any) => { |
|
|
|
this.menuService.editMenu(this.editMenuForm.value, (data: any) => { |
|
|
|
if (data['return_code'] == '000000') { |
|
|
|
if (data['return_code'] == '000000') { |
|
|
|
console.log("获取数据", data); |
|
|
|
|
|
|
|
// 刷新数据
|
|
|
|
// 刷新数据
|
|
|
|
this.queryMenuTree2(); |
|
|
|
this.queryMenuTree(); |
|
|
|
|
|
|
|
|
|
|
|
this.message.create('success', '操作成功'); |
|
|
|
this.message.create('success', '操作成功'); |
|
|
|
|
|
|
|
|
|
|
|
// 关闭弹窗
|
|
|
|
// 关闭弹窗
|
|
|
|
this.closeEditMenu(); |
|
|
|
this.closeEditMenu(); |
|
|
|
} else { |
|
|
|
} else { |
|
|
@ -239,4 +194,36 @@ export class MenuComponent { |
|
|
|
closeEditMenu() { |
|
|
|
closeEditMenu() { |
|
|
|
this.editMenuVisible = false; |
|
|
|
this.editMenuVisible = false; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
|
|
* 删除菜单 |
|
|
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
showDelMenu() { |
|
|
|
|
|
|
|
this.modal.confirm({ |
|
|
|
|
|
|
|
nzTitle: '提示', |
|
|
|
|
|
|
|
nzContent: '确实删除数据?', |
|
|
|
|
|
|
|
nzOnOk: () => this.delMenu() |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
|
|
* 删除菜单 |
|
|
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
delMenu() { |
|
|
|
|
|
|
|
const param = { |
|
|
|
|
|
|
|
menuId: this.menuDetail.id |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
this.menuService.delMenu(param, (data: any) => { |
|
|
|
|
|
|
|
if (data['return_code'] == '000000') { |
|
|
|
|
|
|
|
// 刷新数据
|
|
|
|
|
|
|
|
const s = this.nzTreeComponent.getTreeNodeByKey(""+this.menuDetail.menuPSid) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.message.create('success', '操作成功'); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.message.create('error', data['return_msg']); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|