-
diff --git a/ngapp/src/app/dataservices/jdbc-table-selector/jdbc-table-selector.component.ts b/ngapp/src/app/dataservices/jdbc-table-selector/jdbc-table-selector.component.ts
index 1d51372e..5ec2f77f 100644
--- a/ngapp/src/app/dataservices/jdbc-table-selector/jdbc-table-selector.component.ts
+++ b/ngapp/src/app/dataservices/jdbc-table-selector/jdbc-table-selector.component.ts
@@ -343,23 +343,48 @@ export class JdbcTableSelectorComponent implements OnInit, TableSelector {
return this.tables.filter( ( table ) => table.selected );
}
- public tableSelectionChanged( event: any ): void {
- const selectedTables = event.selected;
- const self = this;
+ public selectAllTables(): void {
+ this.selectedAllRows = !this.selectedAllRows;
+ const self = this;
- // sync up the UI row selections with the actual table selections
this.filteredTables.forEach( ( table ) => {
- if ( ( !table.selected && this.isSelected( selectedTables, table ) )
- || ( table.selected && !this.isSelected( selectedTables, table )) ) {
- table.selected = !table.selected;
+ if ( table.selected !== self.selectedAllRows ) {
+ self.selectedTableChanged( table );
+ }
+ } );
+ }
- if ( table.selected ) {
- this.tableSelectionAdded.emit(table);
- } else {
- this.tableSelectionRemoved.emit(table);
+ /*
+ * Handler for changes in table selection
+ */
+ public selectedTableChanged( table: Table ): void {
+ table.selected = !table.selected;
+
+ if ( table.selected ) {
+ this.tableSelectionAdded.emit(table);
+
+ // check column header checkbox if all are selected
+ if ( !this.selectedAllRows ) {
+ let selectAll = true;
+
+ for ( const tbl of this.filteredTables ) {
+ if ( !tbl.selected ) {
+ selectAll = false;
+ }
+ }
+
+ if ( selectAll ) {
+ this.selectedAllRows = true;
}
}
- } );
+ } else {
+ this.tableSelectionRemoved.emit(table);
+
+ // uncheck column header checkbox if needed
+ if ( this.selectedAllRows ) {
+ this.selectedAllRows = false;
+ }
+ }
}
/**
@@ -369,6 +394,7 @@ export class JdbcTableSelectorComponent implements OnInit, TableSelector {
public deselectTable(table: Table): void {
const connName = table.getConnection().getId();
const tableName = table.getName();
+
for (const theTable of this.tables) {
const theConnName = theTable.getConnection().getId();
const theTableName = theTable.getName();
diff --git a/ngapp/src/app/dataservices/selected-table/column.ts b/ngapp/src/app/dataservices/selected-table/column.ts
new file mode 100644
index 00000000..1286ecad
--- /dev/null
+++ b/ngapp/src/app/dataservices/selected-table/column.ts
@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright 2017 JBoss Inc
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export class Column {
+
+ public selected = true;
+ public name: string;
+ public type: string;
+ public size: number;
+
+ public constructor( name: string,
+ selected: boolean,
+ type: string,
+ size: number ) {
+ this.name = name;
+ this.type = type;
+ this.selected = selected;
+ this.size = size;
+ }
+
+}
diff --git a/ngapp/src/app/dataservices/selected-table/selected-table.component.css b/ngapp/src/app/dataservices/selected-table/selected-table.component.css
index 7b9de951..68add26f 100644
--- a/ngapp/src/app/dataservices/selected-table/selected-table.component.css
+++ b/ngapp/src/app/dataservices/selected-table/selected-table.component.css
@@ -1,24 +1,70 @@
-.selected-table-card {
+.selected-table-card .card-pf {
background-color: #def3ff;
- border:2px dotted darkblue;
- margin-top: 5px;
- margin-left: 0;
- min-height: 60px;
- max-height: 80px;
- padding-top: 5px;
- padding-right: 5px;
+ margin: 0 0px 10px;
+ min-height: 40px;
}
-.selected-table-name {
- margin-left: 20px;
+.selected-table-name:before {
+ display: inline-block;
+ margin-bottom: 0px;
+ margin-right: 10px;
+ margin-top: 0px;
+ font-family: "FontAwesome";
+ content: "\f0ce";
+}
+
+.selected-table-name .card-pf-title {
+ margin-bottom: 0px;
+ margin-left: 5px;
+ margin-top: 0px;
+ font-size: 14px;
font-weight: bold;
}
-.selected-table-connection {
+.selected-table-connection:before {
+ display: inline-block;
+ margin-bottom: 0px;
+ margin-left: 20px;
+ margin-right: 10px;
+ margin-top: 0px;
+ font-family: "FontAwesome";
+ content: "\f1e6";
+ color: #666666;
+}
+
+.selected-table-connection .card-pf-subtitle {
+ color: #666666;
+ margin-bottom: 0px;
margin-left: 5px;
+ margin-top: 0px;
+ font-size: 14px;
}
.selected-table-close-icon {
cursor: pointer;
color: darkred;
}
+
+.selected-table-body .card-pf-body {
+ background-color: white;
+ margin-top: 10px !important;
+}
+
+.selected-table-column-selection {
+ margin-left: 5px;
+ padding-top: 5px;
+ font-weight: bold;
+}
+
+.seleted-table-card .pfng-card .card-pf-heading {
+ background-color: #def3ff;
+ margin-bottom: -10px !important;
+}
+
+
+.selected-table-card .pfng-card .card-pf-footer {
+ margin: 0 !important;
+ padding: 10px 0px 5px 20px;
+ min-height: 20px;
+}
+
diff --git a/ngapp/src/app/dataservices/selected-table/selected-table.component.html b/ngapp/src/app/dataservices/selected-table/selected-table.component.html
index 78abdcf0..671aad6b 100644
--- a/ngapp/src/app/dataservices/selected-table/selected-table.component.html
+++ b/ngapp/src/app/dataservices/selected-table/selected-table.component.html
@@ -1,6 +1,84 @@
-
- {{ table.getConnection().getId() }}
- {{ table.getName() }}
-
+
+
+
+
+ {{ table.getConnection().getId() }}
+
+
+
+
Select columns to include in the view:
+
+
+
+
+ {{selectedColumnCount}} of {{columnCount}} selected
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ngapp/src/app/dataservices/selected-table/selected-table.component.ts b/ngapp/src/app/dataservices/selected-table/selected-table.component.ts
index dba7d5c7..aee276b7 100644
--- a/ngapp/src/app/dataservices/selected-table/selected-table.component.ts
+++ b/ngapp/src/app/dataservices/selected-table/selected-table.component.ts
@@ -1,7 +1,27 @@
-import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core";
+/**
+ * @license
+ * Copyright 2017 JBoss Inc
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation } from "@angular/core";
+import { Column } from "@dataservices/selected-table/column";
import { Table } from "@dataservices/shared/table.model";
+import { CardAction, CardConfig } from "patternfly-ng";
@Component({
+ encapsulation: ViewEncapsulation.None,
selector: "app-selected-table",
templateUrl: "./selected-table.component.html",
styleUrls: ["./selected-table.component.css"]
@@ -11,16 +31,72 @@ export class SelectedTableComponent implements OnInit {
@Input() public table: Table;
@Output() public selectionListTableRemoved: EventEmitter
= new EventEmitter();
+ public columnDefinitions: Column[];
+ public config: CardConfig;
+ public showColumns = false;
+
+ public readonly customClasses = {
+ sortAscending: "fa fa-sort-asc",
+ sortDescending: "fa fa-sort-desc",
+ pagerLeftArrow: "fa fa-chevron-left",
+ pagerRightArrow: "fa fa-chevron-right",
+ pagerPrevious: "fa fa-step-backward",
+ pagerNext: "fa fa-step-forward"
+ };
+
constructor() {
// nothing to do
}
public ngOnInit(): void {
- // nothing to do
+ this.columnDefinitions = [
+ { name: "name", selected: true, type: "string", size: 25 },
+ { name: "age", selected: true, type: "integer", size: 3 },
+ { name: "street", selected: true, type: "string", size: 50 },
+ { name: "state", selected: true, type: "string", size: 2 },
+ { name: "zipcode", selected: true, type: "string", size: 9 },
+ { name: "company", selected: true, type: "string", size: 50 },
+ { name: "married", selected: true, type: "boolean", size: 1 },
+ { name: "gender", selected: true, type: "string", size: 1 }
+ ];
+
+ this.config = {
+ action: {
+ id: "showColumns",
+ hypertext: this.showColumnsActionTitle,
+ iconStyleClass: "fa fa-columns"
+ },
+ titleBorder: true,
+ noPadding: true,
+ topBorder: true
+ } as CardConfig;
+ }
+
+ public get columnCount(): number {
+ return this.columnDefinitions.length;
+ }
+
+ public handleActionSelect( $event: CardAction ): void {
+ this.showColumns = !this.showColumns;
+ $event.hypertext = this.showColumnsActionTitle;
+ }
+
+ public selectedColumnChanged( column: Column ): void {
+ column.selected = !column.selected;
+ }
+
+ public get selectedColumnCount(): number {
+ return this.columnDefinitions.filter( ( column ) => column.selected ).length;
+ }
+
+ public get showColumnsActionTitle(): string {
+ return this.showColumns ? "Hide Columns"
+ : "Show Columns (" + this.selectedColumnCount + " of " + this.columnCount + " selected)";
}
public onRemove(): void {
this.table.selected = false;
this.selectionListTableRemoved.emit(this.table);
}
+
}
diff --git a/ngapp/src/app/dataservices/shared/wizard.service.ts b/ngapp/src/app/dataservices/shared/wizard.service.ts
index cde3c605..191b4674 100644
--- a/ngapp/src/app/dataservices/shared/wizard.service.ts
+++ b/ngapp/src/app/dataservices/shared/wizard.service.ts
@@ -52,7 +52,10 @@ export class WizardService {
* @returns {Table[]} the selections
*/
public getWizardSelectedTables( ): Table[] {
- return this.wizardSelectedTablesArray;
+ return this.wizardSelectedTablesArray.sort(
+ ( thisTable, thatTable ) => {
+ return thisTable.getName().localeCompare( thatTable.getName() );
+ } );
}
/**