IGNITE-9104 Web Console: Enhanced UI grid.
Project: http://git-wip-us.apache.org/repos/asf/ignite/repo Commit: http://git-wip-us.apache.org/repos/asf/ignite/commit/1b5d2755 Tree: http://git-wip-us.apache.org/repos/asf/ignite/tree/1b5d2755 Diff: http://git-wip-us.apache.org/repos/asf/ignite/diff/1b5d2755 Branch: refs/heads/ignite-8446 Commit: 1b5d27555383a7c70801af01d7d663c31adc715a Parents: 7c4705c Author: Alexander Kalinin <verba...@yandex.ru> Authored: Tue Jul 31 10:19:33 2018 +0700 Committer: Alexey Kuznetsov <akuznet...@apache.org> Committed: Tue Jul 31 10:19:33 2018 +0700 ---------------------------------------------------------------------- modules/web-console/frontend/app/app.js | 2 + .../app/components/grid-export/index.js | 2 +- .../app/components/grid-export/style.scss | 34 ++++++++++++++ .../app/components/grid-export/template.pug | 6 ++- .../components/grid-item-selected/template.pug | 5 ++- .../app/components/grid-no-data/controller.js | 7 +-- .../components/grid-showing-rows/component.js | 29 ++++++++++++ .../components/grid-showing-rows/controller.js | 47 ++++++++++++++++++++ .../app/components/grid-showing-rows/index.js | 24 ++++++++++ .../app/components/grid-showing-rows/style.scss | 20 +++++++++ 10 files changed, 168 insertions(+), 8 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/app.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/app.js b/modules/web-console/frontend/app/app.js index b9d72ab..baf06dd 100644 --- a/modules/web-console/frontend/app/app.js +++ b/modules/web-console/frontend/app/app.js @@ -126,6 +126,7 @@ import gridColumnSelector from './components/grid-column-selector'; import gridItemSelected from './components/grid-item-selected'; import gridNoData from './components/grid-no-data'; import gridExport from './components/grid-export'; +import gridShowingRows from './components/grid-showing-rows'; import bsSelectMenu from './components/bs-select-menu'; import protectFromBsSelectRender from './components/protect-from-bs-select-render'; import uiGridHovering from './components/ui-grid-hovering'; @@ -221,6 +222,7 @@ export default angular.module('ignite-console', [ gridItemSelected.name, gridNoData.name, gridExport.name, + gridShowingRows.name, bsSelectMenu.name, uiGridHovering.name, uiGridFilters.name, http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-export/index.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-export/index.js b/modules/web-console/frontend/app/components/grid-export/index.js index 9fa8835..00e2bce 100644 --- a/modules/web-console/frontend/app/components/grid-export/index.js +++ b/modules/web-console/frontend/app/components/grid-export/index.js @@ -16,7 +16,7 @@ */ import angular from 'angular'; - +import './style.scss'; import component from './component'; export default angular http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-export/style.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-export/style.scss b/modules/web-console/frontend/app/components/grid-export/style.scss new file mode 100644 index 0000000..29e35fd --- /dev/null +++ b/modules/web-console/frontend/app/components/grid-export/style.scss @@ -0,0 +1,34 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You 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. + */ + +grid-export { + &:not(.link-success) { + button:nth-child(2) { + display: none; + } + } + + &.link-success { + button:nth-child(1) { + display: none; + } + } + + [ignite-icon='download'] { + margin-right: 5px; + } +} http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-export/template.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-export/template.pug b/modules/web-console/frontend/app/components/grid-export/template.pug index fac10df..a085db6 100644 --- a/modules/web-console/frontend/app/components/grid-export/template.pug +++ b/modules/web-console/frontend/app/components/grid-export/template.pug @@ -14,5 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. -button.btn-ignite.btn-ignite--link-dashed-secondary(ng-click='$ctrl.export()' bs-tooltip='' data-title='Export filtered rows to CSV' data-placement='top') +button.btn-ignite.btn-ignite--primary-outline(ng-click='$ctrl.export()' bs-tooltip='' data-title='Export filtered rows to CSV' data-placement='top') + svg(ignite-icon='csv') + +button.btn-ignite.btn-ignite--link-success.link-success(ng-click='$ctrl.export()' bs-tooltip='' data-title='Export filtered rows to CSV' data-placement='top') svg(ignite-icon='download') + i Export to .csv \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-item-selected/template.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-item-selected/template.pug b/modules/web-console/frontend/app/components/grid-item-selected/template.pug index eca079e..cf0695b 100644 --- a/modules/web-console/frontend/app/components/grid-item-selected/template.pug +++ b/modules/web-console/frontend/app/components/grid-item-selected/template.pug @@ -14,4 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. -i {{ $ctrl.selected }} of {{ $ctrl.count }} selected +span(ng-if='$ctrl.count') + i {{ $ctrl.selected }} of {{ $ctrl.count }} selected +span(ng-if='!$ctrl.count') + i Showing: 0 rows \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-no-data/controller.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-no-data/controller.js b/modules/web-console/frontend/app/components/grid-no-data/controller.js index 2451e03..d252c58 100644 --- a/modules/web-console/frontend/app/components/grid-no-data/controller.js +++ b/modules/web-console/frontend/app/components/grid-no-data/controller.js @@ -15,9 +15,7 @@ * limitations under the License. */ -import filter from 'lodash/fp/filter'; - -const rowsFiltered = filter(({ visible }) => visible); +import _ from 'lodash'; export default class { static $inject = ['$scope', 'uiGridConstants']; @@ -47,7 +45,6 @@ export default class { this.noData = false; - const filtered = rowsFiltered(this.gridApi.grid.rows); - this.noDataFiltered = !filtered.length; + this.noDataFiltered = _.sumBy(this.gridApi.grid.rows, 'visible') === 0; } } http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-showing-rows/component.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-showing-rows/component.js b/modules/web-console/frontend/app/components/grid-showing-rows/component.js new file mode 100644 index 0000000..93fa1b1 --- /dev/null +++ b/modules/web-console/frontend/app/components/grid-showing-rows/component.js @@ -0,0 +1,29 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You 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 './style.scss'; +import controller from './controller.js'; + +export default { + template: ` + <i>Showing: {{ $ctrl.count }} rows</i> + `, + controller, + bindings: { + gridApi: '<' + } +}; http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-showing-rows/controller.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-showing-rows/controller.js b/modules/web-console/frontend/app/components/grid-showing-rows/controller.js new file mode 100644 index 0000000..cb5b496 --- /dev/null +++ b/modules/web-console/frontend/app/components/grid-showing-rows/controller.js @@ -0,0 +1,47 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You 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 _ from 'lodash'; + +export default class { + static $inject = ['$scope', 'uiGridConstants']; + + constructor($scope, uiGridConstants) { + Object.assign(this, {$scope, uiGridConstants}); + + this.count = 0; + } + + $onChanges(changes) { + if (changes && 'gridApi' in changes && changes.gridApi.currentValue) { + this.applyValues(); + + this.gridApi.core.on.rowsVisibleChanged(this.$scope, () => { + this.applyValues(); + }); + } + } + + applyValues() { + if (!this.gridApi.grid.rows.length) { + this.count = 0; + return; + } + + this.count = _.sumBy(this.gridApi.grid.rows, 'visible'); + } +} http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-showing-rows/index.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-showing-rows/index.js b/modules/web-console/frontend/app/components/grid-showing-rows/index.js new file mode 100644 index 0000000..9f8c921 --- /dev/null +++ b/modules/web-console/frontend/app/components/grid-showing-rows/index.js @@ -0,0 +1,24 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You 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 angular from 'angular'; + +import component from './component'; + +export default angular + .module('ignite-console.grid-showing-rows', []) + .component('gridShowingRows', component); http://git-wip-us.apache.org/repos/asf/ignite/blob/1b5d2755/modules/web-console/frontend/app/components/grid-showing-rows/style.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/grid-showing-rows/style.scss b/modules/web-console/frontend/app/components/grid-showing-rows/style.scss new file mode 100644 index 0000000..a37f1b5 --- /dev/null +++ b/modules/web-console/frontend/app/components/grid-showing-rows/style.scss @@ -0,0 +1,20 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You 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. + */ + +grid-showing-rows { + color: #757575; +}
