Merge pull request #18 from ExtProjNomit/ng-profile

Added Profile Route

src/assets/scripts/app/index.js

@@ -12,6 +12,7 @@ angular.module('NomitWisp',
         'nwLogout',
         'nwAds',
         'nwAdsDetails',
+        'nwProfile',
         ngRoute
         
     ])
@@ -31,10 +32,10 @@ angular.module('NomitWisp',
             controller: 'AdsDetailsController',
             templateUrl: 'assets/scripts/ads-details/ads-details.html'
         })
-        // .when('/profile', { 
-        //     controller: 'ProfileController', 
-        //     templateUrl: '' 
-        // })
+        .when('/profile', { 
+            controller: 'ProfileController', 
+            templateUrl: 'assets/scripts/profile/profile.html' 
+        })
         // .when('/users', { 
         //     controller: 'UsersController', 
         //     templateUrl: '' 

src/assets/scripts/dashboard/dashboard.controller.js

@@ -2,7 +2,7 @@
 const DashboardController = ($scope, UserService) => {
     $scope.$on('loadUserSuccess', function(event, user) {
         $scope.user = user;
-        console.log($scope.user);
+        
         // tutte le funzioni del controller
         
     }); 

src/assets/scripts/dashboard/dashboard.html

@@ -82,7 +82,7 @@
               <h6 class="lh-1">New Registered Users</h6>
             </div>
             <div class="layer w-100 p-20">
-              <canvas id="line-chart" height="220" ng-show="user.role === 'admin'"></canvas>
+              <canvas id="line-chart" height="220" ng-show="{{user.role}} == 'admin'"></canvas>
             </div>
             <div class="layer bdT p-20 w-100">
               <div class="peers ai-c jc-c gapX-20">

src/assets/scripts/index.js

@@ -25,5 +25,6 @@ import './nwTopbar';
 import './dashboard'
 import './ads';
 import './ads-details';
+import './profile';
 
 import './app';

src/assets/scripts/logout/controller.js

@@ -1,11 +1,12 @@
-const LogoutController = ($scope, LogoutService, $cookies) => {
+const LogoutController = ($scope, LogoutService, $cookies, UserService) => {
 	$scope.userLogged = false;		
 	
 	$scope.userLogout = async () => {
         console.log("Logout");
 		const result = await LogoutService.logoutUserService($scope.user); 
         $cookies.remove('access_token');
-        console.log(result);
+		console.log(result);
+		UserService.loadUser();
 	}
 };
 

src/assets/scripts/nwLogin/nwLogin.html

@@ -142,11 +142,11 @@
                   </form> 
                   <div ng-show="userLogged">
                     <h2>Welcome {{user.fullname}}!</h2>
-                    <p ng-show="user.role == 'user'">This text is only visible to Users</p>
-                    <p ng-show="user.role == 'company'">This text is only visible to Companies</p>
-                    <p ng-show="user.role == 'nomit' || user.role == 'admin'">This text is visible to both Nomit and Admin</p>
-                    <p ng-show="user.role == 'nomit'">This text is only visible to Nomit</p>
-                    <p ng-show="user.role == 'admin'">This text is only visible to Admin</p>
+                    <p ng-show="{{user.role}} == 'user'">This text is only visible to Users</p>
+                    <p ng-show="{{user.role}} == 'company'">This text is only visible to Companies</p>
+                    <p ng-show="{{user.role}} == 'nomit' || {{user.role}} == 'admin'">This text is visible to both Nomit and Admin</p>
+                    <p ng-show="{{user.role}} == 'nomit'">This text is only visible to Nomit</p>
+                    <p ng-show="{{user.role}} == 'admin'">This text is only visible to Admin</p>
                   </div>
                 </div>
               </div>

src/assets/scripts/nwSidebar/index.js

@@ -1,12 +1,15 @@
 import angular from 'angular';
+import SidebarController from './sidebar.controller';
 
 angular.module('NomitWisp-Sidebar', [])
+    .controller(SidebarController.name, SidebarController)
     .directive('nwSidebar', nwSidebar);
 
 /** @ngInject */
 function nwSidebar(){
     return {
         restrict: 'E',
+        controller: 'SidebarController',
         templateUrl: 'assets/scripts/nwSidebar/nwSidebar.html'
     };
 }

src/assets/scripts/nwSidebar/sidebar.controller.js

@@ -0,0 +1,10 @@
+/** @ngInject */
+const SidebarController = ($scope, UserService) => {
+    $scope.$on('loadUserSuccess', function (event, user) {
+        $scope.user = user;
+    });
+
+    UserService.loadUser();
+}
+
+export default SidebarController;

src/assets/scripts/nwTopbar/index.js

@@ -1,12 +1,15 @@
 import angular from 'angular';
+import TopbarController from './topbar.controller';
 
 angular.module('NomitWisp-Topbar', [])
+    .controller(TopbarController.name, TopbarController)
     .directive('nwTopbar', nwTopbar);
 
 /** @ngInject */
 function nwTopbar(){
     return {
         restrict: 'E',
+        controller: 'TopbarController',
         templateUrl: 'assets/scripts/nwTopbar/nwTopbar.html'
     };
 }

src/assets/scripts/nwTopbar/nwTopbar.html

@@ -8,22 +8,22 @@
           <i class="ti-menu"></i>
         </a>
       </li>
-      <li class="search-box visible-nomit visible-referee">
+      <li class="search-box visible-nomit visible-referee" ng-show="'{{user.role}}'=='nomit' || '{{user.role}}' == 'referee'">
         <a class="search-toggle no-pdd-right" href="javascript:void(0);">
           <i class="search-icon ti-search pdd-right-10"></i>
           <i class="search-icon-close ti-close pdd-right-10"></i>
         </a>
       </li>
-      <li class="search-input visible-referee visible-nomit">
+      <li class="search-input visible-referee visible-nomit" ng-show="'{{user.role}}'=='nomit' || '{{user.role}}' == 'referee'">
         <input class="form-control" type="text" placeholder="Search users, companies, or anything..">
       </li>
-      <li class="visible-nomit ml-2">
+      <li class="visible-nomit ml-2" ng-show="'{{user.role}}'=='nomit'">
         <button type="button" class="btn btn-gradient ">
           <i class="fa fa-plus pdd-right-5 text-white"></i>
           ADD NEW USER
         </button>
       </li>
-      <li class="visible-referee visible-nomit visible-company ml-2">
+      <li class="visible-referee visible-nomit visible-company ml-2" ng-show="'{{user.role}}'=='nomit' || '{{user.role}}' == 'referee' || '{{user.role}}' == 'company'">
         <button type="button" class="btn btn-gradient">
           <i class="fa fa-plus pdd-right-5 text-white"></i>
           CREATE NEW AD
@@ -38,14 +38,14 @@
       <li class="dropdown">
         <a href="" class="dropdown-toggle no-after peers fxw-nw ai-c lh-1" data-toggle="dropdown">
           <div class="peer">
-            <span class="fsz-sm c-grey-900  visible-nomit">Nomit Admin</span>
-            <span class="fsz-sm c-grey-900  visible-referee">Referee Admin</span>
-            <span class="fsz-sm c-grey-900  visible-user visible-company">Username</span>
+            <span class="fsz-sm c-grey-900  visible-nomit" ng-show="'{{user.role}}'=='nomit'">Nomit Admin</span>
+            <span class="fsz-sm c-grey-900  visible-referee" ng-show="'{{user.role}}'=='referee'">Referee Admin</span>
+            <span class="fsz-sm c-grey-900  visible-user visible-company" ng-show="'{{user.role}}'=='user' || '{{user.role}}' == 'company'">Username</span>
           </div>
-          <div class="peer mR-10 visible-nomit">
+          <div class="peer mR-10 visible-nomit" ng-show="'{{user.role}}'=='nomit'">
             <img class=" w-2r bdrs-50p mL-10 nomit-logo-top" src="assets/static/images/nomit-logo.png" alt="">
           </div>
-          <div class="peer mR-10 visible-referee visible-user visible-company">
+          <div class="peer mR-10 visible-referee visible-user visible-company" ng-show="'{{user.role}}'!='nomit'">
             <img class=" w-2r bdrs-50p mL-10 nomit-logo-top" src="assets/static/images/user-update.png" alt="">
           </div>
 

src/assets/scripts/nwTopbar/topbar.controller.js

@@ -0,0 +1,10 @@
+/** @ngInject */
+const TopbarController = ($scope, UserService) => {
+    $scope.$on('loadUserSuccess', function (event, user) {
+        $scope.user = user;
+    });
+
+    UserService.loadUser();
+}
+
+export default TopbarController;

src/assets/scripts/profile/index.js

@@ -0,0 +1,10 @@
+import angular from 'angular';
+import ProfileController from './profile.controller';
+import ProfileService from './profile.service';
+
+angular.module('nwProfile', [])
+    .config(['$httpProvider', function($httpProvider) {
+        $httpProvider.defaults.withCredentials = true;
+    }])
+    .controller(ProfileController.name, ProfileController)
+    .factory(ProfileService.name, ProfileService);

src/assets/scripts/profile/profile.controller.js

@@ -0,0 +1,21 @@
+/** @ngInject */
+const ProfileController = ($scope, ProfileService, UserService) => {
+    $scope.$on('loadUserSuccess', function (event, user) {
+        $scope.user = user;
+    });
+    UserService.loadUser();
+    
+    // Call service to fetch user data
+    ProfileService.fetchProfileService($scope.user.id)
+      .then(function (result) {
+        $scope.profile = result;
+        
+      })
+      .catch(function (error) {
+        console.log(error);
+      })
+    
+    UserService.loadUser();
+}
+
+export default ProfileController;

src/assets/scripts/profile/profile.html

@@ -0,0 +1,543 @@
+<main class='main-content bgc-grey-300'>
+  <div id='mainContent row'>
+    <div class="content-title mT-60">
+      <div class="ml-1 mb-3">
+        Profile
+      </div>
+    </div>
+    <div class="ml-1 mb-3 text-black-bold">
+      Sign up with WISP now to get yourself connected.
+    </div>
+    <div class="ml-1 mb-3 text-size-11">
+      Please, tell us more about your information so we could find the perfect oportunities for you.
+    </div>
+
+    <div class=" gap-30 masonry pos-r">
+      <!-- #content container ===== -->
+      <div class="masonry-sizer col-md-6"></div>
+
+
+      <!-- #user profile ========= -->
+      <div class="masonry-item  w-100 visible-user" ng-show="profile.role =='user'">
+
+        <div class="card item-box">
+          <div class="user-data-title">
+            <img class="user-update-img" src="assets/static/images/user-update.png" alt="">
+            <div class="testo">
+              <h5>{{ profile.fullname }}</h5> Bla Bla, this is your bio or whatever!
+            </div>
+          </div>
+          <div class="card-body-profile">
+            <div class="profile-forms">
+              <h5 class="card-title d-flex text-black-bold"> Your Profile</h5>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">First Name</h9>
+                  <input type="text" class="form-control" placeholder="{{ profile.fullname }}" value="Francesca" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Middle Name</h9>
+                  <input type="text" class="form-control" placeholder="{{ profile.fullname }}" value="" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Last Name</h9>
+                  <input type="text" class="form-control" placeholder="{{ profile.fullname }}" value="Sperati" required>
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Email Address</h9>
+                  <input type="text" class="form-control" placeholder="Email" value="{{ profile.email }}" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Phone Number</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="{{ profile.fullname }}" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">State</h9>
+                  <select id="inputState" class="form-control">
+                    <option selected>VIC</option>
+                    <option>SA</option>
+                    <option>WA</option>
+                    <option>NSW</option>
+                    <option>QLD</option>
+                    <option>TAS</option>
+                  </select>
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Nationality</h9>
+                  <select id="inputNationality" class="form-control">
+                    <option selected>Italian</option>
+                    <option>...</option>
+                  </select>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Visa Type</h9>
+                  <select id="inputVisa" class="form-control">
+                    <option selected>Student</option>
+                    <option>...</option>
+                  </select>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Language (Select one or more)</h9>
+                  <select id="inputLanguage" class="form-control">
+                    <option selected>English</option>
+                    <option>...</option>
+                  </select>
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Expertiece / Fields (Select one or more)</h9>
+                  <input type="text" class="form-control" placeholder="Preofessions" value="" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Expertiece / Fields (Select one or more)</h9>
+                  <select class="form-control">
+                    <option selected>Project Management</option>
+                    <option>...</option>
+                  </select>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Education</h9>
+                  <select class="form-control">
+                    <option selected>Diploma</option>
+                    <option>Degree</option>
+                    <option>...</option>
+                  </select>
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-6 profile-form-row">
+                  <button type="button" class="btn btn-gradient ">UPDATE</button>
+                  <button type="button" class="btn btn-cancel ">CANCEL</button>
+                </div>
+                <div class="col-6 profile-form-row">
+
+                  <form action="upload.asp" method="post" enctype="multipart/form-data">
+                    <h9 class="cv">Curriculum </h9>
+                    <input class="cv" type="file" name="file1" multiple>
+                    <input type="submit" class="btn btn-cv" value="Upload">
+                  </form>
+                </div>
+
+              </div>
+
+
+
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div class="masonry-item  w-100 visible-user" ng-show="profile.role =='user'">
+        <div class="card item-box">
+
+          <div class="card-body-profile">
+            <div class="profile-forms">
+              <h5 class="card-title d-flex text-black-bold">Help NOMIT collecting more data: your information
+                won't be visible!!</h5>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Birthdate</h9>
+                  <div class="timepicker-input input-icon form-group">
+                    <div class="input-group">
+                      <div class="input-group-addon bgc-white bd bdwR-0">
+                        <i class="ti-calendar"></i>
+                      </div>
+                      <input type="text" class="form-control bdc-grey-200 start-date" placeholder="Date of Birth"
+                        data-provide="datepicker">
+                    </div>
+                  </div>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Gender</h9>
+                  <select id="inputGender" class="form-control">
+                    <option selected>Male</option>
+                    <option>Female</option>
+                  </select>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">City of Birth</h9>
+                  <input type="text" class="form-control" id="inputCity">
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Arriving in Australia</h9>
+                  <div class="timepicker-input input-icon form-group">
+                    <div class="input-group">
+                      <div class="input-group-addon bgc-white bd bdwR-0">
+                        <i class="ti-calendar"></i>
+                      </div>
+                      <input type="text" class="form-control bdc-grey-200 start-date" placeholder="Date of Arrive"
+                        data-provide="datepicker">
+
+                    </div>
+                  </div>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Reason for leaving</h9>
+                  <textarea id="leaving" name="story" rows="5">Tell us something about your old life...</textarea>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Reason for staying in Australia</h9>
+                  <textarea id="staying" name="story" rows="5">Tell us something about your new life...</textarea>
+                </div>
+              </div>
+
+
+              <button type="button" class="btn btn-gradient ">UPDATE</button>
+              <button type="button" class="btn btn-cancel ">CANCEL</button>
+
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- #company profile ========= -->
+      <div class="masonry-item  w-100 visible-company" ng-show="profile.role == 'company'">
+        <div class="card item-box">
+          <div class="user-data-title">
+            <img class="user-update-img" src="assets/static/images/user-update.png" alt="">
+            <div class="testo">
+              <h5>Leonardo</h5> A global high-tech company and one of the key players in Aerospace, Defence and
+              Security
+            </div>
+          </div>
+          <div class="card-body-profile">
+            <div class="profile-forms">
+              <h5 class="card-title d-flex text-black-bold"> Your Profile</h5>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Name</h9>
+                  <input type="text" class="form-control" placeholder="Leonardo" value="" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Business Type</h9>
+                  <input type="text" class="form-control" placeholder="Technological Innovation" value=""
+                    required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">ABN</h9>
+                  <input type="text" class="form-control" placeholder="Last name" value="66 942 977 659" required>
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Email Address</h9>
+                  <input type="text" class="form-control" placeholder="Email" value="ir@leonardocompany" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Phone Number</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="+39 06.324731" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Website</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="https://www.leonardocompany.com"
+                    required>
+                </div>
+              </div>
+
+
+              <div class="row">
+                <div class="form-group col-md-4 profile-form-row">
+                  <h9 class="">Address</h9>
+                  <input type="text" class="form-control" id="inputAddress" placeholder="Piazza Monte Grappa, 4"
+                    required>
+                </div>
+                <div class="form-group col-md-4 profile-form-row">
+                  <h9 class="">City</h9>
+                  <input type="text" class="form-control" id="inputCity0" placeholder="Roma" required>
+                </div>
+                <div class="form-group col-md-2 profile-form-row">
+                  <h9 class="">State</h9>
+                  <input type="text" class="form-control" id="validationCustom04" placeholder="Italia" required>
+                </div>
+                <div class="form-group col-md-2 profile-form-row">
+                  <h9 class="">Zip</h9>
+                  <input type="text" class="form-control" id="inputZip" placeholder="00195" required>
+                </div>
+              </div>
+
+              <div class="row">
+                <div class="col-12 profile-form-row">
+                  <h9 class="">Description</h9>
+                  <textarea id="description" class="company-description" name="story" rows="5">We constantly explore new ideas to turn them into new technologies that improve our world and design the future one. We invest in research and development to provide sustainable and competitive solutions. Wherever defence and security are needed:  land, sea, sky, Space and cyberspace.
+                        </textarea>
+                </div>
+              </div>
+              <div class="row ">
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Twitter</h9>
+                  <input type="text" class="form-control" placeholder="Facebook" value="https://twitter.com/leonardo_it">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Facebook</h9>
+                  <input type="text" class="form-control" placeholder="Facebook" value="https://www.facebook.com/Leonardo-Company-473417172849580/">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Instagram</h9>
+                  <input type="text" class="form-control" placeholder="Instagram" value="https://www.instagram.com/leonardo_company/?hl=it">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Linkedin</h9>
+                  <input type="text" class="form-control" placeholder="Linkedin" value="https://www.linkedin.com/company/drs-defense-solutions-llc/life/">
+                </div>
+              </div>
+
+              <button type="button" class="btn btn-gradient ">UPDATE</button>
+              <button type="button" class="btn btn-cancel ">CANCEL</button>
+
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- #nomit profile ========= -->
+      <div class="masonry-item w-100 visible-nomit" ng-show="'{{profile.role}}' =='nomit'">
+        <div class="card item-box">
+          <div class="user-data-title">
+            <img class="user-update-img" src="assets/static/images/nomit-logo.png" alt="">
+            <div class="testo">
+              <h5>Nomit</h5> The Italian Network of Melbourne
+            </div>
+          </div>
+          <div class="card-body-profile">
+            <div class="profile-forms">
+              <h5 class="card-title d-flex text-black-bold"> Your Profile</h5>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Name</h9>
+                  <input type="text" class="form-control" placeholder="Nomit" value="" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Business Type</h9>
+                  <input type="text" class="form-control" placeholder="Australian non-profit Association" value=""
+                    required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">ABN</h9>
+                  <input type="text" class="form-control" placeholder="Last name" value="92 106 088 918" required>
+                </div>
+              </div>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Email Address</h9>
+                  <input type="text" class="form-control" placeholder="Email" value="info@nomit.com.au" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Phone Number</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="0481 983 702 " required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Website</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="https://www.leonardocompany.com"
+                    required>
+                </div>
+              </div>
+
+
+              <div class="row">
+                <div class="form-group col-md-4 profile-form-row">
+                  <h9 class="">Address</h9>
+                  <input type="text" class="form-control" id="inputAddress2" placeholder="1/509 St Kilda Rd" required>
+                </div>
+                <div class="form-group col-md-4 profile-form-row">
+                  <h9 class="">City</h9>
+                  <input type="text" class="form-control" id="inputCity2" placeholder="Melbourne" required>
+                </div>
+                <div class="form-group col-md-2 profile-form-row">
+                  <h9 class="">State</h9>
+                  <input type="text" class="form-control" id="validationCustom05" placeholder="VIC" required>
+                </div>
+                <div class="form-group col-md-2 profile-form-row">
+                  <h9 class="">Zip</h9>
+                  <input type="text" class="form-control" id="inputZip2" placeholder="3004" required>
+                </div>
+              </div>
+
+              <div class="row">
+                <div class="col-12 profile-form-row">
+                  <h9 class="">Description</h9>
+                  <textarea id="description" class="company-description" name="story" rows="5">Nomit is an Australian non-profit organisation supported, amongst others, by the Italian Consulate in Melbourne and the Victorian Multicultural Commission.</textarea>
+                </div>
+              </div>
+              <div class="row ">
+
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Twitter</h9>
+                  <input type="text" class="form-control" placeholder="Facebook" value="https://twitter.com/nomitnetwork">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Facebook</h9>
+                  <input type="text" class="form-control" placeholder="Facebook" value="https://www.facebook.com/nomitnetwork">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Instagram</h9>
+                  <input type="text" class="form-control" placeholder="Instagram" value="">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Linkedin</h9>
+                  <input type="text" class="form-control" placeholder="Linkedin" value="https://www.linkedin.com/company/nomit/about/">
+                </div>
+              </div>
+              <button type="button" class="btn btn-gradient ">UPDATE</button>
+              <button type="button" class="btn btn-cancel ">CANCEL</button>
+
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- #referee profile ========= -->
+      <div class="masonry-item w-100 visible-nomit" ng-show="'{{profile.role}}' =='nomit'">
+        <div class="card item-box">
+          <div class="user-data-title">
+            <img class="user-update-img" src="assets/static/images/user-update.png" alt="">
+            <div class="testo">
+              <h5>Jobwatch</h5> EMPLOYMENT RIGHTS LEGAL CENTRE
+            </div>
+          </div>
+          <div class="card-body-profile">
+            <div class="profile-forms">
+              <h5 class="card-title d-flex text-black-bold"> Your Profile</h5>
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Name</h9>
+                  <input type="text" class="form-control" placeholder="Jobwatch" value="" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Business Type</h9>
+                  <input type="text" class="form-control" placeholder="Employment rights legal centre" value=""
+                    required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">ABN</h9>
+                  <input type="text" class="form-control" placeholder="Last name" value="92 106 088 918" required>
+                </div>
+              </div>
+
+
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Email Address</h9>
+                  <input type="text" class="form-control" placeholder="Email" value="info@test.com.au" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Phone Number</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="9662 1933 " required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Website</h9>
+                  <input type="text" class="form-control" placeholder="Phone" value="http://jobwatch.org.au/"
+                    required>
+                </div>
+              </div>
+
+
+              <div class="row">
+                <div class="form-group col-md-4 profile-form-row">
+                  <h9 class="">Address</h9>
+                  <input type="text" class="form-control" id="inputAddress3" placeholder="1/509 St Kilda Rd" required>
+                </div>
+                <div class="form-group col-md-4 profile-form-row">
+                  <h9 class="">City</h9>
+                  <input type="text" class="form-control" id="inputCity3" placeholder="Melbourne" required>
+                </div>
+                <div class="form-group col-md-2 profile-form-row">
+                  <h9 class="">State</h9>
+                  <input type="text" class="form-control" id="validationCustom06" placeholder="VIC" required>
+                </div>
+                <div class="form-group col-md-2 profile-form-row">
+                  <h9 class="">Zip</h9>
+                  <input type="text" class="form-control" id="inputZip3" placeholder="3004" required>
+                </div>
+              </div>
+
+              <div class="row">
+                <div class="col-12 profile-form-row">
+                  <h9 class="">Description</h9>
+                  <textarea id="description" class="company-description" name="story" rows="5">Nomit is an Australian non-profit organisation supported, amongst others, by the Italian Consulate in Melbourne and the Victorian Multicultural Commission.</textarea>
+                </div>
+              </div>
+              <div class="row ">
+
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Twitter</h9>
+                  <input type="text" class="form-control" placeholder="Facebook" value="https://twitter.com/nomitnetwork">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Facebook</h9>
+                  <input type="text" class="form-control" placeholder="Facebook" value="https://www.facebook.com/nomitnetwork">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Instagram</h9>
+                  <input type="text" class="form-control" placeholder="Instagram" value="">
+                </div>
+                <div class="col-3 profile-form-row">
+                  <h9 class="">Linkedin</h9>
+                  <input type="text" class="form-control" placeholder="Linkedin" value="https://www.linkedin.com/company/nomit/about/">
+                </div>
+              </div>
+              <button type="button" class="btn btn-gradient ">UPDATE</button>
+
+              <button type="button" class="btn btn-cancel ">CANCEL</button>
+
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- #change password ========= -->
+      <div class="masonry-item  w-100">
+
+        <div class="card item-box">
+
+          <div class="card-body-profile">
+            <div class="profile-forms">
+              <h5 class="card-title d-flex text-black-bold"> Change Password</h5>
+              <div class="row ">
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Current Password</h9>
+                  <input type="password" class="form-control" placeholder="Password" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">New Password</h9>
+                  <input type="password" class="form-control" placeholder="New Password" required>
+                </div>
+                <div class="col-4 profile-form-row">
+                  <h9 class="">Confirm New urrent Password</h9>
+                  <input type="password" class="form-control" placeholder="New Password" required>
+
+                </div>
+              </div>
+
+              <button type="button" class="btn btn-gradient ">UPDATE</button>
+              <button type="button" class="btn btn-cancel ">CANCEL</button>
+
+            </div>
+          </div>
+        </div>
+      </div>
+
+
+    </div>
+    <!--content container-->
+  </div>
+  <!--page container-->
+
+</main>

src/assets/scripts/profile/profile.service.js

@@ -0,0 +1,18 @@
+/** @ngInject */
+const ProfileService = ($http) => {
+    let serv = {};
+
+    serv.fetchProfileService = (id) =>{
+        return $http.get('https://nomitwisp-restapi.herokuapp.com/api/user/'+id, { withCredentials: true })
+        .then( (result) => {
+                return result.data;              
+        })
+        .catch( (error) => {
+                console.log(error);
+                return [];
+        });
+    }
+    return serv;
+}
+
+export default ProfileService;