Support column display control

Author: qianmoQ

src/renderer/app/views/object_designer/layout/content/components/preview/database/detail.database.view.html

@@ -1,6 +1,6 @@
 <ng-container *ngIf="!isCreateTable(); else createTable">
   <nz-card [nzTitle]="titleTemplate" [nzLoading]="loading.tableContainer">
-    <div *ngIf="applyResultColumns.length > 0" style="margin-top: 4px;">
+    <div style="margin-top: 4px;">
       <nz-table #tableContainer nzSize="small" [nzData]="applyResultColumns">
         <thead>
         <tr>

src/renderer/app/views/object_designer/layout/content/components/preview_table/preview.table.component.ts

@@ -23,7 +23,7 @@ export class PreviewTableComponent implements AfterViewInit {
     checkedColumns: []
   }
   applyVisible = {
-    columnDrawer: false
+    columnDrawer: null
   }
 
   constructor(private pluginFactory: PluginFactory,
@@ -43,25 +43,23 @@ export class PreviewTableComponent implements AfterViewInit {
         .getResponse(request, sql)
         .then(response => {
           if (response.status) {
-            if (response.data.rows > 0) {
-              Object.keys(response.data.columns[0]).forEach(column => {
-                this.applyResult.headers.push(column);
-                this.applyResult.checkedColumns.push({label: column, value: column, checked: true})
-              })
-              this.applyResult.columns = response.data.columns;
-            }
+            response.data.headers.forEach(column => {
+              this.applyResult.headers.push(column['name']);
+              this.applyResult.checkedColumns.push({label: column['name'], value: column['name'], checked: true})
+            })
+            this.applyResult.columns = response.data.columns;
           }
           this.loading.tableContainer = false;
         });
     }, 0);
   }
 
-  handlerShowColumnDrawer() {
-    this.applyVisible.columnDrawer = true;
+  handlerShowColumnDrawer(value: string) {
+    this.applyVisible.columnDrawer = value;
   }
 
   handlerCloseColumnDrawer() {
-    this.applyVisible.columnDrawer = false;
+    this.applyVisible.columnDrawer = null;
   }
 
   handlerColumnChecked() {

src/renderer/app/views/object_designer/layout/content/components/preview_table/preview.table.view.html

@@ -23,10 +23,12 @@
   </nz-table>
 
   <ng-template #titleTemplate>
-    <button nz-button nzSize="small" nzType="text"
-            nz-tooltip nzTooltipTitle="{{'common.column'|translate}}" (click)="handlerShowColumnDrawer()">
-      <i nz-icon nzType="table" class="action-button-1890"></i>
-    </button>
+    <nz-radio-group [(ngModel)]="applyVisible.columnDrawer" nzSize="small"
+                    (ngModelChange)="handlerShowColumnDrawer($event)">
+      <label nz-radio-button nzValue="column">
+        <i nz-icon nzType="table" class="action-button-1890"></i>
+      </label>
+    </nz-radio-group>
   </ng-template>
 </nz-card>