|
58
|
1 "use strict";
|
|
|
2 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
|
3 var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
|
4 if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
|
5 else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
|
6 return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
|
7 };
|
|
|
8 var __metadata = (this && this.__metadata) || function (k, v) {
|
|
|
9 if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
|
|
10 };
|
|
|
11 var core_1 = require('@angular/core');
|
|
|
12 var QueryResultTableComponent = (function () {
|
|
|
13 function QueryResultTableComponent() {
|
|
|
14 this.showTable = false;
|
|
|
15 this.currentPage = 1;
|
|
|
16 this.itemsPerPage = 10;
|
|
|
17 this.maxSize = 5;
|
|
|
18 this.numPages = 1;
|
|
|
19 this.length = 0;
|
|
|
20 this.config = {
|
|
|
21 paging: true,
|
|
|
22 sorting: { 'columns': this.columns },
|
|
|
23 };
|
|
|
24 }
|
|
|
25 QueryResultTableComponent.prototype.ngOnChanges = function (changes) {
|
|
|
26 console.debug("result table changed! changes=", changes);
|
|
|
27 this.data = this.queryState.results;
|
|
|
28 if (this.data.length > 0) {
|
|
|
29 this.allColumns = this.queryState.resultColumns;
|
|
|
30 this.columns = this.allColumns.filter(function (c) { return c.show; });
|
|
|
31 this.config.sorting = this.columns;
|
|
|
32 this.config.paging = { 'page': this.currentPage, 'itemsPerPage': this.itemsPerPage };
|
|
|
33 this.showTable = (this.data.length < 1000);
|
|
|
34 this.onChangeTable(this.config);
|
|
|
35 }
|
|
|
36 };
|
|
|
37 QueryResultTableComponent.prototype.ngOnInit = function () {
|
|
|
38 console.debug("result table init!");
|
|
|
39 };
|
|
|
40 QueryResultTableComponent.prototype.onSelectNumItems = function (event) {
|
|
|
41 var selected = event.target.value;
|
|
|
42 console.debug("selected number of items:", selected);
|
|
|
43 var num = parseInt(selected);
|
|
|
44 if (num == 0) {
|
|
|
45 this.itemsPerPage = this.length;
|
|
|
46 }
|
|
|
47 else {
|
|
|
48 this.itemsPerPage = num;
|
|
|
49 }
|
|
|
50 // update something
|
|
|
51 this.config.paging = { 'page': this.currentPage, 'itemsPerPage': this.itemsPerPage };
|
|
|
52 this.onChangeTable(this.config);
|
|
|
53 };
|
|
|
54 QueryResultTableComponent.prototype.onSelectCols = function (event) {
|
|
|
55 console.debug("select cols:", this.allColumns);
|
|
|
56 this.columns = this.allColumns.filter(function (c) { return c.show; });
|
|
|
57 this.config.sorting = this.columns;
|
|
|
58 };
|
|
|
59 QueryResultTableComponent.prototype.changePage = function (page, data) {
|
|
|
60 if (data === void 0) { data = this.data; }
|
|
|
61 var start = (page.page - 1) * page.itemsPerPage;
|
|
|
62 var end = page.itemsPerPage > -1 ? (start + page.itemsPerPage) : data.length;
|
|
|
63 return data.slice(start, end);
|
|
|
64 };
|
|
|
65 QueryResultTableComponent.prototype.changeSort = function (data, config) {
|
|
|
66 if (!config.sorting) {
|
|
|
67 return data;
|
|
|
68 }
|
|
|
69 var columns = this.columns.filter(function (c) { return c.sort; });
|
|
|
70 // simple sorting
|
|
|
71 var sorted = data.sort(function (previous, current) {
|
|
|
72 for (var i = 0; i < columns.length; i++) {
|
|
|
73 var sort = columns[i].sort;
|
|
|
74 var columnName = columns[i].name;
|
|
|
75 if (previous[columnName] > current[columnName]) {
|
|
|
76 return sort === 'desc' ? -1 : 1;
|
|
|
77 }
|
|
|
78 else if (previous[columnName] < current[columnName]) {
|
|
|
79 return sort === 'asc' ? -1 : 1;
|
|
|
80 }
|
|
|
81 }
|
|
|
82 return 0;
|
|
|
83 });
|
|
|
84 return sorted;
|
|
|
85 };
|
|
|
86 QueryResultTableComponent.prototype.changeFilter = function (data, config) {
|
|
|
87 var _this = this;
|
|
|
88 if (!config.filtering) {
|
|
|
89 return data;
|
|
|
90 }
|
|
|
91 var filteredData = data.filter(function (item) {
|
|
|
92 return item[config.filtering.columnName].match(_this.config.filtering.filterString);
|
|
|
93 });
|
|
|
94 return filteredData;
|
|
|
95 };
|
|
|
96 QueryResultTableComponent.prototype.onChangeTable = function (config, page) {
|
|
|
97 if (page === void 0) { page = config.paging; }
|
|
|
98 console.debug("onChangeTable config=", config, " page=", page);
|
|
|
99 if (config.filtering) {
|
|
|
100 Object.assign(this.config.filtering, config.filtering);
|
|
|
101 }
|
|
|
102 if (config.sorting) {
|
|
|
103 Object.assign(this.config.sorting, config.sorting);
|
|
|
104 // changing sorting resets page
|
|
|
105 if (page == null) {
|
|
|
106 this.currentPage = 1;
|
|
|
107 page = { 'page': this.currentPage, 'itemsPerPage': this.itemsPerPage };
|
|
|
108 }
|
|
|
109 }
|
|
|
110 //let filteredData = this.changeFilter(this.data, this.config);
|
|
|
111 //let sortedData = this.changeSort(filteredData, this.config);
|
|
|
112 var sortedData = this.changeSort(this.data, this.config);
|
|
|
113 this.rows = (page && this.config.paging) ? this.changePage(page, sortedData) : sortedData;
|
|
|
114 this.length = sortedData.length;
|
|
|
115 };
|
|
|
116 QueryResultTableComponent = __decorate([
|
|
|
117 core_1.Component({
|
|
|
118 selector: 'query-result',
|
|
|
119 template: "\n <div *ngIf=\"queryState?.numResults > 0\">\n <span>Cypher query:</span>\n <pre>{{queryState.getQueryText()}}</pre>\n <h2>Query result</h2>\n <pre>{{resultInfo}}</pre>\n <div *ngIf=\"showTable\"><button (click)=\"showTable=false\">hide results</button></div>\n <div *ngIf=\"!showTable\"><button (click)=\"showTable=true\">show results</button></div>\n <div *ngIf=\"showTable\">\n <div>Show \n <select name=\"numItems\" (change)=\"onSelectNumItems($event)\">\n <option value=\"10\">10</option>\n <option value=\"100\">100</option>\n <option value=\"0\">all</option>\n </select>\n results per page.\n </div>\n <div>\n <form (ngSubmit)=\"onSelectCols($event)\">\n Columns:\n <span *ngFor=\"let col of allColumns\">\n <input type=\"checkbox\" name=\"col{{col.name}}\" value=\"{{col.name}}\" [(ngModel)]=\"col.show\">{{col.name}}\n </span> \n <button type=\"submit\">change columns</button>\n </form>\n </div>\n <pagination *ngIf=\"config.paging\" class=\"pagination-sm\"\n [(ngModel)]=\"currentPage\"\n [totalItems]=\"length\"\n [itemsPerPage]=\"itemsPerPage\"\n [maxSize]=\"maxSize\"\n [boundaryLinks]=\"true\"\n [rotate]=\"false\"\n (pageChanged)=\"onChangeTable(config, $event)\"\n (numPages)=\"numPages = $event\">\n </pagination>\n <ng-table \n [config]=\"config\"\n (tableChanged)=\"onChangeTable($event)\"\n [rows]=\"rows\" [columns]=\"columns\">\n </ng-table>\n </div>\n </div>\n <div *ngIf=\"!(queryState?.numResults > 0)\">\n <h2>No results found</h2>\n </div>\n ",
|
|
|
120 inputs: ['queryState', 'resultInfo']
|
|
|
121 }),
|
|
|
122 __metadata('design:paramtypes', [])
|
|
|
123 ], QueryResultTableComponent);
|
|
|
124 return QueryResultTableComponent;
|
|
|
125 }());
|
|
|
126 exports.QueryResultTableComponent = QueryResultTableComponent;
|
|
|
127 //# sourceMappingURL=query-result-table.component.js.map |
