From 955320205b0d6b1e633b541c3c27c2aff6eb619d Mon Sep 17 00:00:00 2001 From: Marie JONES <14836007+marie-j@users.noreply.github.com> Date: Mon, 15 Apr 2019 10:19:33 +0200 Subject: [PATCH 1/4] refactor(oui-guide-menu): replace guides icon (#388) --- packages/oui-guide-menu/src/guide-menu.html | 15 +-------------- 1 file changed, 1 insertion(+), 14 deletions(-) diff --git a/packages/oui-guide-menu/src/guide-menu.html b/packages/oui-guide-menu/src/guide-menu.html index 21ac6ed3..9ba2a233 100644 --- a/packages/oui-guide-menu/src/guide-menu.html +++ b/packages/oui-guide-menu/src/guide-menu.html @@ -1,20 +1,7 @@ Date: Wed, 17 Apr 2019 10:13:29 +0200 Subject: [PATCH 2/4] feat(oui-datagrid): add page change event (#389) Emit an event instead of directly scrolling the view as it is not the component concerns --- packages/oui-datagrid/README.md | 12 ++++++++ .../oui-datagrid/src/datagrid.controller.js | 30 ++++++++----------- .../oui-datagrid/src/datagrid.directive.js | 3 +- packages/oui-datagrid/src/datagrid.service.js | 2 +- packages/oui-datagrid/src/index.spec.js | 18 +++++++++++ 5 files changed, 46 insertions(+), 19 deletions(-) diff --git a/packages/oui-datagrid/README.md b/packages/oui-datagrid/README.md index 87306a03..c01da3b5 100644 --- a/packages/oui-datagrid/README.md +++ b/packages/oui-datagrid/README.md @@ -281,6 +281,17 @@ Or you can use the `page-size` property. It takes precedence over value configur ``` +You can also add custom behaviour on pagination changes + +```html:preview +

Page size : {{ $ctrl.pageSize }}

+

Offset : {{ $ctrl.offset }}

+ + + + +``` + ### Custom cell templates ```html @@ -718,6 +729,7 @@ call `rows-loader` and then a `row-loader` call for each line. | `columns-parameters` | array | { this.paging.setOffset(1); this.paging.setCriteria(criteria); - }, false, false); + }, false); } - onPaginationChange ($event) { + onPaginationChange ({ offset, pageSize }) { this.refreshData(() => { - this.paging.setOffset($event.offset); - this.paging.setPageSize($event.pageSize); - }, true, true); - } - - scrollToTop () { - // Small delay otherwise rows could not be rendered - // yet and position would be wrong - this.$timeout(() => { - this.$element[0].scrollIntoView(true); - }); + this.paging.setOffset(offset); + this.paging.setPageSize(pageSize); + this.onPageChange({ + $pagination: { + offset, + pageSize + } + }); + }, true); } - refreshData (callback, skipSortAndFilter, requireScrollToTop, hideLoader, forceLoadRows) { + refreshData (callback, skipSortAndFilter, hideLoader, forceLoadRows) { if (this.loading) { return this.$q.when(); } @@ -281,13 +279,11 @@ export default class DatagridController { .then(() => this.paging.loadData(skipSortAndFilter, forceLoadRows)) .then(result => { this.displayedRows = result.data; - if (requireScrollToTop) { - this.scrollToTop(); - } if (this.hasActionMenu) { setTimeout(() => this.checkScroll(), checkScrollOnRefreshDataDelay); } }) + .catch(error => console.log(error)) .finally(() => { this.loading = false; this.firstLoading = false; diff --git a/packages/oui-datagrid/src/datagrid.directive.js b/packages/oui-datagrid/src/datagrid.directive.js index 7ad9c7b1..c4c5caf0 100644 --- a/packages/oui-datagrid/src/datagrid.directive.js +++ b/packages/oui-datagrid/src/datagrid.directive.js @@ -18,7 +18,8 @@ export default () => { rowLoader: "&?", emptyPlaceholder: "@?", onColumnsParametersChange: "&", - onRowSelect: "&" + onRowSelect: "&", + onPageChange: "&" }, compile: elm => { // Transclude can't be used here otherwise transcluded diff --git a/packages/oui-datagrid/src/datagrid.service.js b/packages/oui-datagrid/src/datagrid.service.js index bf7e74ca..dcaec6ae 100644 --- a/packages/oui-datagrid/src/datagrid.service.js +++ b/packages/oui-datagrid/src/datagrid.service.js @@ -28,7 +28,7 @@ export default class DatagridService { const datagridController = this.datagrids[datagridId]; if (datagridController) { - datagridController.refreshData(false, false, false, !showSpinner, true); + datagridController.refreshData(false, false, !showSpinner, true); } } } diff --git a/packages/oui-datagrid/src/index.spec.js b/packages/oui-datagrid/src/index.spec.js index 06b433c2..95037206 100644 --- a/packages/oui-datagrid/src/index.spec.js +++ b/packages/oui-datagrid/src/index.spec.js @@ -1270,6 +1270,24 @@ describe("ouiDatagrid", () => { expect(getCell($secondRow, 1).children().html()).toBe(fakeData[3].lastName); }); + it("should execute callback when pagination changes", () => { + const onPageChangeSpy = jasmine.createSpy("onPaginationChangeSpy"); + const element = TestUtils.compileTemplate(` + + + + + `, { + rows: fakeData.slice(0, 5), + onPageChange: onPageChangeSpy + } + ); + + getNextPagePaginationButton(element).triggerHandler("click"); + + expect(onPageChangeSpy).toHaveBeenCalled(); + }); + it("should support action-menu as column", () => { const element = TestUtils.compileTemplate(` From 882530cb6d9825d7e0912c77a8ba3543abafc617 Mon Sep 17 00:00:00 2001 From: Antoine Leblanc Date: Wed, 17 Apr 2019 11:37:55 +0200 Subject: [PATCH 3/4] refactor(oui-datagrid): remove extra console.log (#392) --- packages/oui-datagrid/src/datagrid.controller.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/oui-datagrid/src/datagrid.controller.js b/packages/oui-datagrid/src/datagrid.controller.js index 295e6d17..2134c756 100644 --- a/packages/oui-datagrid/src/datagrid.controller.js +++ b/packages/oui-datagrid/src/datagrid.controller.js @@ -283,7 +283,6 @@ export default class DatagridController { setTimeout(() => this.checkScroll(), checkScrollOnRefreshDataDelay); } }) - .catch(error => console.log(error)) .finally(() => { this.loading = false; this.firstLoading = false; From 1441a710142365671ab33a7037dd6f00a798b5ef Mon Sep 17 00:00:00 2001 From: Marie JONES <14836007+marie-j@users.noreply.github.com> Date: Fri, 19 Apr 2019 14:45:52 +0200 Subject: [PATCH 4/4] feat(oui-stepper): add ability to set opened step (#393) --- packages/oui-stepper/README.md | 19 +++++++++++++ packages/oui-stepper/src/index.spec.js | 27 +++++++++++++++++++ packages/oui-stepper/src/stepper.component.js | 3 ++- .../oui-stepper/src/stepper.controller.js | 12 +++++++-- 4 files changed, 58 insertions(+), 3 deletions(-) diff --git a/packages/oui-stepper/README.md b/packages/oui-stepper/README.md index 468edea8..b817a5a1 100644 --- a/packages/oui-stepper/README.md +++ b/packages/oui-stepper/README.md @@ -98,6 +98,24 @@ ``` +### Open Steps + +```html:preview + + +

Random content

+ + + + Go to Step 1 + + + +``` + ### Events on `oui-stepper` **Note**: If you want to access the forms inside `on-finish` callback, you need to use the `forms` variable as below. @@ -154,6 +172,7 @@ | ---- | ---- | ---- | ---- | ---- | ---- | ---- | `name` | string | @? | yes | n/a | n/a | stepper name used to identify step | `id` | string | @? | yes | n/a | n/a | stepper id used to identify step +| `current-index` | number | =? | no | n/a | 0 | current step index | `on-init` | function | & | no | n/a | n/a | initialization function | `on-finish` | function | & | no | n/a | n/a | submit all steps function diff --git a/packages/oui-stepper/src/index.spec.js b/packages/oui-stepper/src/index.spec.js index a135172d..afc7890d 100644 --- a/packages/oui-stepper/src/index.spec.js +++ b/packages/oui-stepper/src/index.spec.js @@ -230,6 +230,33 @@ describe("ouiStepper", () => { expect(form2.hasClass(disabledClass)).toBe(false); expect(form3.hasClass(disabledClass)).toBe(true); }); + + it("should open designated step", () => { + const element = TestUtils.compileTemplate(` + + + + + `, { index: 1 }); + + $timeout.flush(); + + const form1 = element.find("form").eq(0); + const form2 = element.find("form").eq(1); + const form3 = element.find("form").eq(2); + + expect(form1.scope().$ctrl.stepper.focused).toBe(false); + expect(form2.scope().$ctrl.stepper.focused).toBe(true); + expect(form3.scope().$ctrl.stepper.focused).toBe(false); + + element.scope().$ctrl.index = 2; + + element.scope().$digest(); + + expect(form1.scope().$ctrl.stepper.focused).toBe(false); + expect(form2.scope().$ctrl.stepper.focused).toBe(false); + expect(form3.scope().$ctrl.stepper.focused).toBe(true); + }); }); }); }); diff --git a/packages/oui-stepper/src/stepper.component.js b/packages/oui-stepper/src/stepper.component.js index e0c7b8ec..c6c091e5 100644 --- a/packages/oui-stepper/src/stepper.component.js +++ b/packages/oui-stepper/src/stepper.component.js @@ -6,7 +6,8 @@ export default { name: "@", id: "@", onInit: "&", - onFinish: "&" + onFinish: "&", + currentIndex: "=?" }, controller, template, diff --git a/packages/oui-stepper/src/stepper.controller.js b/packages/oui-stepper/src/stepper.controller.js index 31edb0c2..4a50bddc 100644 --- a/packages/oui-stepper/src/stepper.controller.js +++ b/packages/oui-stepper/src/stepper.controller.js @@ -1,16 +1,19 @@ +import get from "lodash/get"; + export default class { - constructor ($attrs, $element, $timeout) { + constructor ($attrs, $element, $scope, $timeout) { "ngInject"; this.$attrs = $attrs; this.$element = $element; + this.$scope = $scope; this.$timeout = $timeout; } $onInit () { this.forms = []; this.steps = []; - this.currentIndex = 0; + this.currentIndex = get(this, "currentIndex", 0); this.onInit(); } @@ -21,6 +24,11 @@ export default class { .removeAttr("name") .addClass("oui-stepper") ); + + this.$scope.$watch( + () => this.currentIndex, + (index) => this.focusStep(index) + ); } addStep (step) {