Update local user table to new design
This commit will introduce a reusable data table component.
By creating a reusable component, we can ensure tables in the
GUI will look consistent and common table actions (sort, select row)
are shared.
- Created new components directory to store shared components
- Add password-confirmation directive
- Remove some error handling from API utils so it can be
handled in the UI
TODO:
- Add show/hide toggle to password fields
- Enhance table component with icons
- Manual user unlock
- Batch table actions
- Role table
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I03c95874d2942a2450a5da2f1d2a8bb895aa1746
diff --git a/app/common/directives/password-confirmation.js b/app/common/directives/password-confirmation.js
new file mode 100644
index 0000000..253a6a6
--- /dev/null
+++ b/app/common/directives/password-confirmation.js
@@ -0,0 +1,42 @@
+window.angular && (function(angular) {
+ 'use strict';
+
+ /**
+ * Password confirmation validator
+ *
+ * To use, add attribute directive to password confirmation input field
+ * Also include attribute 'first-password' with value set to first password
+ * to check against
+ *
+ * <input password-confirmation first-password="ctrl.password"
+ * name="passwordConfirm">
+ *
+ */
+ angular.module('app.common.directives')
+ .directive('passwordConfirm', function() {
+ return {
+ restrict: 'A',
+ require: 'ngModel',
+ scope: {firstPassword: '='},
+ link: function(scope, element, attrs, controller) {
+ if (controller === undefined) {
+ return;
+ }
+ controller.$validators.passwordConfirm =
+ (modelValue, viewValue) => {
+ const firstPassword =
+ scope.firstPassword ? scope.firstPassword : '';
+ const secondPassword = modelValue || viewValue || '';
+ if (firstPassword == secondPassword) {
+ return true;
+ } else {
+ return false;
+ }
+ };
+ element.on('keyup', () => {
+ controller.$validate();
+ });
+ }
+ };
+ });
+})(window.angular);