feat: update env

Postcatlab · Jun 28, 2022 · 92760c6 · 92760c6
1 parent 979b4c2
commit 92760c6
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 16 deletions.
diff --git a/src/workbench/browser/src/app/pages/api/api.component.html b/src/workbench/browser/src/app/pages/api/api.component.html
@@ -2,24 +2,30 @@
   <nz-sider nzTheme="light" nzWidth="250">
     <!-- <div class="side-container"> -->
     <nz-content>
-      <nz-tabset nzCentered [nzAnimated]="false">
+      <nz-tabset nzCentered [nzAnimated]="false" [(nzSelectedIndex)]="tabsIndex">
         <nz-tab [nzTitle]="apiTitle">
           <ng-template #apiTitle>
-            <iconpark-icon name="folder-open"></iconpark-icon>
+            <span nzTooltipTitle="Collections" nz-tooltip>
+              <iconpark-icon name="folder-open"></iconpark-icon>
+            </span>
           </ng-template>
           <div class="inner-content">
             <eo-api-group-tree></eo-api-group-tree>
           </div>
         </nz-tab>
         <nz-tab [nzTitle]="historyTitle">
           <ng-template #historyTitle>
-            <iconpark-icon name="history"></iconpark-icon>
+            <span nzTooltipTitle="History" nz-tooltip>
+              <iconpark-icon name="history"></iconpark-icon>
+            </span>
           </ng-template>
           <eo-history></eo-history>
         </nz-tab>
         <nz-tab [nzTitle]="envTitle">
           <ng-template #envTitle>
-            <iconpark-icon name="instruction"></iconpark-icon>
+            <span nzTooltipTitle="Environment" nz-tooltip>
+              <iconpark-icon name="instruction"></iconpark-icon>
+            </span>
           </ng-template>
           <eo-env></eo-env>
         </nz-tab>
@@ -32,15 +38,22 @@
       <div class="inner-content">
         <div class="tabs-bar f_row">
           <eo-api-tab class="fg1"></eo-api-tab>
-          <nz-select
-            [(ngModel)]="envUuid"
-            [(nzOpen)]="isOpen"
-            (nzOpenChange)="handleEnvSelectStatus($event)"
-            nzAllowClear
-            nzPlaceHolder="Environment"
-          >
-            <nz-option *ngFor="let item of envList" [nzValue]="item.uuid" [nzLabel]="item.name"></nz-option>
-          </nz-select>
+          <div class="flex items-center h-full">
+            <nz-select
+              [(ngModel)]="envUuid"
+              [(nzOpen)]="isOpen"
+              (nzOpenChange)="handleEnvSelectStatus($event)"
+              [nzDropdownRender]="renderTemplate"
+              nzAllowClear
+              nzPlaceHolder="Environment"
+            >
+              <nz-option *ngFor="let item of envList" [nzValue]="item.uuid" [nzLabel]="item.name"></nz-option>
+            </nz-select>
+            <ng-template #renderTemplate>
+              <nz-divider></nz-divider>
+              <a class="manager-env" nz-button nzType="link">管理环境</a>
+            </ng-template>
+          </div>
         </div>
         <div class="content_container {{ this.id ? 'has_tab_page' : '' }}">
           <nz-tabset class="inside_page_tab" [nzAnimated]="false" *ngIf="this.id" nzLinkRouter>

diff --git a/src/workbench/browser/src/app/pages/api/api.component.scss b/src/workbench/browser/src/app/pages/api/api.component.scss
@@ -68,3 +68,12 @@ nz-sider {
   }
 }
 
+nz-divider {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
+.manager-env {
+  color: #00785a;
+}
+
diff --git a/src/workbench/browser/src/app/pages/api/api.component.ts b/src/workbench/browser/src/app/pages/api/api.component.ts
@@ -38,6 +38,7 @@ export class ApiComponent implements OnInit, OnDestroy {
   envInfo: any = {};
   envList: Array<any> = [];
   activeUuid: number | string = 0;
+  tabsIndex = 0;
   private destroy$: Subject<void> = new Subject<void>();
 
   constructor(
@@ -127,6 +128,11 @@ export class ApiComponent implements OnInit, OnDestroy {
     this.messageService.send({ type: 'beforeChangeRouter', data });
   }
 
+  gotoEnvManager() {
+    // * switch to env
+    this.tabsIndex = 2;
+  }
+
   getAllEnv(uuid?: number) {
     const projectID = 1;
     return new Promise((resolve) => {

diff --git a/src/workbench/browser/src/app/shared/components/env/env.component.html b/src/workbench/browser/src/app/shared/components/env/env.component.html
@@ -11,10 +11,10 @@
   <a class="btn" (click)="handleShowModal()">管理环境</a>
 </ng-template> -->
 <div class="flex flex-col">
-  <div class="header flex items-center justify-between h-10 px-2">
+  <div class="flex items-center justify-between h-10 px-2 header">
     <span class="font-bold">Environment</span>
     <div
-      class="btn flex shrink-0 items-center justify-center h-7 text-base"
+      class="flex items-center justify-center text-base btn shrink-0 h-7"
       (click)="handleShowModal()"
       nz-tooltip
       nzTooltipTitle="New Environment"
@@ -24,7 +24,7 @@
   </div>
   <div
     *ngFor="let item of envList"
-    class="env-item flex items-center justify-between p-2"
+    class="flex items-center justify-between p-2 env-item"
     (click)="handleSwitchEnv(item.uuid)"
   >
     <span class="name">{{ item.name }}</span>