Merge branch 'master' of bitbucket.org:venbainformationtechnology/appointments_frontend

ng-seed/angular.json

@@ -33,7 +33,8 @@
               "crossvent",
               "calendar-utils/date-adapters/date-fns",
               "contra/emitter",
-              "@mattlewis92/dom-autoscroller"
+              "@mattlewis92/dom-autoscroller",
+              "CommonJS"
             ],    
             "styles": [
               "node_modules/quill/dist/quill.snow.css",

ng-seed/src/app/_guard/auth.guard.ts

@@ -0,0 +1,70 @@
+import { Injectable } from '@angular/core';
+import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, CanActivateChild } from '@angular/router';
+import { Observable ,  of } from 'rxjs';
+// import { CognitoService } from '../AwsService/cognito.service';
+@Injectable()
+export class AuthGuard implements CanActivate, CanActivateChild {
+
+    constructor(private router: Router) { }
+
+    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+
+        const token = localStorage.getItem('user_token'); 
+       
+        if(token != '' && token != undefined && token != null){
+            return true
+        }else{
+            alert("else");
+            this.router.navigate(['authentication/login']);
+            return false;
+        }
+
+        // if (this.shared.getToken()) {
+        //     alert("if");
+        //     // this.router.navigate(['']);
+        //     return true
+        // } else {
+        //     alert("else");
+        //     this.router.navigate(['/login']);
+        //     return false;
+        // }
+    }
+
+    canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+
+        const token = localStorage.getItem('user_token'); 
+        console.log(token)
+        if(token != '' && token != undefined && token != null){
+            return true
+        }else{
+            setTimeout(() => {
+                this.router.navigate(['authentication/login']);
+                return false;
+                },1000);
+        }
+       
+        // if (this.shared.getCurrentUser() != null && this.shared.getToken()) {
+        //     // alert("if");
+            
+        //         return true;
+        // } else {
+        //     // alert("else");
+        //     setTimeout(() => {
+        //     this.router.navigate(['authentication/login']);
+        //     return false;
+        //     },1000);
+            
+        // }
+    }
+
+    // public getToken(): string {
+    //     return localStorage.getItem('token');
+    // }
+
+    // public logOut() {
+    //     localStorage.clear();
+    //     if(localStorage.getItem('token') === null){
+    //         this.router.navigate(['/login']);
+    //     }
+    // }
+}

ng-seed/src/app/app.module.ts

@@ -38,6 +38,7 @@ import { TokenInterceptor } from './_guard/token.interceptor';
 import { SessionService } from './session-services/session.service';
 import { AppointmentService } from './appoinment/appointment.service';
 import { RoleMenuItemsPipe } from './layouts/role-menu-items.pipe';
+import { AuthGuard } from './_guard/auth.guard';
 
 
 export function HttpLoaderFactory(http: HttpClient) {
@@ -91,7 +92,7 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
   ],
   providers: [
     TranslateService,
-    SessionService,
+    SessionService,AuthGuard,
     AppointmentService,
     {
        provide: PERFECT_SCROLLBAR_CONFIG,

ng-seed/src/app/app.routing.ts

@@ -2,6 +2,7 @@ import { Routes } from '@angular/router';
 
 import { AdminLayoutComponent } from './layouts/admin/admin-layout.component';
 import { AuthLayoutComponent } from './layouts/auth/auth-layout.component';
+import { AuthGuard } from './_guard/auth.guard';
 
 export const AppRoutes: Routes = [{
   path: '',
@@ -10,34 +11,38 @@ export const AppRoutes: Routes = [{
 }, {
   path: '',
   component: AdminLayoutComponent,
+  canActivateChild:[AuthGuard],
   children: [{
     path: 'home',
     loadChildren: () => import('./dashboard/dashboard.module').then(m => m.DashboardModule)
   },
+  {
+    path: 'business',
+    loadChildren: () => import('./appoinment/business/business.module').then(m => m.BusinessModule)
+  },
   {
     path: 'appoinments',
     loadChildren: () => import('./appoinment/appoinments/appoinments.module').then(m => m.AppoinmentsModule)
+    
   },
-  {
+ 
-    path: 'service',
+ 
-    loadChildren: () => import('./appoinment/service-list-details/service-list.module').then(m => m.ServiceListModule)
-  },
-  {
-    path: 'users',
-    loadChildren: () => import('./appoinment/user/user.module').then(m => m.UserModule)
-  },
-  {
-    path: 'consultants',
-    loadChildren: () => import('./appoinment/consultants/consultants.module').then(m => m.ConsultantsModule)
-  },
   {
     path: 'customers',
     loadChildren: () => import('./appoinment/customers/customers.module').then(m => m.CustomersModule)
   },
   {
-    path: 'business',
+    path: 'consultants',
-    loadChildren: () => import('./appoinment/business/business.module').then(m => m.BusinessModule)
+    loadChildren: () => import('./appoinment/consultants/consultants.module').then(m => m.ConsultantsModule)
+  },  {
+    path: 'users',
+    loadChildren: () => import('./appoinment/user/user.module').then(m => m.UserModule)
   },
+  {
+    path: 'services',
+    loadChildren: () => import('./appoinment/service-list-details/service-list.module').then(m => m.ServiceListModule)
+  }
+  
 ]
 }, {
   path: '',

ng-seed/src/app/appoinment/appoinment-routing.module.ts

@@ -12,23 +12,15 @@ import {  } from './service-list-details/service-list/service-list.component'
 import { ConsultantsListComponent } from './consultants/consultants-list/consultants-list.component';
 
 
-const routes: Routes = [
+const routes: Routes = [ {
-//   {
+  path: 'add-business-list',
-//     path:'',
+  component: AddBusinessListComponent
-//     redirectTo:'',
+},
-//     pathMatch:'full'
+
-//   },{
+{
-//   path: 'add-business-list',
+  path: 'add-user-list',
-//   component: AddBusinessListComponent
+  component: AddUserListComponent
-// },
+},
-// {
-//   path: 'business-list',
-//   component: BusinessListComponent
-// },
-// {
-//   path: 'add-user-list',
-//   component: AddUserListComponent
-// },
 // {
 //   path: 'user-list',
 //   component: UserListComponent
@@ -41,10 +33,10 @@ const routes: Routes = [
 //   path: 'customers-list',
 //   component: CustomersListComponent
 // },
-// // {
+// {
-// //   path: 'calendar-list',
+//   path: 'calendar-list',
-// //   component: CalendarListComponent
+//   component: CalendarListComponent
-// // },
+// },
 // {
 //   path: 'calendar-list',
 //   component: CalendarListComponent

ng-seed/src/app/appoinment/appoinment.module.ts

@@ -19,13 +19,13 @@ import { ConsultantsModule } from './consultants/consultants.module';
     DemoMaterialModule,
     CommonModule,
     AppoinmentRoutingModule,
-    BusinessModule,
+  
-    UserModule,
+    // UserModule,
-    AppoinmentsModule,
+    // AppoinmentsModule,
-    CustomersModule,
+    // CustomersModule,
-    CalendarsModule,
+    // CalendarsModule,
-    ServiceListModule,
+    // ServiceListModule,
-    ConsultantsModule
+    // ConsultantsModule
   ],
   providers:[
     

ng-seed/src/app/appoinment/appoinments/appoinments-routing.module.ts

@@ -4,14 +4,11 @@ import { AppoinmentsListComponent } from './appoinments-list/appoinments-list.co
 
 const routes: Routes = [
   {
-    path:'',
+   
-    redirectTo:'appoinment/appoinments',
+      path: '',
-    pathMatch:'full'
+      component: AppoinmentsListComponent
-  },
+ 
-  {
+  }
-    path:'appoinment/appoinments',
-    component:AppoinmentsListComponent
-  },
 ];
 
 @NgModule({

ng-seed/src/app/appoinment/appoinments/dialog-box/dialog-box.component.ts

@@ -117,7 +117,7 @@ export class DialogBoxComponent implements OnInit {
 console.log(this.local_data, this.selects)
 // this.form.controls['note'].setValue('Sample')
     this.form.patchValue(this.local_data)
-    }
+}
     public myError = (controlName: string, errorName: string) =>{
       return this.form.controls[controlName].hasError(errorName);
       }

ng-seed/src/app/appoinment/business/business-routing.module.ts

@@ -4,14 +4,9 @@ import { BusinessListComponent } from './business-list/business-list.component';
 
 const routes: Routes = [
   {
-    path:'',
+    path: '',
-    redirectTo:'appoinment/business',
+    component: BusinessListComponent
-    pathMatch:'full'
+  }
-  },
-  {
-    path:'appoinment/business',
-    component:BusinessListComponent
-  },
 ];
 
 @NgModule({

ng-seed/src/app/appoinment/consultants/consultants-details/consultants-details.component.html

@@ -0,0 +1,107 @@
+<h4>
+    <button mat-icon-button  type="button" matTooltip="Close" class="button" matTooltipPosition="above" (click)="close()"
+    >
+    <mat-icon>close</mat-icon>
+ </button>
+</h4>
+<h6 class="mb-1">Date & Time: </h6>
+<p>{{selected | date:'mediumDate'}}</p>
+<div class="d-flex calender-time">
+<div class="calender">
+    <mat-card class="demo-inline-calendar-card">
+        <mat-calendar [(selected)]="selected"></mat-calendar>
+      </mat-card>
+     
+</div>
+<!-- <h5>Slot Availability</h5> -->
+<div class="time">
+    <mat-tab-group class="">
+        <mat-tab>
+            <ng-template mat-tab-label>
+                <a class="toolbar-avatar">
+                    <img src="assets/images/morning.png" class="img">
+                  </a>
+            </ng-template>
+            <mat-card-content>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 mt-1 primary">9:00AM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">9:30AM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">10:00AM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">10:30AM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">11:00AM</button><br>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">11:30AM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">12:00AM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">12:30AM</button>
+            </mat-card-content>
+            </mat-tab>
+        <mat-tab>
+            <ng-template mat-tab-label>
+                <a class="toolbar-avatar">
+                    <img src="assets/images/sun.png" style="width: 33px;">
+                  </a>
+            </ng-template>
+            <mat-card-content>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 mt-1 primary">01:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">01:30PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">02:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">02:30PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">03:00PM</button><br>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">03:30PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">04:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">04:30PM</button>
+            
+            </mat-card-content>
+        </mat-tab>
+        <mat-tab>
+            <ng-template mat-tab-label>
+                <a class="toolbar-avatar">
+                    <img src="assets/images/sunset.png" style="width: 40px;">
+                  </a>
+            </ng-template>
+            <mat-card-content>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 mt-1 primary">05:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">05:50PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">06:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">06:30PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary ">07:00PM</button><br>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">07:30PM</button>
+            </mat-card-content>
+        </mat-tab>
+        <mat-tab>
+            <ng-template mat-tab-label>
+                <a class="toolbar-avatar">
+                    <img src="assets/images/moon.png" style="width: 30px;">
+                  </a>
+            </ng-template>
+            <mat-card-content>
+                <button mat-raised-button mat-button-sm class="mr-1 mb-1 mt-1 primary">08:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">08:30PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">09:00PM</button>
+                <button mat-raised-button mat-button-sm  class="mr-1 mb-1 primary">09:30PM</button>
+            </mat-card-content>
+        </mat-tab>
+    </mat-tab-group>
+    <div mat-dialog-content class="my-table">
+        <form [formGroup]="form" (ngSubmit)="submit()">
+            <div class="field">
+                <mat-form-field  class="mat-pane">
+                   <mat-select placeholder="Select Workspace" formControlName="workspace" required>
+                      <mat-option>--</mat-option>
+                      <mat-option *ngFor="let business of selects" [value]="business.workspace">
+                      {{business.workspace}}
+                      </mat-option>
+                   </mat-select>
+                   <mat-error *ngIf="workspace.hasError('required')">Please choose an Workspace</mat-error>
+                   <mat-error *ngIf="workspace.hasError('invalidValue')">Please choose any other</mat-error>
+                </mat-form-field>
+             </div>
+            </form>
+        </div>
+</div>
+</div>
+
+<div class="success">
+    <p>I have read and un derstood the Terms & Conditions of usage of 24x7, 
+        Privacy policy, Refund Policy and consent to the same.</p>
+  </div>
+<button mat-raised-button mat-button-sm  class="mr-1 mb-1 mt-1 btn-red" >PROCEED</button>
+

ng-seed/src/app/appoinment/consultants/consultants-details/consultants-details.component.scss

@@ -0,0 +1,49 @@
+$color_red_orange_approx: #4caf50;
+$white: #fff;
+.button{
+    margin-bottom: 1rem;
+    background-color: #ffff !important;
+    margin-top: -3rem;
+    float: right;
+}
+.calender{
+   margin-left: -1rem;
+    padding-right: 6rem;
+}
+mat-card{
+    width: 140%;
+}
+::ng-deep .mat-tab-label {
+margin-left: -3rem!important;
+}
+.img{
+    width: 50px;
+}
+.btn-red {
+    background-color: $color_red_orange_approx;
+    color: $white;
+    border: 1px solid $color_red_orange_approx;
+    float: right;
+}
+h6{
+    color: #0087ba;
+    font-weight: 600;
+}
+.primary{
+    background-color: #658F9B;
+    color: white;
+}
+::ng-deep .mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar {
+    background-color: #658F9B!important;
+}
+::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper {
+    width: 250%;
+}
+.success {
+    background: #fff;
+    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
+    padding: 5px;
+    color: #0087ba;
+    font-weight: 600;
+    border-radius: 10px;
+  }

ng-seed/src/app/appoinment/consultants/consultants-details/consultants-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConsultantsDetailsComponent } from './consultants-details.component';
+
+describe('ConsultantsDetailsComponent', () => {
+  let component: ConsultantsDetailsComponent;
+  let fixture: ComponentFixture<ConsultantsDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ConsultantsDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConsultantsDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ng-seed/src/app/appoinment/consultants/consultants-details/consultants-details.component.ts

@@ -0,0 +1,59 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+export interface DialogData {
+  animal: string;
+  name: string;
+}
+export interface UsersData {
+  workspace: string;
+}
+@Component({
+  selector: 'app-consultants-details',
+  templateUrl: './consultants-details.component.html',
+  styleUrls: ['./consultants-details.component.scss']
+})
+export class ConsultantsDetailsComponent implements OnInit {
+  form: FormGroup;
+  local_data:any;
+  selected: Date | null;
+  name = 'Angular';
+  date = new Date();
+  control = new FormControl(
+    {
+      from: this.date,
+      // to: new Date(this.date.getTime() + 1 * 24 * 60 * 60 * 1000),
+    },
+    Validators.required
+  );
+  workspace = new FormControl('', [Validators.required]);
+  selects = [
+    {workspace: 'test 1'},
+    {workspace: 'test 2'},
+    {workspace: 'test 3'},
+  ];
+  constructor(
+    public dialogRef: MatDialogRef<ConsultantsDetailsComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: DialogData) {}
+
+  onNoClick(): void {
+    this.dialogRef.close();
+  }
+  close() {
+    // console.log(this.form.value);
+    this.dialogRef.close();
+}
+
+  ngOnInit(): void {
+    this.form = new FormGroup({
+
+      workspace: new FormControl('', [Validators.required]),
+    });
+console.log(this.local_data, this.selects)
+// this.form.controls['note'].setValue('Sample')
+    this.form.patchValue(this.local_data)
+  }
+  submit(){
+    console.log(this.form.value);
+  }
+}

ng-seed/src/app/appoinment/consultants/consultants-list/consultants-list.component.html

@@ -39,8 +39,8 @@
                 <!-- <button type="button" class="UserActions-editButton edit-button EdgeButton EdgeButton--tertiary" data-scribe-element="profile_edit_button">
                    <span class="button-text">Accept</span>
                    </button> -->
-                <button type="button" class="UserActions-editButton edit-button EdgeButton EdgeButton--tertiary btn-red" data-scribe-element="profile_edit_button">
+                <button type="button" (click)="openDialog()" class="UserActions-editButton edit-button EdgeButton EdgeButton--tertiary btn-red" data-scribe-element="profile_edit_button">
-                <span class="button-text">Book Appoinment</span>
+                  <span class="material-icons"> bookmark_add </span><span class="button-text">Book Appoinment</span>
                 </button>
              </div>
           </div>

ng-seed/src/app/appoinment/consultants/consultants-list/consultants-list.component.scss

@@ -18,6 +18,8 @@ $black_60: rgba(0, 0, 0, 0.6);
     transition: all 0.3s ease-in-out 0s;
     &:hover {
         box-shadow: 0 0 21px $black_30;
+        cursor: pointer;
+        transform: scale(1.04);
     }
 }
 .consultant-span{

ng-seed/src/app/appoinment/consultants/consultants-list/consultants-list.component.ts

@@ -1,4 +1,6 @@
 import { Component, OnInit, ViewEncapsulation } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { ConsultantsDetailsComponent } from '../consultants-details/consultants-details.component';
 
 @Component({
   selector: 'app-consultants-list',
@@ -6,8 +8,22 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core';
   styleUrls: ['./consultants-list.component.scss']
 })
 export class ConsultantsListComponent implements OnInit {
+  animal: string;
+  name: string;
 
-  constructor() { }
+  constructor(public dialog: MatDialog) {}
+
+  openDialog(): void {
+    const dialogRef = this.dialog.open(ConsultantsDetailsComponent, {
+      width: '60%',
+      data: {name: this.name, animal: this.animal}
+    });
+
+    dialogRef.afterClosed().subscribe(result => {
+      console.log('The dialog was closed');
+      this.animal = result;
+    });
+  }
 
   ngOnInit(): void {
   }

ng-seed/src/app/appoinment/consultants/consultants-routing.module.ts

@@ -4,14 +4,9 @@ import { ConsultantsListComponent } from './consultants-list/consultants-list.co
 
 const routes: Routes = [
   {
-    path:'',
+    path: '',
-    redirectTo:'appoinment/consultants',
+    component: ConsultantsListComponent
-    pathMatch:'full'
+  }
-  },
-  {
-    path:'appoinment/consultants',
-    component:ConsultantsListComponent
-  },
 ];
 
 @NgModule({

ng-seed/src/app/appoinment/consultants/consultants.module.ts

@@ -4,11 +4,13 @@ import { CommonModule } from '@angular/common';
 import { ConsultantsRoutingModule } from './consultants-routing.module';
 import { ConsultantsListComponent } from './consultants-list/consultants-list.component';
 import { DemoMaterialModule } from 'app/shared/demo.module';
-import { NgScrollbarModule } from 'ngx-scrollbar'
+import { NgScrollbarModule } from 'ngx-scrollbar';
+import { ConsultantsDetailsComponent } from './consultants-details/consultants-details.component';
 
 @NgModule({
   declarations: [
-    ConsultantsListComponent
+    ConsultantsListComponent,
+    ConsultantsDetailsComponent,
   ],
   imports: [
     DemoMaterialModule,

ng-seed/src/app/appoinment/customers/customers-routing.module.ts

@@ -4,14 +4,9 @@ import { CustomersListComponent } from './customers-list/customers-list.componen
 
 const routes: Routes = [
   {
-    path:'',
+    path: '',
-    redirectTo:'appoinment/customers',
+    component: CustomersListComponent
-    pathMatch:'full'
+  }
-  },
-  {
-    path:'appoinment/customers',
-    component:CustomersListComponent
-  },
 ];
 
 @NgModule({

ng-seed/src/app/appoinment/service-list-details/service-list-routing.module.ts

@@ -2,15 +2,10 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { ServiceListComponent } from './service-list/service-list.component';
 
-const routes: Routes = [
+const routes: Routes = [ 
   {
-    path:'',
+    path: '',
-    redirectTo:'appoinment/service',
+    component: ServiceListComponent
-    pathMatch:'full'
-  },
-  {
-    path:'appoinment/service',
-    component:ServiceListComponent
   },
 ];
 

ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.html

@@ -1,4 +1,4 @@
-<button mat-button (click)="openDialog('Add',{})"   class="button">Add Services</button><br>
+<button mat-button (click)="openDialog('Add',{})"   class="buttons">Add Services</button><br>
 <div fxLayout="row wrap" >
     <div fxFlex.xs="100" fxFlex.sm="50" fxFlex.md="50" class="m-gap p-gap flx" *ngFor="let serviceListDetails of servicesList">
         <div class="Specialties-list-card">

ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.scss

@@ -1,12 +1,17 @@
 $white: #fff;
 $black_10: rgba(0, 0, 0, 0.1);
 $black_30: rgba(0, 0, 0, 0.3);
+$icon-size: 3rem;
+$icon-color: #D8D8D8;
+$main-color: #f44336;
 .Specialties-list-card {
     background: $white;
     box-shadow: 0 2px 6px $black_10;
     transition: all 0.3s ease-in-out 0s;
     &:hover {
         box-shadow: 0 0 21px $black_30;
+        cursor: pointer;
+        transform: scale(1.04);
     }
 }
 .consultant-card-cover {
@@ -63,7 +68,8 @@ $black_30: rgba(0, 0, 0, 0.3);
     width: 100%;
     padding: 0 10px 0 0;
     position: relative;
-    min-height: 80px;
+    // min-height: 60px;
+    height: 65px;
 }
 .mb{
     margin-bottom: 0.60rem;
@@ -74,13 +80,13 @@ $black_30: rgba(0, 0, 0, 0.3);
 ::ng-deep body .mat-card .mat-card-subtitle {
     padding-left: 0rem!important; 
 }
-.button{
+.buttons{
     float: right;
     background-color: #4caf50;
     color: #ffff;
 }
 .edit-color{
-    color: rgba(0, 0, 0, 0.54);
+    color: white;
 }
 .edit-color:hover {
     color: #4caf50;

ng-seed/src/app/appoinment/user/user-routing.module.ts

@@ -5,14 +5,9 @@ import { UserModule } from './user.module';
 
 const routes: Routes = [
   {
-    path:'',
+    path: '',
-    redirectTo:'appoinment/users',
+    component: UserListComponent
-    pathMatch:'full'
+  }
-  },
-  {
-    path:'appoinment/users',
-    component:UserListComponent
-  },
 ];
 
 @NgModule({

ng-seed/src/app/dashboard/dashboard.component.html

@@ -0,0 +1 @@
+<h1>welcome</h1>

ng-seed/src/app/shared/menu-items/horizontal-menu-items.ts

@@ -29,7 +29,7 @@ const HORIZONTALMENUITEMS = [
     icon: 'explore'
   },
   {
-    state: 'appoinments',
+    state: 'appoinment',
     name: 'Appoinments',
     type: 'link',
     icon: 'security',
@@ -38,7 +38,7 @@ const HORIZONTALMENUITEMS = [
     // ]
   },
   {
-    state: 'business',
+    state: 'appoinment',
     name: 'Business',
     type: 'link',
     icon: 'security',
@@ -57,7 +57,7 @@ const HORIZONTALMENUITEMS = [
   //   ]
   // },
   {
-    state: 'customers',
+    state: 'appoinment',
     name: 'Customers',
     type: 'link',
     icon: 'security',
@@ -66,7 +66,7 @@ const HORIZONTALMENUITEMS = [
     // ]
   },
   {
-    state: 'consultants',
+    state: 'appoinment',
     name: 'Consultants',
     type: 'link', 
     icon: 'security',
@@ -75,7 +75,7 @@ const HORIZONTALMENUITEMS = [
     // ]
   },
   {
-    state: 'users',
+    state: 'appoinment',
     name: 'Users',
     type: 'link',
     icon: 'security',
@@ -85,7 +85,7 @@ const HORIZONTALMENUITEMS = [
     // ]
   }, 
   {
-    state: 'service',
+    state: 'appoinment',
     name: 'Services List',
     type: 'link',
     icon: 'security',

ng-seed/src/app/shared/menu-items/menu-items.ts

@@ -84,7 +84,7 @@ const MENUITEMS : Menu[] = [
     // ]
   }, 
   {
-    state: 'service',
+    state: 'services',
     name: 'Services List',
     type: 'link',
     icon: 'security',

package-lock.json

@@ -0,0 +1,3 @@
+{
+  "lockfileVersion": 1
+}