fix: delete group without delete api

Postcatlab · Feb 5, 2022 · c543108 · c543108
1 parent fa1adab
commit c543108
Show file tree

Hide file tree

Showing 23 changed files with 353 additions and 396 deletions.
diff --git a/README.md b/README.md
@@ -9,6 +9,10 @@ Easy-to-use API testing desktop tool
 
 [English](README.md)｜[简体中文](README.zh-cn.md)
 
+# Install
+
+You can download it for Windows, macOS on [Releases](https://github.com/eolinker/eoapi/releases)
+
 # Build and run from source
 
 ## Prerequisites
@@ -44,11 +48,10 @@ npm install -g @angular/cli
 | ---------------------------- | ------------------------------------------------------------- |
 | `npm run electron:build`     | Packaging Electron applications for each platform             |
 | `npm run electron:build:win` | Packaging install customized installation package for windows |
-| `npm run web:build`          | Packaging Web applications|
 
 ### Test
 
-| Command           | Description          |
-| -------------- | ------------- |
-| `npm run test` | Execute unit tests |
-| `npm run e2e`  | Execute end to end tests|
+| Command        | Description              |
+| -------------- | ------------------------ |
+| `npm run test` | Execute unit tests       |
+| `npm run e2e`  | Execute end to end tests |
diff --git a/README.zh-cn.md b/README.zh-cn.md
@@ -1,58 +1,3 @@
-![](https://raw.githubusercontent.com/eolinker/eoapi/main/src/assets/icons/128x128.png?token=GHSAT0AAAAAABRGKRUA6EOYNPFMLMC747IQYP3KNNA)
-
-<h1 align="center">EOAPI</h1>
-<div align="center">
-Easy-to-use API testing desktop tool
-</div>
-
-![](https://raw.githubusercontent.com/eolinker/eoapi/main/wiki/preview_1.png?token=GHSAT0AAAAAABRGKRUA6EOYNPFMLMC747IQYP3KNNA)
-
-[English](README.md)｜[简体中文](README.zh-cn.md)
-
-# Build and run from source
-
-## Prerequisites
-
-- Node.js,version ^14.17
-
-## Run
-
-```
-npm ci
-npm start
-```
-
-If you want to improve development efficiency, you can install the command-line Angular-cli officially provided by Angular to quickly generate templates such as components and services.
-
-```
-npm install -g @angular/cli
-```
-
-## Command
-
-### Run
-
-| Command                  | Description                                                          |
-| ------------------------ | -------------------------------------------------------------------- |
-| `npm start`              | In development mode, running on browser and desktop at the same time |
-| `npm run ng:serve`       | only runs in the browser                                             |
-| `npm run electron:serve` | only runs in the desktop                                             |
-
-### Build
-
-| Command                      | Description                                                   |
-| ---------------------------- | ------------------------------------------------------------- |
-| `npm run electron:build`     | Packaging Electron applications for each platform             |
-| `npm run electron:build:win` | Packaging install customized installation package for windows |
-| `npm run web:build`          | Packaging Web applications                                    |
-
-### Test
-
-| Command        | Description              |
-| -------------- | ------------------------ |
-| `npm run test` | Execute unit tests       |
-| `npm run e2e`  | Execute end to end tests |
-
 ![](https://raw.githubusercontent.com/eolinker/eoapi/main/src/assets/icons/128x128.png?token=GHSAT0AAAAAABRGKRUAKZLRZZKLCCWSV7GAYP3JYZA)
 
 <h1 align="center">EOAPI</h1>
@@ -64,6 +9,10 @@ Open source API Test desktop tool
 
 [English](README.md)｜[简体中文](README.zh-cn.md)
 
+# 安装
+
+你可以访问 [Releases](https://github.com/eolinker/eoapi/releases) 下载 Windows，macOS 版本的安装包。
+
 # 源码运行/构建
 
 ## 环境
@@ -99,7 +48,6 @@ npm install -g @angular/cli
 | ---------------------------- | ---------------------------- |
 | `npm run electron:build`     | 各系统打包 Electron 应用     |
 | `npm run electron:build:win` | windows 打包定制化安装包应用 |
-| `npm run web:build`          | 打包 Web 代码                |
 
 ### 测试
 

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -18,7 +18,7 @@ import { UpgradeModule } from '@angular/upgrade/static';
 
 //Storage Module
 import { StorageSetting } from './modules/storage/storage.config';
-import { demoApi } from './storageSetting.model';
+import { demoApi } from './shared/models/storageSetting.model';
 
 import { NzModalModule } from 'ng-zorro-antd/modal';
 

diff --git a/src/app/pages/api/api.service.ts b/src/app/pages/api/api.service.ts
@@ -4,7 +4,6 @@ import { NzModalService } from 'ng-zorro-antd/modal';
 import { ApiData } from '../../shared/services/api-data/api-data.model';
 import { ApiDataService } from '../../shared/services/api-data/api-data.service';
 import { MessageService } from '../../shared/services/message';
-
 @Injectable()
 export class ApiService {
   constructor(

diff --git a/src/app/pages/api/edit/api-edit.service.ts b/src/app/pages/api/edit/api-edit.service.ts
@@ -3,9 +3,9 @@ import { ModalService } from '../../../shared/services/modal.service';
 import { ApiParamsExtraSettingComponent } from './extra-setting/api-params-extra-setting.component';
 @Injectable()
 export class ApiEditService {
-  constructor(private modal: ModalService) {}
+  constructor(private modalService: ModalService) {}
   showMore(inputArg, opts: { nzOnOk: (result: any) => void; title: string }) {
-    const modal = this.modal.create({
+    const modal = this.modalService.create({
       nzTitle: `${opts.title}详情`,
       nzContent: ApiParamsExtraSettingComponent,
       nzClosable: false,

diff --git a/src/app/pages/api/edit/body/api-edit-body.component.ts b/src/app/pages/api/edit/body/api-edit-body.component.ts
@@ -6,7 +6,6 @@ import {
   Output,
   EventEmitter,
   OnChanges,
-  AfterViewChecked,
   OnDestroy,
 } from '@angular/core';
 
@@ -24,7 +23,7 @@ import { ApiEditService } from '../api-edit.service';
   templateUrl: './api-edit-body.component.html',
   styleUrls: ['./api-edit-body.component.scss'],
 })
-export class ApiEditBodyComponent implements OnInit, OnChanges, AfterViewChecked, OnDestroy {
+export class ApiEditBodyComponent implements OnInit, OnChanges, OnDestroy {
   @Input() model: string | object[] | any;
   @Input() supportType: string[];
   @Input() bodyType: ApiBodyType | string;
@@ -59,8 +58,8 @@ export class ApiEditBodyComponent implements OnInit, OnChanges, AfterViewChecked
   }
   beforeChangeBodyByType(type) {
     switch (type) {
-      case ApiBodyType.Raw: // case ApiBodyType.Binary:
-      {
+      case ApiBodyType.Raw: { // case ApiBodyType.Binary:
+        if (typeof this.model !== 'string') return;
         this.cache[type] = this.model || '';
         break;
       }
@@ -73,11 +72,13 @@ export class ApiEditBodyComponent implements OnInit, OnChanges, AfterViewChecked
   rawDataChange() {
     this.rawChange$.next(this.model);
   }
-  changeBodyType() {
+  changeBodyType(type?) {
     this.bodyType$.next(this.bodyType);
     this.bodyTypeChange.emit(this.bodyType);
     this.setListConf();
     this.setModel();
+    if(type==='init') return;
+    this.modelChange.emit(this.model);
   }
   ngOnInit(): void {
     this.CONST.API_BODY_TYPE = Object.keys(ApiBodyType)
@@ -91,13 +92,9 @@ export class ApiEditBodyComponent implements OnInit, OnChanges, AfterViewChecked
   ngOnChanges(changes) {
     if (changes.model && !changes.model.previousValue && changes.model.currentValue) {
       this.beforeChangeBodyByType(this.bodyType);
-      this.changeBodyType();
+      this.changeBodyType('init');
     }
   }
-  ngAfterViewChecked() {
-    // prevent AngularJS error when dragging and sorting item
-    this.cdRef.detectChanges();
-  }
 
   handleParamsImport(data) {
     this.model = data;
@@ -110,7 +107,8 @@ export class ApiEditBodyComponent implements OnInit, OnChanges, AfterViewChecked
    */
   private setModel() {
     switch (this.bodyType) {
-      case ApiBodyType.Raw: { // case ApiBodyType.Binary:
+      case ApiBodyType.Raw: {
+        // case ApiBodyType.Binary:
         this.model = this.cache[this.bodyType] || '';
         break;
       }

diff --git a/src/app/pages/api/group/edit/api-group-edit.component.html b/src/app/pages/api/group/edit/api-group-edit.component.html
@@ -1,20 +1,13 @@
-<div class="group_edit">
-  <form nz-form [nzLayout]="'vertical'" [formGroup]="validateForm" (ngSubmit)="submit()" *ngIf="!isDelete">
-    <nz-form-item nz-col class="fg1">
-      <nz-form-label nzFor="name">分组名称 </nz-form-label>
-      <nz-form-control nzErrorTip="请输入分组名称">
-        <input type="text" autofocus nz-input id="name" formControlName="name" [(ngModel)]="group.name" />
-      </nz-form-control>
-    </nz-form-item>
-  </form>
-  <p *ngIf="isDelete">
-    删除 <strong title="{{ group.name }}">{{
-      group.name.length > 50 ? group.name.slice(0, 50) + '...' : group.name
-    }}</strong
-    > 后，该分组下的数据都会删除。该操作无法撤销，确认删除吗？
-  </p>
-</div>
-<footer class="group_edit_footer">
-  <button nz-button nzType="primary" (click)="submit()" [nzLoading]="showLoading">确定</button>
-  <button nz-button (click)="close()">取消</button>
-</footer>
+<form nz-form [nzLayout]="'vertical'" [formGroup]="validateForm" (ngSubmit)="submit()" *ngIf="!isDelete">
+  <nz-form-item nz-col class="fg1">
+    <nz-form-label nzFor="name">分组名称 </nz-form-label>
+    <nz-form-control nzErrorTip="请输入分组名称">
+      <input type="text" autofocus nz-input id="name" formControlName="name" [(ngModel)]="group.name" />
+    </nz-form-control>
+  </nz-form-item>
+</form>
+<p *ngIf="isDelete">
+  删除
+  <strong title="{{ group.name }}">{{ group.name.length > 50 ? group.name.slice(0, 50) + '...' : group.name }}</strong>
+  后，该分组下的数据都会删除。该操作无法撤销，确认删除吗？
+</p>
diff --git a/src/app/pages/api/group/edit/api-group-edit.component.scss b/src/app/pages/api/group/edit/api-group-edit.component.scss
@@ -1,15 +0,0 @@
-.group_edit{
-  padding: 24px;
-}
-.group_edit_footer{
-  padding: 10px 16px;
-  border-top: 1px solid #f0f0f0;
-  text-align: right;
-  button {
-    display: inline-block;
-    margin-left: 8px;
-  }
-}
-::ng-deep .ant-modal-body {
-  padding: 0;
-}

diff --git a/src/app/pages/api/group/edit/api-group-edit.component.ts b/src/app/pages/api/group/edit/api-group-edit.component.ts
@@ -3,38 +3,37 @@ import { Group } from '../../../../shared/services/group/group.model';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { NzModalRef } from 'ng-zorro-antd/modal';
 import { GroupService } from '../../../../shared/services/group/group.service';
+import { GroupApiDataModel, GroupTreeItem } from '../../../../shared/models';
+import { MessageService } from '../../../../shared/services/message';
 
 @Component({
   selector: 'eo-api-group-edit',
   templateUrl: './api-group-edit.component.html',
-  styleUrls: ['./api-group-edit.component.scss']
+  styleUrls: ['./api-group-edit.component.scss'],
 })
 export class ApiGroupEditComponent implements OnInit {
   @Input() group: Group;
   @Input() action?: string;
+  @Input() treeItems?: any;
 
   validateForm!: FormGroup;
-  showLoading: boolean = false;
   isDelete: boolean;
 
   constructor(
     private fb: FormBuilder,
+    private messageService: MessageService,
     private modalRef: NzModalRef,
-    private groupService: GroupService,
-  ) { }
+    private groupService: GroupService
+  ) {}
 
   ngOnInit(): void {
     this.isDelete = this.action === 'delete';
     if (!this.isDelete) {
-      const controls = {name: [null, [Validators.required]]};
+      const controls = { name: [null, [Validators.required]] };
       this.validateForm = this.fb.group(controls);
     }
   }
 
-  close(): void {
-    this.modalRef.destroy();
-  }
-
   submit(): void {
     if (!this.isDelete) {
       for (const i in this.validateForm.controls) {
@@ -51,7 +50,6 @@ export class ApiGroupEditComponent implements OnInit {
   }
 
   save(): void {
-    this.showLoading = true;
     if (this.isDelete) {
       this.delete();
     } else {
@@ -64,33 +62,62 @@ export class ApiGroupEditComponent implements OnInit {
   }
 
   create(): void {
-    this.groupService.create(this.group).subscribe((data: Group) => {
-      this.showLoading = false;
-      this.modalRef.destroy({type: 'createGroup', data: {group: data}});
-    }, error => {
-      this.showLoading = false;
-      console.log(error);
-    });
+    this.groupService.create(this.group).subscribe(
+      (data: Group) => {
+        this.modalRef.destroy();
+        this.messageService.send({ type: 'updateGroupSuccess', data: { group: data } });
+      },
+      (error) => {
+        console.log(error);
+      }
+    );
   }
 
   update(): void {
-    this.groupService.update(this.group, this.group.uuid).subscribe((data: Group) => {
-      this.showLoading = false;
-      this.modalRef.destroy({type: 'updateGroup', data: {group: data}});
-    }, error => {
-      this.showLoading = false;
-      console.log(error);
-    });
+    this.groupService.update(this.group, this.group.uuid).subscribe(
+      (data: Group) => {
+        this.modalRef.destroy();
+        this.messageService.send({ type: 'updateGroupSuccess', data: { group: data } });
+      },
+      (error) => {
+        console.log(error);
+      }
+    );
   }
 
+  /**
+   * Get all child items belong to parentID
+   *
+   * @param list
+   * @param tree
+   * @param parentID
+   */
+  getChildrenFromTree(list: Array<GroupTreeItem>, tree: GroupApiDataModel, parentID: string): void {
+    list.forEach((item) => {
+      if (item.parentID === parentID) {
+        if (!item.isLeaf) {
+          tree.group.push(Number(item.key.replace('group-', '')));
+          this.getChildrenFromTree(list, tree, item.key);
+        } else {
+          tree.api.push(Number(item.key));
+        }
+      }
+    });
+  }
+  /**
+   * Delete all tree items
+   */
   delete(): void {
-    this.groupService.remove(this.group.uuid).subscribe(data => {
-      this.showLoading = false;
-      this.modalRef.destroy({type: 'deleteGroup', data: {group: this.group}});
-    }, error => {
-      this.showLoading = false;
-      console.log(error);
+    const data: GroupApiDataModel = { group: [this.group.uuid], api: [] };
+    this.getChildrenFromTree(this.treeItems, data, `group-${this.group.uuid}`);
+    this.modalRef.destroy();
+    this.groupService.bulkRemove(data.group).subscribe((result) => {
+      if (data.api.length) return;
+      this.messageService.send({ type: 'updateGroupSuccess', data: {} });
     });
+    //delete group api
+    if (data.api.length > 0) {
+      this.messageService.send({ type: 'gotoBulkDeleteApi', data: { uuids: data.api } });
+    }
   }
-
 }