Skip to content

Commit

Permalink
Fix #101 - Created profile page for clients'
Browse files Browse the repository at this point in the history
  • Loading branch information
ankit01ojha committed May 16, 2018
1 parent c822a71 commit 53f9c05
Show file tree
Hide file tree
Showing 6 changed files with 155 additions and 6 deletions.
3 changes: 2 additions & 1 deletion app/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,5 @@ md-toolbar .md-menu{
}
#sidebar-menu__account-types{
margin-left: 1rem;
}
}

6 changes: 3 additions & 3 deletions app/app.routes.js
Original file line number Diff line number Diff line change
Expand Up @@ -104,9 +104,9 @@
}
})
.state('app.profile', {
url: '/charges',
templateUrl: 'src/common/coming-soon.html',
controller: 'ClientCtrl',
url: '/profile',
templateUrl: 'src/profile/profile.html',
controller: 'ProfileViewCtrl',
controllerAs: 'vm',
data: {
title: 'Profile',
Expand Down
4 changes: 3 additions & 1 deletion app/src/common/main.component.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,9 @@

function selectItem(itemName) {
vm.title = itemName;
vm.toggleItemsList();
if(itemName!='Profile') {
vm.toggleItemsList();
}
}

function getUserData() {
Expand Down
9 changes: 8 additions & 1 deletion app/src/common/main.html
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,13 @@ <h1 class="sidenav-title md-title">{{'nav.msg.welcome' | translate}} {{vm.profil
</div>
</md-button>
<md-divider></md-divider>
<md-button ng-click="vm.selectItem('Profile')" ui-sref-active="md-warn" ui-sref=".profile"
style="text-align: left;display: block;">
<div class="md-tile-content">
<i hide-sm hide-md class="material-icons md-18">face</i>{{'Profile'}}
</div>
</md-button>
<md-divider></md-divider>
<md-button ng-click="vm.selectItem('About Us')" ui-sref-active="md-warn" ui-sref=".aboutus"
style="text-align: left;display: block;">
<div class="md-tile-content">
Expand Down Expand Up @@ -98,7 +105,7 @@ <h1 class="sidenav-title md-title">{{'nav.msg.welcome' | translate}} {{vm.profil
</md-button>
<md-menu-content width="3">
<md-menu-item>
<md-button ng-click="vm.selectItem('Profile');" ui-sref=".profile">
<md-button ng-click="vm.selectItem('Profile')" ui-sref-active="md-warn" ui-sref=".profile">
<div layout="row">
<p flex>Profile</p>
</div>
Expand Down
39 changes: 39 additions & 0 deletions app/src/profile/profile.components.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
(function(){
'use strict';

angular.module('selfService')
.controller('ProfileViewCtrl', ['$state', '$stateParams', '$filter', 'navService', 'AccountService', ProfileViewCtrl]);

function ProfileViewCtrl($state, $stateParams, $filter, navService, AccountService) {

var vm=this;

vm.profileImage = null;
vm.profile = getUserData();
vm.profileAddress = 'N/A';

function getClient(clientId) {
AccountService.getClient(clientId).get().$promise.then( function (data) {
vm.profile = data;
})
}

function getClientImage(clientId) {
AccountService.getClientImage(clientId).then( function (resp) {
vm.profileImage = resp.data;
}).catch(function(err) {
// Not Found Profile image
vm.profileImage = 'assets/images/ic_person_black_24px.svg';
});
}

function getUserData() {
AccountService.getClientId().then(function (clientId) {
vm.clientId = clientId;
getClient(clientId);
getClientImage(clientId);
});
}
}

})();
100 changes: 100 additions & 0 deletions app/src/profile/profile.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,100 @@
<div layout="row" class="md-padding loan-account-detail-cont" flex>

<div container layout="row" flex>
<div layout="row" flex-gt-md="40">

<md-card class="summary-card">
<img ng-src="{{vm.profileImage}}" class="md-media-sm" style="height: 300px" alt="Washed Out">
<md-card-title>
<md-card-title-text>
<span class="md-headline">{{vm.profile.displayName}}</span>
</md-card-title-text>
</md-card-title>

<md-divider></md-divider>
<br>

<md-input-container class="md-icon-float md-block">
<label>Name</label>
<md-icon><i class="material-icons md-24" style="color: #1e88e5">account_circle</i></md-icon>
<input ng-model="vm.profile.displayName" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Mobile Number</label>
<md-icon><i class="material-icons md-24" style="color: #1e88e5">phone</i></md-icon>
<input ng-model="vm.profile.mobileNo" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Address</label>
<md-icon><i class="material-icons md-24" style="color: #1e88e5">place</i></md-icon>
<input ng-model="vm.profileAddress" type="text" readonly>
</md-input-container>
<md-divider></md-divider>
<br>
<md-input-container class="md-icon-float md-block">
<label>Date of Birth</label>
<md-icon><i class="material-icons md-24" style="color: #1e88e5">calendar_today</i></md-icon>
<input ng-model="vm.profile.dateOfBirth | DateFormat" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Gender</label>
<md-icon><i class="material-icons md-24" style="color: #1e88e5">face</i></md-icon>
<input ng-model="vm.profile.gender.name" type="text" readonly>
</md-input-container>
<br>
<br>
<md-divider></md-divider>
</br>
<md-input-container class="md-icon-float md-block">
<label>Activation Date</label>
<md-icon><i class="material-icons md-24" style="color: #1e88e5">calendar_today</i></md-icon>
<input ng-model="vm.profile.activationDate | DateFormat" type="text" readonly>
</md-input-container>
</md-card>



</div>
<div layout="row" flex-gt-md="50">

<md-card class="summary-card">
<br>
<md-input-container class="md-icon-float md-block">
<label>First Name</label>
<md-icon></md-icon>
<input ng-model="vm.profile.firstname" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Middle Name</label>
<md-icon></md-icon>
<input ng-model="vm.profile.middlename" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Last Name</label>
<md-icon></md-icon>
<input ng-model="vm.profile.lastname" type="text" readonly>
</md-input-container>
<md-input-container class="md-block" md-no-float>
<label>Mobile</label>
<md-icon></md-icon>
<input ng-model="vm.profile.mobileNo" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Account Number</label>
<md-icon></md-icon>
<input ng-model="vm.profile.accountNo" type="text" readonly>
</md-input-container>
<md-input-container class="md-icon-float md-block">
<label>Office Name</label>
<md-icon></md-icon>
<input ng-model="vm.profile.officeName" type="text" readonly>
</md-input-container>

</md-card>
</div>
</div>
</div>
<md-button aria-label="menu" class="md-fab md-fab-bottom-right" style="position: fixed">
<i hide-sm hide-md class="material-icons md-24">edit</i>
</md-button>

0 comments on commit 53f9c05

Please sign in to comment.