Add sort functionality to table Component
Added optional sort function to the shared table component.
Table sort is not implemented on any existing table, but will
be used in the redesigned Event Log table.
- Changed table model attribute to two separate properties
data and header to take advantage of $onChanges lifecycle
hook
- Update local user table and user role table to account for
these updates
Tested on Chrome, Safari, Firefox, Edge, IE
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I4fe68e78ae9d1228d7d9350538f61076036b1089
diff --git a/app/users/controllers/user-accounts-controller.html b/app/users/controllers/user-accounts-controller.html
index 76df616..696a984 100644
--- a/app/users/controllers/user-accounts-controller.html
+++ b/app/users/controllers/user-accounts-controller.html
@@ -23,7 +23,8 @@
</div>
<!-- Local user table -->
<bmc-table
- model="tableModel"
+ data="tableData"
+ header="tableHeader"
row-actions-enabled="true"
emit-action="onEmitAction(value)"
class="local-users__table">
@@ -36,4 +37,4 @@
<role-table></role-table>
</div>
</div>
-</div>
+</div>
\ No newline at end of file
diff --git a/app/users/controllers/user-accounts-controller.js b/app/users/controllers/user-accounts-controller.js
index b5ed1a5..7591a53 100644
--- a/app/users/controllers/user-accounts-controller.js
+++ b/app/users/controllers/user-accounts-controller.js
@@ -17,9 +17,10 @@
$scope.userRoles;
$scope.localUsers;
- $scope.tableModel = {};
- $scope.tableModel.data = [];
- $scope.tableModel.header = ['Username', 'Privilege', 'Account status'];
+ $scope.tableData = [];
+ $scope.tableHeader = [
+ {label: 'Username'}, {label: 'Privilege'}, {label: 'Account status'}
+ ];
/**
* Data table mapper
@@ -61,7 +62,7 @@
APIUtils.getAllUserAccounts()
.then((users) => {
$scope.localUsers = users;
- $scope.tableModel.data = users.map(mapTableData);
+ $scope.tableData = users.map(mapTableData);
})
.catch((error) => {
console.log(JSON.stringify(error));
diff --git a/app/users/directives/role-table.html b/app/users/directives/role-table.html
index 55e8108..95b4c31 100644
--- a/app/users/directives/role-table.html
+++ b/app/users/directives/role-table.html
@@ -7,7 +7,8 @@
<span ng-if="!roleTableCtrl.isCollapsed">Hide privilege role descriptions</span>
</button>
<div uib-collapse="roleTableCtrl.isCollapsed">
- <bmc-table model="roleTableCtrl.tableModel"
+ <bmc-table data="roleTableCtrl.tableData"
+ header="roleTableCtrl.tableHeader"
size="'small'">
</bmc-table>
</div>
diff --git a/app/users/directives/role-table.js b/app/users/directives/role-table.js
index ee99a41..c23fed8 100644
--- a/app/users/directives/role-table.js
+++ b/app/users/directives/role-table.js
@@ -20,9 +20,10 @@
const check =
$sce.trustAsHtml(`<span class="icon__check-mark">${svg}<span>`);
- this.tableModel = {};
- this.tableModel.header =
- ['', 'Admin', 'Operator', 'User', 'Callback'];
+ this.tableHeader = [
+ {label: ''}, {label: 'Admin'}, {label: 'Operator'}, {label: 'User'},
+ {label: 'Callback'}
+ ];
// TODO: When API changed from D-Bus to Redfish, 'Operator' role
// should have 'Configure components managed by this service'
@@ -30,7 +31,7 @@
// TODO: When 'Operator' and 'User' roles have ability to change
// own account's passwords, should have 'Update password for
// current user account' privilege checked
- this.tableModel.data = [
+ this.tableData = [
{
uiData: [
'Configure components managed by this service', check, '', '',