From ec831bcec0fd2e3c94dd6055907feea99a6fe64e Mon Sep 17 00:00:00 2001 From: Andy Butland Date: Thu, 19 Dec 2019 10:12:56 +0100 Subject: [PATCH] V8: #7209 fixes filter in User Management not keeping state (#7216) * Saved and restored user view filter and sort when viewing user details and returning to list. * Reworked state retention when navigating to and from the users list and user details pages to use querystring values. * Fixed issue with culture parameter on navigating between user list and details screen. Ensured when opening users list with querystring that user states filter is correctly populated. --- .../users/views/users/users.controller.js | 108 ++++++++++++++++-- 1 file changed, 99 insertions(+), 9 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js index 1ae0074bfa..024d4539bc 100644 --- a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.controller.js @@ -1,13 +1,12 @@ (function () { "use strict"; - function UsersController($scope, $timeout, $location, $routeParams, usersResource, - userGroupsResource, userService, localizationService, contentEditingHelper, - usersHelper, formHelper, notificationsService, dateHelper, editorService, + function UsersController($scope, $timeout, $location, $routeParams, usersResource, + userGroupsResource, userService, localizationService, + usersHelper, formHelper, dateHelper, editorService, listViewHelper) { var vm = this; - var localizeSaving = localizationService.localize("general_saving"); vm.page = {}; vm.users = []; @@ -128,8 +127,7 @@ function init() { - vm.usersOptions.orderBy = "Name"; - vm.usersOptions.orderDirection = "Ascending"; + initViewOptions(); if ($routeParams.create) { setUsersViewState("createUser"); @@ -144,10 +142,56 @@ // Get user groups userGroupsResource.getUserGroups({ onlyCurrentUserGroups: false }).then(function (userGroups) { vm.userGroups = userGroups; + initUserGroupSelections(); }); } + function initViewOptions() { + + // Start with default view options. + vm.usersOptions.orderBy = "Name"; + vm.usersOptions.orderDirection = "Ascending"; + + // Update from querystring if available. + initViewOptionFromQueryString("orderBy"); + initViewOptionFromQueryString("orderDirection"); + initViewOptionFromQueryString("pageNumber"); + initViewOptionFromQueryString("userStates", true); + initViewOptionFromQueryString("userGroups", true); + } + + function initViewOptionFromQueryString(key, isCollection) { + var value = $location.search()[key]; + if (value) { + if (isCollection) { + value = value.split(","); + } + + vm.usersOptions[key] = value; + } + } + + function initUserStateSelections() { + initUsersOptionsFilterSelections(vm.userStatesFilter, vm.usersOptions.userStates, "key"); + } + + function initUserGroupSelections() { + initUsersOptionsFilterSelections(vm.userGroups, vm.usersOptions.userGroups, "alias"); + } + + function initUsersOptionsFilterSelections(filterCollection, selectedCollection, keyField) { + if (selectedCollection && selectedCollection.length > 0 && filterCollection && filterCollection.length > 0) { + for (var i = 0; i < selectedCollection.length; i++) { + for (var j = 0; j < filterCollection.length; j++) { + if (filterCollection[j][keyField] === selectedCollection[i]) { + filterCollection[j].selected = true; + } + } + } + } + } + function getSortLabel(sortKey, sortDirection) { var found = _.find(vm.userSortData, function (i) { @@ -467,6 +511,7 @@ vm.usersOptions.userStates.splice(index, 1); } + updateLocation("userStates", vm.usersOptions.userStates.join(",")); getUsers(); } @@ -483,20 +528,28 @@ vm.usersOptions.userGroups.splice(index, 1); } + updateLocation("userGroups", vm.usersOptions.userGroups.join(",")); getUsers(); } function setOrderByFilter(value, direction) { vm.usersOptions.orderBy = value; vm.usersOptions.orderDirection = direction; + updateLocation("orderBy", value); + updateLocation("orderDirection", direction); getUsers(); } function changePageNumber(pageNumber) { vm.usersOptions.pageNumber = pageNumber; + updateLocation("pageNumber", pageNumber); getUsers(); } + function updateLocation(key, value) { + $location.search(key, value); + } + function createUser(addUserForm) { if (formHelper.submitForm({ formCtrl: addUserForm, scope: $scope })) { @@ -575,17 +628,53 @@ } function goToUser(user) { - $location.path(pathToUser(user)).search("create", null).search("invite", null); + $location.path(pathToUser(user)) + .search("orderBy", vm.usersOptions.orderBy) + .search("orderDirection", vm.usersOptions.orderDirection) + .search("pageNumber", vm.usersOptions.pageNumber) + .search("userStates", getUsersOptionsFilterCollectionAsDelimitedStringOrNull(vm.usersOptions.userStates)) + .search("userGroups", getUsersOptionsFilterCollectionAsDelimitedStringOrNull(vm.usersOptions.userGroups)) + .search("create", null) + .search("invite", null); + } + + function getUsersOptionsFilterCollectionAsDelimitedStringOrNull(collection) { + if (collection && collection.length > 0) { + return collection.join(","); + } + + return null; } function getEditPath(user) { - return pathToUser(user) + "?mculture=" + $location.search().mculture; + return pathToUser(user) + usersOptionsAsQueryString(); } - + function pathToUser(user) { return "/users/users/user/" + user.id; } + function usersOptionsAsQueryString() { + var qs = "?orderBy=" + vm.usersOptions.orderBy + + "&orderDirection=" + vm.usersOptions.orderDirection + + "&pageNumber=" + vm.usersOptions.pageNumber; + + qs += addUsersOptionsFilterCollectionToQueryString("userStates", vm.usersOptions.userStates); + qs += addUsersOptionsFilterCollectionToQueryString("userGroups", vm.usersOptions.userGroups); + + qs += "&mculture=" + $location.search().mculture; + + return qs; + } + + function addUsersOptionsFilterCollectionToQueryString(name, collection) { + if (collection && collection.length > 0) { + return "&" + name + "=" + collection.join(","); + } + + return ""; + } + // helpers function getUsers() { @@ -604,6 +693,7 @@ formatDates(vm.users); setUserDisplayState(vm.users); vm.userStatesFilter = usersHelper.getUserStatesFilter(data.userStates); + initUserStateSelections(); vm.loading = false;