From 818f6e4e3380167e4268721095bb4ce9c87510a4 Mon Sep 17 00:00:00 2001
From: ibuler <ibuler@qq.com>
Date: Mon, 5 Jun 2023 17:48:40 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E5=8E=BB=E6=8E=89=20debug=EF=BC=8C?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=20bolder?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../advanced-option.component.html            |  2 +-
 .../advanced-option.component.scss            |  7 ++----
 .../advanced-option.component.ts              | 22 +++++++++++++------
 3 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.html b/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.html
index a502ad99..2343e3c6 100644
--- a/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.html
+++ b/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.html
@@ -1,6 +1,6 @@
 <div class="advanced-option">
   <mat-accordion>
-    <mat-expansion-panel [disabled]="!isShowAdvancedOption">
+    <mat-expansion-panel [class.panel-show]="isShowAdvancedOption" [disabled]="!isShowAdvancedOption">
       <mat-expansion-panel-header style="height: 32px;">
         <mat-panel-title>
           {{ 'Advanced option' | translate }}
diff --git a/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.scss b/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.scss
index b47703af..2d715274 100644
--- a/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.scss
+++ b/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.scss
@@ -24,7 +24,7 @@
   }
 }
 
-.mat-expansion-panel.mat-expanded {
+.mat-expansion-panel.panel-show.mat-expanded {
   border-bottom: none;
 
   &::ng-deep .mat-expansion-panel-content {
@@ -56,10 +56,7 @@
 .option-item {
   flex: 0 0 49%;
   box-sizing: border-box;
-}
-
-.option-item:first-child {
-  margin-left: 0;
+  padding: 0 5px;
 }
 
 .mat-checkbox-layout {
diff --git a/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.ts b/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.ts
index c23b7218..67afbe77 100644
--- a/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.ts
+++ b/src/app/elements/connect/connect-dialog/advanced-option/advanced-option.component.ts
@@ -13,6 +13,10 @@ export class ElementAdvancedOptionComponent implements OnChanges {
   @Output() onOptionsChange = new EventEmitter<ConnectOption[]>();
   public advancedOptions: ConnectOption[] = [];
   public isShowAdvancedOption = false;
+  private boolChoices = [
+    {label: 'Yes', value: true},
+    {label: 'No', value: false},
+  ];
 
   constructor() {
   }
@@ -25,7 +29,6 @@ export class ElementAdvancedOptionComponent implements OnChanges {
         label: 'Charset',
         hidden: () => {
           const protocolsCanCharset: Array<string> = ['ssh', 'telnet'];
-          console.log('CUrrent protocol', this.protocol);
           return this.connectMethod.component !== 'koko' || !protocolsCanCharset.includes(this.protocol.name);
         },
         value: 'default',
@@ -39,28 +42,33 @@ export class ElementAdvancedOptionComponent implements OnChanges {
         type: 'select',
         field: 'disableautohash',
         hidden: () => {
-          console.log('CUrrent protocol hash', this.protocol);
           const protocolsCanAutoHash: Array<string> = ['mysql', 'mariadb'];
           return this.connectMethod.component !== 'koko' || !protocolsCanAutoHash.includes(this.protocol.name);
         },
         label: 'Disable auto completion',
         value: false,
-        options: [
-          {label: 'Yes', value: true},
-          {label: 'No', value: false},
-        ]
+        options: this.boolChoices
       },
       {
         type: 'select',
         field: 'resolution',
         hidden: () => {
           const protocolsCanResolution: Array<string> = ['rdp'];
-          console.log('CUrrent protocol res', this.protocol);
           return !protocolsCanResolution.includes(this.protocol.name);
         },
         options: resolutionsChoices.map(i => ({label: i, value: i})),
         label: 'Resolution',
         value: 'Auto'
+      },
+      {
+        type: 'select',
+        field: 'backspaceAsCtrlH',
+        hidden: () => {
+          return this.connectMethod.component !== 'koko';
+        },
+        options: this.boolChoices,
+        label: 'Backspace as Ctrl+H',
+        value: false
       }
     ];
     this.advancedOptions = this.advancedOptions.filter(i => !i.hidden());