Catalog alignment

Issue-ID: SDC-2724
Signed-off-by: ys9693 <ys9693@att.com>
Change-Id: I52b4aacb58cbd432ca0e1ff7ff1f7dd52099c6fe

6 files changed, 14 insertions, 331 deletions

diff --git a/catalog-ui/src/app/view-models/admin-dashboard/admin-dashboard-view-model.ts b/catalog-ui/src/app/view-models/admin-dashboard/admin-dashboard-view-model.ts
index c9ffe470f0..40a9e8fde1 100644
--- a/catalog-ui/src/app/view-models/admin-dashboard/admin-dashboard-view-model.ts
+++ b/catalog-ui/src/app/view-models/admin-dashboard/admin-dashboard-view-model.ts
@@ -19,7 +19,7 @@
  */
 
 'use strict';
-import {CacheService} from "app/services";
+import {CacheService} from "app/services-ng2";
 import {IAppConfigurtaion} from "app/models";
 
 interface IAdminDashboardViewModelScope extends ng.IScope {
diff --git a/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view-model.ts b/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view-model.ts
index c99f9e874d..bb4c44d8da 100644
--- a/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view-model.ts
+++ b/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view-model.ts
@@ -20,7 +20,8 @@
 
 'use strict';
 import {ModalsHandler, ValidationUtils} from "app/utils";
-import {CacheService, ICategoryResource} from "app/services";
+import {ICategoryResource} from "app/services";
+import {CacheService} from "app/services-ng2";
 import {IAppConfigurtaion} from "app/models";
 import {ComponentType} from "../../../utils/constants";
 
@@ -138,58 +139,6 @@ export class CategoryManagementViewModel {
 
         };
 
-        scope.deleteCategory = (category:ICategoryResource, subCategory:ICategoryResource):void => {
-
-            let onOk = ():void => {
-
-                scope.isLoading = true;
-                let type:string = scope.type;
-
-                let onError = (response):void => {
-                    scope.isLoading = false;
-                    console.info('onFaild', response);
-                };
-
-                let onSuccess = (response:any):void => {
-                    let arr:Array<ICategoryResource>;
-
-                    if (!subCategory) {
-                        arr = this.$scope[type + 'Categories'];
-                        arr.splice(arr.indexOf(category), 1);
-                        if (category === scope.selectedCategory) {
-                            scope.selectedCategory = null;
-                            scope.selectedSubCategory = null;
-                        }
-                    } else {
-                        arr = category.subcategories;
-                        arr.splice(arr.indexOf(subCategory), 1);
-                    }
-
-                    scope.isLoading = false;
-                };
-
-                if (!subCategory) {
-                    category.$delete({
-                            types: type + "s",
-                            categoryId: category.uniqueId
-                        }
-                        , onSuccess, onError);
-                } else {
-                    category.$deleteSubCategory({
-                            types: type + "s",
-                            categoryId: category.uniqueId,
-                            subCategoryId: subCategory.uniqueId,
-                        }
-                        , onSuccess, onError);
-                }
-            };
-            let modelType:string = subCategory ? 'sub category' : 'category';
-            let title:string = this.$filter('translate')("DELETE_CATEGORY_MODAL_HEADER", "{'modelType': '" + modelType + "' }");
-            let message:string = this.$filter('translate')("DELETE_CATEGORY_MODAL_CATEGORY_NAME", "{'modelType': '" + modelType + "' }");
-
-            this.ModalsHandler.openConfirmationModal(title, message, false, 'sdc-xsm').then(onOk);
-        };
-
         this.$scope.serviceCategories = this.cacheService.get('serviceCategories');
         this.$scope.resourceCategories = this.cacheService.get('resourceCategories');
     }
diff --git a/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view.html b/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view.html
index d7ee87e2e7..30b71f28e2 100644
--- a/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view.html
+++ b/catalog-ui/src/app/view-models/admin-dashboard/category-management/category-management-view.html
@@ -36,9 +36,6 @@
                         data-ng-click="selectCategory(category)"
                         data-tests-id="{{ type === SERVICE ? 'servicecategory' : 'resourcecategory' }}">
                         {{category.name}}
-
-                        <!--<button class="sprite e-sdc-small-icons-delete" data-ng-click="deleteCategory(category, null)" type="button"></button>-->
-                        <!--button class="sprite e-sdc-small-icons-pad" data-ng-click="" type="button"></button-->
                     </li>
                 </ul>
             </perfect-scrollbar>
@@ -56,9 +53,6 @@
                         data-ng-click="selectSubCategory(subcategory)"
                         data-tests-id="subcategory">
                         {{subcategory.name}}
-
-                        <!--<button class="sprite e-sdc-small-icons-delete" data-ng-click="deleteCategory(selectedCategory, subcategory)" type="button"></button>-->
-                        <!--button class="sprite e-sdc-small-icon-pad" data-ng-click="" type="button"></button-->
                     </li>
                 </ul>
             </perfect-scrollbar>
diff --git a/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view-model.ts b/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view-model.ts
index 45232b7a61..43ae75e048 100644
--- a/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view-model.ts
+++ b/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view-model.ts
@@ -20,55 +20,40 @@
 
 'use strict';
 import * as _ from "lodash";
-import {ModalsHandler} from "app/utils";
-import {User, IUserProperties, IUser, IAppConfigurtaion} from "app/models";
-import {UserService} from "../../../ng2/services/user.service";
+import { User, IUserProperties, IUser, IAppConfigurtaion } from "app/models";
+import { UserService } from "../../../ng2/services/user.service";
+import { SdcUiCommon, SdcUiServices, SdcUiComponents } from "onap-ui-angular";
+import { AuthenticationService } from "app/ng2/services/authentication.service";
 
 interface IUserManagementViewModelScope extends ng.IScope {
-    sdcConfig:IAppConfigurtaion;
     usersList:Array<IUserProperties>;
     isLoading:boolean;
-    isNewUser:boolean;
     sortBy:string;
     reverse:boolean;
     tableHeadersList:any;
-    roles:Array<string>;
-    newUser:IUser;
-    currentUser:IUserProperties;
-    userIdValidationPattern:RegExp;
-    editForm:ng.IFormController;
     getAllUsers():void;
-    editUserRole(user:IUserProperties);
     sort(sortBy:string):void;
-    createUser():void;
-    deleteUser(userId:string):void;
-    onEditUserPressed(user:IUserProperties):void;
-    saveUserChanges(user:IUserProperties):void;
     getTitle(role:string):string;
-    clearForm():void;
-
 }
 
 
 export class UserManagementViewModel {
     static '$inject' = [
         '$scope',
-        'sdcConfig',
         'UserServiceNg2',
-        'UserIdValidationPattern',
+        'AuthenticationServiceNg2',
         '$filter',
-        'ModalsHandler'
+        'ModalServiceSdcUI'
     ];
 
     constructor(private $scope:IUserManagementViewModelScope,
-                private sdcConfig:IAppConfigurtaion,
                 private userService:UserService,
-                private UserIdValidationPattern:RegExp,
+                private authService:AuthenticationService,
                 private $filter:ng.IFilterService,
-                private ModalsHandler:ModalsHandler) {
+                private modalService:SdcUiServices.ModalService) {
 
-        this.initScope();
 
+        setTimeout(this.initScope, 1000);
     }
 
 
@@ -89,13 +74,8 @@ export class UserManagementViewModel {
         this.userService.getAllUsers().subscribe(onSuccess, onError);
     };
 
-    private updateUserFilterTerm = (user:IUserProperties):void => {
-        user.filterTerm = user.firstName + ' ' + user.lastName + ' ' + user.userId + ' ' + user.email + ' ' + user.role + ' ' + this.$filter('date')(user.lastLoginTime, "MM/dd/yyyy");
-    };
-
     private initScope = ():void => {
         let self = this;
-
         this.$scope.tableHeadersList = [{title: "First Name", property: 'firstName'}, {
             title: "Last Name",
             property: 'lastName'
@@ -107,116 +87,18 @@ export class UserManagementViewModel {
                 title: "Last Active",
                 property: 'lastLoginTime'
             }];
-        this.$scope.userIdValidationPattern = this.UserIdValidationPattern;
         this.$scope.sortBy = 'lastLoginTime';
         this.$scope.reverse = false;
-        this.$scope.roles = this.sdcConfig.roles;
-        this.$scope.isNewUser = false;
-        this.$scope.currentUser = this.userService.getLoggedinUser();
         this.getAllUsers();
 
-        let userInfo:IUserProperties = <IUserProperties>{};
-        this.$scope.newUser = new User(userInfo);
-
         this.$scope.sort = (sortBy:string):void => {//default sort by descending last update. default for alphabetical = ascending
-            this.$scope.isNewUser = false;
             this.$scope.reverse = (this.$scope.sortBy === sortBy) ? ( !this.$scope.reverse) : this.$scope.reverse = false;
             this.$scope.sortBy = sortBy;
         };
 
-        this.$scope.createUser = ():void => {
-
-            let onError = (response) => {
-                this.$scope.isLoading = false;
-                console.info('onFaild', response);
-            };
-
-            let onSuccess = (response:IUserProperties) => {
-                this.$scope.newUser.userInfo.lastLoginTime = "0";
-                this.$scope.newUser.userInfo.status = response.status;
-                this.updateUserFilterTerm(this.$scope.newUser.userInfo);
-                this.$scope.usersList.push(this.$scope.newUser.userInfo);
-                this.$scope.isNewUser = true;
-                this.$scope.sortBy = null;
-                this.$scope.reverse = true;
-                this.$scope.isLoading = false;
-                this.$scope.newUser = new User(null);
-                this.$scope.editForm.$setPristine();
-                let _self = this;
-                setTimeout(function () {
-                    _self.$scope.isNewUser = false;
-                }, 7000);
-            };
-            this.userService.createUser({
-                userId: this.$scope.newUser.userInfo.userId,
-                role: this.$scope.newUser.userInfo.role
-            }).subscribe(onSuccess, onError);
-        };
-
-
-        this.$scope.onEditUserPressed = (user:IUserProperties):void => {
-            user.isInEditMode = true;
-            user.tempRole = user.role;
-        };
-
-        this.$scope.editUserRole = (user:IUserProperties):void => {
-            let roleBeforeUpdate:string = user.role;
-            user.role = user.tempRole;
-
-            let onError = (response) => {
-                this.$scope.isLoading = false;
-                user.role = roleBeforeUpdate;
-                console.info('onFaild', response);
-            };
-            let onSuccess = (response:any) => {
-                this.$scope.isLoading = false;
-                user.tempRole = user.role;
-                this.updateUserFilterTerm(user);
-            };
-
-            this.userService.editUserRole(user.userId, user.role).subscribe(onSuccess, onError);
-        };
-
-        this.$scope.saveUserChanges = (user:IUserProperties):void => {
-            if (user.tempRole != user.role) {
-                this.$scope.editUserRole(user)
-            }
-            user.isInEditMode = false;
-        };
-
-        this.$scope.deleteUser = (userId:string):void => {
-
-            let onOk = ():void => {
-                this.$scope.isLoading = true;
-
-                let onError = (response):void => {
-                    this.$scope.isLoading = false;
-                    console.info('onFaild', response);
-                };
-
-                let onSuccess = (response:any):void => {
-                    _.remove(this.$scope.usersList, {userId: userId});
-                    this.$scope.isLoading = false;
-                };
-                this.userService.deleteUser(userId).subscribe(onSuccess, onError);
-            };
-
-            let title:string = this.$filter('translate')("USER_MANAGEMENT_VIEW_DELETE_MODAL_TITLE");
-            let message:string = this.$filter('translate')("USER_MANAGEMENT_VIEW_DELETE_MODAL_TEXT");
-            this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk);
-        };
-
         this.$scope.getTitle = (role:string):string => {
             return role.toLowerCase().replace('governor', 'governance_Rep').replace('_', ' ');
         };
 
-        this.$scope.clearForm = ():void => {
-            if (!this.$scope.editForm['contactId'].$viewValue && !this.$scope.editForm['role'].$viewValue) {
-                this.$scope.editForm.$setPristine();
-            }
-            //if(this.$scope.editForm['contactId'].$viewValue === '' && this.$scope.editForm['role'].$viewValue){
-            //    this.$scope.editForm.$setPristine();
-            //}
-        };
     }
 }
diff --git a/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view.html b/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view.html
index 9322ab00aa..89fd280205 100644
--- a/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view.html
+++ b/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management-view.html
@@ -13,7 +13,6 @@
   ~ See the License for the specific language governing permissions and
   ~ limitations under the License.
 -->
-
 <div ng-controller="Sdc.ViewModels.UserManagementViewModel">
     <loader data-display="isLoading"></loader>
     <div class="sdc-user-management-top-bar">
@@ -22,48 +21,6 @@
             <input type="text" class="sdc-user-management-top-bar-form-input" placeholder="Search user by name, userId, email or role" data-ng-model="search.filterTerm" ng-model-options="{ debounce: 500 }" data-tests-id="searchbox" />
             <span class="w-sdc-search-icon" data-ng-class="{'cancel':search.filterTerm, 'magnification':!search.filterTerm}" data-ng-click="search.filterTerm=''" ></span>
         </div>
-        <div  class="vertical-border-container">
-            <div class="vertical-border"></div>
-        </div>
-        <form class="sdc-user-management-top-bar-create-user-container w-sdc-form" name="editForm">
-            <label class="sdc-user-management-top-bar-title">Create New User</label>
-            <div class="sdc-user-management-top-bar-wrapper">
-                <div class="i-sdc-form-item sdc-user-management-top-bar-form-container" data-ng-class="{error:(editForm.contactId.$dirty && editForm.contactId.$invalid)}">
-                    <input ng-focus="search.filterTerm=''" type="text"
-                           data-ng-model="newUser.userInfo.userId"
-                           class="i-sdc-form-input"
-                           placeholder="{{ USER_MANAGEMENT_SEARCH_TEXT | translate}}"
-                           data-ng-model-options="{ updateOn: 'default blur', debounce: { 'default': 750, 'blur': 0 } }"
-                           name="contactId"
-                           data-ng-pattern="userIdValidationPattern"
-                           data-ng-change="clearForm()"
-                           data-ng-blur="clearForm()"
-                           data-required
-                           data-tests-id="newuserId" />
-
-                    <div class="input-error" data-ng-show="editForm.contactId.$dirty && editForm.contactId.$invalid">
-                        <span ng-show="editForm.contactId.$error.required" translate="NEW_USER_ERROR_USER_ID_REQUIRED"></span>
-                        <span ng-show="editForm.contactId.$error.pattern" translate="NEW_USER_ERROR_USER_ID_NOT_VALID"></span>
-                    </div>
-                </div>
-                <div class="i-sdc-form-item sdc-user-management-top-bar-form-container"  data-ng-class="{error:(editForm.role.$dirty && editForm.role.$invalid
-                                                                                                            && editForm.contactId.$viewValue)}">
-                    <select class="i-sdc-form-select capitalize"
-                            data-required
-                            name="role"
-                            data-tests-id="selectrole"
-                            data-ng-model = "newUser.userInfo.role"
-                            data-ng-options="role as (getTitle(role)) for role in roles | orderBy:'role'"
-                            ng-focus="search.filterTerm=''">
-                        <option value="">Select Role</option>
-                    </select>
-                    <div class="input-error" data-ng-show="editForm.role.$dirty && editForm.role.$invalid && editForm.contactId.$viewValue">
-                        <span ng-show="editForm.role.$error.required" translate="NEW_USER_ERROR_ROLE_REQUIRED"></span>
-                    </div>
-                </div>
-                <button data-tests-id="creategreen" data-ng-disabled="editForm.$invalid" class="sdc-user-management-top-bar-create-btn" ng-click="search.filterTerm = '' ; createUser()">Create</button>
-            </div>
-        </form>
     </div>
 
 
@@ -74,15 +31,13 @@
                 <div class="sdc-user-management-table-header head-row hand sdc-user-management-flex-item" data-tests-id="th{{header.title}}" ng-repeat="header in tableHeadersList" ng-click="sort(header.property)">{{header.title}}
                     <span  ng-if="sortBy === header.property" class="sdc-user-management-table-header-sort-arrow" data-ng-class="{'down': reverse, 'up':!reverse}"> </span>
                 </div>
-              <div class="sdc-user-management-table-no-text-header head-row sdc-user-management-flex-item"></div>
-                <div class="sdc-user-management-table-no-text-header head-row sdc-user-management-flex-item"></div>
             </div>
 
             <div class="body">
                 <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container">
                     <div ng-init="user.filterTerm = user.firstName + ' ' + user.lastName + ' ' + user.userId + ' ' + user.email + ' ' + user.role + ' ' + (user.lastLoginTime | date: 'MM/dd/yyyy')"
                          ng-repeat="user in usersList | filter: search | orderBy:sortBy:reverse"
-                         data-ng-class="{'sdc-user-management-table-new-user-row': (isNewUser && $first), 'sdc-user-management-table-row-edit-mode': user.isInEditMode}"
+                         data-ng-class="{'sdc-user-management-table-new-user-row':  $first}"
                          class="sdc-user-management-flex-container data-row" data-tests-id="row_{{$index}}">
 
                         <div sdc-smart-tooltip class="sdc-user-management-table-col-general sdc-user-management-flex-item" data-tests-id="firstName_{{$index}}">{{user.firstName || '---'}}</div>
@@ -91,25 +46,10 @@
                         <div sdc-smart-tooltip class="sdc-user-management-table-col-general sdc-user-management-flex-item" data-tests-id="email_{{$index}}">{{user.email || '---'}}</div>
                         <div class="sdc-user-management-table-col-general sdc-user-management-flex-item">
                             <div class="sdc-user-management-table-role-select capitalize sdc-user-management-table-role-label"
-                                 data-ng-if="!user.isInEditMode"
                                  data-tests-id="role_{{$index}}"
                                  data-ng-bind="getTitle(user.role)"></div>
-                            <select class="sdc-user-management-table-role-select capitalize"
-                                    data-tests-id="selectRole_{{$index}}"
-                                    data-ng-if="user.isInEditMode"
-                                    data-ng-model="user.tempRole"
-                                    data-ng-options="role as (getTitle(role)) for role in roles | orderBy:'role'">
-                            </select>
                         </div>
                         <div class="sdc-user-management-table-col-general sdc-user-management-flex-item" data-tests-id="lastActive_{{$index}}">{{user.lastLoginTime == 0 ? 'Waiting' :  (user.lastLoginTime | date:'MM/dd/yyyy')}}</div>
-                        <div class="sdc-user-management-table-btn-col sdc-user-management-flex-item">
-                            <button data-ng-disabled="user.isInEditMode" data-ng-hide="user.isInEditMode || currentUser.userId === user.userId"  class="sdc-user-management-table-edit-btn" ng-click="onEditUserPressed(user)" data-tests-id="updateUser_{{$index}}"> </button>
-                            <button data-ng-show="user.isInEditMode" class="sdc-user-management-table-save-btn" ng-click="saveUserChanges(user)" data-tests-id="save_{{$index}}"> </button>
-                        </div>
-                        <div class="sdc-user-management-table-btn-col sdc-user-management-flex-item">
-                            <button data-ng-hide="currentUser.userId === user.userId"  class="sdc-user-management-table-delete-btn" ng-click="deleteUser(user.userId)" data-tests-id="delete_{{$index}}"> </button>
-                        </div>
-
                     </div>
                 </perfect-scrollbar>
             </div>
diff --git a/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management.less b/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management.less
index 934faab9e7..d1528492de 100644
--- a/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management.less
+++ b/catalog-ui/src/app/view-models/admin-dashboard/user-management/user-management.less
@@ -4,8 +4,7 @@
     label {
         .i_17;
     }
-    .sdc-user-management-top-bar-form-input,
-    .sdc-user-management-top-bar-form-select {
+    .sdc-user-management-top-bar-form-input {
         .b_9;
         color: @color_b;
         height: 28px;
@@ -29,57 +28,6 @@
             top: 49px;
         }
     }
-    .vertical-border-container {
-        min-width: 50px;
-        margin: 0px auto;
-
-        .vertical-border {
-
-            width: 1px;
-            height: 70px;
-            background-color: @color_e;
-            display: table;
-            margin: 0 auto;
-        }
-    }
-
-    .sdc-user-management-top-bar-wrapper {
-        display: flex;
-    }
-
-    .sdc-user-management-top-bar-title {
-        .i_17;
-        font-weight: bold;
-    }
-
-    .sdc-user-management-top-bar-create-user-container {
-
-        display: flex;
-        flex-direction: column;
-        position: relative;
-        float: right;
-        padding-top: 0px;
-        text-align: left;
-        width: 650px;
-
-        label {
-            margin-bottom: 20px;
-        }
-
-        .sdc-user-management-top-bar-form-container {
-            width: 233px;
-            margin-right: 35px;
-        }
-
-        .sdc-user-management-top-bar-create-btn {
-            .w-sdc-btn-light-green;
-            height: 30px;
-            width: 100px;
-            line-height: 0px;
-            padding-bottom: 3px;
-            margin-right: 0px;
-        }
-    }
 }
 
 
@@ -147,9 +95,6 @@
                         }
                     }
                 }
-                &.sdc-user-management-table-row-edit-mode {
-                    .bg_j;
-                }
                 div {
 
                     border-right: 1px solid @border_color_d;
@@ -176,33 +121,6 @@
             }
 
         }
-
-        .sdc-user-management-table-btn-col {
-
-            line-height: 0px;
-            text-align: center;
-            .sdc-user-management-table-delete-btn {
-                background-color: transparent;
-                border: none;
-                .sprite;
-                .sprite.e-sdc-small-icon-delete;
-                opacity: 0.7;
-            }
-            .sdc-user-management-table-edit-btn {
-                background-color: transparent;
-                border: none;
-                .sprite;
-                .e-sdc-small-icon-pencil;
-                opacity: 0.7;
-            }
-            .sdc-user-management-table-save-btn {
-                background-color: transparent;
-                border: none;
-                .sprite;
-                .sprite.e-sdc-green-save;
-            }
-        }
-
     }
 
     .sdc-user-management-flex-container {