perf: 修改 setting

Author: ibuler

src/app/elements/chat/chat.component.html

@@ -1,3 +1,10 @@
+<div
+  (click)="onSettingOpenDrawer()"
+  [hidden]="!isShowSetting || subViews.length > 1"
+  class="drag-setting"
+>
+  <i class="fa fa-cog"></i>
+</div>
 <div *ngIf="chatAiEnabled" class="chat-container" id="chatContainer">
   <iframe
     [src]="iframeURL | safeUrl"

src/app/elements/chat/chat.component.scss

@@ -12,3 +12,66 @@
     border: none;
   }
 }
+
+.drag-setting {
+  position: absolute;
+  right: 10px;
+  bottom: 100px;
+  width: 36px;
+  height: 36px;
+  line-height: 38px;
+  margin-bottom: 2px;
+  text-align: center;
+  border-radius: 50%;
+  cursor: pointer;
+  transform: translateX(20%);
+  background-color: rgba(88, 88, 88, .8);
+  border: 1px solid transparent;
+  transition: border-color 0.3s ease;
+
+  &:hover {
+    .setting-list {
+      display: block;
+      transform: translateY(0);
+    }
+
+    i {
+      opacity: 1;
+      transform: rotate(45deg);
+    }
+  }
+
+  i {
+    font-size: 18px;
+    color: white;
+    opacity: 0.8;
+  }
+
+  .setting-list {
+    position: absolute;
+    bottom: 35px;
+    right: 4px;
+    margin: 0;
+    padding: 0;
+    display: none;
+    list-style-type: none;
+    transition: all 0.3s ease;
+    transform: translateY(100%);
+
+    .setting-item {
+      width: 28px;
+      height: 28px;
+      line-height: 28px;
+      padding: 2px;
+      border-radius: 50%;
+      margin-bottom: 2px;
+      overflow: hidden;
+      background-color: #FFFFFF;
+
+      &:hover {
+        background-color: #f0f1f5;
+        border-color: #a0a0a0;
+      }
+    }
+  }
+}

src/app/elements/chat/chat.component.ts

@@ -19,10 +19,27 @@ export class ElementChatComponent implements OnInit {
   ) {
   }
 
+  get isShowSetting() {
+    return true;
+    const connectMethods = ['koko', 'lion', 'tinker', 'panda'];
+    return (
+      this.currentView.hasOwnProperty('connectMethod')
+      && connectMethods.includes(this.currentView.connectMethod.component)
+    );
+  }
+
+  get subViews() {
+    return this.currentView.hasOwnProperty('subViews') ? this.currentView.subViews : [];
+  }
+
   get chatAiEnabled() {
     return this._settingSvc.globalSetting.CHAT_AI_ENABLED;
   }
 
+  onSettingOpenDrawer() {
+    this.currentView.iframeElement.postMessage({name: 'OPEN'}, '*');
+  }
+
   ngOnInit() {
     this.viewSrv.currentView$.subscribe((state: View) => {
       this.currentView = state;

src/app/elements/nav/nav.component.ts

@@ -54,7 +54,7 @@ export class ElementNavComponent implements OnInit {
     return [
       {
         id: 'FileManager',
-        name: 'File Manager',
+        name: 'File Explorer',
         children: [
           {
             id: 'Connect',