edit

src/app/routes/menu-manager/components/index/index.component.html

@@ -0,0 +1,5 @@
+<page-header-wrapper [title]="''"></page-header-wrapper>
+
+<button nz-button [nzSize]="'small'" (click)="menuImport()" [nzLoading]="service.http.loading">
+  导入
+</button>

src/app/routes/menu-manager/components/index/index.component.less

@@ -0,0 +1,16 @@
+:host {
+  ::ng-deep {
+    .pane-content-left {
+      padding-right: 12px;
+
+      nz-select {
+        width: 100%;
+        margin-bottom: 1rem;
+        border-bottom: 2px solid #15408e;
+      }
+    }
+    .pane-content-right {
+      padding-left: 12px;
+    }
+  }
+}

src/app/routes/menu-manager/components/index/index.component.spec.ts

@@ -0,0 +1,23 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { MenuManagerComponentsIndexComponent } from './index.component';
+
+describe('MenuManagerComponentsIndexComponent', () => {
+  let component: MenuManagerComponentsIndexComponent;
+  let fixture: ComponentFixture<MenuManagerComponentsIndexComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [MenuManagerComponentsIndexComponent],
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MenuManagerComponentsIndexComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/routes/menu-manager/components/index/index.component.ts

@@ -0,0 +1,120 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { Menu } from '@delon/theme';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { MenuManagerService } from './../../services/menu-manager.service';
+
+@Component({
+  selector: 'app-menu-manager-components-index',
+  templateUrl: './index.component.html',
+  styleUrls: ['./index.component.less'],
+})
+export class MenuManagerComponentsIndexComponent implements OnInit {
+  selectedPlatform!: { name: string; appId: string; enName: string };
+  menus: Array<any> = [];
+  platforms: Array<any> = [];
+  currentSelectedNode: any;
+  transferData!: string;
+  dropType = {
+    dropPrev: true,
+    dropNext: true,
+    dropInner: true,
+  };
+  constructor(public service: MenuManagerService, private modal: NzModalService) { }
+
+  ngOnInit(): void {
+    this.initData();
+  }
+
+  initData(): void {
+    this.platforms = [
+      { name: '运维平台', appId: 'D40B4EFC33FC4803864934872A11B0CE', enName: 'scm-soc-ui' },
+      { name: '运营后台', appId: '2537B72DDA534361AE4931903F0BFEB3', enName: 'scm-ows-ui' },
+      { name: '供应商平台', appId: '0CEE254099064665872B777CF9FCBB6B', enName: 'scm-cvc-ui' },
+      // { name: '代理商平台', appId: '737BB699C8894B2D81F21FC667A21169', enName: 'scm-cac-ui' },
+      // { name: '分销商平台', appId: '0D00C7CC306A4CACA5AF95BBD1251980', enName: 'scm-cdc-ui' },
+      // { name: '开放平台', appId: '7B216DD933CB4922BD9094ED8F96B0B4', enName: 'scm-opc-ui' },
+    ];
+  }
+
+  platformChange(e: { name: string; appId: string }) {
+    if (e) {
+      this.loadMenus(e.appId);
+    } else {
+      this.menus = [];
+      this.currentSelectedNode = null;
+    }
+  }
+
+  loadMenus(appId: string) {
+    this.service.request(this.service.$api_get_all, { appId }, 'POST', true, 'FORM').subscribe((res) => {
+      this.menus = res;
+    });
+  }
+
+
+  editValueChange(event: any) {
+    console.log('editChanged', event);
+  }
+
+
+  menuImport() {
+    if (!this.selectedPlatform) {
+      return;
+    }
+
+    this.service.http.request('GET', `assets/tmp/_mock/platform/${this.selectedPlatform.enName}.json`).subscribe((res: any) => {
+      // console.log(res);
+      this.addMenu(res.menu);
+    });
+  }
+
+  addMenu(menus: Array<Menu>, parentId: string = '') {
+    menus.forEach((r) => {
+      if (parentId !== '') {
+        r.parentId = parentId;
+      }
+      this.service.request(this.service.$api_get_one, { appId: this.selectedPlatform.appId, i18n: r.i18n }).subscribe((res) => {
+        // 如果res.data存在，则更新菜单
+        if (res.data) {
+          r.id = res.data.id;
+        }
+        this.service
+          .addOne({ appId: this.selectedPlatform.appId, ...r, isLeaf: !(r.children && r.children.length > 0) })
+          .subscribe((result) => {
+            if (result) {
+              if (r.children && r.children.length > 0) {
+                this.addMenu(r.children, result.id);
+              }
+            }
+          });
+      });
+    });
+
+    this.loadMenus(this.selectedPlatform.appId);
+  }
+
+  addMenuRecursion() {
+
+  }
+
+  delMenu(appId: string, menus: Array<Menu>) {
+    if (!menus || menus.length === 0) {
+      return;
+    }
+    let notice = `确认删除菜单[${menus[0].text}]?`;
+    if (menus.length > 1) {
+      notice = `确认删除勾选的${menus.length}行菜单记录？`;
+    }
+    const ids = menus.map((r) => r.id);
+    this.modal.confirm({
+      nzTitle: '<i>删除确认</i>',
+      nzContent: `<b>${notice}</b><br>是否删除？`,
+      nzOnOk: () =>
+        this.service.delMany(ids).subscribe((res) => {
+          if (res === true) {
+            this.service.msgSrv.success('删除成功！');
+          }
+        }),
+    });
+  }
+}